搜索功能完成

.nuxt/components.d.ts

@@ -31,6 +31,9 @@ interface _GlobalComponents {
     'HomePageHead': typeof import("../components/home/pageHead.vue")['default']
     'HomePageNavigation': typeof import("../components/home/pageNavigation.vue")['default']
     'HomePageNavigation1': typeof import("../components/home/pageNavigation1.vue")['default']
+    'SearchJobHunting': typeof import("../components/search/jobHunting.vue")['default']
+    'SearchJobRecruit': typeof import("../components/search/jobRecruit.vue")['default']
+    'SearchNews': typeof import("../components/search/news.vue")['default']
     'NuxtWelcome': typeof import("../node_modules/nuxt/dist/app/components/welcome.vue")['default']
     'NuxtLayout': typeof import("../node_modules/nuxt/dist/app/components/nuxt-layout")['default']
     'NuxtErrorBoundary': typeof import("../node_modules/nuxt/dist/app/components/nuxt-error-boundary")['default']
@@ -83,6 +86,9 @@ interface _GlobalComponents {
     'LazyHomePageHead': typeof import("../components/home/pageHead.vue")['default']
     'LazyHomePageNavigation': typeof import("../components/home/pageNavigation.vue")['default']
     'LazyHomePageNavigation1': typeof import("../components/home/pageNavigation1.vue")['default']
+    'LazySearchJobHunting': typeof import("../components/search/jobHunting.vue")['default']
+    'LazySearchJobRecruit': typeof import("../components/search/jobRecruit.vue")['default']
+    'LazySearchNews': typeof import("../components/search/news.vue")['default']
     'LazyNuxtWelcome': typeof import("../node_modules/nuxt/dist/app/components/welcome.vue")['default']
     'LazyNuxtLayout': typeof import("../node_modules/nuxt/dist/app/components/nuxt-layout")['default']
     'LazyNuxtErrorBoundary': typeof import("../node_modules/nuxt/dist/app/components/nuxt-error-boundary")['default']
@@ -141,6 +147,9 @@ export const HomeKefu: typeof import("../components/home/kefu.vue")['default']
 export const HomePageHead: typeof import("../components/home/pageHead.vue")['default']
 export const HomePageNavigation: typeof import("../components/home/pageNavigation.vue")['default']
 export const HomePageNavigation1: typeof import("../components/home/pageNavigation1.vue")['default']
+export const SearchJobHunting: typeof import("../components/search/jobHunting.vue")['default']
+export const SearchJobRecruit: typeof import("../components/search/jobRecruit.vue")['default']
+export const SearchNews: typeof import("../components/search/news.vue")['default']
 export const NuxtWelcome: typeof import("../node_modules/nuxt/dist/app/components/welcome.vue")['default']
 export const NuxtLayout: typeof import("../node_modules/nuxt/dist/app/components/nuxt-layout")['default']
 export const NuxtErrorBoundary: typeof import("../node_modules/nuxt/dist/app/components/nuxt-error-boundary")['default']
@@ -193,6 +202,9 @@ export const LazyHomeKefu: typeof import("../components/home/kefu.vue")['default
 export const LazyHomePageHead: typeof import("../components/home/pageHead.vue")['default']
 export const LazyHomePageNavigation: typeof import("../components/home/pageNavigation.vue")['default']
 export const LazyHomePageNavigation1: typeof import("../components/home/pageNavigation1.vue")['default']
+export const LazySearchJobHunting: typeof import("../components/search/jobHunting.vue")['default']
+export const LazySearchJobRecruit: typeof import("../components/search/jobRecruit.vue")['default']
+export const LazySearchNews: typeof import("../components/search/news.vue")['default']
 export const LazyNuxtWelcome: typeof import("../node_modules/nuxt/dist/app/components/welcome.vue")['default']
 export const LazyNuxtLayout: typeof import("../node_modules/nuxt/dist/app/components/nuxt-layout")['default']
 export const LazyNuxtErrorBoundary: typeof import("../node_modules/nuxt/dist/app/components/nuxt-error-boundary")['default']

.nuxt/manifest/latest.json

@@ -1 +1 @@
-{"id":"4048dcd7-0889-45d1-a989-1804f0136117","timestamp":1754619448493}
+{"id":"f1ba10b5-8bac-4c0e-bf6a-7b89c33d7df9","timestamp":1754878878121}

.nuxt/manifest/meta/4048dcd7-0889-45d1-a989-1804f0136117.json

@@ -1 +0,0 @@
-{"id":"4048dcd7-0889-45d1-a989-1804f0136117","timestamp":1754619448493,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}

.nuxt/manifest/meta/f1ba10b5-8bac-4c0e-bf6a-7b89c33d7df9.json

@@ -0,0 +1 @@
+{"id":"f1ba10b5-8bac-4c0e-bf6a-7b89c33d7df9","timestamp":1754878878121,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}

.nuxt/tsconfig.json

@@ -102,7 +102,7 @@
         "./imports"
       ],
       "#app-manifest": [
-        "./manifest/meta/4048dcd7-0889-45d1-a989-1804f0136117.json"
+        "./manifest/meta/f1ba10b5-8bac-4c0e-bf6a-7b89c33d7df9.json"
       ],
       "#components": [
         "./components"

assets/css/search/global.less

@@ -0,0 +1,93 @@
+//导航条
+.breadcrumb {
+    width: 100%;
+    height: 22px;
+    margin-bottom: 30px;
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: 400;
+    font-size: 20px;
+    color: #666666;
+    line-height: 23px;
+    text-align: left;
+    font-style: normal;
+    text-transform: none;
+
+    :deep(.el-breadcrumb) {
+        display: inline-block;
+        vertical-align: -4px;
+    }
+
+    :deep(.el-breadcrumb__inner a),
+    :deep(.el-breadcrumb__inner.is-link) {
+        color: #666666;
+        font-weight: 400;
+        text-decoration: none;
+        transition: var(--el-transition-color);
+    }
+
+    span {
+        font-family: Microsoft YaHei, Microsoft YaHei;
+        font-weight: 400;
+        font-size: 20px;
+        color: #666666;
+        line-height: 23px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+
+    span:hover {
+        color: #666666;
+    }
+
+    .location {
+        margin-right: 20px;
+        width: 100px;
+        height: 22px;
+        font-family: Microsoft YaHei, Microsoft YaHei;
+        font-weight: 400;
+        font-size: 20px;
+        color: #666666;
+        line-height: 23px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+    }
+}
+
+.search {
+    width: 100%;
+    height: 100px;
+    margin-top: 40px;
+
+    .inner {
+        width: 1200px;
+        height: 100px;
+        padding-top: 10px;
+        text-align: center;
+
+        input {
+            width: 582px;
+            height: 46px;
+            outline: none;
+            border: 1px solid #E6E6E6;
+            border-radius: 0;
+            padding-left: 20px;
+            vertical-align: 0px;
+            font-size: 16px;
+            color: #666666
+        }
+
+        button {
+            width: 120px;
+            height: 48px;
+            background-color: #489d97;
+            font-size: 16px;
+            letter-spacing: 4px;
+            color: #fff;
+            border: none;
+            border-radius: 0;
+            cursor: pointer;
+        }
+    }
+}

assets/css/search/jobHunting.less

@@ -0,0 +1,403 @@
+@charset "utf-8";
+
+.empty {
+    width: 100%;
+    height: 350px;
+    line-height: 350px;
+    text-align: center;
+
+    .empty_img {
+        vertical-align: -30px;
+        margin-right: 20px;
+    }
+
+    .empty_text {
+        font-size: 26px;
+        color: #999;
+    }
+}
+
+.pagination11 {
+    width: 1200px;
+    margin: 50px auto;
+}
+
+//分页
+.pagination {
+    width: 1200px;
+    height: 34px;
+    margin-left: 141px;
+    display: flex;
+    justify-content: center;
+    margin: 0;
+
+    // 鼠标移入后字体颜色
+    .el-pagination::v-deep :hover {
+        color: #489d97;
+    }
+
+    .el-pagination.is-background::v-deep .btn-next,
+    .el-pagination.is-background::v-deep .btn-prev {
+        width: 70px;
+        height: 34px;
+        margin: 0px 10px;
+        border-radius: 4px;
+    }
+
+    .el-pagination.is-background::v-deep .el-pager li {
+        margin: 0px 10px;
+        width: 38px;
+        height: 34px;
+        border-radius: 4px;
+    }
+
+    .el-pagination.is-background::v-deep .btn-next.is-active,
+    .el-pagination.is-background::v-deep .btn-prev.is-active,
+    .el-pagination.is-background::v-deep .el-pager li.is-active {
+        background-color: #489d97;
+        color: #fff;
+    }
+}
+
+* {
+    font-family: "微软雅黑", "microsoft yahei";
+}
+
+ul,
+ol {
+    list-style: none;
+}
+
+a:active {
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: none;
+}
+
+a:visited {
+    text-decoration: none;
+}
+
+a:link {
+    text-decoration: none;
+}
+
+a:focus {
+    text-decoration: none;
+}
+
+body {
+    position: relative;
+}
+
+.clearfix {
+    overflow: hidden;
+}
+
+.clearfix_2::after {
+    content: '';
+    display: block;
+    height: 0;
+    visibility: hidden;
+    clear: both;
+}
+
+.hiddenColor {
+    visibility: hidden;
+}
+
+.hand {
+    cursor: pointer;
+}
+
+.aTag_parent {
+    position: relative;
+}
+
+.aTag_parent>a,
+.aTag {
+    display: block;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    z-index: 99;
+    border: 0px;
+    top: 0px;
+    left: 0px;
+    background: rgba(0, 0, 0, 0);
+}
+
+.dot1 {
+    display: block;
+    word-break: keep-all;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.dot2 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+}
+
+input,
+img {
+    border: none;
+}
+
+.cover100 img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.back100 {
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+}
+
+article,
+aside,
+footer,
+header,
+time,
+video,
+main,
+nav,
+h4,
+h3,
+section {
+    display: block;
+}
+
+.index_main {
+    width: 1200px;
+    margin: 0 auto;
+    min-height: 400px;
+}
+
+.slow_6 {
+    -webkit-transition: all .6s;
+    -moz-transition: all .6s;
+    -ms-transition: all .6s;
+    -o-transition: all .6s;
+    transition: all .6s;
+}
+
+.table_head {
+    border-bottom: solid 1px #E9E9E9;
+    border-top: solid 1px #d9d9d9;
+
+    .table_head_name {
+        width: 140px;
+    }
+
+    .table_head_job {
+        width: 220px;
+    }
+
+    .table_head_sex {
+        width: 82px;
+        margin-left: 4px;
+    }
+
+    .table_head_experience {
+        width: 100px;
+        margin-left: 4px;
+    }
+
+    .table_head_native {
+        width: 157px;
+        margin-left: 20px;
+    }
+
+    .table_head_industry {
+        width: 180px;
+    }
+
+    .table_head_address {
+        width: 140px;
+        margin-left: 18px;
+    }
+
+    .table_head_time {
+        width: 125px;
+        float: right;
+    }
+}
+
+.table_ul {
+    .table_li {
+        border-bottom: solid 1px #E9E9E9;
+    }
+
+    .table_li_a {
+        display: block;
+    }
+}
+
+.table_li_in {}
+
+@media screen and (min-width:801px) {
+
+    /*pc_1440*/
+    .table_li div {
+        float: left;
+        height: 86px;
+        line-height: 86px;
+        box-sizing: border-box;
+        padding-right: 8px;
+    }
+
+    .table_li_text {
+        width: 100%;
+    }
+
+    .table_head div {
+        float: left;
+        height: 61px;
+        line-height: 61px;
+        font-size: 16px;
+        color: #666;
+        box-sizing: border-box;
+        padding-right: 8px;
+    }
+
+    .table_li_name {
+        width: 140px;
+    }
+
+    .table_li_name_in {
+        width: 140px;
+        font-size: 20px;
+        font-weight: bold;
+        color: #333;
+    }
+
+    .table_li_in {
+        float: left;
+        line-height: 25px;
+        height: 25px;
+        color: #999;
+        font-size: 14px;
+        background: #F8F8F8;
+        margin-top: 33px;
+        max-width: 100%;
+        padding: 0px 10px;
+        box-sizing: border-box;
+    }
+
+    .table_li_job {
+        width: 220px;
+        font-size: 16px;
+        color: #489d97;
+        padding-right: 10px;
+        margin-right: 5px;
+    }
+
+    .table_li_sex {
+        width: 86px;
+        font-size: 16px;
+        color: #333;
+    }
+
+    .table_li_experience {
+        width: 110px;
+        font-size: 16px;
+        color: #333;
+        margin-right: 5px;
+    }
+
+    .table_li_native {
+        width: 150px;
+        font-size: 16px;
+        color: #333;
+        margin-right: 5px;
+    }
+
+    .table_li_industry {
+        width: 180px;
+        font-size: 16px;
+        color: #333;
+    }
+
+    .table_li_address {
+        width: 140px;
+        margin-left: 20px;
+    }
+
+    .table_li_time {
+        width: 110px;
+        float: right;
+    }
+
+    .table_li_a:hover {
+        background: #F6F6F6;
+    }
+
+    .table_li_a:hover .table_li_in {
+        background: #F6F6F6;
+    }
+
+    @media screen and (max-width:1440px) {
+        /*1200*/
+    }
+
+    .pc_none {
+        display: none;
+    }
+}
+
+@media screen and (max-width:800px) {
+    .index_main {
+        width: 98%;
+        margin: 6px auto;
+    }
+
+    .table_li_label {
+        float: left;
+        font-size: 20px;
+        color: #333;
+        height: 33px;
+        margin-right: 8px;
+        word-break: keep-all;
+        white-space: nowrap;
+    }
+
+    .table_li {
+        margin-bottom: 33px;
+    }
+
+    .table_li_a>div {
+        width: 98%;
+        margin: 6px auto;
+        height: 33px;
+        display: flex;
+    }
+
+    .table_li_name_in {
+        font-weight: bold;
+        width: 100%;
+    }
+
+    .table_li_in,
+    .table_li_a>div>div {
+        float: left;
+        font-size: 20px;
+        color: #333;
+        height: 33px;
+    }
+
+    .phone_none {
+        display: none;
+    }
+}
+
+@media screen and (max-width:599px) {}
+
+@media screen and (max-width:320px) {}

assets/css/search/jobRecruit.less

@@ -0,0 +1,408 @@
+@charset "utf-8";
+
+.empty {
+    width: 100%;
+    height: 350px;
+    line-height: 350px;
+    text-align: center;
+
+    .empty_img {
+        vertical-align: -30px;
+        margin-right: 20px;
+    }
+
+    .empty_text {
+        font-size: 26px;
+        color: #999;
+    }
+}
+
+.pagination11 {
+    width: 1200px;
+    margin: 50px auto;
+}
+
+//分页
+.pagination {
+    width: 1200px;
+    height: 34px;
+    margin-left: 141px;
+    display: flex;
+    justify-content: center;
+    margin: 0;
+
+    // 鼠标移入后字体颜色
+    .el-pagination::v-deep :hover {
+        color: #489d97;
+    }
+
+    .el-pagination.is-background::v-deep .btn-next,
+    .el-pagination.is-background::v-deep .btn-prev {
+        width: 70px;
+        height: 34px;
+        margin: 0px 10px;
+        border-radius: 4px;
+    }
+
+    .el-pagination.is-background::v-deep .el-pager li {
+        margin: 0px 10px;
+        width: 38px;
+        height: 34px;
+        border-radius: 4px;
+    }
+
+    .el-pagination.is-background::v-deep .btn-next.is-active,
+    .el-pagination.is-background::v-deep .btn-prev.is-active,
+    .el-pagination.is-background::v-deep .el-pager li.is-active {
+        background-color: #489d97;
+        color: #fff;
+    }
+}
+
+* {
+    font-family: "微软雅黑", "microsoft yahei";
+}
+
+ul,
+ol {
+    list-style: none;
+}
+
+a:active {
+    text-decoration: none;
+}
+
+a:hover {
+    text-decoration: none;
+}
+
+a:visited {
+    text-decoration: none;
+}
+
+a:link {
+    text-decoration: none;
+}
+
+a:focus {
+    text-decoration: none;
+}
+
+body {
+    position: relative;
+}
+
+.clearfix {
+    overflow: hidden;
+}
+
+.clearfix_2::after {
+    content: '';
+    display: block;
+    height: 0;
+    visibility: hidden;
+    clear: both;
+}
+
+.hiddenColor {
+    visibility: hidden;
+}
+
+.hand {
+    cursor: pointer;
+}
+
+.aTag_parent {
+    position: relative;
+}
+
+.aTag_parent>a,
+.aTag {
+    display: block;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    z-index: 99;
+    border: 0px;
+    top: 0px;
+    left: 0px;
+    background: rgba(0, 0, 0, 0);
+}
+
+.dot1 {
+    display: block;
+    word-break: keep-all;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.dot2 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+}
+
+input,
+img {
+    border: none;
+}
+
+.cover100 img {
+    display: block;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.back100 {
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+}
+
+article,
+aside,
+footer,
+header,
+time,
+video,
+main,
+nav,
+h4,
+h3,
+section {
+    display: block;
+}
+
+.index_main {
+    width: 1200px;
+    margin: 0 auto;
+    min-height: 400px;
+}
+
+.slow_6 {
+    -webkit-transition: all .6s;
+    -moz-transition: all .6s;
+    -ms-transition: all .6s;
+    -o-transition: all .6s;
+    transition: all .6s;
+}
+
+.table_head {
+    border-top: solid 1px #d9d9d9;
+    border-bottom: solid 1px #e9e9e9;
+
+    .table_head_masg {
+        width: 154px;
+    }
+
+    .table_head_company {
+        width: 340px;
+        padding: 0px 8px;
+        box-sizing: border-box;
+        margin-left: 80px;
+    }
+
+    .table_head_job {
+        width: 265px;
+        padding: 0px 8px;
+        box-sizing: border-box;
+        margin-left: 20px;
+    }
+
+    .table_head_address {
+        width: 140px;
+        margin-left: 6px;
+    }
+}
+
+.table_head div {
+    float: left;
+    height: 61px;
+    line-height: 61px;
+    font-size: 16px;
+    color: #666;
+    box-sizing: border-box;
+}
+
+.table_head .table_head_time {
+    width: 174px;
+    float: right;
+}
+
+.table_ul {
+    .table_li {
+        border-bottom: solid 1px #E9E9E9;
+    }
+
+    .table_li_a {
+        display: block;
+    }
+
+    .table_li div {
+        float: left;
+        box-sizing: border-box;
+    }
+
+    .table_li_masg {
+        width: 177px;
+        font-size: 20px;
+        color: #333;
+        font-weight: bold;
+    }
+
+    .table_li_company {
+        width: 340px;
+        padding: 0px 8px;
+        box-sizing: border-box;
+        margin-left: 53px;
+        font-size: 16px;
+        color: #333;
+    }
+
+    .table_li_job {
+        width: 275px;
+        padding: 0px 8px;
+        box-sizing: border-box;
+        font-size: 14px;
+        color: #999;
+        margin-left: 20px;
+    }
+
+    .table_li_job_in {
+        float: left;
+        line-height: 25px;
+        height: 25px;
+        color: #999;
+        font-size: 14px;
+        background: #F8F8F8;
+        margin-top: 33px;
+        max-width: 100%;
+        padding: 0px 10px;
+        box-sizing: border-box;
+    }
+
+    .table_li_address {
+        width: 131px;
+        color: #999;
+        font-size: 16px;
+        text-indent: 33px;
+        background: url(@/public/search/location.png) no-repeat left center;
+        background-size: 22px auto;
+    }
+
+    .table_li_a .table_li_time {
+        width: 174px;
+        float: right;
+        color: #999;
+        font-size: 16px;
+        text-indent: 31px;
+        background: url(@/public/search/time.png) no-repeat left center;
+        background-size: 22px auto;
+    }
+
+    .table_li_a:hover {
+        background: #F6F6F6;
+    }
+
+    .table_li_a:hover .table_li_job_in {
+        background: #F6F6F6;
+    }
+}
+
+@media screen and (min-width:1200px) {
+
+    /*pc_1440*/
+    .table_li div {
+        height: 86px;
+        line-height: 86px;
+        // text-align: center;
+    }
+
+    @media screen and (max-width:1440px) {
+        /*1200*/
+    }
+
+    .pc_none {
+        display: none;
+    }
+}
+
+@media screen and (min-width:801px) {
+    .table_li_masg .table_li_text {
+        width: 100%;
+    }
+
+    .table_li_company .table_li_text {
+        width: 100%;
+    }
+
+    .table_li_address .table_li_text {
+        width: 100%;
+    }
+}
+
+@media screen and (max-width:800px) {
+    .index_main {
+        width: 98%;
+        margin: 6px auto;
+    }
+
+    .table_li {
+        margin-bottom: 22px;
+    }
+
+    .table_li_a {
+        display: block;
+        overflow: hidden;
+    }
+
+    .table_li_a>div {
+        height: 33px;
+        line-height: 33px;
+        width: 100%;
+        float: none;
+        display: flex;
+        width: 100% !important;
+        margin: 0 !important;
+        padding: 0px !important;
+        background: rgba(0, 0, 0, 0) !important;
+        text-indent: 0px !important;
+    }
+
+    .table_li div {
+        height: 33px;
+        line-height: 33px;
+        overflow: hidden;
+    }
+
+    .table_li_label {
+        height: 33px;
+        line-height: 33px;
+        float: left;
+        margin-right: 8px;
+        font-size: 20px;
+        color: #333;
+        word-break: keep-all;
+        white-space: nowrap;
+    }
+
+    .table_li_text {
+        font-size: 20px !important;
+        color: #333 !important;
+        height: 33px !important;
+        line-height: 33px !important;
+        margin-top: 0px !important;
+        background: rgba(0, 0, 0, 0) !important;
+        padding: 0px !important;
+    }
+
+    .phone_none {
+        display: none;
+    }
+}
+
+@media screen and (max-width:599px) {}
+
+@media screen and (max-width:320px) {}

components/home/pageHead.vue

@@ -198,7 +198,7 @@ let backHome = () => {
 
 //点击搜索按钮
 let goSearch = () => {
-    const route = `/search/search?keyword=${keyword.value}`;
+    const route = `/search/search?keyword=${keyword.value}&type=1`;
     window.location.href = route;
 }
 

components/home/pageNavigation.vue

@@ -20,7 +20,6 @@
         <div class="partTwo">
             <div class="inner">
                 <ul class="partTwoNav">
-                    <!-- <li class="navList">农民工资讯</li> -->
                     <li class="navList" v-for="(item, index) in navigation2" :key="index">
                         <NuxtLink :href="getLinkPath(item)" :title="item.alias"
                             :target="item.is_url == 1 ? '_blank' : '_self'">
@@ -46,12 +45,11 @@
                     </client-only>
                     <i></i>
                     <input type="text" v-model="typeValue" placeholder="输入关键词" class="ipt">
-                    <em class="search"></em>
+                    <em class="search" @click="goToSearch"></em>
                 </div>
                 <div class="box111"></div>
-                <div class="title">搜索地区 :</div>
+                <div class="title">搜索资讯 :</div>
                 <div class="searchRole" v-if="provinceList.length > 0">
-                    <!--  -->
                     <el-select v-model="province" placeholder="请选择省" size="large" style="width: 80px">
                         <el-option v-for="item in provinceList" :key="item.id" :label="item.name"
                             @click="change(item.id)" :value="item.id" />
@@ -68,34 +66,6 @@
                     </el-select>
                     <em class="searchbtn" @click="goToPrimary"></em>
                 </div>
-                <!-- <div class="searchRole">
-                    <client-only> 
-                        <el-select v-model="searchInputValue2" placeholder="选择职业" size="large" style="width: 80px" :key="'select2'">
-                            <el-option 
-                                v-for="item in selectOptions2" 
-                                :label="item.name"
-                                :value="item.id" 
-                                :key="item.id"
-                            />
-                        </el-select>
-                    </client-only>
-                    <i></i>
-                    <client-only> 
-                    <el-select v-model="searchInputValue3" placeholder="选择地区" size="large" style="width: 80px" :key="'select3'">
-                        <el-option 
-                            v-for="item in selectOptions3" 
-                            :key="item.id" 
-                            :label="item.name"
-                            :value="item.id" 
-                        />
-                        </el-select>
-                    </client-only>
-                    <i></i>
-                    <em class="search1" @click="goToPrimary"></em>
-                </div> -->
-                <!-- <div class="title1">
-                    更多搜索条件>>
-                </div> -->
             </div>
         </div>
     </div>
@@ -138,41 +108,23 @@ getNavigation2();
 //2.搜索 start ---------------------------------------->
 import { ElSelect, ElOption, ElMessage } from 'element-plus'
 
-const searchInputValue1 = ref("")
-const searchInputValue2 = ref("")
-const searchInputValue3 = ref("")
-
 let selectOptions = [
-    { name: '求职', id: 1 },
-    { name: '招聘', id: 2 },
+    { name: '招聘', id: 4 },
+    { name: '求职', id: 5 },
 ]
-// let selectOptions2 = [
-//     { name: '职业1', id: 1 },
-//     { name: '职业2', id: 2 },
-//     { name: '职业3', id: 3 },
-// ]
-// let selectOptions3 = [
-//     { name: '地区1', id: 1 },
-//     { name: '地区2', id: 2 },
-//     { name: '地区3', id: 3 },
-// ]
-// const selectValue = ref("") //搜索左侧下拉选择的值
-// const inputValue = ref("") //搜索右侧框输入的值
-
 
 //2.1跳转到搜索页面
-// let goToPrimary = async () => {
-//     if (inputValue.value == "" || selectValue.value == "") {
-//         ElMessage.error('搜索项不能为空！')
-//     } else {
-//         if (selectValue.value == 2 || selectValue.value == 3) {
-//             ElMessage.error('所选分类暂不支持检索！')
-//         } else {
-//             const route = `/search/search?type=${selectValue.value}&keyword=${inputValue.value}`;
-//             window.location.href = route;
-//         }
-//     }
-// }
+const searchInputValue1 = ref("")
+const typeValue = ref("")
+
+let goToSearch = async () => {
+    if (typeValue.value == "" || searchInputValue1.value == "") {
+        ElMessage.error('搜索项不能为空！')
+    } else {
+        const route = `/search/search?type=${searchInputValue1.value}&keyword=${typeValue.value}`;
+        window.location.href = route;
+    }
+}
 
 //2.搜索 end ---------------------------------------->
 
@@ -246,7 +198,7 @@ let goToPrimary = async () => {
     if (province.value == "" && city.value == "" && region.value == "") {
         ElMessage.error('请选择地区！')
     } else {
-        const route = `/search/search?catids=${getcityid.value}`;
+        const route = `/search/search?catids=${getcityid.value}&type=1`;
         window.location.href = route;
     }
 }

components/home/pageNavigation1.vue

@@ -28,52 +28,6 @@
                 </ul>
             </div>
         </div>
-        <div class="partThree">
-            <div class="inner">
-                <div class="title">
-                    搜索职位 : 
-                </div>
-                <div class="searchRole">
-                    <!--下拉框只在客户端渲染-->
-                    <client-only> 
-                        <el-select v-model="searchInputValue1" placeholder="招聘" size="large" style="width: 75px" :key="'select1'">
-                            <el-option v-for="item in selectOptions" :key="item.id" :label="item.name" :value="item.id" />
-                        </el-select>
-                    </client-only>
-                    <i></i>
-                    <input type="text" v-model="typeValue" placeholder="输入关键词" class="ipt">
-                    <em class="search"></em>
-                </div>
-                <div class="searchRole">
-                    <client-only> 
-                        <el-select v-model="searchInputValue2" placeholder="选择职业" size="large" style="width: 80px" :key="'select2'">
-                            <el-option 
-                                v-for="item in selectOptions2" 
-                                :label="item.name"
-                                :value="item.id" 
-                                :key="item.id"
-                            />
-                        </el-select>
-                    </client-only>
-                    <i></i>
-                    <client-only> 
-                    <el-select v-model="searchInputValue3" placeholder="选择地区" size="large" style="width: 80px" :key="'select3'">
-                        <el-option 
-                            v-for="item in selectOptions3" 
-                            :key="item.id" 
-                            :label="item.name"
-                            :value="item.id" 
-                        />
-                        </el-select>
-                    </client-only>
-                    <i></i>
-                    <!-- <em class="search1" @click="goToPrimary"></em> -->
-                </div>
-                <div class="title1">
-                    更多搜索条件>>
-                </div>
-            </div>
-        </div>
     </div>
 </template>
 
@@ -111,67 +65,6 @@ async function getNavigation2() {
 getNavigation2();
 //1.获取导航菜单 end ---------------------------------------->
 
-//2.搜索 start ---------------------------------------->
-import { ElSelect, ElOption, ElMessage } from 'element-plus'
-
-const searchInputValue1 = ref("")
-const searchInputValue2 = ref("")
-const searchInputValue3 = ref("")
-
-let selectOptions = [
-    {name:'资讯',id:1},
-    {name:'商城',id:2},
-    {name:'招工招聘',id:3},
-]
-let selectOptions2 = [
-    {name:'职业1',id:1},
-    {name:'职业2',id:2},
-    {name:'职业3',id:3},
-]
-let selectOptions3 = [ 
-    {name:'地区1',id:1},
-    {name:'地区2',id:2},
-    {name:'地区3',id:3},
-]
-const selectValue = ref("") //搜索左侧下拉选择的值
-const inputValue = ref("") //搜索右侧框输入的值
-
-
-//2.1跳转到搜索页面
-let goToPrimary = async () => {
-    if (inputValue.value==""||selectValue.value=="") {
-        ElMessage.error('搜索项不能为空！')
-    }else{
-        if(selectValue.value == 2||selectValue.value == 3){
-            ElMessage.error('所选分类暂不支持检索！')
-        }else{
-            const route = `/search/search?type=${selectValue.value}&keyword=${inputValue.value}`;
-            window.location.href = route;
-        }
-    }
-}
-
-onMounted(async ()  => {
-    //2.2 获得搜索选项
-    //暂时为固定
-    //商城、招工招聘 都不能跳转
-    // try {
-    //     const { $webUrl, $CwebUrl } = useNuxtApp();
-    //     const response = await fetch($webUrl + '/web/selectWebsiteDepartment', {
-    //         headers: {
-    //             'Content-Type': 'application/json',
-    //             'Userurl': $CwebUrl,
-    //             'Origin': $CwebUrl
-    //         }
-    //     });
-    //     const result = await response.json();
-    //     department.value = result.data;
-    // } catch (error) {
-    //     console.error('获取部门数据失败:', error);
-    // }
-})
-//2.搜索 end ---------------------------------------->
-
 </script>
 
 <style lang="less" scoped>

components/search/jobHunting.vue

@@ -0,0 +1,268 @@
+<template>
+    <div id="newsList">
+        <!-- 页面头部 -->
+        <HomePageHead></HomePageHead>
+        <!-- 导航栏 -->
+        <HomePageNavigation></HomePageNavigation>
+        <!-- 列表页广告一 -->
+        <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
+        <!-- 搜索框 -->
+        <div class="search">
+            <div class="inner">
+                <input v-model="keywordInput" type="text" placeholder="请输入要搜索的岗位名称">
+                <button @click="goSearch">搜索</button>
+            </div>
+        </div>
+        <div class="breadcrumb">
+            <div class="inner">
+                <span class="location">当前位置:</span>
+                <el-breadcrumb :separator-icon="ArrowRight">
+                    <el-breadcrumb-item>
+                        <NuxtLink to="/">首页</NuxtLink>
+                    </el-breadcrumb-item>
+                    <el-breadcrumb-item>搜索</el-breadcrumb-item>
+                    <el-breadcrumb-item>求职</el-breadcrumb-item>
+                </el-breadcrumb>
+            </div>
+        </div>
+        <!-- 求职列表页 -->
+        <main class="index_main">
+            <section class="table_out clearfix">
+                <div class="table_head clearfix phone_none">
+                    <div class="table_head_name">姓名</div>
+                    <div class="table_head_job">岗位</div>
+                    <div class="table_head_sex">性别</div>
+                    <div class="table_head_experience">工作经验</div>
+                    <div class="table_head_native">籍贯</div>
+                    <div class="table_head_industry">所属行业</div>
+                    <div class="table_head_address">地区</div>
+                    <div class="table_head_time">时间</div>
+                </div>
+                <div class="table_ul clearfix">
+                    <div class="table_li clearfix" v-for="(item, index) in jobList" :key="index">
+                        <NuxtLink class="table_li_a clearfix" :href="getLinkPathDetail(item)" :title="item.name">
+                            <div class="table_li_name dot1">
+                                <label class="table_li_label pc_none">姓名:</label>
+                                <div class="table_li_name_in dot1">
+                                    {{ item.name }}
+                                </div>
+                            </div>
+                            <div class="table_li_job dot1">
+                                <label class="table_li_label pc_none">岗位:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.jtzw_name }}
+                                </div>
+                            </div>
+                            <div class="table_li_sex dot1">
+                                <label class="table_li_label pc_none">性别:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.sexy ? '男' : '女' }}
+                                </div>
+                            </div>
+                            <div class="table_li_experience dot1">
+                                <label class="table_li_label pc_none">工作经验:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.experience_name }}
+                                </div>
+                            </div>
+                            <div class="table_li_native dot1">
+                                <label class="table_li_label pc_none">籍贯:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.origin }}
+                                </div>
+                            </div>
+                            <div class="table_li_industry dot1">
+                                <label class="table_li_label pc_none">所属行业:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.hy_name }}
+                                </div>
+                            </div>
+                            <div class="table_li_address">
+                                <label class="table_li_label pc_none">地区:</label>
+                                <span class="table_li_in dot1">
+                                    {{ item.city_name }}
+                                </span>
+                            </div>
+                            <div class="table_li_time dot1">
+                                <label class="table_li_label pc_none">时间:</label>
+                                <span class="table_li_in dot1">
+                                    {{ getTime(item.updated_at, 'year', 1) }}
+                                </span>
+                            </div>
+                        </NuxtLink>
+                    </div>
+                </div>
+                <div class="empty" v-if="jobList == false">
+                    <img src="@/public/search/empty.png" alt="" class="empty_img">
+                    <span class="empty_text">当前暂无数据</span>
+                </div>
+            </section>
+        </main>
+        <!-- 分页器 -->
+        <div class="pagination11" v-if="jobList != false">
+            <div class="pagination">
+                <el-pagination background layout="prev, pager, next" :total="total" :page-size="pageSize"
+                    prev-text="上一页" next-text="下一页" @current-change="changePage" />
+            </div>
+        </div>
+        <!-- 列表页广告二 -->
+        <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
+        <!-- 页面底部 -->
+        <HomeFoot1></HomeFoot1>
+    </div>
+</template>
+
+<script setup>
+//1.页面依赖 start ---------------------------------------->
+import { ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus'
+import { ArrowRight } from '@element-plus/icons-vue'
+import { ref, onMounted } from 'vue';
+//1.页面依赖 end ---------------------------------------->
+
+
+//2.获取url中的参数 start ---------------------------------------->
+const route = useRoute();
+const pageCatids = route.query.catids;
+let keywordInput = ref("");
+
+if (route.params.id == 'search') {
+    //该处用于带有文字出入的搜索栏跳转
+    console.log("检测到从搜索栏跳转的搜索！")
+    console.log(route.query.type)//左侧搜索下拉框的值
+    console.log(route.query.keyword)//右侧输入框的值
+
+    //目前route.query.type 1=资讯 2=商城 3=招工招聘
+    //但是商城和招工招聘暂没有开发完，所以这里不需要考虑 只给keyword赋值即可
+    keywordInput.value = route.query.keyword;
+
+} else {
+    //该处用于搜索栏中含有地区的跳转
+    const pageCatids = route.params.id
+}
+const pageDepartment_id = route.query.department_id;
+//2.获取url中的参数 end ---------------------------------------->
+
+//3.在该页进行搜索 start ---------------------------------------->
+//3.1 分页
+let total = useState("total", () => 0)
+let page = useState("page", () => 1)
+let pageSize = useState("pageSize", () => 10)
+
+//3.2 获得求职列表
+const jobList = ref()
+const getJobsList = await requestDataPromise('/web/getWebsiteJobList', {
+    method: 'GET',
+    query: {
+        'page': page.value,
+        'pageSize': pageSize.value,
+        'type': 2
+    },
+});
+console.log("获取数据列表job", getJobsList.data.JobHunting);
+
+if (getJobsList.code == 200) {
+    jobList.value = getJobsList.data.JobHunting
+    total.value = getJobsList.data.hunt_count
+}
+
+
+//3.3 在本页进行搜索的方法
+let goSearch = async () => {
+    console.log(page.value)
+    console.log(pageSize.value)
+    console.log(keywordInput.value)
+    console.log(pageCatids)
+    console.log(pageDepartment_id)
+
+    const listData = await requestDataPromise('/web/getWebsiteJobList', {
+        method: 'GET',
+        query: {
+            'page': page.value,
+            'pageSize': pageSize.value,
+            'keyword': keywordInput.value,
+            'type': 2
+        },
+    });
+    if (listData.code == 200) {
+        jobList.value = listData.data.JobHunting
+        total.value = listData.data.hunt_count
+    } else {
+        jobList.value = [];
+        total.value = 0;
+    }
+}
+
+goSearch();
+
+//3.4 分页事件
+let changePage = (value) => {
+    console.log("当前页码", value);
+    page.value = value
+    console.log(page.value);
+    goSearch()
+}
+//3.在该页进行搜索 end ---------------------------------------->
+
+
+//4.广告 start ---------------------------------------->
+let adImg1 = ref([]);
+let adImg2 = ref([]);
+
+onMounted(async () => {
+    //从客户端获取行政职能部门 加快打开速度
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0001`
+    const responseAd1 = await fetch(url, {
+        headers: {
+            'Content-Type': 'application/json',
+            'Userurl': $CwebUrl,
+            'Origin': $CwebUrl
+        }
+    });
+    const resultAd1 = await responseAd1.json();
+    adImg1.value = resultAd1.data[0];
+
+    //广告2
+    let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0002`
+    const responseAd2 = await fetch(url2, {
+        headers: {
+            'Content-Type': 'application/json',
+            'Userurl': $CwebUrl,
+            'Origin': $CwebUrl
+        }
+    });
+    const resultAd2 = await responseAd2.json();
+    adImg2.value = resultAd2.data[0];
+})
+//4.页面数据 end ---------------------------------------->
+
+
+//5.设置seo信息 start---------------------------------------->
+const setData = await requestDataPromise('/web/getWebsiteFootInfo', {
+    method: 'GET',
+    query: {},
+});
+
+let seoTitle = setData.data.website_head.title;
+let seoDescription = setData.data.website_head.description;
+let seoKeywords = setData.data.website_head.keywords;
+let seoSuffix = setData.data.website_head.suffix;
+let seoName = setData.data.website_head.website_name;
+
+useSeoMeta({
+    title: seoTitle + "_" + seoSuffix,
+    meta: [
+        { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
+        { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
+    ]
+});
+//5.设置seo信息 end---------------------------------------->
+
+
+</script>
+
+<style lang="less" scoped>
+@import url('@/assets/css/search/global.less');
+@import url('@/assets/css/search/jobHunting.less');
+</style>

components/search/jobRecruit.vue

@@ -0,0 +1,246 @@
+<template>
+    <div id="newsList">
+        <!-- 页面头部 -->
+        <HomePageHead></HomePageHead>
+        <!-- 导航栏 -->
+        <HomePageNavigation></HomePageNavigation>
+        <!-- 列表页广告一 -->
+        <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
+        <!-- 搜索框 -->
+        <div class="search">
+            <div class="inner">
+                <input v-model="keywordInput" type="text" placeholder="请输入要搜索的职位信息">
+                <button @click="goSearch">搜索</button>
+            </div>
+        </div>
+        <div class="breadcrumb">
+            <div class="inner">
+                <span class="location">当前位置:</span>
+                <el-breadcrumb :separator-icon="ArrowRight">
+                    <el-breadcrumb-item>
+                        <NuxtLink to="/">首页</NuxtLink>
+                    </el-breadcrumb-item>
+                    <el-breadcrumb-item>搜索</el-breadcrumb-item>
+                    <el-breadcrumb-item>招聘</el-breadcrumb-item>
+                </el-breadcrumb>
+            </div>
+        </div>
+        <main class="index_main">
+            <section class="table_out clearfix">
+                <div class="table_head clearfix phone_none">
+                    <div class="table_head_masg">职位信息</div>
+                    <div class="table_head_company">公司</div>
+                    <div class="table_head_job">岗位</div>
+                    <div class="table_head_address">地区</div>
+                    <div class="table_head_time">时间</div>
+                </div>
+                <div class="table_ul clearfix">
+                    <div class="table_li clearfix" v-for="(item, index) in jobList" :key="index">
+                        <NuxtLink class="table_li_a clearfix" :href="getLinkPathDetail(item)" :title="item.title">
+                            <div class="table_li_masg dot1">
+                                <label class="table_li_label pc_none">职位信息:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.title }}
+                                </div>
+                            </div>
+                            <div class="table_li_company dot1">
+                                <label class="table_li_label pc_none">公司:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.business_name }}
+                                </div>
+                            </div>
+                            <div class="table_li_job ">
+                                <label class="table_li_label pc_none">岗位:</label>
+                                <span class="table_li_job_in table_li_text dot1">
+                                    {{ item.jtzw_name }}
+                                </span>
+                            </div>
+                            <div class="table_li_address dot1">
+                                <label class="table_li_label pc_none">地区:</label>
+                                <div class="table_li_text dot1">
+                                    {{ item.city_name }}
+                                </div>
+                            </div>
+                            <div class="table_li_time">
+                                <label class="table_li_label pc_none">时间:</label>
+                                <div class="table_li_text dot1">
+                                    {{ getTime(item.updated_at, 'year', 1) }}
+                                </div>
+                            </div>
+                        </NuxtLink>
+                    </div>
+                </div>
+                <div class="empty" v-if="jobList == false">
+                    <img src="@/public/search/empty.png" alt="" class="empty_img">
+                    <span class="empty_text">当前暂无数据</span>
+                </div>
+            </section>
+        </main>
+        <!-- 分页器 -->
+        <div class="pagination11" v-if="jobList != false">
+            <div class="pagination">
+                <el-pagination background layout="prev, pager, next" :total="total" :page-size="pageSize"
+                    prev-text="上一页" next-text="下一页" @current-change="changePage" />
+            </div>
+        </div>
+        <!-- 列表页广告二 -->
+        <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
+        <!-- 页面底部 -->
+        <HomeFoot1></HomeFoot1>
+    </div>
+</template>
+
+<script setup>
+//1.页面依赖 start ---------------------------------------->
+import { ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus'
+import { ArrowRight } from '@element-plus/icons-vue'
+import { ref, onMounted } from 'vue';
+//1.页面依赖 end ---------------------------------------->
+
+
+//2.获取url中的参数 start ---------------------------------------->
+const route = useRoute();
+const pageCatids = route.query.catids;
+let keywordInput = ref("");
+
+if (route.params.id == 'search') {
+    //该处用于带有文字出入的搜索栏跳转
+    console.log("检测到从搜索栏跳转的搜索！")
+    console.log(route.query.type)//左侧搜索下拉框的值
+    console.log(route.query.keyword)//右侧输入框的值
+
+    //目前route.query.type 1=资讯 2=商城 3=招工招聘
+    //但是商城和招工招聘暂没有开发完，所以这里不需要考虑 只给keyword赋值即可
+    keywordInput.value = route.query.keyword;
+
+} else {
+    //该处用于搜索栏中含有地区的跳转
+    const pageCatids = route.params.id
+}
+const pageDepartment_id = route.query.department_id;
+//2.获取url中的参数 end ---------------------------------------->
+
+//3.在该页进行搜索 start ---------------------------------------->
+//3.1 分页
+let total = useState("total", () => 0)
+let page = useState("page", () => 1)
+let pageSize = useState("pageSize", () => 10)
+
+//3.2 获得招聘列表 
+const jobList = ref([]);
+let getJobsList = async () => {
+    const getJobsList = await requestDataPromise('/web/getWebsiteJobList', {
+        method: 'GET',
+        query: {
+            'page': page.value,
+            'pageSize': pageSize.value,
+            'type': 1
+        },
+    });
+
+    if (getJobsList.code == 200) {
+        jobList.value = getJobsList.data.JobRecruiting
+        total.value = getJobsList.data.recruit_count
+    }
+}
+getJobsList();
+
+
+//3.3 在本页进行搜索的方法
+let goSearch = async () => {
+    console.log(page.value)
+    console.log(pageSize.value)
+    console.log(keywordInput.value)
+    console.log(pageCatids)
+    console.log(pageDepartment_id)
+
+    const listData = await requestDataPromise('/web/getWebsiteJobList', {
+        method: 'GET',
+        query: {
+            'page': page.value,
+            'pageSize': pageSize.value,
+            'keyword': keywordInput.value,
+            'type': 1
+        },
+    });
+    if (listData.code == 200) {
+        jobList.value = listData.data.JobRecruiting
+        total.value = listData.data.recruit_count
+    } else {
+        jobList.value = [];
+        total.value = 0;
+    }
+}
+goSearch();
+
+//3.4 分页事件
+let changePage = (value) => {
+    console.log("当前页码", value);
+    page.value = value
+    console.log(page.value);
+    goSearch()
+}
+//3.在该页进行搜索 end ---------------------------------------->
+
+
+//4.广告 start ---------------------------------------->
+let adImg1 = ref([]);
+let adImg2 = ref([]);
+
+onMounted(async () => {
+    //从客户端获取行政职能部门 加快打开速度
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0001`
+    const responseAd1 = await fetch(url, {
+        headers: {
+            'Content-Type': 'application/json',
+            'Userurl': $CwebUrl,
+            'Origin': $CwebUrl
+        }
+    });
+    const resultAd1 = await responseAd1.json();
+    adImg1.value = resultAd1.data[0];
+
+    //广告2
+    let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0002`
+    const responseAd2 = await fetch(url2, {
+        headers: {
+            'Content-Type': 'application/json',
+            'Userurl': $CwebUrl,
+            'Origin': $CwebUrl
+        }
+    });
+    const resultAd2 = await responseAd2.json();
+    adImg2.value = resultAd2.data[0];
+})
+//4.页面数据 end ---------------------------------------->
+
+
+//5.设置seo信息 start---------------------------------------->
+const setData = await requestDataPromise('/web/getWebsiteFootInfo', {
+    method: 'GET',
+    query: {},
+});
+
+let seoTitle = setData.data.website_head.title;
+let seoDescription = setData.data.website_head.description;
+let seoKeywords = setData.data.website_head.keywords;
+let seoSuffix = setData.data.website_head.suffix;
+let seoName = setData.data.website_head.website_name;
+
+useSeoMeta({
+    title: seoTitle + "_" + seoSuffix,
+    meta: [
+        { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
+        { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
+    ]
+});
+//5.设置seo信息 end---------------------------------------->
+
+</script>
+
+<style lang="less" scoped>
+@import url('@/assets/css/search/global.less');
+@import url('@/assets/css/search/jobRecruit.less');
+</style>

components/search/news.vue

@@ -0,0 +1,207 @@
+<template>
+    <div id="newsList">
+        <!-- 页面头部 -->
+        <HomePageHead></HomePageHead>
+        <!-- 导航栏 -->
+        <HomePageNavigation></HomePageNavigation>
+        <!-- 列表页广告一 -->
+        <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
+        <!-- 搜索框 -->
+        <div class="search">
+            <div class="inner">
+                <input v-model="keywordInput" type="text" placeholder="请输入搜索内容">
+                <button @click="goSearch">搜索</button>
+            </div>
+        </div>
+        <div class="breadcrumb">
+            <div class="inner">
+                <span class="location">当前位置:</span>
+                <el-breadcrumb :separator-icon="ArrowRight">
+                    <el-breadcrumb-item>
+                        <NuxtLink to="/">首页</NuxtLink>
+                    </el-breadcrumb-item>
+                    <el-breadcrumb-item>搜索</el-breadcrumb-item>
+                    <el-breadcrumb-item>资讯</el-breadcrumb-item>
+                </el-breadcrumb>
+            </div>
+        </div>
+        <div class="newsList">
+            <div class="inner">
+                <div class="innerLeft">
+                    <ul class="list" v-if="newsList.length >= 0">
+                        <li v-for="(item, index) in newsList" :key="index">
+                            <NuxtLink :href="getLinkPathDetail(item)" :title="item.title" :target="item.islink == 1 ? '_blank' : '_self'">
+                                {{ item.title }}
+                            </NuxtLink>
+                            <span class="time right">{{getTime(item.updated_at,'month',1)}}</span>
+                        </li>
+                    </ul>
+                    <div v-if="newsList.length == 0" class="empty">
+                        <div>
+                            <img src="../../public/search/empty.png" alt="暂无内容">
+                            <p>暂无搜索数据</p>
+                        </div>
+                    </div>
+                    <!-- 分页器 -->
+                    <div class="pagination" v-if="total > 0">
+                        <el-pagination 
+                            size="small" 
+                            background 
+                            layout="prev, pager, next" 
+                            :total="total" 
+                            class="mt-4"
+                            :page-size="pageSize" 
+                            prev-text="上一页" 
+                            next-text="下一页" 
+                            @change="changePage"
+                         />
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!-- 列表页广告二 -->
+        <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
+        <!-- 页面底部 -->
+        <HomeFoot1></HomeFoot1>
+    </div>
+</template>
+
+<script setup>
+//1.页面依赖 start ---------------------------------------->
+import { ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus'
+import { ArrowRight } from '@element-plus/icons-vue'
+import { ref, onMounted } from 'vue';
+//1.页面依赖 end ---------------------------------------->
+
+
+//2.获取url中的参数 start ---------------------------------------->
+const route = useRoute();
+const pageCatids = route.query.catids;
+let keywordInput = ref("");
+
+if(route.params.id=='search'){
+    //该处用于带有文字出入的搜索栏跳转
+    console.log("检测到从搜索栏跳转的搜索！")
+    console.log(route.query.type)//左侧搜索下拉框的值
+    console.log(route.query.keyword)//右侧输入框的值
+
+    //目前route.query.type 1=资讯 2=商城 3=招工招聘
+    //但是商城和招工招聘暂没有开发完，所以这里不需要考虑 只给keyword赋值即可
+    keywordInput.value = route.query.keyword;
+    
+}else{
+    //该处用于搜索栏中含有地区的跳转
+    const pageCatids = route.params.id
+}
+const pageDepartment_id = route.query.department_id;
+//2.获取url中的参数 end ---------------------------------------->
+
+//3.在该页进行搜索 start ---------------------------------------->
+//3.1 分页
+let total = useState("total", () => 0)
+let page = useState("page", () => 1)
+let pageSize = useState("pageSize", () => 20)
+
+//3.2 获得新闻列表
+const newsList = ref([]);
+
+
+//3.3 在本页进行搜索的方法
+let goSearch = async () => {
+    console.log(page.value)
+    console.log(pageSize.value)
+    console.log(keywordInput.value)
+    console.log(pageCatids)
+    console.log(pageDepartment_id)
+    
+    const listData =  await requestDataPromise('/web/selectWebsiteCategory', {
+        method: 'GET',
+        query: {
+            'page': page.value,
+            'pageSize': pageSize.value,
+            'keyword':keywordInput.value,
+            'cityid':pageCatids,
+            'department_id':pageDepartment_id
+        },
+    });
+    if(listData.data.rows){
+        console.log(listData)
+        newsList.value = listData.data.rows;
+        total.value = listData.data.count;
+    }else{
+        newsList.value = [];
+        total.value = 0;
+    }
+}
+
+goSearch();
+
+//3.4 分页事件
+let changePage = (value) => {
+    console.log("当前页码", value);
+    page.value = value
+    console.log(page.value);
+    goSearch()
+}
+//3.在该页进行搜索 end ---------------------------------------->
+
+
+//4.广告 start ---------------------------------------->
+let adImg1 = ref([]);
+let adImg2 = ref([]);
+
+onMounted(async ()  => {
+    //从客户端获取行政职能部门 加快打开速度
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0001`
+    const responseAd1 = await fetch(url, {
+        headers: {
+            'Content-Type': 'application/json',
+            'Userurl': $CwebUrl,
+            'Origin': $CwebUrl
+        }
+    });
+    const resultAd1 = await responseAd1.json();
+    adImg1.value = resultAd1.data[0];
+    
+    //广告2
+    let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0002`
+    const responseAd2 = await fetch(url2, {
+        headers: {
+            'Content-Type': 'application/json',
+            'Userurl': $CwebUrl,
+            'Origin': $CwebUrl
+        }
+    });
+    const resultAd2 = await responseAd2.json();
+    adImg2.value = resultAd2.data[0];
+})
+//4.页面数据 end ---------------------------------------->
+
+
+//5.设置seo信息 start---------------------------------------->
+const setData =  await requestDataPromise('/web/getWebsiteFootInfo', {
+    method: 'GET',
+    query: {},
+});
+
+let seoTitle = setData.data.website_head.title;
+let seoDescription = setData.data.website_head.description;
+let seoKeywords = setData.data.website_head.keywords;
+let seoSuffix = setData.data.website_head.suffix;
+let seoName = setData.data.website_head.website_name;
+
+useSeoMeta({
+    title: seoTitle + "_" + seoSuffix,
+    meta: [
+        { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
+        { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
+    ]
+});
+//5.设置seo信息 end---------------------------------------->
+</script>
+
+<style lang="less" scoped>
+@import url('@/assets/css/search.less');
+</style>

pages/search/[id].vue

@@ -1,206 +1,13 @@
 <template>
-    <div id="newsList">
-        <!-- 页面头部 -->
-        <HomePageHead></HomePageHead>
-        <!-- 导航栏 -->
-        <HomePageNavigation></HomePageNavigation>
-        <!-- 列表页广告一 -->
-        <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
-        <!-- 搜索框 -->
-        <div class="search">
-            <div class="inner">
-                <input v-model="keywordInput" type="text" placeholder="请输入搜索内容">
-                <button @click="goSearch">搜索</button>
-            </div>
-        </div>
-        <div class="breadcrumb">
-            <div class="inner">
-                <span class="location">当前位置:</span>
-                <el-breadcrumb :separator-icon="ArrowRight">
-                    <el-breadcrumb-item>
-                        <NuxtLink to="/">首页</NuxtLink>
-                    </el-breadcrumb-item>
-                    <el-breadcrumb-item>搜索</el-breadcrumb-item>
-                </el-breadcrumb>
-            </div>
-        </div>
-        <div class="newsList">
-            <div class="inner">
-                <div class="innerLeft">
-                    <ul class="list" v-if="newsList.length >= 0">
-                        <li v-for="(item, index) in newsList" :key="index">
-                            <NuxtLink :href="getLinkPathDetail(item)" :title="item.title" :target="item.islink == 1 ? '_blank' : '_self'">
-                                {{ item.title }}
-                            </NuxtLink>
-                            <span class="time right">{{getTime(item.updated_at,'month',1)}}</span>
-                        </li>
-                    </ul>
-                    <div v-if="newsList.length == 0" class="empty">
-                        <div>
-                            <img src="../../public/search/empty.png" alt="暂无内容">
-                            <p>暂无搜索数据</p>
-                        </div>
-                    </div>
-                    <!-- 分页器 -->
-                    <div class="pagination" v-if="total > 0">
-                        <el-pagination 
-                            size="small" 
-                            background 
-                            layout="prev, pager, next" 
-                            :total="total" 
-                            class="mt-4"
-                            :page-size="pageSize" 
-                            prev-text="上一页" 
-                            next-text="下一页" 
-                            @change="changePage"
-                         />
-                    </div>
-                </div>
-            </div>
-        </div>
-        <!-- 列表页广告二 -->
-        <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
-        <!-- 页面底部 -->
-        <HomeFoot1></HomeFoot1>
-    </div>
+    <SearchNews v-if="type == 1"></SearchNews>
+    <SearchJobHunting v-if="type == 5"></SearchJobHunting>
+    <SearchJobRecruit v-if="type == 4"></SearchJobRecruit>
 </template>
-
 <script setup>
-//1.页面依赖 start ---------------------------------------->
-import { ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus'
-import { ArrowRight } from '@element-plus/icons-vue'
-import { ref, onMounted } from 'vue';
-//1.页面依赖 end ---------------------------------------->
-
-
-//2.获取url中的参数 start ---------------------------------------->
+import { ref } from 'vue'
+import { useRoute } from 'vue-router'
 const route = useRoute();
-const pageCatids = route.query.catids;
-let keywordInput = ref("");
-
-if(route.params.id=='search'){
-    //该处用于带有文字出入的搜索栏跳转
-    console.log("检测到从搜索栏跳转的搜索！")
-    console.log(route.query.type)//左侧搜索下拉框的值
-    console.log(route.query.keyword)//右侧输入框的值
-
-    //目前route.query.type 1=资讯 2=商城 3=招工招聘
-    //但是商城和招工招聘暂没有开发完，所以这里不需要考虑 只给keyword赋值即可
-    keywordInput.value = route.query.keyword;
-    
-}else{
-    //该处用于搜索栏中含有地区的跳转
-    const pageCatids = route.params.id
-}
-const pageDepartment_id = route.query.department_id;
-//2.获取url中的参数 end ---------------------------------------->
-
-//3.在该页进行搜索 start ---------------------------------------->
-//3.1 分页
-let total = useState("total", () => 0)
-let page = useState("page", () => 1)
-let pageSize = useState("pageSize", () => 20)
-
-//3.2 获得新闻列表
-const newsList = ref([]);
-
-
-//3.3 在本页进行搜索的方法
-let goSearch = async () => {
-    console.log(page.value)
-    console.log(pageSize.value)
-    console.log(keywordInput.value)
-    console.log(pageCatids)
-    console.log(pageDepartment_id)
-    
-    const listData =  await requestDataPromise('/web/selectWebsiteCategory', {
-        method: 'GET',
-        query: {
-            'page': page.value,
-            'pageSize': pageSize.value,
-            'keyword':keywordInput.value,
-            'cityid':pageCatids,
-            'department_id':pageDepartment_id
-        },
-    });
-    if(listData.data.rows){
-        console.log(listData)
-        newsList.value = listData.data.rows;
-        total.value = listData.data.count;
-    }else{
-        newsList.value = [];
-        total.value = 0;
-    }
-}
-
-goSearch();
-
-//3.4 分页事件
-let changePage = (value) => {
-    console.log("当前页码", value);
-    page.value = value
-    console.log(page.value);
-    goSearch()
-}
-//3.在该页进行搜索 end ---------------------------------------->
-
-
-//4.广告 start ---------------------------------------->
-let adImg1 = ref([]);
-let adImg2 = ref([]);
-
-onMounted(async ()  => {
-    //从客户端获取行政职能部门 加快打开速度
-    const { $webUrl, $CwebUrl } = useNuxtApp();
-    //广告1
-    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0001`
-    const responseAd1 = await fetch(url, {
-        headers: {
-            'Content-Type': 'application/json',
-            'Userurl': $CwebUrl,
-            'Origin': $CwebUrl
-        }
-    });
-    const resultAd1 = await responseAd1.json();
-    adImg1.value = resultAd1.data[0];
-    
-    //广告2
-    let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_search_0002`
-    const responseAd2 = await fetch(url2, {
-        headers: {
-            'Content-Type': 'application/json',
-            'Userurl': $CwebUrl,
-            'Origin': $CwebUrl
-        }
-    });
-    const resultAd2 = await responseAd2.json();
-    adImg2.value = resultAd2.data[0];
-})
-//4.页面数据 end ---------------------------------------->
-
-
-//5.设置seo信息 start---------------------------------------->
-const setData =  await requestDataPromise('/web/getWebsiteFootInfo', {
-    method: 'GET',
-    query: {},
-});
-
-let seoTitle = setData.data.website_head.title;
-let seoDescription = setData.data.website_head.description;
-let seoKeywords = setData.data.website_head.keywords;
-let seoSuffix = setData.data.website_head.suffix;
-let seoName = setData.data.website_head.website_name;
-
-useSeoMeta({
-    title: seoTitle + "_" + seoSuffix,
-    meta: [
-        { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
-        { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
-    ]
-});
-//5.设置seo信息 end---------------------------------------->
-</script>
+let type = route.query.type
+let keyword = route.query.keyword
 
-<style lang="less" scoped>
-@import url('@/assets/css/search.less');
-</style>
+</script>