k_online_ui/src/router/index.ts

import { createRouter, createWebHistory } from 'vue-router'
import { useUserStore } from '@/stores/modules/user'
import { useBreadCrumb } from '@/stores/modules/breadCrumb'

const router = createRouter({
  history: createWebHistory(`${import.meta.env.VITE_BASE_URL}`),
  routes: [
    {
      path: '/',
      name: 'Home',
      redirect: '/dashboard',
      component: () => import('../views/Layout'),
      children: [
        {
          path: '/dashboard',
          name: 'Dashboard',
          component: () => import('../views/Dashboard')
        },
        {
          path: '/booking',
          name: 'Booking',
          component: () => import('../views/Booking')
        },
        {
          path: '/report',
          name: 'Report Management',
          component: () => import('../views/Report')
        },
        {
          path: '/report/detail',
          name: 'Report Detail',
          component: () => import('../views/Report/src/components/ReportDetail'),
          meta: {
            activeMenu: '/report',
            breadName: 'Detail'
          }
        },
        {
          path: '/report/schedule',
          name: 'Report Schedule',
          component: () => import('../views/Report/src/components/ReportSchedule'),
          meta: {
            activeMenu: '/report',
            breadName: 'Schedule Configuration'
          }
        },
        {
          path: '/booking/detail',
          name: 'Booking Detail',
          component: () => import('../views/Booking/src/components/BookingDetail'),
          meta: {
            activeMenu: '/booking'
          }
        },
        {
          path: '/tracking',
          name: 'Tracking',
          component: () => import('../views/Tracking')
        },
        {
          path: '/tracking/detail',
          name: 'Tracking Detail',
          component: () => import('../views/Tracking/src/components/TrackingDetail'),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/tracking/download-attachment',
          name: 'Tracking Download Attachment',
          component: () => import('../views/Tracking/src/components/DownloadAttachment'),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/shipment/detail',
          name: 'Shipment Detail',
          component: () => import('../views/Tracking/src/components/TrackingDetail'),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/tracking/add-vgm',
          name: 'Add VGM',
          component: () =>
            import('../views/Tracking/src/components/TrackingTable/src/components/VGMView.vue'),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/public-tracking',
          name: 'Public Tracking',
          component: () => import('../views/Tracking/src/components/PublicTracking'),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/public-tracking/detail',
          name: 'Public Tracking Detail',
          component: () =>
            import(
              '../views/Tracking/src/components/PublicTracking/src/components/PublicTrackingDetail.vue'
            ),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/login',
          name: 'Login',
          component: () => import('../views/Login'),
          meta: {
            activeMenu: '/tracking'
          }
        },
        {
          path: '/reset-password',
          name: 'Reset Password',
          component: () => import('../views/Login/src/components/ChangePasswordCard.vue')
        },
        {
          path: '/operation-log',
          name: 'Operation log',
          component: () => import('../views/OperationLog')
        },
        {
          path: '/chat-log',
          name: 'Chat Log',
          component: () => import('../views/ChatLog')
        },
        {
          path: '/ai-api-log',
          name: 'AI API Log',
          component: () => import('../views/AIApiLog')
        },
        {
          path: '/prompt-configuration',
          name: 'Prompt Configuration',
          component: () => import('../views/PromptConfiguration')
        },
        {
          path: '/template-management',
          name: 'Template Management',
          component: () => import('../views/TemplateManagement')
        },
        {
          path: '/template-management/create-report-template',
          name: 'Create Report Template',
          component: () => import('../views/TemplateManagement/src/components/CreateReportTemplate'),
          meta: {
            activeMenu: '/template-management'
          }
        },
        {
          path: '/system-message',
          name: 'System Message',
          component: () => import('../views/SystemMessage')
        },
        {
          path: '/system-message-detail',
          name: 'System Message Detail',
          meta: {
            breadName: 'Detail',
            activeMenu: '/system-message'
          },
          component: () => import('../views/SystemMessage/src/components/SystemMessageDetail.vue')
        },
        {
          path: '/system-settings',
          name: 'System Settings',
          component: () => import('../views/SystemSettings')
        },
        {
          path: '/system-settings/create-new-rule',
          name: 'Create New Rule',
          component: () => import('../views/SystemSettings/src/components/CreateNewrule'),
          meta: {
            activeMenu: '/system-settings'
          }
        },
        {
          path: '/destination-delivery',
          name: 'Destination Delivery',
          component: () => import('../views/DestinationDelivery')
        },
        {
          path: '/destination-delivery/create-new-booking',
          name: 'Create New Booking',
          component: () => import('../views/DestinationDelivery/src/components/CreateNewBooking')
        },
        {
          path: '/destination-delivery/configurations',
          name: 'Configurations',
          component: () => import('../views/DestinationDelivery/src/components/ConfiguRations'),
          meta: {
            activeMenu: '/destination-delivery'
          }
        },
        {
          path: '/destination-delivery/configurations/create-new-rule',
          name: 'Destination Create New Rule',
          component: () =>
            import(
              '../views/DestinationDelivery/src/components/ConfiguRations/src/components/CreateNewRule.vue'
            ),
          meta: {
            activeMenu: '/destination-delivery'
          }
        },
        {
          path: '/destination-delivery/modify-booking',
          name: 'Modify Booking',
          component: () => import('../views/DestinationDelivery/src/components/ModifyBooking'),
          meta: {
            breadName: 'Modify Booking',
            activeMenu: '/destination-delivery'
          }
        }, {
          path: '/demo-video',
          name: 'Demo Video',
          component: () => import('../views/Video'),
        },
      ]
    }
  ]
})

// * 路由拦截 beforeEach
router.beforeEach(async (to, from, next) => {
  useBreadCrumb().setRouteList(to)
  const userStore = useUserStore()
  // 如果手动跳转登录页，清除登录信息
  if (to.path === '/login') {
    if (userStore.isLogin) {
      await userStore.logout()
    }
    sessionStorage.removeItem('trackingTablePageInfo')
    sessionStorage.removeItem('bookingTablePageInfo')
  }

  // 判断是否从systemMessage详情页跳转到systemMessage列表页，或者从systemMessage列表页跳转到systemMessage详情页
  if (
    !(
      from.name === 'System Message Detail' ||
      from.name === 'System Message' ||
      !from.name ||
      from.name === 'Tracking Detail'
    ) ||
    !(
      to.name === 'System Message' ||
      to.name === 'System Message Detail' ||
      to.name === 'Tracking Detail'
    )
  ) {
    sessionStorage.removeItem('activeCardTypeName')
  }

  // 未登录白名单
  const whiteList = ['/login', '/public-tracking', '/public-tracking/detail', '/reset-password', '/demo-video']
  // 判断是否登录
  if (!whiteList.includes(to.path) && !userStore.isLogin) {
    const userStore = useUserStore()
    await userStore.logout()
    if (whiteList.includes(from.path)) {
      ElMessage.warning({
        message: 'Please log in to use this feature.',
        grouping: true
      })
      next(false)
      return
    } else {
      next('/login')
    }
  }
  next()
})

export default router