k_online_ui/src/stores/modules/breadCrumb.ts

import { defineStore } from 'pinia'
import { collapseTextChangeRangesAcrossMultipleVersions } from 'typescript'

interface Route {
  label: string
  path: string
  query?: string
}
interface BreadCrumb {
  routeList: Route[]
}
// 需要添加多级菜单的页面，值为route的name
const whiteList = [
  'Booking Detail',
  'Tracking Detail',
  'Add VGM',
  'Public Tracking Detail',
  'Create New Rule',
  'System Message Detail'
]

export const useBreadCrumb = defineStore('breadCrumb', {
  state: (): BreadCrumb => ({
    routeList: JSON.parse(localStorage.getItem('routeList')) || []
  }),
  getters: {},
  actions: {
    setRouteList(toRoute: any) {
      const index = this.routeList.findIndex((item) => item.label === toRoute.name)
      if (index !== -1) {
        this.routeList.splice(index + 1)
      } else if (toRoute.name === 'Public Tracking Detail') {
        this.routeList = [
          {
            label: 'Public Tracking',
            path: '/public-tracking',
            query: ''
          },
          {
            label: 'Public Tracking Detail',
            path: '/public-tracking/detail',
            query: toRoute.query
          }
        ]
      } else if (toRoute.name === 'System Message Detail') {
        this.routeList = [
          {
            label: 'System Message',
            path: '/system-message',
            query: ''
          },
          {
            label: 'System Message Detail',
            path: '/system-message/detail',
            query: toRoute.query
          }
        ]
      } else if (toRoute.name === 'Shipment Detail') {
        this.routeList = [
          {
            label: 'System Settings',
            path: '/SystemSettings',
            query: ''
          },
          {
            label: 'Shipment Detail',
            path: '/shipment/detail',
            query: toRoute.query
          }
        ]
      } else if (toRoute.name && whiteList.includes(toRoute.name)) {
        this.routeList.push({
          label: toRoute?.meta?.breadName || toRoute.name,
          path: toRoute.path,
          query: toRoute.query
        })
      } else {
        this.routeList = [
          {
            label: toRoute.name,
            path: toRoute.path,
            query: toRoute.query
          }
        ]
      }
      localStorage.setItem('routeList', JSON.stringify(this.routeList))
    },
    getUpperRoute() {
      return this.routeList[this.routeList.length - 2]
    }
  }
})