Sfoglia il codice sorgente

频道页商城功能完成

Jing 2 settimane fa
parent
commit
f78556621d

+ 16 - 0
.nuxt/components.d.ts

@@ -6,6 +6,8 @@ interface _GlobalComponents {
     'AdvertisingOrderList': typeof import("../components/advertising/OrderList.vue")['default']
     'DetailHotNews': typeof import("../components/detail/HotNews.vue")['default']
     'DetailHotNews2': typeof import("../components/detail/HotNews2.vue")['default']
+    'GoodsDetail': typeof import("../components/goods/detail.vue")['default']
+    'GoodsList': typeof import("../components/goods/list.vue")['default']
     'HomeAdvertising': typeof import("../components/home/Advertising.vue")['default']
     'HomeBigSwiper': typeof import("../components/home/BigSwiper.vue")['default']
     'HomeBigTitleList': typeof import("../components/home/BigTitle_List.vue")['default']
@@ -21,6 +23,8 @@ 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']
+    'NewsDetail': typeof import("../components/news/detail.vue")['default']
+    'NewsList': typeof import("../components/news/list.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']
@@ -48,6 +52,8 @@ interface _GlobalComponents {
     'LazyAdvertisingOrderList': typeof import("../components/advertising/OrderList.vue")['default']
     'LazyDetailHotNews': typeof import("../components/detail/HotNews.vue")['default']
     'LazyDetailHotNews2': typeof import("../components/detail/HotNews2.vue")['default']
+    'LazyGoodsDetail': typeof import("../components/goods/detail.vue")['default']
+    'LazyGoodsList': typeof import("../components/goods/list.vue")['default']
     'LazyHomeAdvertising': typeof import("../components/home/Advertising.vue")['default']
     'LazyHomeBigSwiper': typeof import("../components/home/BigSwiper.vue")['default']
     'LazyHomeBigTitleList': typeof import("../components/home/BigTitle_List.vue")['default']
@@ -63,6 +69,8 @@ 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']
+    'LazyNewsDetail': typeof import("../components/news/detail.vue")['default']
+    'LazyNewsList': typeof import("../components/news/list.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']
@@ -96,6 +104,8 @@ export const AdvertisingBuyAD: typeof import("../components/advertising/BuyAD.vu
 export const AdvertisingOrderList: typeof import("../components/advertising/OrderList.vue")['default']
 export const DetailHotNews: typeof import("../components/detail/HotNews.vue")['default']
 export const DetailHotNews2: typeof import("../components/detail/HotNews2.vue")['default']
+export const GoodsDetail: typeof import("../components/goods/detail.vue")['default']
+export const GoodsList: typeof import("../components/goods/list.vue")['default']
 export const HomeAdvertising: typeof import("../components/home/Advertising.vue")['default']
 export const HomeBigSwiper: typeof import("../components/home/BigSwiper.vue")['default']
 export const HomeBigTitleList: typeof import("../components/home/BigTitle_List.vue")['default']
@@ -111,6 +121,8 @@ export const HomeFoot1: typeof import("../components/home/foot1.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 NewsDetail: typeof import("../components/news/detail.vue")['default']
+export const NewsList: typeof import("../components/news/list.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']
@@ -138,6 +150,8 @@ export const LazyAdvertisingBuyAD: typeof import("../components/advertising/BuyA
 export const LazyAdvertisingOrderList: typeof import("../components/advertising/OrderList.vue")['default']
 export const LazyDetailHotNews: typeof import("../components/detail/HotNews.vue")['default']
 export const LazyDetailHotNews2: typeof import("../components/detail/HotNews2.vue")['default']
+export const LazyGoodsDetail: typeof import("../components/goods/detail.vue")['default']
+export const LazyGoodsList: typeof import("../components/goods/list.vue")['default']
 export const LazyHomeAdvertising: typeof import("../components/home/Advertising.vue")['default']
 export const LazyHomeBigSwiper: typeof import("../components/home/BigSwiper.vue")['default']
 export const LazyHomeBigTitleList: typeof import("../components/home/BigTitle_List.vue")['default']
@@ -153,6 +167,8 @@ export const LazyHomeFoot1: typeof import("../components/home/foot1.vue")['defau
 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 LazyNewsDetail: typeof import("../components/news/detail.vue")['default']
+export const LazyNewsList: typeof import("../components/news/list.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']

File diff suppressed because it is too large
+ 979 - 0
.nuxt/dev/index.mjs


File diff suppressed because it is too large
+ 0 - 0
.nuxt/dev/index.mjs.map


+ 2 - 1
.nuxt/imports.d.ts

@@ -29,8 +29,9 @@ export { onBeforeRouteLeave, onBeforeRouteUpdate, useLink } from 'vue-router';
 export { withCtx, withDirectives, withKeys, withMemo, withModifiers, withScopeId, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onServerPrefetch, onUnmounted, onUpdated, computed, customRef, isProxy, isReactive, isReadonly, isRef, markRaw, proxyRefs, reactive, readonly, ref, shallowReactive, shallowReadonly, shallowRef, toRaw, toRef, toRefs, triggerRef, unref, watch, watchEffect, watchPostEffect, watchSyncEffect, isShallow, effect, effectScope, getCurrentScope, onScopeDispose, defineComponent, defineAsyncComponent, resolveComponent, getCurrentInstance, h, inject, hasInjectionContext, nextTick, provide, mergeModels, toValue, useModel, useAttrs, useCssModule, useCssVars, useSlots, useTransitionState, useId, useTemplateRef, useShadowRoot, Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue';
 export { injectHead, useHead, useSeoMeta, useHeadSafe, useServerHead, useServerSeoMeta, useServerHeadSafe } from '@unhead/vue';
 export { requestData, requestDataPromise, requestDataWebUrl, requestHome } from '../composables/getData';
-export { getTime, getTitleLength } from '../composables/publicFunction';
+export { getTime, getTitleLength, getLinkPath, getLinkPath1, getLinkPathDetail, getRoutePath } from '../composables/publicFunction';
 export { seoSetup } from '../composables/useSeo';
 export { default as proxy } from '../utils/proxy';
 export { apiUse, asyncFetchData, fGET, fPOST, fPUT, fDELETE, GET, POST, PUT, DELETE } from '../utils/request';
+export { useNuxtDevTools } from '../node_modules/@nuxt/devtools/dist/runtime/use-nuxt-devtools';
 export { definePageMeta } from '../node_modules/nuxt/dist/pages/runtime/composables';

+ 1 - 1
.nuxt/manifest/latest.json

@@ -1 +1 @@
-{"id":"cff456cc-8f6a-49f6-b201-bd66faf512bf","timestamp":1750661693938}
+{"id":"dev","timestamp":1751525046803}

+ 1 - 0
.nuxt/manifest/meta/7527ea27-8fe2-4525-92e2-5988e4b4d7ea.json

@@ -0,0 +1 @@
+{"id":"7527ea27-8fe2-4525-92e2-5988e4b4d7ea","timestamp":1751524899937,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}

+ 0 - 1
.nuxt/manifest/meta/cff456cc-8f6a-49f6-b201-bd66faf512bf.json

@@ -1 +0,0 @@
-{"id":"cff456cc-8f6a-49f6-b201-bd66faf512bf","timestamp":1750661693938,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}

+ 1 - 0
.nuxt/manifest/meta/dev.json

@@ -0,0 +1 @@
+{"id":"dev","timestamp":1751525046803,"matcher":{"static":{},"wildcard":{},"dynamic":{}},"prerendered":[]}

+ 17 - 0
.nuxt/nitro.json

@@ -0,0 +1,17 @@
+{
+  "date": "2025-07-03T06:44:09.941Z",
+  "preset": "nitro-dev",
+  "framework": {
+    "name": "nuxt",
+    "version": "3.15.2"
+  },
+  "versions": {
+    "nitro": "2.10.4"
+  },
+  "dev": {
+    "pid": 4880,
+    "workerAddress": {
+      "socketPath": "\\\\.\\pipe\\nitro\\worker-4880-1.sock"
+    }
+  }
+}

+ 9 - 0
.nuxt/nuxt.json

@@ -0,0 +1,9 @@
+{
+  "_hash": "nOcZiyvxdB",
+  "project": {
+    "rootDir": "D:/01_AA_ssr_master/sannongzixunwang_web"
+  },
+  "versions": {
+    "nuxt": "3.15.2"
+  }
+}

+ 1 - 1
.nuxt/tsconfig.json

@@ -102,7 +102,7 @@
         "./imports"
       ],
       "#app-manifest": [
-        "./manifest/meta/cff456cc-8f6a-49f6-b201-bd66faf512bf.json"
+        "./manifest/meta/dev.json"
       ],
       "#components": [
         "./components"

+ 1 - 0
.nuxt/types/build.d.ts

@@ -11,6 +11,7 @@ declare module "#build/paths.mjs";
 declare module "#build/root-component.mjs";
 declare module "#build/plugins.server.mjs";
 declare module "#build/test-component-wrapper.mjs";
+declare module "#build/devtools/settings.mjs";
 declare module "#build/routes.mjs";
 declare module "#build/pages.mjs";
 declare module "#build/router.options.mjs";

+ 10 - 0
.nuxt/types/imports.d.ts

@@ -37,6 +37,10 @@ declare global {
   const getAppManifest: typeof import('../../node_modules/nuxt/dist/app/composables/manifest')['getAppManifest']
   const getCurrentInstance: typeof import('vue')['getCurrentInstance']
   const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const getLinkPath1: typeof import('../../composables/publicFunction')['getLinkPath1']
+  const getLinkPath: typeof import('../../composables/publicFunction')['getLinkPath']
+  const getLinkPathDetail: typeof import('../../composables/publicFunction')['getLinkPathDetail']
+  const getRoutePath: typeof import('../../composables/publicFunction')['getRoutePath']
   const getRouteRules: typeof import('../../node_modules/nuxt/dist/app/composables/manifest')['getRouteRules']
   const getTime: typeof import('../../composables/publicFunction')['getTime']
   const getTitleLength: typeof import('../../composables/publicFunction')['getTitleLength']
@@ -130,6 +134,7 @@ declare global {
   const useModel: typeof import('vue')['useModel']
   const useNuxtApp: typeof import('../../node_modules/nuxt/dist/app/nuxt')['useNuxtApp']
   const useNuxtData: typeof import('../../node_modules/nuxt/dist/app/composables/asyncData')['useNuxtData']
+  const useNuxtDevTools: typeof import('../../node_modules/@nuxt/devtools/dist/runtime/use-nuxt-devtools')['useNuxtDevTools']
   const usePreviewMode: typeof import('../../node_modules/nuxt/dist/app/composables/preview')['usePreviewMode']
   const useRequestEvent: typeof import('../../node_modules/nuxt/dist/app/composables/ssr')['useRequestEvent']
   const useRequestFetch: typeof import('../../node_modules/nuxt/dist/app/composables/ssr')['useRequestFetch']
@@ -232,6 +237,10 @@ declare module 'vue' {
     readonly getAppManifest: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/composables/manifest')['getAppManifest']>
     readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
     readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
+    readonly getLinkPath1: UnwrapRef<typeof import('../../composables/publicFunction')['getLinkPath1']>
+    readonly getLinkPath: UnwrapRef<typeof import('../../composables/publicFunction')['getLinkPath']>
+    readonly getLinkPathDetail: UnwrapRef<typeof import('../../composables/publicFunction')['getLinkPathDetail']>
+    readonly getRoutePath: UnwrapRef<typeof import('../../composables/publicFunction')['getRoutePath']>
     readonly getRouteRules: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/composables/manifest')['getRouteRules']>
     readonly getTime: UnwrapRef<typeof import('../../composables/publicFunction')['getTime']>
     readonly getTitleLength: UnwrapRef<typeof import('../../composables/publicFunction')['getTitleLength']>
@@ -325,6 +334,7 @@ declare module 'vue' {
     readonly useModel: UnwrapRef<typeof import('vue')['useModel']>
     readonly useNuxtApp: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/nuxt')['useNuxtApp']>
     readonly useNuxtData: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/composables/asyncData')['useNuxtData']>
+    readonly useNuxtDevTools: UnwrapRef<typeof import('../../node_modules/@nuxt/devtools/dist/runtime/use-nuxt-devtools')['useNuxtDevTools']>
     readonly usePreviewMode: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/composables/preview')['usePreviewMode']>
     readonly useRequestEvent: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/composables/ssr')['useRequestEvent']>
     readonly useRequestFetch: UnwrapRef<typeof import('../../node_modules/nuxt/dist/app/composables/ssr')['useRequestFetch']>

+ 7 - 2
.nuxt/types/plugins.d.ts

@@ -9,12 +9,17 @@ type NuxtAppInjections =
   InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/revive-payload.client.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/head/runtime/plugins/unhead.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/pages/runtime/plugins/router.js")> &
-  InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/payload.client.js")> &
+  InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/browser-devtools-timing.client.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/navigation-repaint.client.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/check-outdated-build.client.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/revive-payload.server.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/chunk-reload.client.js")> &
   InjectionType<typeof import("../../node_modules/nuxt/dist/pages/runtime/plugins/prefetch.client.js")> &
+  InjectionType<typeof import("../../node_modules/nuxt/dist/pages/runtime/plugins/check-if-page-unused.js")> &
+  InjectionType<typeof import("../../node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.server.js")> &
+  InjectionType<typeof import("../../node_modules/@nuxt/devtools/dist/runtime/plugins/devtools.client.js")> &
+  InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/dev-server-logs.js")> &
+  InjectionType<typeof import("../../node_modules/nuxt/dist/app/plugins/check-if-layout-used.js")> &
   InjectionType<typeof import("../../plugins/element-plus.js")> &
   InjectionType<typeof import("../../plugins/request.js")> &
   InjectionType<typeof import("../../plugins/globals.js")> &
@@ -24,7 +29,7 @@ declare module '#app' {
   interface NuxtApp extends NuxtAppInjections { }
 
   interface NuxtAppLiterals {
-    pluginName: 'nuxt:revive-payload:client' | 'nuxt:head' | 'nuxt:router' | 'nuxt:payload' | 'nuxt:revive-payload:server' | 'nuxt:chunk-reload' | 'nuxt:global-components' | 'nuxt:prefetch'
+    pluginName: 'nuxt:revive-payload:client' | 'nuxt:head' | 'nuxt:router' | 'nuxt:browser-devtools-timing' | 'nuxt:revive-payload:server' | 'nuxt:chunk-reload' | 'nuxt:global-components' | 'nuxt:prefetch' | 'nuxt:checkIfPageUnused' | 'nuxt:checkIfLayoutUsed'
   }
 }
 

+ 450 - 0
assets/css/shop/goodsDetail.less

@@ -0,0 +1,450 @@
+@charset "utf-8";
+
+* {
+    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 {
+    margin: 0 auto 30px;
+}
+
+.slow_6 {
+    -webkit-transition: all .6s;
+    -moz-transition: all .6s;
+    -ms-transition: all .6s;
+    -o-transition: all .6s;
+    transition: all .6s;
+}
+
+.index_main {
+    width: 1200px;
+}
+
+.banner_1 {
+    margin-top: 29px;
+    height: 90px;
+    overflow: hidden;
+
+    .banner_1_a {
+        display: block;
+        width: 100%;
+        height: 100%;
+    }
+
+    .banner_1_img {
+        display: block;
+        width: 100%;
+    }
+}
+
+.categ_crumb {
+    line-height: 26px;
+    color: #999;
+    font-size: 20px;
+    margin-top: 30px;
+    padding-bottom: 30px;
+    border-bottom: solid 1px #D9D9D9;
+
+    .categ_crumb_text {
+        display: inline-block;
+        line-height: 26px;
+        color: #999;
+        font-size: 20px;
+        margin: 0px 11px;
+    }
+
+    span.categ_crumb_text {
+        color: #333;
+    }
+
+    a.categ_crumb_text:hover {
+        color: #49a769;
+    }
+}
+
+.index_2 {
+    margin-top: 30px;
+}
+
+.index_2_img {
+    float: left;
+    width: 330px;
+    height: 330px;
+}
+
+.index_2_right {
+    float: right;
+    width: 540px;
+}
+
+.index_2_h4 {
+    line-height: 29px;
+    color: #333;
+    font-size: 22px;
+}
+
+.index_2_title_box {}
+
+.index_2_title {
+    float: left;
+    height: 31px;
+    line-height: 31px;
+    color: #999;
+    font-size: 16px;
+    padding: 0px 10px;
+    margin: 14px 20px 0px 0px;
+    background: #F8F8F8;
+}
+
+.index_2_ul {
+    margin-top: 10px;
+}
+
+.index_2_li {
+    display: flex;
+    margin-bottom: 16px;
+
+    .index_2_li_label {
+        line-height: 21px;
+        color: #999;
+        font-size: 16px;
+        min-width: 64px;
+        margin-right: 15px;
+    }
+
+    .index_2_li_text {
+        line-height: 21px;
+        color: #333;
+        font-size: 16px;
+    }
+}
+
+.shop_head_1 {
+    position: relative;
+    padding-bottom: 30px;
+    border-bottom: solid 1px #E9E9E9;
+
+    .shop_head_1_name {
+        float: left;
+        height: 29px;
+        line-height: 29px;
+        color: #666;
+        font-size: 22px;
+        font-weight: bold;
+        padding-left: 22px;
+    }
+
+    .shop_head_1_name_only {
+        color: #49a769;
+    }
+
+    .shop_head_1_name:nth-of-type(1) {
+        background: url(@/public/image/01.png) no-repeat left center;
+        background-size: 12px 18px;
+    }
+}
+
+.card_out {
+    margin-top: 30px;
+}
+
+.card_1_box {
+    font-size: 18px;
+    color: #333333;
+
+    p {
+        line-height: 35px;
+    }
+}
+
+
+.box_1_head {
+    height: 67px;
+    background: #F7FBFE;
+    border-bottom: solid 1px #ddd;
+    position: relative;
+
+    .box_1_head_name {
+        float: left;
+        height: 67px;
+        line-height: 67px;
+        margin-left: 20px;
+        color: #49a769;
+        font-size: 22px;
+        font-weight: bold;
+    }
+
+    .box_1_head_a {
+        float: right;
+        height: 67px;
+        line-height: 67px;
+        color: #999;
+        font-size: 16px;
+        margin-right: 20px;
+    }
+
+    .box_1_head_a::after {
+        content: '';
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        left: 0px;
+        top: 0px;
+    }
+}
+
+.box_1 {
+    border: solid 1px #ddd;
+    margin-top: 30px;
+}
+
+.img_ul_1 {
+    margin: 20px auto 0px;
+    box-sizing: border-box;
+    padding: 0px 7px;
+    min-height: 170px;
+
+    .img_li_1 {
+        float: left;
+        width: 120px;
+        margin: 0px 13.8px 19px;
+    }
+
+    .img_li_1_a {
+        display: block;
+        width: 120px;
+    }
+
+    .img_li_1_img_box {
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_1_img {
+        display: block;
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_1_dot2 {
+        height: 32px;
+        line-height: 16px;
+        color: #999;
+        font-size: 12px;
+        margin-top: 5px;
+        text-align: center;
+    }
+
+    .img_li_1_a:hover .img_li_1_dot2 {
+        color: #49a769;
+    }
+}
+
+.index_3 {
+    margin-top: 17px;
+}
+
+.index_4 {}
+
+@media screen and (min-width:1200px) {
+    /*pc_1440*/
+    @media screen and (max-width:1440px) {
+        /*1200*/
+    }
+
+    .pc_none {
+        display: none;
+    }
+}
+
+@media screen and (max-width:599px) {}
+
+@media screen and (max-width:320px) {}
+
+//导航条
+.breadcrumb {
+    width: 100%;
+    height: 22px;
+    padding-bottom: 30px;
+    border-bottom: 1px solid #ccc;
+    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;
+    margin-top: 20px;
+
+    :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;
+    }
+}
+
+.supply_art_box_img {
+    img {
+        width: 210px;
+        height: 210px;
+        margin-right: 30px;
+    }
+
+}
+
+// .allInfo {
+//     font-size: 14px;
+//     color: #49a769;
+//     margin-top: 20px;
+//     margin-bottom: 20px;
+// }

+ 526 - 0
assets/css/shop/goodsDetail1.less

@@ -0,0 +1,526 @@
+@charset "utf-8";
+
+* {
+    // margin: 0;
+    // padding: 0;
+    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 {
+    margin: 0 auto 30px;
+}
+
+.slow_6 {
+    -webkit-transition: all .6s;
+    -moz-transition: all .6s;
+    -ms-transition: all .6s;
+    -o-transition: all .6s;
+    transition: all .6s;
+}
+
+.index_main {
+    width: 1200px;
+}
+
+.banner_1 {
+    margin-top: 29px;
+    height: 90px;
+    overflow: hidden;
+
+    .banner_1_a {
+        display: block;
+        width: 100%;
+        height: 100%;
+    }
+
+    .banner_1_img {
+        display: block;
+        width: 100%;
+    }
+}
+
+.categ_crumb {
+    line-height: 26px;
+    color: #999;
+    font-size: 20px;
+    margin-top: 30px;
+    padding-bottom: 30px;
+    border-bottom: solid 1px #D9D9D9;
+
+    .categ_crumb_text {
+        display: inline-block;
+        line-height: 26px;
+        color: #999;
+        font-size: 20px;
+        margin: 0px 11px;
+    }
+
+    span.categ_crumb_text {
+        color: #333;
+    }
+
+    a.categ_crumb_text:hover {
+        color: #49a769;
+    }
+}
+
+.index_2 {
+    margin-top: 30px;
+}
+
+.index_2_img {
+    float: left;
+    width: 330px;
+    height: 330px;
+}
+
+.index_2_left {
+    float: left;
+    margin-left: 20px;
+    width: 850px;
+}
+
+.index_2_h4 {
+    line-height: 29px;
+    color: #333;
+    font-size: 22px;
+    border-bottom: solid 1px #E9E9E9;
+    padding-bottom: 20px;
+}
+
+.index_2_title_box {}
+
+.index_2_title {
+    float: left;
+    line-height: 31px;
+    color: #999;
+    font-size: 16px;
+    padding: 0px 10px;
+    margin: 14px 20px 0px 0px;
+    background: #F8F8F8;
+}
+
+.index_2_ul {
+    margin-top: 20px;
+}
+
+.index_2_li {
+    display: flex;
+    margin-bottom: 11px;
+
+    .index_2_li_label {
+        line-height: 21px;
+        color: #999;
+        font-size: 16px;
+        min-width: 64px;
+        margin-right: 15px;
+    }
+
+    .index_2_li_text {
+        line-height: 21px;
+        color: #333;
+        font-size: 16px;
+    }
+}
+
+.shop_head_1 {
+    position: relative;
+    padding-bottom: 30px;
+    border-bottom: solid 1px #E9E9E9;
+
+    .shop_head_1_name {
+        float: left;
+        height: 29px;
+        line-height: 29px;
+        color: #666;
+        font-size: 22px;
+        font-weight: bold;
+        padding-left: 22px;
+    }
+
+    .shop_head_1_name_only {
+        color: #49a769;
+    }
+
+    .shop_head_1_name:nth-of-type(1) {
+        background: url(@/public/image/01.png) no-repeat left center;
+        background-size: 12px 18px;
+    }
+}
+
+.card_out {
+    margin-top: 30px;
+
+    .card_1_box {
+        display: none;
+    }
+
+    .card_1_box_only {
+        display: block;
+    }
+}
+
+.box_1_head {
+    height: 67px;
+    background: #F7FBFE;
+    border-bottom: solid 1px #ddd;
+    position: relative;
+
+    .box_1_head_name {
+        float: left;
+        height: 67px;
+        line-height: 67px;
+        margin-left: 20px;
+        color: #49a769;
+        font-size: 22px;
+        font-weight: bold;
+    }
+
+    .box_1_head_a {
+        float: right;
+        height: 67px;
+        line-height: 67px;
+        color: #999;
+        font-size: 16px;
+        margin-right: 20px;
+    }
+
+    .box_1_head_a::after {
+        content: '';
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        left: 0px;
+        top: 0px;
+    }
+}
+
+.box_1 {
+    border: solid 1px #ddd;
+    margin-top: 30px;
+}
+
+.img_ul_1 {
+    margin: 20px auto 0px;
+    box-sizing: border-box;
+    padding: 0px 7px;
+    min-height: 170px;
+
+    .img_li_1 {
+        float: left;
+        width: 120px;
+        margin: 0px 13.8px 19px;
+    }
+
+    .img_li_1_a {
+        display: block;
+        width: 120px;
+    }
+
+    .img_li_1_img_box {
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_1_img {
+        display: block;
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_1_dot2 {
+        height: 32px;
+        line-height: 16px;
+        color: #999;
+        font-size: 12px;
+        margin-top: 5px;
+    }
+
+    .img_li_1_a:hover .img_li_1_dot2 {
+        color: #49a769;
+    }
+}
+
+.index_3 {
+    margin-top: 17px;
+}
+
+.index_4 {}
+
+.index_out_1_left {
+    float: left;
+    width: 894px;
+}
+
+/* 选项卡 */
+.choice_1_box {
+    border: solid 1px #E9E9E9;
+    box-sizing: border-box;
+
+    .choice_1_btn_box {
+        height: 64px;
+    }
+
+    .choice_1_btn {
+        height: 64px;
+        width: 50%;
+        float: left;
+    }
+
+    .choice_1_btn_a {
+        display: block;
+        width: 100%;
+        line-height: 64px;
+        color: #333;
+        font-style: italic;
+        height: 64px;
+        background: #F8F8F8;
+        text-align: center;
+        font-size: 16px;
+        box-sizing: border-box;
+        font-family: DingTalk JinBuTi, DingTalk JinBuTi;
+        letter-spacing: 1px;
+    }
+
+    .choice_1_btn_only {}
+
+    .choice_1_btn_only .choice_1_btn_a {
+        background: #fff;
+        border-bottom: solid 1px #fff;
+    }
+}
+
+/* 选项卡 */
+.shop_3_right {
+    margin-top: 87px;
+    float: right;
+    width: 280px;
+}
+
+.shop_ul_img_2 {
+    height: 285px;
+    width: 252px;
+    margin: 20px auto 0px;
+}
+
+.shop_li_img_2 {
+    width: 252px;
+    height: 22px;
+    margin-bottom: 22px;
+
+    .shop_li_img_2_a {
+        display: block;
+        height: 22px;
+        display: flex;
+    }
+
+    .shop_li_img_2_num {
+        width: 22px;
+        max-width: 22px;
+        min-width: 22px;
+        height: 22px;
+        line-height: 22px;
+        text-align: center;
+        background: #ccc;
+        color: #F6F6F6;
+        font-size: 16px;
+        font-weight: bold;
+        border-radius: 4px;
+        margin-right: 10px;
+    }
+
+    .shop_li_img_2_right {
+        height: 22px;
+    }
+
+    .shop_li_img_2_img {
+        display: none;
+    }
+
+    .shop_li_img_2_text {
+        height: 22px;
+        line-height: 22px;
+        color: #333;
+        font-size: 16px;
+        display: block;
+        word-break: keep-all;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+}
+
+.shop_li_img_2:nth-of-type(1) {
+    height: auto;
+    margin-bottom: 15px;
+}
+
+.shop_li_img_2:nth-of-type(1) .shop_li_img_2_a {
+    height: auto;
+}
+
+.shop_li_img_2:nth-of-type(1) .shop_li_img_2_right {
+    width: 252px;
+    height: auto;
+    display: flex;
+    border-bottom: solid 1px #E9E9E9;
+    padding-bottom: 10px;
+}
+
+.shop_li_img_2:nth-of-type(1) .shop_li_img_2_img {
+    display: block;
+    width: 45px;
+    height: 45px;
+    margin-right: 10px;
+}
+
+.shop_li_img_2:nth-of-type(1) .shop_li_img_2_text {
+    height: 44px;
+    line-height: 22px;
+    color: #333;
+    font-size: 16px;
+    font-weight: bold;
+    overflow: hidden;
+    display: -webkit-box !important;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    word-break: break-all;
+    white-space: wrap;
+}
+
+.shop_li_img_2:nth-of-type(-n+3) .shop_li_img_2_num {
+    background: #49a769;
+    color: #fff;
+}
+
+.shop_li_img_2:hover .shop_li_img_2_text {
+    color: #49a769;
+}
+
+@media screen and (min-width:1200px) {
+    /*pc_1440*/
+    @media screen and (max-width:1440px) {
+        /*1200*/
+    }
+
+    .pc_none {
+        display: none;
+    }
+}
+
+@media screen and (max-width:599px) {}
+
+@media screen and (max-width:320px) {}

+ 754 - 0
assets/css/shop/goodsList.less

@@ -0,0 +1,754 @@
+* {
+    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 {
+    margin: 0 auto;
+}
+
+.slow_6 {
+    -webkit-transition: all .6s;
+    -moz-transition: all .6s;
+    -ms-transition: all .6s;
+    -o-transition: all .6s;
+    transition: all .6s;
+}
+
+.index_main {
+    width: 1200px;
+    margin: 0px auto 30px;
+}
+
+.banner_1 {
+    margin-top: 29px;
+    height: 90px;
+    overflow: hidden;
+
+    .banner_1_a {
+        display: block;
+        width: 100%;
+        height: 100%;
+    }
+
+    .banner_1_img {
+        display: block;
+        width: 100%;
+    }
+}
+
+.banner_2 {
+    margin-top: 29px;
+    height: 90px;
+    overflow: hidden;
+
+    .banner_2_a {
+        display: block;
+        width: 100%;
+        height: 100%;
+    }
+
+    .banner_2_img {
+        display: block;
+        width: 100%;
+    }
+}
+
+.shop_head_1 {
+    height: 29px;
+    position: relative;
+
+    .shop_head_1_name {
+        float: left;
+        height: 29px;
+        line-height: 29px;
+        color: #49a769;
+        font-size: 22px;
+        font-weight: bold;
+        padding-left: 22px;
+        background: url(@/public/image/01.png) no-repeat left center;
+        background-size: 12px 18px;
+
+        a {
+            color: #49a769;
+        }
+    }
+
+    .shop_head_1_more {
+        height: 29px;
+        line-height: 29px;
+        color: #999;
+        float: right;
+        font-size: 16px;
+    }
+
+    .shop_head_1_more::after {
+        content: '';
+        display: block;
+        left: 0px;
+        top: 0px;
+        position: absolute;
+        width: 100%;
+        height: 100%;
+        z-index: 11;
+    }
+}
+
+.categ_color_box {
+    border: solid 1px #E9E9E9;
+    background: #F8F8F8;
+    margin-top: 30px;
+    box-sizing: border-box;
+    min-height: 50px;
+
+    .categ_color_name {
+        width: 1160px;
+        margin: 0px auto;
+        height: 60px;
+        line-height: 60px;
+        color: #333;
+        font-size: 18px;
+        border-bottom: dashed 1px #E9E9E9;
+    }
+
+    .categ_color_in {
+        padding: 6px 0px 0px;
+    }
+
+    .categ_color_a {
+        float: left;
+        height: 29px;
+        line-height: 29px;
+        color: #333;
+        margin: 10px 10px 16px;
+        font-size: 16px;
+        padding: 0px 10px;
+    }
+
+    .categ_color_a_only {
+        color: #fff;
+        background: #49a769;
+    }
+}
+
+.categ_crumb {
+    line-height: 26px;
+    color: #999;
+    font-size: 20px;
+    margin-top: 30px;
+    padding-bottom: 30px;
+    border-bottom: solid 1px #D9D9D9;
+
+    .categ_crumb_text {
+        display: inline-block;
+        line-height: 26px;
+        color: #999;
+        font-size: 20px;
+        margin: 0px 11px;
+    }
+
+    span.categ_crumb_text {
+        color: #333;
+    }
+
+    a.categ_crumb_text:hover {
+        color: #49a769;
+    }
+}
+
+.box_1 {
+    border: solid 1px #ddd;
+    width: 588px;
+}
+
+.box_1:nth-of-type(odd) {
+    float: left;
+}
+
+.box_1:nth-of-type(even) {
+    float: right;
+}
+
+.box_1_head {
+    height: 67px;
+    background: #f8f8f8;
+    border-bottom: solid 1px #ddd;
+    position: relative;
+
+    .box_1_head_name {
+        float: left;
+        height: 67px;
+        line-height: 67px;
+        margin-left: 20px;
+        color: #49a769;
+        font-size: 22px;
+        font-weight: bold;
+    }
+
+    .box_1_head_a {
+        float: right;
+        height: 67px;
+        line-height: 67px;
+        color: #999;
+        font-size: 16px;
+        margin-right: 20px;
+    }
+
+    .box_1_head_a::after {
+        content: '';
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        left: 0px;
+        top: 0px;
+    }
+}
+
+.img_ul_1 {
+    margin: 20px auto 0px;
+    width: 588px;
+    box-sizing: border-box;
+    padding: 0px 9px;
+    min-height: 175px;
+
+    .img_li_1 {
+        float: left;
+        width: 120px;
+        margin: 0px 11px 19px;
+    }
+
+    .img_li_1_a {
+        display: block;
+        width: 120px;
+    }
+
+    .img_li_1_img_box {
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_1_img {
+        display: block;
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_1_dot2 {
+        height: 32px;
+        line-height: 16px;
+        color: #999;
+        font-size: 12px;
+        margin-top: 5px;
+        text-align: center;
+    }
+
+    .img_li_1_a:hover .img_li_1_dot2 {
+        color: #49a769;
+    }
+}
+
+.box_2_head {
+    height: 67px;
+    background: #f8f8f8;
+    border-bottom: solid 1px #ddd;
+    position: relative;
+
+    .box_2_head_name {
+        float: left;
+        height: 67px;
+        line-height: 67px;
+        margin-left: 20px;
+        color: #49a769;
+        font-size: 22px;
+        font-weight: bold;
+    }
+
+    .box_2_head_a {
+        float: right;
+        height: 67px;
+        line-height: 67px;
+        color: #999;
+        font-size: 16px;
+        margin-right: 20px;
+    }
+
+    .box_2_head_a::after {
+        content: '';
+        display: block;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        left: 0px;
+        top: 0px;
+    }
+}
+
+.box_2 {
+    border: solid 1px #ddd;
+}
+
+.img_ul_2 {
+    margin: 20px auto 0px;
+    box-sizing: border-box;
+    padding: 0px 7px;
+    min-height: 175px;
+
+    .img_li_2 {
+        float: left;
+        width: 120px;
+        margin: 0px 13.8px 19px;
+    }
+
+    .img_li_2_a {
+        display: block;
+        width: 120px;
+    }
+
+    .img_li_2_img_box {
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_2_img {
+        display: block;
+        width: 120px;
+        height: 120px;
+    }
+
+    .img_li_2_dot2 {
+        height: 32px;
+        line-height: 16px;
+        color: #999;
+        font-size: 12px;
+        margin-top: 5px;
+        text-align: center;
+    }
+
+    .img_li_2_a:hover .img_li_2_dot2 {
+        color: #49a769;
+    }
+}
+
+.index_1 {
+    margin-top: 30px;
+
+    .shop_nav_2 {
+        width: 1200px;
+        min-height: 50px;
+        line-height: 35px;
+        border: 1px solid #ddd;
+        background-color: #f8f8f8;
+        margin-top: 20px;
+        padding: 10px;
+        box-sizing: border-box;
+        font-size: 18px;
+
+        .shop_nav_2_a {
+            color: #666;
+            display: inline-block;
+            width: 117px;
+            text-align: center;
+        }
+        .shop_nav_2_a:hover{
+            color: #49a769;
+        }
+    }
+}
+
+
+
+.index_2 {
+    margin-top: 30px;
+    min-height: 100px;
+}
+
+.index_3 {
+    margin-top: 30px;
+    min-height: 100px;
+}
+
+.index_4 {
+    margin-top: 30px;
+    min-height: 100px;
+}
+
+.index_5 {
+    margin-top: 30px;
+    min-height: 100px;
+    margin-bottom: 30px;
+}
+
+/* 三农市场网-商城-商品列表 */
+.categ_table {
+    .categ_table_head_box {
+        height: 61px;
+        border-bottom: solid 1px #E9E9E9;
+    }
+
+    .categ_table_head_box>.categ_table_td_1 {
+        height: 61px;
+        line-height: 61px;
+    }
+
+    .categ_table_head_box>.categ_table_td_2 {
+        height: 61px;
+        line-height: 61px;
+    }
+
+    .categ_table_head_box>.categ_table_td_3 {
+        height: 61px;
+        line-height: 61px;
+    }
+
+    .categ_table_head_box>.categ_table_td_4 {
+        height: 61px;
+        line-height: 61px;
+    }
+
+    .categ_table_td_1 {
+        float: left;
+        height: 100%;
+        text-align: center;
+        color: #666;
+        font-size: 16px;
+        width: 155px;
+        margin-right: 126px;
+    }
+
+    .categ_table_td_2 {
+        float: left;
+        height: 100%;
+        text-align: center;
+        color: #666;
+        font-size: 16px;
+        width: 480px;
+        margin-right: 124px;
+    }
+
+    .categ_table_td_3 {
+        float: left;
+        height: 100%;
+        text-align: center;
+        color: #666;
+        font-size: 16px;
+        width: 120px;
+        margin-right: 62px;
+    }
+
+    .categ_table_td_4 {
+        float: left;
+        height: 100%;
+        text-align: center;
+        color: #666;
+        font-size: 16px;
+        width: 133px;
+    }
+
+    .categ_table_li {
+        height: 161px;
+        box-sizing: border-box;
+        padding: 15px 0px;
+        border-bottom: solid 1px #E9E9E9;
+    }
+
+    .categ_table_td_1_img {
+        display: block;
+        width: 130px;
+        height: 130px;
+        margin: 0px auto;
+    }
+
+    .categ_table_li .categ_table_td_1 {
+        line-height: 160px;
+        line-height: 160px;
+    }
+
+    .categ_table_li .categ_table_td_2 {
+        height: 100%;
+        display: flex;
+        align-items: center;
+    }
+
+    .categ_table_td_2_in {
+        display: flex;
+        flex-direction: column;
+        width: 100%;
+    }
+
+    .categ_table_li .categ_table_td_2_dot1 {
+        text-align: left;
+        flex-basis: 100%;
+        height: 21px;
+        line-height: 21px;
+        font-size: 16px;
+        font-weight: bold;
+        color: #333;
+    }
+
+    .categ_table_li .categ_table_td_2_dot2 {
+        flex-basis: 100%;
+        max-height: 36px;
+        text-align: left;
+        line-height: 18px;
+        width: 100%;
+        font-size: 14px;
+        color: #999;
+    }
+
+    .categ_table_li .categ_table_td_3 {
+        line-height: 144px;
+    }
+
+    .categ_table_li .categ_table_td_4 {
+        line-height: 144px;
+    }
+}
+
+.info_foot {
+    margin-top: 60px;
+    text-align: center;
+
+    .info_foot_a {
+        height: 34px;
+        line-height: 34px;
+        color: #666;
+        display: inline-block;
+        border-radius: 4px;
+        margin: 0px 10px;
+        font-size: 14px;
+        border: solid 1px #EAEAEA;
+        background: #F6F6F6;
+        padding: 0px 15px;
+    }
+
+    .info_foot_a_only {
+        font-weight: bold;
+        background: #49a769;
+        color: #fff;
+    }
+}
+
+@media screen and (min-width:1200px) {
+    /*pc_1440*/
+    @media screen and (max-width:1440px) {
+        /*1200*/
+    }
+
+    .pc_none {
+        display: none;
+    }
+}
+
+@media screen and (max-width:599px) {}
+
+@media screen and (max-width:320px) {}
+
+//导航条
+.breadcrumb {
+    width: 100%;
+    height: 22px;
+    padding-bottom: 30px;
+    border-bottom: 1px solid #ccc;
+    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;
+    margin-top: 30px;
+
+    :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;
+    }
+}
+
+//分页
+.pagination1 {
+    width: 1200px;
+    height: 34px;
+    margin-left: 141px;
+    display: flex;
+    justify-content: center;
+    margin: 0;
+
+    // 鼠标移入后字体颜色
+    .el-pagination::v-deep :hover {
+        color: #49a769;
+    }
+
+    .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: #49a769;
+        color: #fff;
+    }
+
+
+}

+ 576 - 0
components/goods/detail.vue

@@ -0,0 +1,576 @@
+<template>
+    <!-- goods -->
+    <div class="goods">
+        <HomePageHead></HomePageHead>
+        <HomePageNavigation></HomePageNavigation>
+        <HomeAdvertising :imgurl="adImg1"></HomeAdvertising>
+        <main class="index_main" v-if="shopType == 1">
+            <section class="index_1 clearfix">
+                <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 v-if="p_parent_name != ''">
+                                <NuxtLink :to="`/${targetSegment}/index.html`"> {{ p_parent_name }}</NuxtLink>
+                            </el-breadcrumb-item>
+                            <el-breadcrumb-item v-if="parent_name != ''">
+                                <NuxtLink :to="`/${targetSegment}/${targetSegment1}/list-1.html`"> {{ parent_name }}
+                                </NuxtLink>
+                            </el-breadcrumb-item>
+                            <el-breadcrumb-item>
+                                {{ routeNewsTtitle }}
+                            </el-breadcrumb-item>
+                        </el-breadcrumb>
+                    </div>
+                </div>
+            </section>
+            <section class="index_2 clearfix">
+                <img class="index_2_img" :src="shopImg" :title="newsDetail.name" alt="">
+                <div class="index_2_left">
+                    <h4 class="index_2_h4 dot1">{{ newsDetail.name }}</h4>
+                    <div class="index_2_title_box clearfix">
+                        <time class="index_2_title"> 更新日期:{{ newsDetail.updated_at }}</time>
+                        <span class="index_2_title">浏览次数:{{ newsDetail.hits }}</span>
+                    </div>
+                    <div class="index_2_ul clearfix">
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">公 司 名</label>
+                            <span class="index_2_li_text "> {{ newsDetail.com }}</span>
+                        </div>
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">所 在 地</label>
+                            <span class="index_2_li_text ">{{ newsDetail.address }}</span>
+                        </div>
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">联 系 人</label>
+                            <span class="index_2_li_text ">{{ newsDetail.contact }}</span>
+                        </div>
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">产品单价</label>
+
+                            <span class="index_2_li_text">
+                                {{ newsDetail.price }}
+                                元/
+                                {{ newsDetail.unit }}
+                            </span>
+                        </div>
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">最小定量</label>
+                            <span class="index_2_li_text ">{{ newsDetail.min }}</span>
+                        </div>
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">供货总量</label>
+                            <span class="index_2_li_text ">{{ newsDetail.max }}</span>
+                        </div>
+                        <div class="index_2_li clearfix">
+                            <label class="index_2_li_label">有 效 期</label>
+                            <span class="index_2_li_text ">{{ getTime(newsDetail.validity, 'year', 1) }}</span>
+                        </div>
+                    </div>
+                </div>
+            </section>
+            <!-- 选项卡1 -->
+            <section class="index_3 clearfix">
+                <div class="shop_head_1 clearfix">
+                    <div class="shop_head_1_name" :class="{ shop_head_1_name_only: supply_num == 1 }"
+                        @mouseover="supply_num = 1">详情信息</div>
+                    <div class="shop_head_1_name" :class="{ shop_head_1_name_only: supply_num == 2 }"
+                        @mouseover="supply_num = 2">联系方式</div>
+                    <div class="shop_head_1_name" :class="{ shop_head_1_name_only: supply_num == 3 }"
+                        @mouseover="supply_num = 3">图片展示</div>
+                </div>
+                <div class="card_out clearfix">
+                    <div class="card_1_box clearfix card_1_box_only" v-if="supply_num == 1" v-html="newsDetail.detail">
+                    </div>
+                    <div class="card_1_box clearfix card_1_box_only" v-if="supply_num == 2">
+                        <p class="supply_art_box_p">公司名称:{{ newsDetail.com }}</p>
+                        <p class="supply_art_box_p">电子邮箱:{{ newsDetail.email }}</p>
+                        <p class="supply_art_box_p">邮政编码:{{ newsDetail.postal }}</p>
+                        <p class="supply_art_box_p">联系地址:{{ newsDetail.address }}</p>
+                    </div>
+                    <div class="card_1_box clearfix card_1_box_only" v-if="supply_num == 3">
+                        <div class="supply_art_box_img">
+                            <img :src="item" v-for="item in newsDetail.imgurl">
+                        </div>
+                    </div>
+                </div>
+            </section>
+            <!-- 选项卡2 -->
+            <section class="index_4 clearfix">
+                <div class="box_1 clearfix">
+                    <div class="box_1_head">
+                        <div class="box_1_head_name">点击排行</div>
+                    </div>
+                    <div class="img_ul_1 clearfix">
+                        <div class="img_li_1 clearfix" v-for="(item, index) in pageData1" :key="index">
+                            <NuxtLink class="img_li_1_a" :href="getLinkPathDetail(item)" :title="item.title">
+                                <div class="img_li_1_img_box clearfix">
+                                    <img class="img_li_1_img" :src="item.imgurl" :title="item.title" alt="">
+                                </div>
+                                <div class="img_li_1_dot2">{{ item.name }}
+                                </div>
+                            </NuxtLink>
+                        </div>
+                    </div>
+                </div>
+                <div class="box_1 clearfix">
+                    <div class="box_1_head">
+                        <div class="box_1_head_name">最新商机</div>
+                    </div>
+                    <div class="img_ul_1 clearfix">
+                        <div class="img_li_1 clearfix" v-for="(item, index) in pageData2" :key="index">
+                            <NuxtLink class="img_li_1_a" :href="getLinkPathDetail(item)" :title="item.title">
+                                <div class="img_li_1_img_box clearfix">
+                                    <img class="img_li_1_img" :src="item.imgurl" :title="item.title" alt="">
+                                </div>
+                                <div class="img_li_1_dot2">{{ item.name }}
+                                </div>
+                            </NuxtLink>
+                        </div>
+                    </div>
+                </div>
+            </section>
+        </main>
+
+        <main class="index_main" v-if="shopType == 2">
+            <section class=" clearfix">
+                <div class="index_out_1_left clearfix">
+                    <section class="index_1 clearfix">
+                        <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 v-if="p_parent_name != ''">
+                                        <NuxtLink :to="`/${targetSegment}/index.html`"> {{ p_parent_name }}</NuxtLink>
+                                    </el-breadcrumb-item>
+                                    <el-breadcrumb-item v-if="parent_name != ''">
+                                        <NuxtLink :to="`/${targetSegment}/${targetSegment1}/list-1.html`">
+                                            {{ parent_name }}
+                                        </NuxtLink>
+                                    </el-breadcrumb-item>
+                                    <el-breadcrumb-item>
+                                        {{ routeNewsTtitle }}
+                                    </el-breadcrumb-item>
+                                </el-breadcrumb>
+                            </div>
+                        </div>
+                    </section>
+                    <section class="index_2 clearfix">
+                        <img class="index_2_img" :src="shopImg" :title="newsDetail.name" alt="">
+                        <div class="index_2_right">
+                            <h4 class="index_2_h4 dot1">求购:{{ newsDetail.name }}</h4>
+                            <div class="index_2_ul clearfix">
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">发布日期</label>
+                                    <span class="index_2_li_text">{{ getTime(newsDetail.updated_at, 'year', 1) }}</span>
+                                </div>
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">截止日期</label>
+                                    <span class="index_2_li_text">{{ getTime(newsDetail.validity, 'year', 1) }}</span>
+                                </div>
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">浏览次数</label>
+                                    <span class="index_2_li_text">{{ newsDetail.hits }}</span>
+                                </div>
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">联 系 人</label>
+                                    <span class="index_2_li_text">{{ newsDetail.contact }}</span>
+                                </div>
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">发布地区</label>
+                                    <span class="index_2_li_text">{{ newsDetail.address }}</span>
+                                </div>
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">座 机</label>
+                                    <span class="index_2_li_text">{{ newsDetail.landline }}</span>
+                                </div>
+                                <div class="index_2_li clearfix">
+                                    <label class="index_2_li_label">联系电话</label>
+                                    <span class="index_2_li_text">{{ newsDetail.phone }}</span>
+                                </div>
+                            </div>
+                        </div>
+                    </section>
+                </div>
+                <div class="shop_3_right clearfix">
+                    <div class="choice_1_box clearfix">
+                        <div class="choice_1_btn_box clearfix">
+                            <div class="choice_1_btn" :class="{ choice_1_btn_only: supply_buy == 1 }"
+                                @mouseover="supply_buy = 1">
+                                <span class="choice_1_btn_a" title="供应商品">供应商品</span>
+                            </div>
+                            <div class="choice_1_btn " :class="{ choice_1_btn_only: supply_buy == 2 }"
+                                @mouseover="supply_buy = 2">
+                                <a class="choice_1_btn_a" title="求购商品">求购商品</a>
+                            </div>
+                        </div>
+                        <div class="choice_1_card_box">
+                            <!-- 供应商品 -->
+                            <div class="shop_ul_img_2 choice_1_card clearfix" v-show="supply_buy == 1">
+                                <div class="shop_li_img_2" v-for="(item, index) in pageData3" :key="index">
+                                    <NuxtLink class="shop_li_img_2_a" :href="getLinkPathDetail(item)"
+                                        :title="item.name">
+                                        <div class="shop_li_img_2_num"> {{ index + 1 }} </div>
+                                        <div class="shop_li_img_2_right clearfix">
+                                            <img class="shop_li_img_2_img" :src="item.imgurl" :title="item.name" alt="">
+                                            <div class="shop_li_img_2_text">
+                                                {{ item.name }}
+                                            </div>
+                                        </div>
+                                    </NuxtLink>
+                                </div>
+                            </div>
+                            <!-- 供应商品 -->
+                            <!-- 求购商品 -->
+                            <div class="shop_ul_img_2 choice_1_card clearfix" v-show="supply_buy == 2">
+                                <div class="shop_li_img_2" v-for="(item, index) in pageData4" :key="index">
+                                    <NuxtLink class="shop_li_img_2_a" :href="getLinkPathDetail(item)"
+                                        :title="item.name">
+                                        <div class="shop_li_img_2_num"> {{ index + 1 }} </div>
+                                        <div class="shop_li_img_2_right clearfix">
+                                            <img class="shop_li_img_2_img" :src="item.imgurl" :title="item.name" alt="">
+                                            <div class="shop_li_img_2_text">
+                                                {{ item.name }}
+                                            </div>
+                                        </div>
+                                    </NuxtLink>
+                                </div>
+                            </div>
+                            <!-- 求购商品 -->
+                        </div>
+                    </div>
+                </div>
+            </section>
+            <!-- 选项卡1 -->
+            <section class="index_3 clearfix">
+                <div class="shop_head_1 clearfix">
+                    <div class="shop_head_1_name" :class="{ shop_head_1_name_only: buy_num == 1 }"
+                        @mouseover="buy_num = 1">详情信息</div>
+                    <div class="shop_head_1_name" :class="{ shop_head_1_name_only: buy_num == 2 }"
+                        @mouseover="buy_num = 2">发布人信息</div>
+                </div>
+                <div class="card_out clearfix">
+                    <div class="card_1_box clearfix card_1_box_only" v-show="buy_num == 1" v-html="newsDetail.detail">
+                    </div>
+                    <div class="card_1_box clearfix card_1_box_only" v-show="buy_num == 2">
+                        <P>公司名称:{{ newsDetail.com }}</P>
+                        <P>电子邮箱:{{ newsDetail.email }}</P>
+                        <P>邮政编码:{{ newsDetail.postal }}</P>
+                        <P>联系地址:{{ newsDetail.address }}</P>
+                    </div>
+                </div>
+            </section>
+            <!-- 选项卡2 -->
+            <section class="index_4 clearfix">
+                <div class="box_1 clearfix">
+                    <div class="box_1_head">
+                        <div class="box_1_head_name">点击排行</div>
+                    </div>
+                    <div class="img_ul_1 clearfix">
+                        <div class="img_li_1 clearfix" v-for="(item, index) in pageData1" :key="index">
+                            <NuxtLink class="img_li_1_a" :href="getLinkPathDetail(item)" :title="item.title">
+                                <div class="img_li_1_img_box clearfix">
+                                    <img class="img_li_1_img" :src="item.imgurl" :title="item.title" alt="">
+                                </div>
+                                <div class="img_li_1_dot2">{{ item.name }}
+                                </div>
+                            </NuxtLink>
+                        </div>
+                    </div>
+                </div>
+                <div class="box_1 clearfix">
+                    <div class="box_1_head">
+                        <div class="box_1_head_name">最新商机</div>
+                    </div>
+                    <div class="img_ul_1 clearfix">
+                        <div class="img_li_1 clearfix" v-for="(item, index) in pageData2" :key="index">
+                            <NuxtLink class="img_li_1_a" :href="getLinkPathDetail(item)" :title="item.title">
+                                <div class="img_li_1_img_box clearfix">
+                                    <img class="img_li_1_img" :src="item.imgurl" :title="item.title" alt="">
+                                </div>
+                                <div class="img_li_1_dot2">{{ item.name }}
+                                </div>
+                            </NuxtLink>
+                        </div>
+                    </div>
+                </div>
+            </section>
+        </main>
+        <HomeAdvertising :imgurl="adImg2"></HomeAdvertising>
+        <HomeFoot1></HomeFoot1>
+    </div>
+</template>
+
+<script setup>
+//0.页面依赖 start ---------------------------------------->
+import { onMounted, ref } from 'vue'
+import { ElBreadcrumb, ElBreadcrumbItem, ElRadio, ElRadioGroup, ElCheckbox, ElCheckboxGroup, ElMessage, ElInput } from 'element-plus'
+import { ArrowRight } from '@element-plus/icons-vue'
+//0.页面依赖 end ---------------------------------------->
+
+//1.获得路由id start ---------------------------------------->
+const route = useRoute();
+const articleId = parseInt(route.params.id);
+const targetSegment = getRoutePath(1);
+const targetSegment1 = getRoutePath(2);
+const targetSegment2 = getRoutePath(3);
+const supply_num = ref(1)
+const buy_num = ref(1)
+const supply_buy = ref(1)
+
+//1.1 获得当前的路由id
+let routeId;
+let routeType;
+let navTitle = ref('')//二级导航标题
+let navCid = ref('')//二级导航id
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment2,
+    },
+});
+console.log("getRouteId", getRouteId);
+
+if (getRouteId.code == 200) {
+    navTitle.value = getRouteId.data.alias
+    navCid.value = getRouteId.data.category_id
+} else {
+    console.log("获得路由id出错!", getRouteId.message)
+}
+//1.2 获取二级栏目
+let parent_name = ref('');//父级名称
+let parent_id = ref('');//父级id
+let parent_pinyin = ref('');//父级拼音
+const getRoutePName = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment1,
+    },
+});
+console.log("getRoutePName", getRoutePName);
+
+if (getRoutePName.code == 200) {
+    routeId = getRoutePName.data.category_id
+    parent_id.value = getRoutePName.data.category_id
+    parent_name.value = getRoutePName.data.alias
+    routeType = getRoutePName.data.type
+} else {
+    console.log("获得路由id出错!", getRoutePName.message)
+}
+//1.3 获取一级栏目
+let p_parent_name = ref('');//父级名称
+let p_parent_id = ref('');//父级id
+let p_parent_pinyin = ref('');//父级拼音
+const getRoutePName_parent = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+console.log("getRoutePName_parent", getRoutePName_parent);
+
+if (getRoutePName_parent.code == 200) {
+    p_parent_id.value = getRoutePName_parent.data.category_id
+    p_parent_name.value = getRoutePName_parent.data.alias
+    // p_parent_pinyin.value = getRoutePName_parent.data.aLIas_pinyin
+} else {
+    console.log("获得路由id出错!", getRoutePName_parent.message)
+}
+//1.4 获取某个栏目
+const getParentId = await requestDataPromise('/web/getOneWebsiteCategory', {
+    method: 'GET',
+    query: {
+        'catid': parent_id.value,
+    },
+});
+console.log("getParentId", getParentId);
+
+if (getParentId.code == 200) {
+    parent_pinyin.value = getParentId.data.aLIas_pinyin
+} else {
+    console.log("获得路由id出错!", getParentId.message)
+}
+//1.获得路由id end ---------------------------------------->
+
+//2.获得模块数据 start ---------------------------------------->
+const pageData1 = ref([])//点击排行
+const pageData2 = ref([])//最新商机
+const pageData3 = ref([])//供应商品
+const pageData4 = ref([])//求购商品
+
+//创建请求数据json
+let getJson = [
+    { "level": "3,0,8" },//点击排行
+    { "level": "4,0,8" },//最新商机
+    { "level": "5,0,6" },//供应商品
+    { "level": "6,0,6" },//求购商品
+]
+let jsonString = JSON.stringify(getJson)
+
+//获取所有数据
+async function getPageAllData() {
+    const mkdata = await requestDataPromise('/web/getWebsiteshop', {
+        method: 'GET',
+        query: {
+            'id': jsonString,
+            'catid': 713,
+        },
+    });
+    if (mkdata.code == 200) {
+        //点击排行
+        pageData1.value = mkdata.data.goods[0];
+        //最新商机
+        pageData2.value = mkdata.data.goods[1];
+        //供应商品
+        pageData3.value = mkdata.data.goods[2];
+        //求购商品
+        pageData4.value = mkdata.data.goods[3];
+    } else {
+        ElMessage.error(mkdata.message)
+    }
+}
+getPageAllData();
+
+//2.获得模块数据 end ---------------------------------------->
+
+
+//4.新闻详情 start ---------------------------------------->
+//4.1 资讯详情
+const newsDetail = ref({})
+const routeNewsTtitle = ref("");
+//4.2 发布日期
+const time = ref("");
+//4.3 路径
+const routLevelTitle = ref("");
+const routLevelId = ref("");
+//4.4 是否展示投票
+const articleChoice = ref(false);
+//4.5 获取详情
+let shopImg = ref('')
+let shopType = ref(1)
+async function getPageData() {
+    const mkdata = await requestDataPromise('/web/getWebsiteshopInfo', {
+        method: 'GET',
+        query: {
+            'id': articleId
+        },
+    });
+    if (mkdata.code == 200) {
+        //判断是否显示投票
+        if (mkdata.data.is_survey == 1) {
+            console.log("本篇文章含有投票!")
+            articleChoice.value = true;
+        }
+        //获取内容
+        newsDetail.value = mkdata.data;
+        shopType.value = mkdata.data.type_id
+        //获取路径
+        routLevelTitle.value = newsDetail.value.cat_name;
+        routLevelId.value = newsDetail.value.category_id;
+        shopImg.value = mkdata.data.imgurl[0]
+        //获取发布时间
+        time.value = newsDetail.value.updated_at.split(' ')[0];
+        //修正标题长度
+        if (newsDetail.value.name.length >= 20) {
+            routeNewsTtitle.value = newsDetail.value.name.substr(0, 20) + "...";
+        } else {
+            routeNewsTtitle.value = newsDetail.value.name
+        }
+    } else {
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:获取详情内容")
+        console.log("后端错误反馈:", mkdata.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+}
+getPageData();
+//4.新闻详情 end ---------------------------------------->
+
+//5.广告 start ---------------------------------------->
+let adImg1 = ref([]);
+let adImg2 = ref([]);
+
+onMounted(async () => {
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_detail_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=snzxw_detail_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];
+})
+//5.广告 end ---------------------------------------->
+
+
+//6.设置seo信息 start---------------------------------------->
+const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
+    method: 'GET',
+    query: {
+        'catid': routeId
+    },
+});
+
+if (setData.code == 200) {
+    let seoTitle = setData.data.seo_title;
+    let seoDescription = setData.data.seo_description;
+    let seoKeywords = setData.data.seo_keywords;
+    let seoSuffix = setData.data.suffix;
+    let seoName = setData.data.website_name;
+
+    useSeoMeta({
+        title: seoTitle + "_" + seoSuffix,
+        meta: [
+            { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
+            { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
+        ]
+    });
+} else {
+    console.log("设置频道页SEO出错!", setData.message)
+}
+//6.设置seo信息 end---------------------------------------->
+
+//8.页面图片放大 start---------------------------------------->
+const previewVisible = ref(false)
+const selectedImage = ref(' ')
+
+const openPreview = (event) => {
+    if (event.target.tagName === 'IMG') {
+        selectedImage.value = event.target.src;
+        previewVisible.value = true;
+    }
+}
+const closePreview = () => {
+    previewVisible.value = false;
+}
+//8.页面图片放大 end---------------------------------------->
+</script>
+
+
+<style lang="less" scoped>
+@import url('@/assets/css/shop/goodsDetail.less');
+@import url('@/assets/css/shop/goodsDetail1.less');
+</style>

+ 341 - 0
components/goods/list.vue

@@ -0,0 +1,341 @@
+<template>
+    <HomePageHead></HomePageHead>
+    <HomePageNavigation></HomePageNavigation>
+    <HomeAdvertising :imgurl="adImg1"></HomeAdvertising>
+    <!-- 商品列表 goods-->
+    <main class="index_main">
+        <section class="index_1 clearfix">
+            <div class="shop_head_1 clearfix">
+                <div class="shop_head_1_name">
+                    <NuxtLink :to="`/${targetSegment}/index.html`"> {{ parent_name }}</NuxtLink>
+                </div>
+            </div>
+            <div class="shop_nav_2">
+                <a class="shop_nav_2_a" :href="`/${targetSegment}/${item.aLIas_pinyin}/list-1.html`" title=""
+                    v-for="(item, index) in secondNav" :key="index">{{ item.alias }}</a>
+            </div>
+        </section>
+        <!-- 地区选择 -->
+        <GoodsSubMenu1></GoodsSubMenu1>
+        <!-- 三农市场网-商城-商品列表 1-->
+        <section class="">
+            <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 v-if="parent_name != ''">
+                            <NuxtLink :to="`/${targetSegment}/index.html`"> {{ parent_name }}</NuxtLink>
+                        </el-breadcrumb-item>
+                        <el-breadcrumb-item>{{ navTitle }}</el-breadcrumb-item>
+                    </el-breadcrumb>
+                </div>
+            </div>
+            <!-- 商品列表 -->
+            <div class="categ_table clearfix">
+                <div class="categ_table_head_box">
+                    <div class="categ_table_td_1">产品图片</div>
+                    <div class="categ_table_td_2">供求信息/公司</div>
+                    <div class="categ_table_td_3">发布时间</div>
+                    <div class="categ_table_td_4">地区</div>
+                </div>
+                <div class="categ_table_li" v-for="(item, index) in goodsList" :key="index">
+                    <a class="categ_table_li_a" :href="`/${item.pinyin}/${item.id}.html`" title="">
+                        <div class="categ_table_td_1">
+                            <img class="categ_table_td_1_img" :src="item.imgurl" title="" alt="">
+                        </div>
+                        <div class="categ_table_td_2 ">
+                            <div class="categ_table_td_2_in">
+                                <div class="categ_table_td_2_dot1 dot1">
+                                    {{ item.name }}
+                                </div>
+                                <div class="categ_table_td_2_dot2 dot2">
+                                    {{ item.description }}
+                                </div>
+                            </div>
+                        </div>
+                        <div class="categ_table_td_3">{{ getTime(item.updated_at, 'year', 1) }}</div>
+                        <div class="categ_table_td_4 dot1">{{ item.city_name }}</div>
+                    </a>
+                </div>
+                <div class="empty" v-if="goodsList == false">
+                    <img src="@/public/topic/empty.png" alt="" class="empty_img">
+                    <span class="empty_text">当前暂无数据</span>
+                </div>
+            </div>
+            <div class="pagination1" v-if="goodstotal > 0">
+                <el-pagination background layout="prev, pager, next" :total="goodstotal" :page-size="pageSize_goods"
+                    prev-text="上一页" next-text="下一页" />
+            </div>
+        </section>
+        <!-- 三农市场网-商城-商品列表 2-->
+    </main>
+    <HomeAdvertising :imgurl="adImg2"></HomeAdvertising>
+    <HomeFoot></HomeFoot>
+</template>
+
+<script setup>
+//0.加载页面依赖 start ---------------------------------------->
+import { ref, onMounted } from 'vue';
+import { ElMessage, ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus';
+import { ArrowRight } from '@element-plus/icons-vue'
+import { NuxtLink } from '#components';
+//0.加载页面依赖 end ---------------------------------------->
+
+//1.获得路由id start ---------------------------------------->
+const targetSegment = getRoutePath(1);
+const targetSegment1 = getRoutePath(2);
+const route = useRoute();
+let cityid = route.query.cityid;
+let cityId = ref(0)
+cityId.value = parseFloat(cityid)
+
+//1.1 获得当前的路由id
+let routeId;
+let routeType;
+let navTitle = ref('')//二级导航标题
+let navCid = ref('')//二级导航id
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment1,
+    },
+});
+console.log("getRouteId", getRouteId);
+
+if (getRouteId.code == 200) {
+    navTitle.value = getRouteId.data.alias
+    navCid.value = getRouteId.data.category_id
+} else {
+    console.log("获得路由id出错!", getRouteId.message)
+}
+//1.2 获取父级栏目
+let parent_name = ref('');//父级名称
+let parent_id = ref('');//父级id
+let parent_pinyin = ref('');//父级拼音
+const getRoutePName = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+console.log("getRoutePName", getRoutePName);
+
+if (getRoutePName.code == 200) {
+    routeId = getRoutePName.data.category_id
+    parent_id.value = getRoutePName.data.category_id
+    parent_name.value = getRoutePName.data.alias
+    routeType = getRoutePName.data.type
+} else {
+    console.log("获得路由id出错!", getRoutePName.message)
+}
+//1.3 获取某个栏目
+const getParentId = await requestDataPromise('/web/getOneWebsiteCategory', {
+    method: 'GET',
+    query: {
+        'catid': parent_id.value,
+    },
+});
+console.log("getParentId", getParentId);
+
+if (getParentId.code == 200) {
+    parent_pinyin.value = getParentId.data.aLIas_pinyin
+} else {
+    console.log("获得路由id出错!", getParentId.message)
+}
+//1.获得路由id end ---------------------------------------->
+
+//2.选项卡 start ---------------------------------------->
+let showTabs = ref(1)
+let qhtabs = function (number) {
+    console.log(number)
+    showTabs.value = number
+}
+//2.选项卡 end ---------------------------------------->
+
+//3.广告 start ---------------------------------------->
+let adImg1 = ref({})
+let adImg2 = ref({})
+onMounted(async () => {
+    //从客户端获取行政职能部门 加快打开速度
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_list_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=snzxw_list_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];
+})
+//3.广告 end ---------------------------------------->
+
+//4.页面数据 start ---------------------------------------->
+const secondNav = ref([]);
+let getSecondNav = async () => {
+    const listData = await requestDataPromise('/web/getWebsiteModelCategory', {
+        method: 'GET',
+        query: {
+            'placeid': 1,
+            'pid': parent_id.value,
+            'num': 20,
+            'type': 1
+        },
+    });
+    console.log('listData', listData);
+
+    if (listData.code == 200) {
+        secondNav.value = listData.data;
+    } else {
+        console.log("错误位置:获取二级栏目列表")
+    }
+}
+getSecondNav()
+
+// 获取商品数据列表 start--------------------------------------->
+const goodsList = ref()
+const page_goods = ref(1)
+const pageSize_goods = ref(20)
+const goodstotal = ref()
+
+let getshop = async () => {
+    let params = {
+        'catid': navCid.value,
+        'city_id': cityId.value,
+        'page': page_goods.value,
+        'pageSize': pageSize_goods.value,
+        'ismix': 1
+    }
+    if (cityId.value == undefined || cityId.value == '' || cityId.value == 'NaN') {
+        //删除变量params中的city_id参数
+        delete params.city_id
+    } else {
+        params.city_id = parseFloat(cityId.value)
+    }
+
+    const getGoodsList = await requestDataPromise('/web/getWebsiteshopList', {
+        method: 'GET',
+        query: params
+    });
+    console.log("获取数据列表goods", getGoodsList);
+
+    if (getGoodsList.code == 200) {
+        goodsList.value = getGoodsList.data.goods
+        goodstotal.value = getGoodsList.data.count
+    }
+}
+
+let getshop1 = async () => {
+    let params = {
+        'catid': navCid.value,
+        'page': page_goods.value,
+        'pageSize': pageSize_goods.value,
+        'ismix': 1
+    }
+
+    const getGoodsList = await requestDataPromise('/web/getWebsiteshopList', {
+        method: 'GET',
+        query: params
+    });
+    // console.log("获取数据列表goods", getGoodsList);
+
+    if (getGoodsList.code == 200) {
+        goodsList.value = getGoodsList.data.goods
+        goodstotal.value = getGoodsList.data.count
+    }
+
+}
+// getshop1()
+//4.4.1 监听cityid
+watch(() => route.query.cityid, (newVal, oldVal) => {
+    if (newVal != undefined) {
+        cityId.value = parseFloat(newVal)
+        getshop()
+    } else {
+        getshop1()
+    }
+}, {
+    deep: true,
+    immediate: true
+})
+
+
+// 获取商品数据 end----------------------------------------->
+
+//4.页面数据 end ---------------------------------------->
+
+//5.设置seo信息 start---------------------------------------->
+const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
+    method: 'GET',
+    query: {
+        'catid': routeId
+    },
+});
+
+if (setData.code == 200) {
+    let seoTitle = setData.data.seo_title;
+    let seoDescription = setData.data.seo_description;
+    let seoKeywords = setData.data.seo_keywords;
+    let seoSuffix = setData.data.suffix;
+    let seoName = setData.data.website_name;
+
+    useSeoMeta({
+        title: seoTitle + "_" + seoSuffix,
+        meta: [
+            { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
+            { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 }
+        ]
+    });
+} else {
+    console.log("设置频道页SEO出错!", setData.message)
+}
+//5.设置seo信息 end---------------------------------------->
+</script>
+<style lang="less" scoped>
+@import url("@/assets/css/shop/goodsList.less");
+
+.empty {
+    width: 100%;
+    height: 300px;
+    line-height: 300px;
+    text-align: center;
+}
+
+.empty_img {
+    vertical-align: -30px;
+    margin-right: 20px;
+}
+
+.empty_text {
+    font-size: 26px;
+    color: #999;
+}
+
+.pagination {
+    height: 100px;
+    margin-top: 20px;
+}
+
+.pagination1 {
+    height: 100px;
+    margin-top: 20px;
+}
+</style>

+ 639 - 0
components/news/detail.vue

@@ -0,0 +1,639 @@
+<template>
+    <!-- 页面头部 -->
+    <HomePageHead></HomePageHead>
+    <!-- 导航栏 -->
+    <HomePageNavigation1></HomePageNavigation1>
+    <!-- 列表页广告一 -->
+    <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
+    <!-- 面包屑导航 -->
+    <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>
+                    <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
+                </el-breadcrumb-item>
+                <el-breadcrumb-item>
+                    <NuxtLink :to="`list-1.html`"> {{ routLevelTitle }}</NuxtLink>
+                </el-breadcrumb-item>
+                <el-breadcrumb-item>{{ routeNewsTtitle }}</el-breadcrumb-item>
+            </el-breadcrumb>
+        </div>
+    </div>
+    <!-- 资讯列表 -->
+    <div class="newsDetail">
+        <div class="inner">
+            <div class="innerLeft">
+                <div class="LeftTop">
+                    <h1>{{ newsDetail.title }}</h1>
+                    <p>
+                        来源: <span>{{ newsDetail.copyfrom }}</span>
+                        作者: <span>{{ newsDetail.author }}</span>
+                        发布时间: <span>{{ time }}</span>
+                    </p>
+                    <!-- <img :src="newsDetail.imgurl" v-if="newsDetail.imgurl&&newsDetail.level==2||newsDetail.level==3"> -->
+                </div>
+                <!-- <div class="leftBottom" v-html="newsDetail.content" v-if="newsDetail.content"></div> -->
+                <div 
+                    class="leftBottom" 
+                    v-html="newsDetail.content" 
+                    v-if="newsDetail.content" 
+                    @click="openPreview">
+                </div>
+                <div v-if="previewVisible" class="preview-modal" @click="closePreview">
+                    <img :src="selectedImage" alt="Preview">
+                </div>
+                <!-- 免责声明: -->
+                <div class="disclaimer" v-if="newsDetail.copyfrom!='本网'">
+                    <p>原文链接:{{ newsDetail.fromurl }}</p>
+                    <p>[免责声明]本文来源于网络转载,仅供学习交流使用,不构成商业目的。 版权归原作者所有,如涉及作品内容,版权和其他问题,请在30日与本网联系,我们将第一时间处理。</p>
+                </div>
+                <div v-if="articleChoice">
+                    <!-- 投票 start ---------------------------------------->
+                    <div class="index_3_box_vote" v-if="articleChoice">
+                        <div class="voteTitle">投票区</div>
+                        <div class="inquire">
+                            <p v-if="voteList.length>0">{{voteList[0].survey_name}}</p>
+                            <div class="radioBox">
+                            <!--投票选项-->
+                            <div v-if="!isDisabled">
+                                <div class="radio" v-if="isRadio">
+                                    <el-radio-group v-model="radio1" @change="handleRadioChange">
+                                        <el-radio v-for="item in voteList" :key="item.id" :value="item.id" size="large">
+                                            <span v-if="item.is_other == 0">{{item.choice_name}}</span>
+                                            <span v-else>其他</span>
+                                        </el-radio>
+                                    </el-radio-group>
+                                    <el-input
+                                        v-if="showUserChoice"
+                                        v-model="userChoice"
+                                        :rows="2"
+                                        type="textarea"
+                                        resize="none"
+                                        placeholder="请输入.."
+                                    />
+                                </div>
+                                <div class="checkInputBox" v-else>
+                                    <el-checkbox-group v-model="check1" @change="handleCheckboxChange">
+                                        <span v-for="item in voteList" :key="item.id">
+                                            <span v-if="item.is_other == 0">
+                                                <el-checkbox size="large" :label="item.choice_name" :value="item.id"/>
+                                            </span>
+                                            <span v-else>
+                                                <el-checkbox size="large" label="其他" :value="item.id"/>
+                                            </span>
+                                        </span>
+                                    </el-checkbox-group>
+                                    <el-input
+                                        v-if="showUserChoice"
+                                        v-model="userChoice"
+                                        :rows="2"
+                                        type="textarea"
+                                        resize="none"
+                                        placeholder="请输入.."
+                                    />
+                                </div>
+                            </div>
+                            <!--投票结果-->
+                            <div class="inquireData" v-else>
+                                <div v-for="item in websiteSurveyData.data" :key="item.id">
+                                    <div class="inquireDataItem active" v-if="item.status == 1">
+                                        <div class="inquireDataItemTitle">
+                                            <span v-if="item.choice_name == ''">其他</span>
+                                            <span v-else>{{item.choice_name}}</span>
+                                        </div>
+                                        <div class="inquireDataItemNum">{{item.results}}票</div>
+                                    </div>
+                                    <div class="inquireDataItem" v-else>
+                                        <div class="inquireDataItemTitle">
+                                            <span v-if="item.choice_name == ''">其他</span>
+                                            <span v-else>{{item.choice_name}}</span>
+                                        </div>
+                                        <div class="inquireDataItemNum">{{item.results}}票</div>
+                                    </div>
+                                </div>
+                            </div>
+                            </div>
+                            <div class="btn">
+                                <button class="voting" @click="addWebsiteSurvey" :disabled="isDisabled" v-if="!isDisabled">投票</button>
+                            </div>
+                        </div>
+                    </div>
+                    <!-- 投票 end ---------------------------------------->
+                </div>
+            </div>
+            <div class="innerRight">
+                <!-- 热点资讯1 -->
+                <div class="hotList1">
+                    <DetailHotNews></DetailHotNews>
+                </div>
+                <!-- 热点资讯2 -->
+                <div class="hotList2">
+                    <DetailHotNews2></DetailHotNews2>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 页面底部 -->
+    <HomeFoot1></HomeFoot1>
+</template>
+
+<script setup>
+//1.页面依赖 start ---------------------------------------->
+import { onMounted } from 'vue'
+import { ElBreadcrumb, ElBreadcrumbItem,ElRadio, ElRadioGroup,ElCheckbox,ElCheckboxGroup,ElMessage,ElInput } from 'element-plus'
+import { ArrowRight } from '@element-plus/icons-vue'
+
+const nuxtApp = useNuxtApp();
+const axios = nuxtApp.$axios;
+
+//1.1 获得跳转过来的id
+const route = useRoute();
+const articleId = parseInt(route.params.id);  //获得该页面的id
+
+//1.2 获得父级栏目的名称、id
+//获得当前的完整路径
+const fullPath = route.path;
+//拆分,取出来中间这一段,然后提取数字部分
+const segments = fullPath.split('/'); 
+const targetSegment = segments[1]; 
+// const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+// const routeId = numberPart;
+
+
+let routeId;
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    routeId = getRouteId.data.category_id
+}else{
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    console.log("错误位置:通过url路径查询导航池id")
+    console.log("后端错误反馈:",getRouteId.message)
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+}
+
+//面包屑导航
+const parent_name = ref("");
+const parent_id = ref("");
+const parent_pinyin = ref("");
+let getParentNav = async () => {
+    const listData = await requestDataPromise('/web/getOneWebsiteCategory', {
+        method: 'GET',
+        query: {
+            'catid': routeId
+        },
+    });
+    
+    if (listData.code == 200) {
+        parent_name.value = listData.data.alias;
+        parent_id.value = listData.data.parent_id;
+        parent_pinyin.value = listData.data.aLIas_pinyin;
+
+    } else {
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:获取面包屑导航")
+        console.log("后端错误反馈:", listData.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+}
+//获得父级栏目详情
+getParentNav();
+//1.页面依赖 end ---------------------------------------->
+
+//2.页面数据 start ---------------------------------------->
+//2.1 资讯详情
+const newsDetail = ref({})
+const routeNewsTtitle = ref("");
+//2.2 发布日期
+const time = ref("");
+//2.3 路径
+const routLevelTitle = ref("");
+const routLevelId = ref("");
+//是否展示投票
+const articleChoice = ref(false);
+//2.4获取详情
+async function getPageData() {
+    const mkdata =  await requestDataPromise('/web/selectWebsiteArticleInfo', {
+        method: 'GET',
+        query: {
+            'articleid': articleId
+        },
+    });
+    if(mkdata.code==200){
+        //判断是否显示投票
+        if(mkdata.data.is_survey==1){
+            console.log("本篇文章含有投票!")
+            articleChoice.value = true;
+            getVoteList();
+        }
+        //获取内容
+        newsDetail.value = mkdata.data;
+        //获取路径
+        routLevelTitle.value = newsDetail.value.cat_name;
+        routLevelId.value = newsDetail.value.category_id;
+        //获取发布时间
+        time.value = newsDetail.value.updated_at.split(' ')[0];
+        //修正标题长度
+        if (newsDetail.value.title.length >= 30) {
+            routeNewsTtitle.value = newsDetail.value.title.substr(0, 30) + "...";
+        } else {
+            routeNewsTtitle.value = newsDetail.value.title
+        }
+    }else{
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:获取详情内容")
+        console.log("后端错误反馈:",mkdata.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+}
+getPageData();
+
+//2.5 获得广告
+//广告列表
+let adImg1 = ref([]);
+// async function getAdData(){
+//     const adData = await requestDataPromise('/web/getWebsiteAdvertisement',{method:'GET',query:{'ad_tag':'DETAIL'}});
+//     if(adData.code==200){
+//         for(let item of adData.data){
+//             if(item.ad_tag == 'DETAIL_0001'){
+//                 adImg1.value = item;
+//             }
+//         }
+//     }else{
+//         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+//         console.log("错误位置:获取详情页广告列表")
+//         console.log("后端错误反馈:",adData.message)
+//         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+//     }
+// }
+// getAdData();
+
+onMounted(async ()  => {
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_detail_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.页面数据 end ---------------------------------------->
+
+//3.设置seo信息 start---------------------------------------->
+//3.1 设置seo信息
+const setData =  await requestDataPromise('/web/selectWebsiteArticleInfo', {
+    method: 'GET',
+    query: {
+        'articleid': articleId
+    },
+});
+if(setData.code==200){
+    let seoTitle = setData.data.title;
+    let seoDescription = setData.data.introduce;
+    let seoKeywords = setData.data.keyword;
+    let seoSuffix = setData.data.suffix;
+    let seoName = setData.data.website_name;
+
+    useSeoMeta({
+        title: seoTitle + "_" + seoName + "_" + seoSuffix,
+        meta: [
+            { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
+            { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
+        ]
+    });
+}else{
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    console.log("错误位置:设置详情页面SEO数据")
+    console.log("后端错误反馈:",setData.message)
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+}
+//3.设置seo信息 end---------------------------------------->
+
+//4.投票 start---------------------------------------->
+const radio1 = ref(''); //单选
+const check1 = ref([]); //多选
+const isDisabled = ref(false);//是否禁用提交按钮
+const isRadio = ref(true);//是否渲染单选
+
+const userSurId = ref('');//投票属于哪一篇文章
+const userChoice = ref('');//用于判断用户选择了其他选项以后,输入的值
+const userIsChoice = ref('');//用于判断其他选项目前是什么值
+const showUserChoice = ref(false);//是否显示其他输入框
+const websiteSurveyData = ref([]);//投票结果
+
+//3.2获得投票列表
+let voteList = ref([]);
+async function getVoteList(){
+    const voteData = await requestHome('/web/getWebsiteSurvey',{method:'GET',query:{'art_id':articleId}});
+    console.log(778899)
+    console.log(voteData)
+    if(voteData.code == 200){
+        voteList.value = voteData.data;
+        console.log(voteList.value)
+        //判断显示单选还是多选
+        //survey_type 0是单选 1是多选
+        if(voteData.data[0].survey_type == 0){
+            isRadio.value = true;
+            console.log("1111")
+        }else{
+            isRadio.value = false;
+        }
+        //把最后一个的值拿出来 用于判断用户是否选择了其他
+        for(let item of voteData.data){
+            //如果含有其他
+            if(item.is_other==1){
+                userIsChoice.value = item.id;
+            }
+        }
+        //用户投票属于哪一篇文章
+        userSurId.value = voteData.data[0].sur_id;
+
+    }else{
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:首页投票")
+        console.log("后端错误反馈:",voteData.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->") 
+    }
+}
+
+
+//3.2当用户选择了选项,判断是否展示其他输入框
+const handleRadioChange = (value) => {
+    if(value == userIsChoice.value){
+        showUserChoice.value = true;
+    }else{
+        showUserChoice.value = false;
+    }
+}
+
+const handleCheckboxChange = (value) => {
+    if (value.includes(userIsChoice.value)) {
+        showUserChoice.value = true;
+    } else {
+        showUserChoice.value = false;
+    }
+}
+
+//3.2发起投票
+async function addWebsiteSurvey(){
+    //判断当前是单选还是多选
+    console.log(isRadio.value)
+    if(isRadio.value){
+        console.log("用户单选!")
+        if(radio1.value!=''){
+            //先判断一下是否使用了其他选项
+            if(showUserChoice.value){
+                if(userChoice.value!=''){
+                    //文章id
+                    // console.log(userSurId.value)
+                    // 用户输入的值
+                    // console.log(userChoice.value)
+                    //如果使用了其他,其他的选项需要增加进去
+                    const ChoiceData = await requestHome('/web/addWebsiteSurveyOption',{
+                        method:'GET',
+                        query:{
+                            'sur_id':userSurId.value,//投票的新闻id
+                            'choice_name':userChoice.value,//投票的选项id
+                        }
+                    });
+                    if(ChoiceData.code == 200){
+                        //提交完其他选项以后,再正式发起投票
+                        const mkData = await requestHome('/web/addWebsiteSurveyVote',{
+                            method:'GET',
+                            query:{
+                                'sur_id':userSurId.value,
+                                'choice_id':ChoiceData.data
+                            }
+                        });
+                        if(mkData.code == 200){
+                            ElMessage.success('投票成功!')
+                            //把投票结果显示到页面上 禁用投票按钮
+                            isDisabled.value = true;
+                            websiteSurveyData.value = mkData.data;
+                            //遍历一下,把用户选中的那个设置status为1
+                            let data = mkData.data;
+                            //遍历一下,把用户选中的那个设置status为1
+                            for(let item of data.data){
+                                for(let i of data.choice){
+                                    if(item.id == i){
+                                        console.log(item.id)
+                                        item.status = 1;
+                                    }
+                                }
+                            }
+                            websiteSurveyData.value = data;
+                        }else{
+                            ElMessage.error(mkData.message)
+                        }
+                    }else{
+                        ElMessage.error('其他投票失败!')
+                    }
+                }else{
+                    ElMessage.error('请输入选项内容!')
+                }
+            }else{
+                //如果没选择其他,直接提交选择的内容
+                const mkData = await requestHome('/web/addWebsiteSurveyVote',{
+                    method:'GET',
+                    query:{
+                        'sur_id':userSurId.value,
+                        'choice_id':radio1.value
+                    }
+                });
+                if(mkData.code == 200){
+                    ElMessage.success('投票成功!')
+                    //把投票结果显示到页面上 禁用投票按钮
+                    isDisabled.value = true;
+                    let data = mkData.data;
+                    //遍历一下,把用户选中的那个设置status为1
+                    for(let item of data.data){
+                        for(let i of data.choice){
+                            if(item.id == i){
+                                item.status = 1;
+                            }
+                        }
+                    }
+                    websiteSurveyData.value = data;
+                }else{
+                    ElMessage.error('投票失败!')
+                }
+            }
+        }else{
+            ElMessage.error('请选择一个选项')
+        }
+    }else{
+        console.log("多选!")
+        //多选
+        if(check1.value!=[]){
+             //先判断一下是否使用了其他选项
+            if(showUserChoice.value){
+                if(userChoice.value!=''){
+                    //判断用户是否只选择了一个其他
+                    if(check1.value.length == 1){
+                        const ChoiceData = await requestDataPromise('/web/addWebsiteSurveyOption',{
+                            method:'GET',
+                            query:{
+                                'sur_id':userSurId.value,//投票的新闻id
+                                'choice_name':userChoice.value,//用户输入的其他选项文字
+                            }
+                        });
+                        if(ChoiceData.code == 200){
+                            //提交完其他选项以后,再正式发起投票
+                            const mkData = await requestDataPromise('/web/addWebsiteSurveyVote',{
+                                method:'GET',
+                                query:{
+                                    'sur_id':userSurId.value,
+                                    'choice_id':ChoiceData.data
+                                }
+                            });
+                            if(mkData.code == 200){
+                                ElMessage.success('投票成功!')
+                                //把投票结果显示到页面上 禁用投票按钮
+                                isDisabled.value = true;
+                                websiteSurveyData.value = mkData.data;
+                                //遍历一下,把用户选中的那个设置status为1
+                                let data = mkData.data;
+                                //遍历一下,把用户选中的那个设置status为1
+                                for(let item of data.data){
+                                    for(let i of data.choice){
+                                        if(item.id == i){
+                                            console.log(item.id)
+                                            item.status = 1;
+                                        }
+                                    }
+                                }
+                                websiteSurveyData.value = data;
+                            }else{
+                                ElMessage.error(mkData.message)
+                            }
+                        }else{
+                            ElMessage.error('其他投票失败!')
+                        }
+
+                    }else{
+                        //用户选择了除了其他以外,还包括别的选项
+                        const ChoiceData = await requestDataPromise('/web/addWebsiteSurveyOption',{
+                            method:'GET',
+                            query:{
+                                'sur_id':userSurId.value,//投票的新闻id
+                                'choice_name':userChoice.value,//用户输入的其他选项文字
+                            }
+                        });
+                        if(ChoiceData.code == 200){
+                            let data = check1.value;
+                            //找到多选的数组,把其他默认值给替换掉
+                            for (let i = 0; i < data.length; i++) {
+                                if (data[i] == userIsChoice.value) {
+                                    data[i] = ChoiceData.data;
+                                }
+                            }
+                            let jsonArray = JSON.stringify(data);
+                            //提交完其他选项以后,再正式发起投票
+                            const mkData = await requestDataPromise('/web/addWebsiteSurveyVote',{
+                                method:'GET',
+                                query:{
+                                    'sur_id':userSurId.value,
+                                    'choice_id':jsonArray
+                                }
+                            });
+                            
+                            if(mkData.code == 200){
+                                ElMessage.success('投票成功!')
+                                //把投票结果显示到页面上 禁用投票按钮
+                                isDisabled.value = true;
+                                websiteSurveyData.value = mkData.data;
+                                //遍历一下,把用户选中的那个设置status为1
+                                let data = mkData.data;
+                                //遍历一下,把用户选中的那个设置status为1
+                                for(let item of data.data){
+                                    for(let i of data.choice){
+                                        if(item.id == i){
+                                            //console.log(item.id)
+                                            item.status = 1;
+                                        }
+                                    }
+                                }
+                                websiteSurveyData.value = data;
+                            }else{
+                                ElMessage.error(mkData.message)
+                            }
+                        }else{
+                            ElMessage.error('其他投票失败!')
+                        }
+
+                    }
+                }else{
+                    ElMessage.error('请输入选项内容!')
+                }
+            }else{
+                let jsonArray = JSON.stringify(check1.value);
+                //如果没选择其他,直接提交选择的内容
+                const mkData = await requestDataPromise('/web/addWebsiteSurveyVote',{
+                    method:'GET',
+                    query:{
+                        'sur_id':userSurId.value,
+                        'choice_id':jsonArray
+                    }
+                });
+                if(mkData.code == 200){
+                    ElMessage.success('投票成功!')
+                    //把投票结果显示到页面上 禁用投票按钮
+                    isDisabled.value = true;
+                    websiteSurveyData.value = mkData.data;
+                    //遍历一下,把用户选中的那个设置status为1
+                    let data = mkData.data;
+                    //遍历一下,把用户选中的那个设置status为1
+                    for(let item of data.data){
+                        for(let i of data.choice){
+                            if(item.id == i){
+                                console.log(item.id)
+                                item.status = 1;
+                            }
+                        }
+                    }
+                    websiteSurveyData.value = data;
+                }else{
+                    ElMessage.error('投票失败!')
+                }
+            }
+        }else{
+            ElMessage.error('请选择一个选项')
+        }
+    }
+}
+//4.投票 end---------------------------------------->
+
+//5.页面图片放大 start---------------------------------------->
+const previewVisible = ref(false)
+const selectedImage = ref(' ')
+
+const openPreview = (event) => {
+    if (event.target.tagName === 'IMG') {
+        selectedImage.value = event.target.src;
+        previewVisible.value = true;
+    }
+}
+const closePreview = () => {
+    previewVisible.value = false;
+}
+//5.页面图片放大 end---------------------------------------->
+</script>
+
+<style lang="less" scoped>
+@import url('@/assets/css/detail.less');
+</style>

+ 329 - 0
components/news/list.vue

@@ -0,0 +1,329 @@
+<template>
+    <div id="newsList">
+        <!-- 页面头部 -->
+        <HomePageHead></HomePageHead>
+
+        <!-- 导航栏 -->
+        <HomePageNavigation1></HomePageNavigation1>
+
+        <!-- 列表页广告一 -->
+        <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
+
+        <!-- 二级标题-->
+        <div class="sannongzhichuang" v-if="parent_name != ''">
+            <div class="inner">
+                <h2>
+                    <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
+                    <em class="iconfont icon-xingzhuang-zhijiaosanjiaoxing-copy"></em>
+                </h2>
+                <p class="introduction">
+                    <strong>频道介绍</strong>
+                    <div v-for="(item, index) in secondNav" :key="index">
+                        <span v-if="index <= 7">
+                            <NuxtLink :to="{ path: `/${targetRoute}/${item.aLIas_pinyin}/list-1.html`}">{{ item.alias }}</NuxtLink>
+                        </span>
+                        <b v-else></b>
+                    </div>
+                </p>
+            </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 v-if="parent_name !=''">
+                        <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
+                    </el-breadcrumb-item>
+                    <el-breadcrumb-item>{{ name }}</el-breadcrumb-item>
+                </el-breadcrumb>
+            </div>
+        </div>
+        <!-- 资讯列表 -->
+        <div class="newsList">
+            <div class="inner">
+                <div class="innerLeft">
+                    <ul class="list">
+                        <li v-for="(item, index) in newsList" :key="index">
+                            <NuxtLink :href="getLinkPathDetail(item)" :title="item.alias">
+                                {{ item.title }}
+                            </NuxtLink>
+                        </li>
+                    </ul>
+                    <!-- 分页器 -->
+                    <div class="pagination" v-if="total > 0">
+                        <el-pagination 
+                            size="small" 
+                            background 
+                            layout="prev, pager, next" 
+                            :total="total" 
+                            class="mt-4"
+                            :page-size="pageSize" 
+                            :current-page="pageNum"
+                            prev-text="上一页" 
+                            next-text="下一页" 
+                            @current-change="changePage" 
+                        />
+                    </div>
+                </div>
+                <div class="innerRight">
+                    <DetailHotNews></DetailHotNews>
+                    <DetailHotNews2></DetailHotNews2>
+                </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';
+//当前列表名称
+const name = ref('')
+const { $webUrl, $CwebUrl, $BwebUrl } = useNuxtApp()
+
+//格式化跳转路径
+const getLinkPathDetail = (item) => {
+    if (item.islink == 1) {
+        return `${item.linkurl}`;
+    } else {
+        //return `/${item.aLIas_pinyin}/${item.id}`;
+        //return `/newsDetail/${item.id}`
+        return `/${item.pinyin}/${item.id}.html`;
+    }
+}
+//1.页面必备依赖 end ---------------------------------------->
+
+//1.获得路由id start ---------------------------------------->
+const route = useRoute();
+let articleId = 0;//路由id
+let pageNum = ref(2);
+let total = ref(1);
+let pageSize = ref(20);
+
+//获得当前的完整路径
+const fullPath = route.path;
+//拆分,取出来中间这一段,然后提取数字部分
+const segments = fullPath.split('/'); 
+const targetSegment = segments[2]; 
+const targetRoute = segments[1]; 
+
+//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+//let routeId = 20 //排除路径错误可以打开这个
+//articleId = numberPart;
+
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    articleId = getRouteId.data.category_id
+}else{
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    console.log("错误位置:通过url路径查询导航池id")
+    console.log("后端错误反馈:",getRouteId.message)
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+}
+//获得html前的数字
+// const pageUrl = segments[3]; 
+// const pageNumber = pageUrl.split('.')[0];
+// console.log("当前URL中的页码:")
+// console.log(pageNumber)//2
+// pageNum.value = parseInt(pageNumber);
+pageNum.value = parseInt(route.params.id);
+
+//1.获得路由id end ---------------------------------------->
+
+//2.页面数据 start ---------------------------------------->
+//2.2新闻列表
+const newsList = ref([]);
+let newslists = async () => {
+    const listData = await requestDataPromise('/web/getWebsiteArticleList', {
+        method: 'GET',
+        query: {
+            'page': pageNum.value,
+            'pageSize': pageSize.value,
+            'catid': articleId
+        },
+    });
+    if (listData.code == 200) {
+        newsList.value = listData.data.rows;
+        total.value = listData.data.count;
+
+    } else {
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:获取新闻列表")
+        console.log("后端错误反馈:", listData.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+}
+//获得列表
+newslists();
+
+//分页事件
+let changePage = (value) => {
+    console.log("当前页码", value);
+    navigateTo(`/${targetSegment}/${value}.html`)
+}
+
+//2.3获得页面名称
+let getPageName = async () => {
+    const pageName = await requestDataPromise('/web/getOneWebsiteCategory', {
+        method: 'GET',
+        query: {
+            'catid': articleId
+        },
+    });
+    if (pageName.code == 200) {
+        name.value = pageName.data.alias
+    } else {
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:设置页面标题")
+        console.log("后端错误反馈:", pageName.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+}
+//获得列表
+getPageName();
+//2.页面数据 end ---------------------------------------->
+
+
+//3.二级栏目 start ---------------------------------------->
+//3.1通过id获取父栏目
+const parent_name = ref([]);
+const parent_id = ref([]);
+const parent_pinyin = ref("");
+let getParentNav = async () => {
+    const listData = await requestDataPromise('/web/getOneWebsiteCategory', {
+        method: 'GET',
+        query: {
+            'catid': articleId
+        },
+    });
+    if (listData.code == 200) {
+        console.log(111999)
+        console.log(listData.data);
+        parent_name.value = listData.data.parent_name;
+        parent_id.value = listData.data.parent_id;
+        parent_pinyin.value = listData.data.parent_pinyin;
+    } else {
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:获取新闻列表")
+        console.log("后端错误反馈:", listData.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+    getSecondNav();
+}
+//获得父级栏目详情
+getParentNav();
+
+// 3.2获取二级栏目
+const secondNav = ref([]);
+let getSecondNav = async () => {
+    const listData = await requestDataPromise('/web/getWebsiteModelCategory', {
+        method: 'GET',
+        query: {
+            'placeid': 1,
+            'pid': parent_id.value,
+            'num': 8,
+        },
+    });
+    console.log('listData', listData);
+
+    if (listData.code == 200) {
+        secondNav.value = listData.data;
+    } else {
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+        console.log("错误位置:获取新闻列表")
+        console.log("后端错误反馈:", listData.message)
+        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    }
+}
+//3.二级栏目 end ---------------------------------------->
+
+//4.设置seo信息 start---------------------------------------->
+//4.1 设置seo信息
+const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
+    method: 'GET',
+    query: {
+        'catid': articleId
+    },
+});
+
+if (setData.code == 200) {
+    let seoTitle = setData.data.seo_title;
+    let seoDescription = setData.data.seo_description;
+    let seoKeywords = setData.data.seo_keywords;
+    let seoSuffix = setData.data.suffix;
+    let seoName = setData.data.website_name;
+
+    useSeoMeta({
+        title: seoTitle + "_" + seoName + "_" + seoSuffix,
+        meta: [
+            { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
+            { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
+        ]
+    });
+} else {
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    console.log("错误位置:设置列表页面SEO数据")
+    console.log("后端错误反馈:", setData.message)
+    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+}
+//4.设置seo信息 end---------------------------------------->
+
+
+//5.广告 start---------------------------------------->
+let adImg1 = ref({});
+let adImg2 = ref({});
+
+onMounted(async ()  => {
+
+    //从客户端获取行政职能部门 加快打开速度
+    const { $webUrl, $CwebUrl } = useNuxtApp();
+    //广告1
+    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_list_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=snzxw_list_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];
+
+})
+//5.广告 end---------------------------------------->
+</script>
+
+<style lang="less" scoped>
+@import url('@/assets/css/list.less');
+</style>

+ 65 - 12
composables/publicFunction.ts

@@ -1,51 +1,104 @@
 //1.格式化日期
 //time 日期字符串 type 从什么时候开始返回 year = 返回年月日 month = 返回月日..
 //style 样式,比如 年-月-日 年.月.日
-const getTime = function(time:string,type:string,style:Number){
+const getTime = function (time: string, type: string, style: Number) {
   const date = new Date(time);
   const year = date.getFullYear();
   const month = date.getMonth() + 1;
   const day = date.getDate();
 
   //返回 年.月.日
-  if(type == 'year'&& style == 0){
+  if (type == 'year' && style == 0) {
     return `${year}.${month}.${day}`;
   }
   //返回 年-月-日
-  if(type == 'year'&& style == 1){
+  if (type == 'year' && style == 1) {
     return `${year}-${month}-${day}`;
   }
   //返回 年-月
-  if(type == 'year'&& style == 2){
+  if (type == 'year' && style == 2) {
     return `${year}-${month}`;
   }
   //返回 年
-  if(type == 'year'&& style == 3){
+  if (type == 'year' && style == 3) {
     return `${year}`;
   }
   //返回 月-日
-  if(type == 'month'&& style == 1){
+  if (type == 'month' && style == 1) {
     return `${month}-${day}`;
   }
   //返回 月.日
-  if(type == 'month'&& style == 2){
+  if (type == 'month' && style == 2) {
     return `${month}.${day}`;
   }
   //返回 日
-  if(type == 'day'&& style == 1){
+  if (type == 'day' && style == 1) {
     return `${day}`;
   }
 }
 
 //2.格式化标题长度
 //title 标题 length 长度
-const getTitleLength = function(title:string,length:number){
-  if(title.length >= length){
+const getTitleLength = function (title: string, length: number) {
+  if (title.length >= length) {
     return title.substring(0, length) + "...";
-  }else{
+  } else {
     return title;
   }
 }
+//3.格式化跳转路径 start ---------------------------------------->
+//3.1跳转到频道页面或者一级列表页
+const getLinkPath = (item: any) => {
+  if (item.is_url == 1) {
+    return `${item.web_url}`;
+  } else if (item.alias == "供求信息") {
+    return `/gongqiuxinxi/gongyingxinxi/index.html`;
+  } else if (item.children_count == 0) {
+    return `/${item.aLIas_pinyin}/list-1.html`;
+  } else {
+    return `/${item.aLIas_pinyin}/index.html`;
+  }
+}
+const getLinkPath1 = (item: any) => {
+  return `/${item.aLIas_pinyin}/list-1.html`;
+}
+//3.2跳转到详情页
+const getLinkPathDetail = (item: any) => {
+  if (item.islink == 1) {
+    return `${item.linkurl}`;
+  } else {
+    return `/${item.pinyin}/${item.id}.html`;
+  }
+}
+//3.格式化跳转路径 end ---------------------------------------->
+
+
+//4.获得路由路径 start ---------------------------------------->
+const getRoutePath = (type: Number) => {
+  const route = useRoute();
+  //获得当前的完整路径
+  const fullPath = route.path;
+  //拆分,取出来中间这一段,然后提取数字部分
+  const segments = fullPath.split('/');
+  const targetSegmentOne = segments[1];
+  const targetSegmentTwo = segments[2];
+  const targetSegmentThree = segments[3];
+
+  if (type == 1) {
+    return targetSegmentOne;
+  }
+  if (type == 2) {
+    return targetSegmentTwo;
+  }
+  if (type == 3) {
+    return targetSegmentThree;
+  }
+}
+
+
+
+//4.获得路由路径 end ---------------------------------------->
+export { getTime, getTitleLength, getLinkPath, getLinkPath1, getLinkPathDetail, getRoutePath };
 
 
-export { getTime,getTitleLength };
+// export { getTime, getTitleLength };

+ 20 - 626
pages/[dir]/[dir]/[id].vue

@@ -1,639 +1,33 @@
 <template>
-    <!-- 页面头部 -->
-    <HomePageHead></HomePageHead>
-    <!-- 导航栏 -->
-    <HomePageNavigation1></HomePageNavigation1>
-    <!-- 列表页广告一 -->
-    <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
-    <!-- 面包屑导航 -->
-    <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>
-                    <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
-                </el-breadcrumb-item>
-                <el-breadcrumb-item>
-                    <NuxtLink :to="`list-1.html`"> {{ routLevelTitle }}</NuxtLink>
-                </el-breadcrumb-item>
-                <el-breadcrumb-item>{{ routeNewsTtitle }}</el-breadcrumb-item>
-            </el-breadcrumb>
-        </div>
-    </div>
-    <!-- 资讯列表 -->
-    <div class="newsDetail">
-        <div class="inner">
-            <div class="innerLeft">
-                <div class="LeftTop">
-                    <h1>{{ newsDetail.title }}</h1>
-                    <p>
-                        来源: <span>{{ newsDetail.copyfrom }}</span>
-                        作者: <span>{{ newsDetail.author }}</span>
-                        发布时间: <span>{{ time }}</span>
-                    </p>
-                    <!-- <img :src="newsDetail.imgurl" v-if="newsDetail.imgurl&&newsDetail.level==2||newsDetail.level==3"> -->
-                </div>
-                <!-- <div class="leftBottom" v-html="newsDetail.content" v-if="newsDetail.content"></div> -->
-                <div 
-                    class="leftBottom" 
-                    v-html="newsDetail.content" 
-                    v-if="newsDetail.content" 
-                    @click="openPreview">
-                </div>
-                <div v-if="previewVisible" class="preview-modal" @click="closePreview">
-                    <img :src="selectedImage" alt="Preview">
-                </div>
-                <!-- 免责声明: -->
-                <div class="disclaimer" v-if="newsDetail.copyfrom!='本网'">
-                    <p>原文链接:{{ newsDetail.fromurl }}</p>
-                    <p>[免责声明]本文来源于网络转载,仅供学习交流使用,不构成商业目的。 版权归原作者所有,如涉及作品内容,版权和其他问题,请在30日与本网联系,我们将第一时间处理。</p>
-                </div>
-                <div v-if="articleChoice">
-                    <!-- 投票 start ---------------------------------------->
-                    <div class="index_3_box_vote" v-if="articleChoice">
-                        <div class="voteTitle">投票区</div>
-                        <div class="inquire">
-                            <p v-if="voteList.length>0">{{voteList[0].survey_name}}</p>
-                            <div class="radioBox">
-                            <!--投票选项-->
-                            <div v-if="!isDisabled">
-                                <div class="radio" v-if="isRadio">
-                                    <el-radio-group v-model="radio1" @change="handleRadioChange">
-                                        <el-radio v-for="item in voteList" :key="item.id" :value="item.id" size="large">
-                                            <span v-if="item.is_other == 0">{{item.choice_name}}</span>
-                                            <span v-else>其他</span>
-                                        </el-radio>
-                                    </el-radio-group>
-                                    <el-input
-                                        v-if="showUserChoice"
-                                        v-model="userChoice"
-                                        :rows="2"
-                                        type="textarea"
-                                        resize="none"
-                                        placeholder="请输入.."
-                                    />
-                                </div>
-                                <div class="checkInputBox" v-else>
-                                    <el-checkbox-group v-model="check1" @change="handleCheckboxChange">
-                                        <span v-for="item in voteList" :key="item.id">
-                                            <span v-if="item.is_other == 0">
-                                                <el-checkbox size="large" :label="item.choice_name" :value="item.id"/>
-                                            </span>
-                                            <span v-else>
-                                                <el-checkbox size="large" label="其他" :value="item.id"/>
-                                            </span>
-                                        </span>
-                                    </el-checkbox-group>
-                                    <el-input
-                                        v-if="showUserChoice"
-                                        v-model="userChoice"
-                                        :rows="2"
-                                        type="textarea"
-                                        resize="none"
-                                        placeholder="请输入.."
-                                    />
-                                </div>
-                            </div>
-                            <!--投票结果-->
-                            <div class="inquireData" v-else>
-                                <div v-for="item in websiteSurveyData.data" :key="item.id">
-                                    <div class="inquireDataItem active" v-if="item.status == 1">
-                                        <div class="inquireDataItemTitle">
-                                            <span v-if="item.choice_name == ''">其他</span>
-                                            <span v-else>{{item.choice_name}}</span>
-                                        </div>
-                                        <div class="inquireDataItemNum">{{item.results}}票</div>
-                                    </div>
-                                    <div class="inquireDataItem" v-else>
-                                        <div class="inquireDataItemTitle">
-                                            <span v-if="item.choice_name == ''">其他</span>
-                                            <span v-else>{{item.choice_name}}</span>
-                                        </div>
-                                        <div class="inquireDataItemNum">{{item.results}}票</div>
-                                    </div>
-                                </div>
-                            </div>
-                            </div>
-                            <div class="btn">
-                                <button class="voting" @click="addWebsiteSurvey" :disabled="isDisabled" v-if="!isDisabled">投票</button>
-                            </div>
-                        </div>
-                    </div>
-                    <!-- 投票 end ---------------------------------------->
-                </div>
-            </div>
-            <div class="innerRight">
-                <!-- 热点资讯1 -->
-                <div class="hotList1">
-                    <DetailHotNews></DetailHotNews>
-                </div>
-                <!-- 热点资讯2 -->
-                <div class="hotList2">
-                    <DetailHotNews2></DetailHotNews2>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- 页面底部 -->
-    <HomeFoot1></HomeFoot1>
+    <NewsDetail v-if="routeType == 1"></NewsDetail>
+    <GoodsDetail v-if="routeType == 2"></GoodsDetail>
 </template>
 
 <script setup>
-//1.页面依赖 start ---------------------------------------->
-import { onMounted } from 'vue'
-import { ElBreadcrumb, ElBreadcrumbItem,ElRadio, ElRadioGroup,ElCheckbox,ElCheckboxGroup,ElMessage,ElInput } from 'element-plus'
-import { ArrowRight } from '@element-plus/icons-vue'
-
-const nuxtApp = useNuxtApp();
-const axios = nuxtApp.$axios;
-
-//1.1 获得跳转过来的id
-const route = useRoute();
-const articleId = parseInt(route.params.id);  //获得该页面的id
-
-//1.2 获得父级栏目的名称、id
-//获得当前的完整路径
-const fullPath = route.path;
-//拆分,取出来中间这一段,然后提取数字部分
-const segments = fullPath.split('/'); 
-const targetSegment = segments[1]; 
-// const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-// const routeId = numberPart;
-
-
+//0.加载页面依赖 start ---------------------------------------->
+import { ref, onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
+//0.加载页面依赖 end ---------------------------------------->
+
+//1.获得路由id start ---------------------------------------->
+const targetSegment = getRoutePath(1);
+const targetSegment1 = getRoutePath(2);
+//1.1 获得当前的路由id
 let routeId;
+let routeType;
 //通过导航路径反向查询导航id
 const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
     method: 'GET',
     query: {
-        'pinyin': targetSegment,
+        'pinyin': targetSegment1,
     },
 });
-if(getRouteId.code == 200){
+if (getRouteId.code == 200) {
+    console.log('getRouteId', getRouteId.data);
     routeId = getRouteId.data.category_id
-}else{
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    console.log("错误位置:通过url路径查询导航池id")
-    console.log("后端错误反馈:",getRouteId.message)
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-}
-
-//面包屑导航
-const parent_name = ref("");
-const parent_id = ref("");
-const parent_pinyin = ref("");
-let getParentNav = async () => {
-    const listData = await requestDataPromise('/web/getOneWebsiteCategory', {
-        method: 'GET',
-        query: {
-            'catid': routeId
-        },
-    });
-    
-    if (listData.code == 200) {
-        parent_name.value = listData.data.alias;
-        parent_id.value = listData.data.parent_id;
-        parent_pinyin.value = listData.data.aLIas_pinyin;
-
-    } else {
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:获取面包屑导航")
-        console.log("后端错误反馈:", listData.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    }
-}
-//获得父级栏目详情
-getParentNav();
-//1.页面依赖 end ---------------------------------------->
-
-//2.页面数据 start ---------------------------------------->
-//2.1 资讯详情
-const newsDetail = ref({})
-const routeNewsTtitle = ref("");
-//2.2 发布日期
-const time = ref("");
-//2.3 路径
-const routLevelTitle = ref("");
-const routLevelId = ref("");
-//是否展示投票
-const articleChoice = ref(false);
-//2.4获取详情
-async function getPageData() {
-    const mkdata =  await requestDataPromise('/web/selectWebsiteArticleInfo', {
-        method: 'GET',
-        query: {
-            'articleid': articleId
-        },
-    });
-    if(mkdata.code==200){
-        //判断是否显示投票
-        if(mkdata.data.is_survey==1){
-            console.log("本篇文章含有投票!")
-            articleChoice.value = true;
-            getVoteList();
-        }
-        //获取内容
-        newsDetail.value = mkdata.data;
-        //获取路径
-        routLevelTitle.value = newsDetail.value.cat_name;
-        routLevelId.value = newsDetail.value.category_id;
-        //获取发布时间
-        time.value = newsDetail.value.updated_at.split(' ')[0];
-        //修正标题长度
-        if (newsDetail.value.title.length >= 30) {
-            routeNewsTtitle.value = newsDetail.value.title.substr(0, 30) + "...";
-        } else {
-            routeNewsTtitle.value = newsDetail.value.title
-        }
-    }else{
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:获取详情内容")
-        console.log("后端错误反馈:",mkdata.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    }
-}
-getPageData();
-
-//2.5 获得广告
-//广告列表
-let adImg1 = ref([]);
-// async function getAdData(){
-//     const adData = await requestDataPromise('/web/getWebsiteAdvertisement',{method:'GET',query:{'ad_tag':'DETAIL'}});
-//     if(adData.code==200){
-//         for(let item of adData.data){
-//             if(item.ad_tag == 'DETAIL_0001'){
-//                 adImg1.value = item;
-//             }
-//         }
-//     }else{
-//         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-//         console.log("错误位置:获取详情页广告列表")
-//         console.log("后端错误反馈:",adData.message)
-//         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-//     }
-// }
-// getAdData();
-
-onMounted(async ()  => {
-    const { $webUrl, $CwebUrl } = useNuxtApp();
-    //广告1
-    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_detail_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.页面数据 end ---------------------------------------->
-
-//3.设置seo信息 start---------------------------------------->
-//3.1 设置seo信息
-const setData =  await requestDataPromise('/web/selectWebsiteArticleInfo', {
-    method: 'GET',
-    query: {
-        'articleid': articleId
-    },
-});
-if(setData.code==200){
-    let seoTitle = setData.data.title;
-    let seoDescription = setData.data.introduce;
-    let seoKeywords = setData.data.keyword;
-    let seoSuffix = setData.data.suffix;
-    let seoName = setData.data.website_name;
-
-    useSeoMeta({
-        title: seoTitle + "_" + seoName + "_" + seoSuffix,
-        meta: [
-            { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
-            { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
-        ]
-    });
-}else{
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    console.log("错误位置:设置详情页面SEO数据")
-    console.log("后端错误反馈:",setData.message)
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    routeType = getRouteId.data.type
+} else {
+    console.log("获得路由id出错!", getRouteId.message)
 }
-//3.设置seo信息 end---------------------------------------->
-
-//4.投票 start---------------------------------------->
-const radio1 = ref(''); //单选
-const check1 = ref([]); //多选
-const isDisabled = ref(false);//是否禁用提交按钮
-const isRadio = ref(true);//是否渲染单选
-
-const userSurId = ref('');//投票属于哪一篇文章
-const userChoice = ref('');//用于判断用户选择了其他选项以后,输入的值
-const userIsChoice = ref('');//用于判断其他选项目前是什么值
-const showUserChoice = ref(false);//是否显示其他输入框
-const websiteSurveyData = ref([]);//投票结果
-
-//3.2获得投票列表
-let voteList = ref([]);
-async function getVoteList(){
-    const voteData = await requestHome('/web/getWebsiteSurvey',{method:'GET',query:{'art_id':articleId}});
-    console.log(778899)
-    console.log(voteData)
-    if(voteData.code == 200){
-        voteList.value = voteData.data;
-        console.log(voteList.value)
-        //判断显示单选还是多选
-        //survey_type 0是单选 1是多选
-        if(voteData.data[0].survey_type == 0){
-            isRadio.value = true;
-            console.log("1111")
-        }else{
-            isRadio.value = false;
-        }
-        //把最后一个的值拿出来 用于判断用户是否选择了其他
-        for(let item of voteData.data){
-            //如果含有其他
-            if(item.is_other==1){
-                userIsChoice.value = item.id;
-            }
-        }
-        //用户投票属于哪一篇文章
-        userSurId.value = voteData.data[0].sur_id;
-
-    }else{
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:首页投票")
-        console.log("后端错误反馈:",voteData.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->") 
-    }
-}
-
-
-//3.2当用户选择了选项,判断是否展示其他输入框
-const handleRadioChange = (value) => {
-    if(value == userIsChoice.value){
-        showUserChoice.value = true;
-    }else{
-        showUserChoice.value = false;
-    }
-}
-
-const handleCheckboxChange = (value) => {
-    if (value.includes(userIsChoice.value)) {
-        showUserChoice.value = true;
-    } else {
-        showUserChoice.value = false;
-    }
-}
-
-//3.2发起投票
-async function addWebsiteSurvey(){
-    //判断当前是单选还是多选
-    console.log(isRadio.value)
-    if(isRadio.value){
-        console.log("用户单选!")
-        if(radio1.value!=''){
-            //先判断一下是否使用了其他选项
-            if(showUserChoice.value){
-                if(userChoice.value!=''){
-                    //文章id
-                    // console.log(userSurId.value)
-                    // 用户输入的值
-                    // console.log(userChoice.value)
-                    //如果使用了其他,其他的选项需要增加进去
-                    const ChoiceData = await requestHome('/web/addWebsiteSurveyOption',{
-                        method:'GET',
-                        query:{
-                            'sur_id':userSurId.value,//投票的新闻id
-                            'choice_name':userChoice.value,//投票的选项id
-                        }
-                    });
-                    if(ChoiceData.code == 200){
-                        //提交完其他选项以后,再正式发起投票
-                        const mkData = await requestHome('/web/addWebsiteSurveyVote',{
-                            method:'GET',
-                            query:{
-                                'sur_id':userSurId.value,
-                                'choice_id':ChoiceData.data
-                            }
-                        });
-                        if(mkData.code == 200){
-                            ElMessage.success('投票成功!')
-                            //把投票结果显示到页面上 禁用投票按钮
-                            isDisabled.value = true;
-                            websiteSurveyData.value = mkData.data;
-                            //遍历一下,把用户选中的那个设置status为1
-                            let data = mkData.data;
-                            //遍历一下,把用户选中的那个设置status为1
-                            for(let item of data.data){
-                                for(let i of data.choice){
-                                    if(item.id == i){
-                                        console.log(item.id)
-                                        item.status = 1;
-                                    }
-                                }
-                            }
-                            websiteSurveyData.value = data;
-                        }else{
-                            ElMessage.error(mkData.message)
-                        }
-                    }else{
-                        ElMessage.error('其他投票失败!')
-                    }
-                }else{
-                    ElMessage.error('请输入选项内容!')
-                }
-            }else{
-                //如果没选择其他,直接提交选择的内容
-                const mkData = await requestHome('/web/addWebsiteSurveyVote',{
-                    method:'GET',
-                    query:{
-                        'sur_id':userSurId.value,
-                        'choice_id':radio1.value
-                    }
-                });
-                if(mkData.code == 200){
-                    ElMessage.success('投票成功!')
-                    //把投票结果显示到页面上 禁用投票按钮
-                    isDisabled.value = true;
-                    let data = mkData.data;
-                    //遍历一下,把用户选中的那个设置status为1
-                    for(let item of data.data){
-                        for(let i of data.choice){
-                            if(item.id == i){
-                                item.status = 1;
-                            }
-                        }
-                    }
-                    websiteSurveyData.value = data;
-                }else{
-                    ElMessage.error('投票失败!')
-                }
-            }
-        }else{
-            ElMessage.error('请选择一个选项')
-        }
-    }else{
-        console.log("多选!")
-        //多选
-        if(check1.value!=[]){
-             //先判断一下是否使用了其他选项
-            if(showUserChoice.value){
-                if(userChoice.value!=''){
-                    //判断用户是否只选择了一个其他
-                    if(check1.value.length == 1){
-                        const ChoiceData = await requestDataPromise('/web/addWebsiteSurveyOption',{
-                            method:'GET',
-                            query:{
-                                'sur_id':userSurId.value,//投票的新闻id
-                                'choice_name':userChoice.value,//用户输入的其他选项文字
-                            }
-                        });
-                        if(ChoiceData.code == 200){
-                            //提交完其他选项以后,再正式发起投票
-                            const mkData = await requestDataPromise('/web/addWebsiteSurveyVote',{
-                                method:'GET',
-                                query:{
-                                    'sur_id':userSurId.value,
-                                    'choice_id':ChoiceData.data
-                                }
-                            });
-                            if(mkData.code == 200){
-                                ElMessage.success('投票成功!')
-                                //把投票结果显示到页面上 禁用投票按钮
-                                isDisabled.value = true;
-                                websiteSurveyData.value = mkData.data;
-                                //遍历一下,把用户选中的那个设置status为1
-                                let data = mkData.data;
-                                //遍历一下,把用户选中的那个设置status为1
-                                for(let item of data.data){
-                                    for(let i of data.choice){
-                                        if(item.id == i){
-                                            console.log(item.id)
-                                            item.status = 1;
-                                        }
-                                    }
-                                }
-                                websiteSurveyData.value = data;
-                            }else{
-                                ElMessage.error(mkData.message)
-                            }
-                        }else{
-                            ElMessage.error('其他投票失败!')
-                        }
-
-                    }else{
-                        //用户选择了除了其他以外,还包括别的选项
-                        const ChoiceData = await requestDataPromise('/web/addWebsiteSurveyOption',{
-                            method:'GET',
-                            query:{
-                                'sur_id':userSurId.value,//投票的新闻id
-                                'choice_name':userChoice.value,//用户输入的其他选项文字
-                            }
-                        });
-                        if(ChoiceData.code == 200){
-                            let data = check1.value;
-                            //找到多选的数组,把其他默认值给替换掉
-                            for (let i = 0; i < data.length; i++) {
-                                if (data[i] == userIsChoice.value) {
-                                    data[i] = ChoiceData.data;
-                                }
-                            }
-                            let jsonArray = JSON.stringify(data);
-                            //提交完其他选项以后,再正式发起投票
-                            const mkData = await requestDataPromise('/web/addWebsiteSurveyVote',{
-                                method:'GET',
-                                query:{
-                                    'sur_id':userSurId.value,
-                                    'choice_id':jsonArray
-                                }
-                            });
-                            
-                            if(mkData.code == 200){
-                                ElMessage.success('投票成功!')
-                                //把投票结果显示到页面上 禁用投票按钮
-                                isDisabled.value = true;
-                                websiteSurveyData.value = mkData.data;
-                                //遍历一下,把用户选中的那个设置status为1
-                                let data = mkData.data;
-                                //遍历一下,把用户选中的那个设置status为1
-                                for(let item of data.data){
-                                    for(let i of data.choice){
-                                        if(item.id == i){
-                                            //console.log(item.id)
-                                            item.status = 1;
-                                        }
-                                    }
-                                }
-                                websiteSurveyData.value = data;
-                            }else{
-                                ElMessage.error(mkData.message)
-                            }
-                        }else{
-                            ElMessage.error('其他投票失败!')
-                        }
-
-                    }
-                }else{
-                    ElMessage.error('请输入选项内容!')
-                }
-            }else{
-                let jsonArray = JSON.stringify(check1.value);
-                //如果没选择其他,直接提交选择的内容
-                const mkData = await requestDataPromise('/web/addWebsiteSurveyVote',{
-                    method:'GET',
-                    query:{
-                        'sur_id':userSurId.value,
-                        'choice_id':jsonArray
-                    }
-                });
-                if(mkData.code == 200){
-                    ElMessage.success('投票成功!')
-                    //把投票结果显示到页面上 禁用投票按钮
-                    isDisabled.value = true;
-                    websiteSurveyData.value = mkData.data;
-                    //遍历一下,把用户选中的那个设置status为1
-                    let data = mkData.data;
-                    //遍历一下,把用户选中的那个设置status为1
-                    for(let item of data.data){
-                        for(let i of data.choice){
-                            if(item.id == i){
-                                console.log(item.id)
-                                item.status = 1;
-                            }
-                        }
-                    }
-                    websiteSurveyData.value = data;
-                }else{
-                    ElMessage.error('投票失败!')
-                }
-            }
-        }else{
-            ElMessage.error('请选择一个选项')
-        }
-    }
-}
-//4.投票 end---------------------------------------->
-
-//5.页面图片放大 start---------------------------------------->
-const previewVisible = ref(false)
-const selectedImage = ref(' ')
-
-const openPreview = (event) => {
-    if (event.target.tagName === 'IMG') {
-        selectedImage.value = event.target.src;
-        previewVisible.value = true;
-    }
-}
-const closePreview = () => {
-    previewVisible.value = false;
-}
-//5.页面图片放大 end---------------------------------------->
-</script>
-
-<style lang="less" scoped>
-@import url('@/assets/css/detail.less');
-</style>
+//1.获得路由id end ---------------------------------------->
+</script>

+ 18 - 315
pages/[dir]/[dir]/list-[id].vue

@@ -1,329 +1,32 @@
 <template>
-    <div id="newsList">
-        <!-- 页面头部 -->
-        <HomePageHead></HomePageHead>
-
-        <!-- 导航栏 -->
-        <HomePageNavigation1></HomePageNavigation1>
-
-        <!-- 列表页广告一 -->
-        <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
-
-        <!-- 二级标题-->
-        <div class="sannongzhichuang" v-if="parent_name != ''">
-            <div class="inner">
-                <h2>
-                    <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
-                    <em class="iconfont icon-xingzhuang-zhijiaosanjiaoxing-copy"></em>
-                </h2>
-                <p class="introduction">
-                    <strong>频道介绍</strong>
-                    <div v-for="(item, index) in secondNav" :key="index">
-                        <span v-if="index <= 7">
-                            <NuxtLink :to="{ path: `/${targetRoute}/${item.aLIas_pinyin}/list-1.html`}">{{ item.alias }}</NuxtLink>
-                        </span>
-                        <b v-else></b>
-                    </div>
-                </p>
-            </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 v-if="parent_name !=''">
-                        <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
-                    </el-breadcrumb-item>
-                    <el-breadcrumb-item>{{ name }}</el-breadcrumb-item>
-                </el-breadcrumb>
-            </div>
-        </div>
-        <!-- 资讯列表 -->
-        <div class="newsList">
-            <div class="inner">
-                <div class="innerLeft">
-                    <ul class="list">
-                        <li v-for="(item, index) in newsList" :key="index">
-                            <NuxtLink :href="getLinkPathDetail(item)" :title="item.alias">
-                                {{ item.title }}
-                            </NuxtLink>
-                        </li>
-                    </ul>
-                    <!-- 分页器 -->
-                    <div class="pagination" v-if="total > 0">
-                        <el-pagination 
-                            size="small" 
-                            background 
-                            layout="prev, pager, next" 
-                            :total="total" 
-                            class="mt-4"
-                            :page-size="pageSize" 
-                            :current-page="pageNum"
-                            prev-text="上一页" 
-                            next-text="下一页" 
-                            @current-change="changePage" 
-                        />
-                    </div>
-                </div>
-                <div class="innerRight">
-                    <DetailHotNews></DetailHotNews>
-                    <DetailHotNews2></DetailHotNews2>
-                </div>
-            </div>
-        </div>
-
-        <!-- 列表页广告二 -->
-        <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
-
-        <!-- 页面底部 -->
-        <HomeFoot1></HomeFoot1>
-    </div>
+    <NewsList v-if="routeType == 1"></NewsList>
+    <GoodsList v-if="routeType == 2"></GoodsList>
 </template>
-
 <script setup>
-//1.页面必备依赖 start ---------------------------------------->
-import { ElBreadcrumb, ElBreadcrumbItem, ElPagination } from 'element-plus'
-import { ArrowRight } from '@element-plus/icons-vue'
+//0.加载页面依赖 start ---------------------------------------->
 import { ref, onMounted } from 'vue';
-//当前列表名称
-const name = ref('')
-const { $webUrl, $CwebUrl, $BwebUrl } = useNuxtApp()
-
-//格式化跳转路径
-const getLinkPathDetail = (item) => {
-    if (item.islink == 1) {
-        return `${item.linkurl}`;
-    } else {
-        //return `/${item.aLIas_pinyin}/${item.id}`;
-        //return `/newsDetail/${item.id}`
-        return `/${item.pinyin}/${item.id}.html`;
-    }
-}
-//1.页面必备依赖 end ---------------------------------------->
+import { ElMessage } from 'element-plus';
+//0.加载页面依赖 end ---------------------------------------->
 
 //1.获得路由id start ---------------------------------------->
-const route = useRoute();
-let articleId = 0;//路由id
-let pageNum = ref(2);
-let total = ref(1);
-let pageSize = ref(20);
-
-//获得当前的完整路径
-const fullPath = route.path;
-//拆分,取出来中间这一段,然后提取数字部分
-const segments = fullPath.split('/'); 
-const targetSegment = segments[2]; 
-const targetRoute = segments[1]; 
-
-//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//let routeId = 20 //排除路径错误可以打开这个
-//articleId = numberPart;
-
+const targetSegment = getRoutePath(1);
+const targetSegment1 = getRoutePath(2);
+//1.1 获得当前的路由id
+let routeId;
+let routeType;
 //通过导航路径反向查询导航id
 const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
     method: 'GET',
     query: {
-        'pinyin': targetSegment,
-    },
-});
-if(getRouteId.code == 200){
-    articleId = getRouteId.data.category_id
-}else{
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    console.log("错误位置:通过url路径查询导航池id")
-    console.log("后端错误反馈:",getRouteId.message)
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-}
-//获得html前的数字
-// const pageUrl = segments[3]; 
-// const pageNumber = pageUrl.split('.')[0];
-// console.log("当前URL中的页码:")
-// console.log(pageNumber)//2
-// pageNum.value = parseInt(pageNumber);
-pageNum.value = parseInt(route.params.id);
-
-//1.获得路由id end ---------------------------------------->
-
-//2.页面数据 start ---------------------------------------->
-//2.2新闻列表
-const newsList = ref([]);
-let newslists = async () => {
-    const listData = await requestDataPromise('/web/getWebsiteArticleList', {
-        method: 'GET',
-        query: {
-            'page': pageNum.value,
-            'pageSize': pageSize.value,
-            'catid': articleId
-        },
-    });
-    if (listData.code == 200) {
-        newsList.value = listData.data.rows;
-        total.value = listData.data.count;
-
-    } else {
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:获取新闻列表")
-        console.log("后端错误反馈:", listData.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    }
-}
-//获得列表
-newslists();
-
-//分页事件
-let changePage = (value) => {
-    console.log("当前页码", value);
-    navigateTo(`/${targetSegment}/${value}.html`)
-}
-
-//2.3获得页面名称
-let getPageName = async () => {
-    const pageName = await requestDataPromise('/web/getOneWebsiteCategory', {
-        method: 'GET',
-        query: {
-            'catid': articleId
-        },
-    });
-    if (pageName.code == 200) {
-        name.value = pageName.data.alias
-    } else {
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:设置页面标题")
-        console.log("后端错误反馈:", pageName.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    }
-}
-//获得列表
-getPageName();
-//2.页面数据 end ---------------------------------------->
-
-
-//3.二级栏目 start ---------------------------------------->
-//3.1通过id获取父栏目
-const parent_name = ref([]);
-const parent_id = ref([]);
-const parent_pinyin = ref("");
-let getParentNav = async () => {
-    const listData = await requestDataPromise('/web/getOneWebsiteCategory', {
-        method: 'GET',
-        query: {
-            'catid': articleId
-        },
-    });
-    if (listData.code == 200) {
-        console.log(111999)
-        console.log(listData.data);
-        parent_name.value = listData.data.parent_name;
-        parent_id.value = listData.data.parent_id;
-        parent_pinyin.value = listData.data.parent_pinyin;
-    } else {
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:获取新闻列表")
-        console.log("后端错误反馈:", listData.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    }
-    getSecondNav();
-}
-//获得父级栏目详情
-getParentNav();
-
-// 3.2获取二级栏目
-const secondNav = ref([]);
-let getSecondNav = async () => {
-    const listData = await requestDataPromise('/web/getWebsiteModelCategory', {
-        method: 'GET',
-        query: {
-            'placeid': 1,
-            'pid': parent_id.value,
-            'num': 8,
-        },
-    });
-    console.log('listData', listData);
-
-    if (listData.code == 200) {
-        secondNav.value = listData.data;
-    } else {
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置:获取新闻列表")
-        console.log("后端错误反馈:", listData.message)
-        console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    }
-}
-//3.二级栏目 end ---------------------------------------->
-
-//4.设置seo信息 start---------------------------------------->
-//4.1 设置seo信息
-const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
-    method: 'GET',
-    query: {
-        'catid': articleId
+        'pinyin': targetSegment1,
     },
 });
-
-if (setData.code == 200) {
-    let seoTitle = setData.data.seo_title;
-    let seoDescription = setData.data.seo_description;
-    let seoKeywords = setData.data.seo_keywords;
-    let seoSuffix = setData.data.suffix;
-    let seoName = setData.data.website_name;
-
-    useSeoMeta({
-        title: seoTitle + "_" + seoName + "_" + seoSuffix,
-        meta: [
-            { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
-            { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
-        ]
-    });
+if (getRouteId.code == 200) {
+    console.log('getRouteId', getRouteId.data);
+    routeId = getRouteId.data.category_id
+    routeType = getRouteId.data.type
 } else {
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-    console.log("错误位置:设置列表页面SEO数据")
-    console.log("后端错误反馈:", setData.message)
-    console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
+    console.log("获得路由id出错!", getRouteId.message)
 }
-//4.设置seo信息 end---------------------------------------->
-
-
-//5.广告 start---------------------------------------->
-let adImg1 = ref({});
-let adImg2 = ref({});
-
-onMounted(async ()  => {
-
-    //从客户端获取行政职能部门 加快打开速度
-    const { $webUrl, $CwebUrl } = useNuxtApp();
-    //广告1
-    let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_list_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=snzxw_list_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];
-
-})
-//5.广告 end---------------------------------------->
-</script>
-
-<style lang="less" scoped>
-@import url('@/assets/css/list.less');
-</style>
+//1.获得路由id end ---------------------------------------->
+</script>

+ 285 - 158
pages/[dir]/index.html.vue

@@ -2,7 +2,7 @@
     <div>
         <HomePageHead></HomePageHead>
         <HomePageNavigation></HomePageNavigation>
-        <HomeSecondaryHeading :titleData="pageData" :pinyinid="routeId"></HomeSecondaryHeading>
+        <HomeSecondaryHeading :titleData="allData" :pinyinid="routeId"></HomeSecondaryHeading>
 
         <div class="farmingPartOne">
             <div class="inner">
@@ -178,6 +178,38 @@
                         </li>
                     </ul>
                 </div>
+                <div class="farmer" v-if="goodsData.length >= 1">
+                    <div class="title">
+                        <h3>
+                            <NuxtLink :href="getLinkPath(goodsData[0])" v-if="goodsData[0]" :title="goodsData[0].alias">
+                                {{ goodsData[0].alias }}
+                            </NuxtLink>
+                            <span>
+                                <NuxtLink :href="getLinkPath(goodsData[0])" v-if="goodsData[0]"
+                                    :title="goodsData[0].alias">
+                                    查看更多
+                                </NuxtLink>
+                            </span>
+                        </h3>
+                    </div>
+                    <div class="PartTwoPhoto">
+                        <div v-if="goodsData[0].data[0]">
+                            <NuxtLink :href="getLinkPathDetail(goodsData[0].data[0])"
+                                :title="goodsData[0].data[0].name">
+                                <img :src="goodsData[0].data[0].imgurl" :alt="goodsData[0].data[0].name">
+                                <span>{{ goodsData[0].data[0].name }}</span>
+                            </NuxtLink>
+                        </div>
+                    </div>
+                    <ul class="PartTwoList">
+                        <li v-for="item in goodsData[0].data2">
+                            <em></em>
+                            <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
+                                {{ item.name }}
+                            </NuxtLink>
+                        </li>
+                    </ul>
+                </div>
             </div>
         </div>
         <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
@@ -334,6 +366,159 @@
                 </div>
             </div>
         </div>
+        <div class="zixuntuijian" v-if="goodsData.length > 1">
+            <div class="inner">
+                <div class="innerLeft">
+                    <div class="zixunTop">
+                        <div class="zixunLeft" v-if="goodsData.length > 1">
+                            <div class="title">
+                                <h3>
+                                    <NuxtLink :href="getLinkPath(goodsData[1])" v-if="goodsData[1]"
+                                        :title="goodsData[1].alias">
+                                        {{ goodsData[1].alias }}
+                                    </NuxtLink>
+                                    <span>
+                                        <NuxtLink :href="getLinkPath(goodsData[1])" v-if="goodsData[1]"
+                                            :title="goodsData[1].name">
+                                            查看更多
+                                        </NuxtLink>
+                                    </span>
+                                </h3>
+                            </div>
+                            <ul class="photo_text">
+                                <li v-for="item in goodsData[1].data">
+                                    <article>
+                                        <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                            <img :src="item.imgurl" :alt="item.name">
+                                        </NuxtLink>
+                                        <div>
+                                            <h5>
+                                                <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                                    {{ item.name }}
+                                                </NuxtLink>
+                                            </h5>
+                                            <p>
+                                                <span>{{ item.author }}</span>
+                                                <span>{{ getTime(item.updated_at, 'month', 1) }}</span>
+                                            </p>
+                                        </div>
+                                    </article>
+                                </li>
+                                <li v-for="item in goodsData[1].data2">
+                                    <article>
+                                        <em></em>
+                                        <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                            {{ item.name }}
+                                        </NuxtLink>
+                                    </article>
+                                </li>
+                            </ul>
+                        </div>
+                        <div class="zixunRight" v-if="goodsData.length > 2">
+                            <div class="title">
+                                <h3>
+                                    <NuxtLink :href="getLinkPath(goodsData[2])" v-if="goodsData[2]"
+                                        :title="goodsData[2].alias">
+                                        {{ goodsData[2].alias }}
+                                    </NuxtLink>
+                                    <span>
+                                        <NuxtLink :href="getLinkPath(goodsData[2])" v-if="goodsData[2]"
+                                            :title="goodsData[2].title">
+                                            查看更多
+                                        </NuxtLink>
+                                    </span>
+                                </h3>
+                            </div>
+                            <div class="towPic">
+                                <div v-for="item in goodsData[2].data" class="picBox">
+                                    <div>
+                                        <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                            <img :src="item.imgurl" :alt="item.name">
+                                        </NuxtLink>
+                                    </div>
+                                </div>
+                            </div>
+                            <ul class="photo_text">
+                                <li v-for="item in goodsData[2].data2">
+                                    <article>
+                                        <em></em>
+                                        <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                            {{ item.name }}
+                                        </NuxtLink>
+                                    </article>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                    <div class="zixunBottom" v-if="goodsData[1].data3">
+                        <NuxtLink :href="getLinkPathDetail(goodsData[1].data3[0])"
+                            v-if="goodsData[1].data3[0] && hoverStatus == 0">
+                            <img class="left" :src="goodsData[1].data3[0].imgurl" :alt="goodsData[1].data3[0].title">
+                        </NuxtLink>
+                        <NuxtLink :href="getLinkPathDetail(goodsData[1].data3[1])"
+                            v-if="goodsData[1].data3[1] && hoverStatus == 1">
+                            <img class="left" :src="goodsData[1].data3[1].imgurl" :alt="goodsData[1].data3[1].title">
+                        </NuxtLink>
+                        <NuxtLink :href="getLinkPathDetail(goodsData[1].data3[2])"
+                            v-if="goodsData[1].data3[2] && hoverStatus == 2">
+                            <img class="left" :src="goodsData[1].data3[2].imgurl" :alt="goodsData[1].data3[2].title">
+                        </NuxtLink>
+                        <NuxtLink :href="getLinkPathDetail(goodsData[1].data3[3])"
+                            v-if="goodsData[1].data3[3] && hoverStatus == 3">
+                            <img class="left" :src="goodsData[1].data3[3].imgurl" :alt="goodsData[1].data3[3].title">
+                        </NuxtLink>
+                        <NuxtLink :href="getLinkPathDetail(goodsData[1].data3[4])"
+                            v-if="goodsData[1].data3[4] && hoverStatus == 4">
+                            <img class="left" :src="goodsData[1].data3[4].imgurl" :alt="goodsData[1].data3[4].title">
+                        </NuxtLink>
+                        <NuxtLink :href="getLinkPathDetail(goodsData[1].data3[5])"
+                            v-if="goodsData[1].data3[5] && hoverStatus == 5">
+                            <img class="left" :src="goodsData[1].data3[5].imgurl" :alt="goodsData[1].data3[5].title">
+                        </NuxtLink>
+                        <ul class="leftList left">
+                            <li v-for="(item, index) in goodsData[1].data3" @mouseenter="qhPic(index)">
+                                <h4>
+                                    <em></em>
+                                    <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                        {{ item.name }}
+                                    </NuxtLink>
+                                </h4>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+                <div class="innerRight" v-if="goodsData.length > 3">
+                    <div class="title">
+                        <h3>
+                            <NuxtLink :href="getLinkPath(goodsData[3])" v-if="goodsData[3]" :title="goodsData[3].alias">
+                                {{ goodsData[3].alias }}
+                            </NuxtLink>
+                            <span>
+                                <NuxtLink :href="getLinkPath(goodsData[3])" v-if="goodsData[3]"
+                                    :title="goodsData[3].title">
+                                    查看更多
+                                </NuxtLink>
+                            </span>
+                        </h3>
+                    </div>
+                    <ul class="information">
+                        <li v-for="item in goodsData[3].data">
+                            <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                <img :src="item.imgurl" :alt="item.name">
+                            </NuxtLink>
+                            <div class="text">
+                                <h5>
+                                    <NuxtLink :href="getLinkPathDetail(item)" :title="item.name">
+                                        {{ item.name }}
+                                    </NuxtLink>
+                                </h5>
+                                <p>{{ item.author }}</p>
+                            </div>
+                        </li>
+                    </ul>
+                </div>
+            </div>
+        </div>
         <HomeTopTen :imgurl="adImg3" v-if="adImg3"></HomeTopTen>
         <!-- 十强称号logo -->
         <HomeTopTen :imgurl="adImg4" v-if="adImg4"></HomeTopTen>
@@ -485,27 +670,10 @@ const pageData = ref([
     // { id: 8, data: [], title: "", cid: "" },
     // { id: 9, data: [], title: "", cid: "" },
     // { id: 10, data: [], title: "", cid: "" },
-    // { id: 10, data: [], title: "", cid: "" },
-    // {
-    //     id: 11,
-    //     title: "",
-    //     data: [],
-    //     data1: [],
-    //     data2: [],
-    //     data3: [],
-    //     data4: [],
-    //     category_id1: "",
-    //     category_id2: "",
-    //     category_id3: "",
-    //     category_id4: "",
-    //     title1: "",
-    //     title2: "",
-    //     title3: "",
-    //     title4: "",
-    //     cid: ""
-    // },
-    // { id: 12, data1: [], data2: [], data3: [], cid: "" },
 ])
+// 商品
+const goodsData = ref([]);
+const allData = ref([])
 
 const navSize = ref("");
 
@@ -519,7 +687,7 @@ try {
             'num': 8
         },
     });
-    console.log('11111111111111',navigateData)
+    // console.log('navigateData1111111', navigateData)
     if (navigateData.code == 200) {
         // 遍历可用的导航池放到页面中
         for (let index in navigateData.data) {
@@ -546,29 +714,63 @@ try {
             if (navigateData.data[index].is_url == 1) {
                 // 处理 URL 的逻辑
             } else {
+                if (navigateData.data[index].type == 2) {
+                    goodsData.value.push(data);
+                } else if (navigateData.data[index].type == 1) {
+                    pageData.value.push(data);
+                }
                 //每个页面最多8个模块
-                pageData.value.push(data);
+                allData.value.push(data);
             }
         }
+        // console.log("导航池11111pageData", pageData.value);
+        // console.log("导航池11111goods", goodsData.value);
+
+        let goodsJson = []
+        for (let i = 0; i < goodsData.value.length; i++) {
+            if (i == 0) {
+                goodsJson.push({ "catid": goodsData.value[0].cid + ",0,7" });
+            } else if (i == 1) {
+                goodsJson.push({ "catid": goodsData.value[1].cid + ",0,10" });
+            } else if (i == 2) {
+                goodsJson.push({ "catid": goodsData.value[2].cid + ",0,5" });
+            } else if (i == 3) {
+                goodsJson.push({ "catid": goodsData.value[3].cid + ",0,4" });
+            }
+        }
+        let goodsJsonString = JSON.stringify(goodsJson);
+        getPageGoodsAllData(goodsJsonString);
+
         //导航池加载完毕,开始申请模块数据
-        // await getPageData1();
-        // await getPageData2();
-        // await getPageData3();
-        // await getPageData4();
-        // await getPageData5();
-        // await getPageData6();
-        // await getPageData7();
-        // await getPageData8();
         let getJson = [
-            { "parent": routeId + ",0,0", "child": pageData.value[0].cid + ",5,8" },//模块1理论前沿
-            { "parent": routeId + ",0,0", "child": pageData.value[1].cid + ",5,0" },//模块2典型经验
-            { "parent": routeId + ",0,0", "child": pageData.value[2].cid + ",1,6" },//模块3农业天地
-            { "parent": routeId + ",0,0", "child": pageData.value[3].cid + ",1,6" },//模块4美丽乡村
-            { "parent": routeId + ",0,0", "child": pageData.value[4].cid + ",1,6" },//模块5农民之家
-            { "parent": routeId + ",0,0", "child": pageData.value[5].cid + ",6,3" },//模块6农业天地
-            { "parent": routeId + ",0,0", "child": pageData.value[6].cid + ",2,3" },//模块7农村建设
-            { "parent": routeId + ",0,0", "child": pageData.value[7].cid + ",4,0" },//模块8高端资讯
+            // { "parent": routeId + ",0,0", "child": pageData.value[0].cid + ",5,8" },//模块1理论前沿
+            // { "parent": routeId + ",0,0", "child": pageData.value[1].cid + ",5,0" },//模块2典型经验
+            // { "parent": routeId + ",0,0", "child": pageData.value[2].cid + ",1,6" },//模块3农业天地
+            // { "parent": routeId + ",0,0", "child": pageData.value[3].cid + ",1,6" },//模块4美丽乡村
+            // { "parent": routeId + ",0,0", "child": pageData.value[4].cid + ",1,6" },//模块5农民之家
+            // { "parent": routeId + ",0,0", "child": pageData.value[5].cid + ",6,3" },//模块6农业天地
+            // { "parent": routeId + ",0,0", "child": pageData.value[6].cid + ",2,3" },//模块7农村建设
+            // { "parent": routeId + ",0,0", "child": pageData.value[7].cid + ",4,0" },//模块8高端资讯
         ]
+        for (let i = 0; i < pageData.value.length; i++) {
+            if (i == 0) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[0].cid + ",5,8" });//模块1理论前沿
+            } else if (i == 1) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[1].cid + ",5,0" });//模块2典型经验
+            } else if (i == 2) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[2].cid + ",1,6" });//模块3农业天地
+            } else if (i == 3) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[3].cid + ",4,0" });//模块4美丽乡村
+            } else if (i == 4) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[4].cid + ",1,6" });//模块5农民之家
+            } else if (i == 5) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[5].cid + ",6,3" });//模块6农业天地
+            } else if (i == 6) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[6].cid + ",2,3" });//模块7农村建设
+            } else if (i == 7) {
+                getJson.push({ "parent": routeId + ",0,0", "child": pageData.value[7].cid + ",4,0" });//模块8高端资讯
+            }
+        }
 
         let jsonString = JSON.stringify(getJson);
         getPageAllData(jsonString);
@@ -586,7 +788,50 @@ try {
     console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
 }
 
+// 获取商品数据 start--------------------------------------->
+async function getPageGoodsAllData(goodsJsonString) {
+    const mkdata = await requestDataPromise('/web/getWebsiteCatidshop', {
+        method: 'GET',
+        query: {
+            'catid': goodsJsonString
+        },
+    });
+    // console.log("获取商品数据", mkdata);
+    if (mkdata.code == 200) {
+        //模块1
+        for (let index in mkdata.data[0]) {
+            if (index < 1) {
+                goodsData.value[0].data.push(mkdata.data[0][index]);
+            } else {
+                goodsData.value[0].data2.push(mkdata.data[0][index]);
+            }
+        }
+        //模块3
+        for (let index in mkdata.data[1]) {
+            if (index < 1) {
+                goodsData.value[1].data.push(mkdata.data[1][index]);
+            } else if (index < 4) {
+                goodsData.value[1].data2.push(mkdata.data[1][index]);
+            } else {
+                goodsData.value[1].data3.push(mkdata.data[1][index]);
+            }
+        }
+        // 模块3
+        for (let index in mkdata.data[2]) {
+            if (index < 2) {
+                goodsData.value[2].data.push(mkdata.data[2][index]);
+            } else {
+                goodsData.value[2].data2.push(mkdata.data[2][index]);
+            }
+        }
+        // 模块4
+        goodsData.value[3].data = mkdata.data[3];
+
+    }
+}
+// 获取商品数据 end----------------------------------------->
 
+// 获取资讯数据 start----------------------------------------->
 async function getPageAllData(jsonString) {
     const mkdata = await requestDataPromise('/web/getWebsiteAllArticle', {
         method: 'GET',
@@ -647,125 +892,7 @@ async function getPageAllData(jsonString) {
         ElMessage.error(mkdata.message)
     }
 }
-
-
-//获得模块数据
-// async function getPageData(catid,img_num,text_num,modulesNum,childNavNum,childImgNum,childTextNum){
-//     const mkdata =  await requestDataPromise('/web/getWebsiteCatidArticle', {
-//         method: 'GET',
-//         query: {
-//             'catid': catid, //catid
-//             'img_num': img_num, //图片数量
-//             'text_num': text_num, //文字数量
-//             'child_catnum':childNavNum,//子级栏目菜单数量
-//             'child_imgnum':childImgNum,//子栏目展示图片新闻数量
-//             'child_textnum':childTextNum//子栏目展示文字新闻数量
-//         },
-//     });
-//     if(modulesNum == 1){
-//         if(mkdata.data.img.length > 0){
-//             pageData.value[0].data.push(mkdata.data.img[0]);
-//         }
-//         if(mkdata.data.img.length > 1){
-//             pageData.value[0].data2.push(mkdata.data.img[1]);
-//         }
-//         if(mkdata.data.img.length > 2){
-//             pageData.value[0].data2.push(mkdata.data.img[2]);
-//         }
-//         if(mkdata.data.img.length > 3){
-//             pageData.value[0].data2.push(mkdata.data.img[3]);
-//         }
-//         if(mkdata.data.img.length > 4){
-//             pageData.value[0].data2.push(mkdata.data.img[4]);
-//         }
-//         // pageData.value[0].data.push(mkdata.data.img[0]);
-//         // pageData.value[0].data2.push(mkdata.data.img[1]);
-//         // pageData.value[0].data2.push(mkdata.data.img[2]);
-//         // pageData.value[0].data2.push(mkdata.data.img[3]);
-//         // pageData.value[0].data2.push(mkdata.data.img[4]);
-//         pageData.value[0].data3 = mkdata.data.text;
-//     }
-//     if(modulesNum == 2){
-//         pageData.value[1].data = mkdata.data.img;
-//     }
-//     if(modulesNum == 3){
-//         pageData.value[2].data = mkdata.data.img;
-//         pageData.value[2].data2 = mkdata.data.text;
-//     }
-//     if(modulesNum == 4){
-//         pageData.value[3].data = mkdata.data.img;
-//         pageData.value[3].data2 = mkdata.data.text;
-//     }
-//     if(modulesNum == 5){
-//         pageData.value[4].data = mkdata.data.img;
-//         pageData.value[4].data2 = mkdata.data.text;
-//     }
-//     if(modulesNum == 6){
-//         if(mkdata.data.img.length > 0){
-//             pageData.value[5].data.push(mkdata.data.img[0]);
-//         }
-//         pageData.value[5].data2 = mkdata.data.text;
-//         if(mkdata.data.img.length > 1){
-//             pageData.value[7].data.push(mkdata.data.img[1]);
-//         }
-//         if(mkdata.data.img.length > 2){
-//             pageData.value[7].data.push(mkdata.data.img[2]);
-//         }
-//         if(mkdata.data.img.length > 3){
-//             pageData.value[7].data.push(mkdata.data.img[3]);
-//         }
-//         if(mkdata.data.img.length > 4){
-//             pageData.value[7].data.push(mkdata.data.img[4]);
-//         }
-//         if(mkdata.data.img.length > 5){
-//             pageData.value[7].data.push(mkdata.data.img[5]);
-//         }
-//     }
-//     if(modulesNum == 7){
-//         pageData.value[6].data = mkdata.data.img;
-//         pageData.value[6].data2 = mkdata.data.text;
-//     }
-//     //模块8 向后移动一个位置
-//     if(modulesNum == 8){
-//         pageData.value[7].data2 = mkdata.data.img;
-//     }
-// }
-//新农村
-//模块1 理论前沿
-// async function getPageData1() {
-//     await getPageData(pageData.value[0].cid,5,8,1,0,0,0);
-// }
-// //模块2 典型经验
-// async function getPageData2() {
-//     await getPageData(pageData.value[1].cid,5,0,2,0,0,0);
-// }
-// //模块3 农业天地
-// async function getPageData3() {
-//     await getPageData(pageData.value[2].cid,1,6,3,0,0,0);
-// }
-// //模块4 美丽乡村
-// async function getPageData4() {
-//     await getPageData(pageData.value[3].cid,1,6,4,0,0,0);
-// }
-// //模块5 农民之家
-// async function getPageData5() {
-//     await getPageData(pageData.value[4].cid,1,6,5,0,0,0);
-// }
-// //模块6 农业天地
-// async function getPageData6() {
-//     await getPageData(pageData.value[5].cid,6,3,6,0,0,0);
-// }
-// //模块7 农村建设
-// async function getPageData7() {
-//     await getPageData(pageData.value[6].cid,2,3,7,0,0,0);
-// }
-// //模块8 高端资讯
-// async function getPageData8() {
-//     await getPageData(pageData.value[7].cid,4,0,8,0,0,0);
-// }
-// 注意,为了保持模块的数量,当前固定为8个
-// 所以这里的农业天地,合并了原来是下面的7号模块
-// 而原本是7号模块的地方现在变成了8号模块
+// 获取资讯数据 end----------------------------------------->
 
 //3.渲染页面数据 end ---------------------------------------->
 

+ 2 - 2
plugins/request.js

@@ -6,8 +6,8 @@ export default defineNuxtPlugin(nuxtApp => {
 
     let Url = {
         //正式环境
-        // webUrl: 'https://flzxw.bjzxtw.org.cn', //接口地址
-        // CwebUrl: 'nw.bjzxtw.org.cn' //页面地址
+        webUrl: 'https://flzxw.bjzxtw.org.cn', //接口地址
+        CwebUrl: 'nw.bjzxtw.org.cn' //页面地址
         //pre环境
         // webUrl: 'http://apipre1.bjzxtw.org.cn:29501', //pre接口地址
         // CwebUrl: 'nwpre.bjzxtw.org.cn' //页面地址

BIN
public/image/01.png


BIN
public/topic/empty.png


Some files were not shown because too many files changed in this diff