fs-admin/src/components/GlobalSubMenu.vue

<script lang="ts" setup>
import { useThemeStore } from '@/stores/theme'
import { useMenuStore } from '@/stores/menu'
import { isAbsolutePath } from '@/utils/utils'

interface Props {
  menu: any
}

const props = defineProps<Props>()

const themeStore = useThemeStore()

const router = useRouter()
const menuStore = useMenuStore()

const handleClick = (menu: any) => {
  const path = menu.index
  if (isAbsolutePath(path)) {
    window.open(path)
  } else {
    router.push(path)
  }
}
</script>

<template>
  <el-sub-menu v-if="menu.children?.length" :index="menu.name">
    <template #title>
      <el-icon v-if="menu.meta?.icon"><component :is="menu.meta?.icon"></component></el-icon>
      <span>{{ menu.meta.title }}</span>
    </template>
    <global-sub-menu v-for="item in menu.children" :key="item.path" :menu="item"></global-sub-menu>
  </el-sub-menu>
  <el-menu-item v-else :index="menu.path" @click="handleClick">
    <el-icon v-if="menu.meta?.icon"><component :is="menu.meta?.icon"></component></el-icon>
    <span>{{ menu.meta.title }}</span>
  </el-menu-item>
</template>

<style lang="scss" scoped></style>