动态路由终

动态路由终

.nuxt/manifest/latest.json

@@ -1 +1 @@
-{"id":"dev","timestamp":1743483804980}
+{"id":"dev","timestamp":1743489681957}

.nuxt/manifest/meta/dev.json

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

.nuxt/nitro.json

@@ -1,5 +1,5 @@
 {
-  "date": "2025-04-01T05:03:33.085Z",
+  "date": "2025-04-01T06:41:24.653Z",
   "preset": "nitro-dev",
   "framework": {
     "name": "nuxt",
@@ -9,9 +9,9 @@
     "nitro": "2.10.4"
   },
   "dev": {
-    "pid": 11552,
+    "pid": 11368,
     "workerAddress": {
-      "socketPath": "\\\\.\\pipe\\nitro\\worker-11552-1.sock"
+      "socketPath": "\\\\.\\pipe\\nitro\\worker-11368-1.sock"
     }
   }
 }

components/home/SecondaryHeading.vue

@@ -19,27 +19,13 @@
 </template>
 
 <script setup>
-//设置组件数据 start---------------------------------------->
+//1.设置组件数据 start---------------------------------------->
 //子导航
 const props = defineProps({
-    titleData:Array
+    titleData:Array,
+    pinyinid:Number
 });
-//设置组件数据 end---------------------------------------->
-
-
-//1.获得路由id start ---------------------------------------->
-const route = useRoute();
-
-//获得当前的完整路径
-const fullPath = route.path;
-//拆分，取出来中间这一段，然后提取数字部分
-const segments = fullPath.split('/'); 
-const targetSegment = segments[1]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
-//let routeId = 11 //排除路径错误可以打开这个
-let routeId = numberPart;
-//1.获得路由id end ---------------------------------------->
+//1.设置组件数据 end---------------------------------------->
 
 //2.设置组件标题 start ---------------------------------------->
 const title = ref("")
@@ -48,7 +34,7 @@ async function getPageData() {
     const mkdata =  await requestDataPromise('/web/getOneWebsiteCategory', {
         method: 'GET',
         query: {
-            'catid': routeId,
+            'catid': props.pinyinid,
         },
     });
     if(mkdata.code == 200){

middleware/auth.js

@@ -1,7 +1,3 @@
-// middleware/auth.js
 export default defineNuxtRouteMiddleware(async (to) => {
-  //局部中间件 使用此方法你必须在页面中调用
-  // definePageMeta({
-  //   middleware: 'auth'
-  // })
+
 });

middleware/setup.global.js

@@ -1,48 +0,0 @@
-export default defineNuxtRouteMiddleware(async (to, from) => {
-  // const router = useRouter()
-  // const responseRoute = await $fetch('http://apipre1.bjzxtw.org.cn:29501/web/getWebsiteParentCategory', {
-  //   headers: {
-  //     'Content-Type': 'application/json',
-  //     'Userurl': 'http://apipre1.bjzxtw.org.cn:29501',
-  //     'Origin': 'http://apipre1.bjzxtw.org.cn:29501'
-  //   }
-  // })
-  
-  // //添加所有分类页路由
-  // for(let index in responseRoute.data.parent){
-  //   if(responseRoute.data.parent[index].path!=undefined){
-      
-  //     router.addRoute({
-  //       path: responseRoute.data.parent[index].path,
-  //       component: () => import('~/pages/primaryNavigation/[id].vue'),
-  //       meta: {
-  //         isAlias: true,
-  //         routeId: responseRoute.data.parent[index].cid,
-  //         routeName: responseRoute.data.parent[index].name
-  //       }
-  //     })
-
-  //   }
-  // }
-  // //添加所有列表路由
-  // for(let index in responseRoute.data.child){
-  //   if(responseRoute.data.child[index].path!=undefined){
-      
-  //     router.addRoute({
-  //       path: responseRoute.data.child[index].path,
-  //       component: () => import('~/pages/newsList/[id].vue'),
-  //       meta: {
-  //         isAlias: true,
-  //         routeId: responseRoute.data.child[index].cid,
-  //         routeName: responseRoute.data.child[index].name
-  //       }
-  //     })
-
-  //   }
-  // }
-
-
-  // console.log('进入路由中间件，目标路由：', to.path, "当前路由:", from.path);
-
-})
-

pages/[dir]/[dir]/[id].vue

@@ -118,10 +118,25 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[2]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
+//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
 //let routeId = 20 //排除路径错误可以打开这个
-articleId = numberPart;
+//articleId = numberPart;
+
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    articleId = getRouteId.data
+}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];
@@ -198,6 +213,7 @@ let getParentNav = async () => {
         },
     });
     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;
