解决路由问题

src/enums/pageEnum.ts

@@ -20,8 +20,8 @@ export enum EditEnum {
 
 export enum PageEnum {
   // 登录
-  BASE_LOGIN = '/ai',
-  BASE_LOGIN_NAME = 'ai',
+  BASE_LOGIN = '/chat',
+  BASE_LOGIN_NAME = 'chat',
 
   //重定向
   REDIRECT = '/redirect',
@@ -36,7 +36,7 @@ export enum PageEnum {
   RELOAD_NAME = 'Reload',
 
   // 首页
-  BASE_HOME = '/project',
+  BASE_HOME = '/chat',
   BASE_HOME_NAME = 'Project',
 
   // 我的项目

src/router/base.ts

@@ -1,35 +1,29 @@
 import { RouteRecordRaw } from 'vue-router'
-import type { AppRouteRecordRaw } from '@/router/types';
-import { ErrorPage404, ErrorPage403, ErrorPage500, Layout, RedirectHome, RedirectUnPublish } from '@/router/constant';
+import type { AppRouteRecordRaw } from '@/router/types'
+import { ErrorPage404, ErrorPage403, ErrorPage500, Layout, RedirectHome, RedirectUnPublish } from '@/router/constant'
 import { PageEnum } from '@/enums/pageEnum'
 import { GoReload } from '@/components/GoReload'
 
-
 export const LoginRoute: RouteRecordRaw = {
   path: PageEnum.BASE_LOGIN,
   name: PageEnum.BASE_LOGIN_NAME,
   component: () => import('@/views/AI/index.vue'),
   meta: {
-    title: 'AI',
+    title: 'AI'
   },
   children: [
-    {
-      path: '',
-      redirect: '/chat'
-    },
     {
       path: '/chat',
       name: 'chat',
-      component: () => import('@/views/AI/chat/index.vue'),
+      component: () => import('@/views/AI/chat/index.vue')
     },
     {
       path: '/board',
       name: 'board',
-      component: () => import('@/views/AI/board/index.vue'),
+      component: () => import('@/views/chart/index.vue')
     }
-   
   ]
-};
+}
 
 export const HttpErrorPage: RouteRecordRaw[] = [
   {
@@ -37,25 +31,25 @@ export const HttpErrorPage: RouteRecordRaw[] = [
     name: PageEnum.ERROR_PAGE_NAME_404,
     component: ErrorPage404,
     meta: {
-      title: PageEnum.ERROR_PAGE_NAME_404,
-    },
+      title: PageEnum.ERROR_PAGE_NAME_404
+    }
   },
   {
     path: '/error/403',
     name: PageEnum.ERROR_PAGE_NAME_403,
     component: ErrorPage403,
     meta: {
-      title: PageEnum.ERROR_PAGE_NAME_403,
-    },
+      title: PageEnum.ERROR_PAGE_NAME_403
+    }
   },
   {
     path: '/error/500',
     name: PageEnum.ERROR_PAGE_NAME_500,
     component: ErrorPage500,
     meta: {
-      title: PageEnum.ERROR_PAGE_NAME_500,
-    },
-  },
+      title: PageEnum.ERROR_PAGE_NAME_500
+    }
+  }
 ]
 
 export const ErrorPageRoute: AppRouteRecordRaw = {
@@ -64,17 +58,17 @@ export const ErrorPageRoute: AppRouteRecordRaw = {
   component: ErrorPage404,
   meta: {
     title: PageEnum.ERROR_PAGE_NAME_404,
-    hideBreadcrumb: true,
+    hideBreadcrumb: true
   }
-};
+}
 
 export const ReloadRoute: AppRouteRecordRaw = {
   path: PageEnum.RELOAD,
   name: PageEnum.RELOAD_NAME,
   component: GoReload,
   meta: {
-    title: PageEnum.RELOAD_NAME,
-  },
+    title: PageEnum.RELOAD_NAME
+  }
 }
 
 export const RedirectRoute: RouteRecordRaw[] = [
@@ -83,15 +77,15 @@ export const RedirectRoute: RouteRecordRaw[] = [
     name: PageEnum.REDIRECT_NAME,
     component: RedirectHome,
     meta: {
-      title: PageEnum.REDIRECT_NAME,
-    },
+      title: PageEnum.REDIRECT_NAME
+    }
   },
   {
     path: PageEnum.REDIRECT_UN_PUBLISH,
     name: PageEnum.REDIRECT_UN_PUBLISH_NAME,
     component: RedirectUnPublish,
     meta: {
-      title: PageEnum.REDIRECT_UN_PUBLISH_NAME,
-    },
-  },
+      title: PageEnum.REDIRECT_UN_PUBLISH_NAME
+    }
+  }
 ]

src/router/router-guards.ts

@@ -7,7 +7,8 @@ const routerAllowList = [
   // 登录
   PageEnum.BASE_LOGIN_NAME,
   // 预览
-  PreviewEnum.CHART_PREVIEW_NAME
+  PreviewEnum.CHART_PREVIEW_NAME,
+  'board'
 ]
 
 export function createRouterGuards(router: Router) {

src/views/AI/index.vue

@@ -3,12 +3,13 @@
     <div class="left-menu">
       <ai-logo></ai-logo>
       <div class="menu-list">
-        <router-link
+        <div
           class="menu-item flex-box"
-          active-class="active-link"
+          :class="getCurrentRoute(item.path) ? 'active-link' : ''"
           :to="item.path"
           v-for="(item, index) in menuList"
           :key="index"
+          @click="handlerPath(item.path)"
         >
           <n-icon size="20">
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
@@ -17,7 +18,7 @@
               />
             </svg> </n-icon
           >新建{{ item.name }}
-        </router-link>
+        </div>
       </div>
       <ai-history></ai-history>
     </div>
@@ -28,12 +29,27 @@
 </template>
 
 <script setup>
+import { useRoute,useRouter } from 'vue-router'
+
+
 import AiLogo from '../AI/components/logo/index.vue'
 import AiHistory from '../AI/components/history/index.vue'
+
+const router = useRouter()
+const route = useRoute()
+
 const menuList = [
   { name: '聊天', path: '/chat' },
   { name: '数据看板', path: '/board' }
 ]
+
+const getCurrentRoute = path => {
+  console.log(route.path, path, 'SSS')
+  return  route.path == path
+}
+const handlerPath = (path)=>{
+  router.push({path:path,query:{id:Date.now()}})
+}
 </script>
 
 <style lang="scss" scoped>
@@ -72,7 +88,7 @@ const menuList = [
   }
   .right-container {
     flex: 1;
-  
+
     overflow-x: auto;
   }
 }

src/views/chart/index.vue

@@ -70,8 +70,8 @@ const {
 
 <style lang="scss" scoped>
 @include go("chart") {
-  height: 100vh;
-  width: 100vw;
+  height: 100%;
+  width: 100%;
   overflow: hidden;
   @include background-image("background-image");
 }