@@ -208,6 +224,7 @@ let getParentNav = async () => {
         console.log("后端错误反馈：", listData.message)
         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
     }
+    getSecondNav();
 }
 //获得父级栏目详情
 getParentNav();

pages/[dir]/[dir]/a/[id].vue

@@ -14,7 +14,9 @@
                     <NuxtLink to="/">首页</NuxtLink>
                 </el-breadcrumb-item>
                 <el-breadcrumb-item v-if="parent_name != ''">
-                    <NuxtLink :to="`/${parent_pinyin}/`"> {{ parent_name }}</NuxtLink>
+                    <NuxtLink :to="`/${parent_pinyin}/`"> 
+                        {{ parent_name }}
+                    </NuxtLink>
                 </el-breadcrumb-item>
                 <el-breadcrumb-item>{{ routeNewsTtitle }}</el-breadcrumb-item>
             </el-breadcrumb>
@@ -157,9 +159,27 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[1]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-const routeId = numberPart;
+// 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
+}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("");
@@ -174,11 +194,11 @@ let getParentNav = async () => {
     if (listData.code == 200) {
         parent_name.value = listData.data.alias;
         parent_id.value = listData.data.parent_id;
-        parent_pinyin.value = listData.data.parent_pinyin;
+        parent_pinyin.value = listData.data.aLIas_pinyin;
 
     } else {
         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置：获取新闻列表")
+        console.log("错误位置：获取面包屑导航")
         console.log("后端错误反馈：", listData.message)
         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
     }

pages/[dir]/[id].vue

@@ -118,10 +118,25 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[1]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
+//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
+}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[2]; 
 const pageNumber = pageUrl.split('.')[0];

pages/[dir]/a/[id].vue

@@ -152,17 +152,31 @@ const route = useRoute();
 //获得详情id
 const articleId = parseInt(route.params.id); //获得该页面的id
 
-
-//获得路由
 //获得当前的完整路径
 const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[1]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
-//let routeId = 20 //排除路径错误可以打开这个
-const routeId = numberPart;
+// const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+// let routeId = 20 //排除路径错误可以打开这个
+// const routeId = numberPart;
+let routeId;
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    routeId = getRouteId.data
+}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 ---------->")
+}
+
 
 //1.2 获得父级栏目的名称、id
 const parent_name = ref([]);
@@ -181,10 +195,10 @@ let getParentNav = async () => {
         console.log(listData.data);
         parent_name.value = listData.data.alias;
         parent_id.value = listData.data.parent_id;
-        parent_pinyin.value = listData.data.parent_pinyin;
+        parent_pinyin.value = listData.data.aLIas_pinyin;
     } else {
         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
-        console.log("错误位置：获取新闻列表")
+        console.log("错误位置：获取面包屑导航")
         console.log("后端错误反馈：", listData.message)
         console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
     }

pages/[dir]/index.vue

@@ -2,7 +2,7 @@
     <div>
         <HomePageHead></HomePageHead>
         <HomePageNavigation></HomePageNavigation>
-        <HomeSecondaryHeading :titleData="pageData"></HomeSecondaryHeading>
+        <HomeSecondaryHeading :titleData="pageData" :pinyinid="routeId"></HomeSecondaryHeading>
         
         <div class="farmingPartOne">
             <div class="inner">
@@ -324,6 +324,7 @@
 <script setup>
 //0.加载页面依赖 start ---------------------------------------->
 import { ref, onMounted } from 'vue';
+import { ElMessage } from 'element-plus';
 
 //格式化跳转路径 - 标题
 //首页分类栏目标题，不需要考虑外链
@@ -352,10 +353,25 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[1]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
 //let routeId = 11 //排除路径错误可以打开这个
-let routeId = numberPart;
+//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+//let routeId = numberPart;
+let routeId;
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'pinyin': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    routeId = getRouteId.data
+}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 ---------->")
+}
 //1.获得路由id end ---------------------------------------->
 
 //2.页面交互效果 start ---------------------------------------->

pages/about/[dir]/[id].vue

@@ -83,10 +83,26 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[2]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
-//let routeId = 11 //排除路径错误可以打开这个
-const pageId = numberPart;//左侧菜单选中哪个
+//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+
+let articleId;
+let pageId;
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'foot_pinyin ': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    articleId = getRouteId.data;
+    pageId = getRouteId.data;
+}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 ---------->")
+}
 
 //1.页面依赖 end ---------------------------------------->
 

pages/about/[dir]/index.vue

@@ -70,12 +70,26 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[2]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
-//let routeId = 11 //排除路径错误可以打开这个
-let articleId = numberPart;
-const pageId = numberPart;//左侧菜单选中哪个
-// const routeHref = route.href;
+//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+
+let articleId;
+let pageId;
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'foot_pinyin ': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    articleId = getRouteId.data;
+    pageId = getRouteId.data;
+}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 ---------->")
+}
 
 //1.页面依赖 end ---------------------------------------->
 

pages/about/[dir]/zhaopin/[id].vue

@@ -70,12 +70,26 @@ const fullPath = route.path;
 //拆分，取出来中间这一段，然后提取数字部分
 const segments = fullPath.split('/'); 
 const targetSegment = segments[2]; 
-const numberPart = targetSegment.match(/\d+$/)?.[0]; 
-//路由id
-//let routeId = 11 //排除路径错误可以打开这个
-let articleId = numberPart;
-const pageId = numberPart;//左侧菜单选中哪个
-// const routeHref = route.href;
+//const numberPart = targetSegment.match(/\d+$/)?.[0]; 
+
+let articleId;
+let pageId;
+//通过导航路径反向查询导航id
+const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
+    method: 'GET',
+    query: {
+        'foot_pinyin ': targetSegment,
+    },
+});
+if(getRouteId.code == 200){
+    articleId = getRouteId.data;
+    pageId = getRouteId.data;
+}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 ---------->")
+}
 
 //1.页面依赖 end ---------------------------------------->
 

pages/search/[id].vue

@@ -32,7 +32,7 @@
                             <NuxtLink :to="item.linkurl" v-show="item.islink == 1" :title="item.title">{{ item.title }}
                             </NuxtLink>
                             <NuxtLink
-                                :to="{ path: `/newsDetail/${item.id}`, query: { listId: routeId, listName: routeName } }"
+                                :to="{ path: `/${item.aLIas_pinyin}/${item.id}`, query: { listId: routeId, listName: routeName } }"
                                 v-if="item.islink == 0" :title="item.title">{{ item.title }}</NuxtLink>
                         </li>
                     </ul>
@@ -162,7 +162,7 @@ let goSearch = async () => {
     console.log(pageCatids)
     console.log(pageDepartment_id)
     
-    const listData =  await requestDataPromise('/web/selectWebsiteCategory', {
+    const listData =  await requestDataPromise('/web/getWebsiteArticleList', {
         method: 'GET',
         query: {
             'page': page.value,