特性: 优化菜单
This commit is contained in:
parent
66a3c584df
commit
5f181fae03
|
|
@ -25,9 +25,10 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import Logo from './components/Logo.vue'
|
import Logo from './components/Logo.vue'
|
||||||
import SubItem from '../SubMenu/SubItem.vue'
|
import SubItem from '../SubMenu/SubItem.vue'
|
||||||
|
import SubMenu from '../SubMenu/SubMenu.vue'
|
||||||
import {useSettingStore} from "@/store/modules/setting"
|
import {useSettingStore} from "@/store/modules/setting"
|
||||||
import {usePermissionStore} from "@/store/modules/permission"
|
import {usePermissionStore} from "@/store/modules/permission"
|
||||||
import { computed } from 'vue'
|
import { computed, ref, watch } from "vue";
|
||||||
import { useRoute } from 'vue-router'
|
import { useRoute } from 'vue-router'
|
||||||
|
|
||||||
// 在setup中获取store
|
// 在setup中获取store
|
||||||
|
|
@ -40,6 +41,8 @@ const isCollapse = computed(() => !SettingStore.isCollapse)
|
||||||
// 设置
|
// 设置
|
||||||
const themeConfig = computed(() =>SettingStore.themeConfig )
|
const themeConfig = computed(() =>SettingStore.themeConfig )
|
||||||
|
|
||||||
|
const basePath = ref('/')
|
||||||
|
|
||||||
// 获取路由
|
// 获取路由
|
||||||
const permission_routes = computed(() => PermissionStore.permission_routes)
|
const permission_routes = computed(() => PermissionStore.permission_routes)
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -3,18 +3,18 @@
|
||||||
<el-sub-menu v-if="subItem.children && subItem.children.length > 0" :index="subItem.path">
|
<el-sub-menu v-if="subItem.children && subItem.children.length > 0" :index="subItem.path">
|
||||||
<template #title>
|
<template #title>
|
||||||
<el-icon>
|
<el-icon>
|
||||||
<component :is="subItem.meta.icon"></component>
|
<component :is="subItem?.meta?.icon"></component>
|
||||||
</el-icon>
|
</el-icon>
|
||||||
<span>{{ subItem.meta.title }}</span>
|
<span>{{ subItem?.meta?.title }}</span>
|
||||||
</template>
|
</template>
|
||||||
<SubMenu :menuList="subItem.children" :basePath="`${basePath}/${subItem.path}`"/>
|
<SubMenu :menuList="subItem.children" :basePath="`${basePath?'/':''}${subItem.path}`"/>
|
||||||
</el-sub-menu>
|
</el-sub-menu>
|
||||||
<el-menu-item v-else-if="!subItem.hidden" :index="subItem.path" @click="handleClickMenu(subItem)">
|
<el-menu-item v-else-if="!subItem.hidden" :index="subItem.path" @click="handleClickMenu(subItem)">
|
||||||
<el-icon>
|
<el-icon>
|
||||||
<component :is="subItem.meta.icon"></component>
|
<component :is="subItem?.meta?.icon"></component>
|
||||||
</el-icon>
|
</el-icon>
|
||||||
<template #title>
|
<template #title>
|
||||||
<span>{{ subItem.meta.title }}</span>
|
<span>{{ subItem?.meta?.title }}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-menu-item>
|
</el-menu-item>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -36,7 +36,6 @@ let props = defineProps({
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const handleClickMenu = (subItem) => {
|
const handleClickMenu = (subItem) => {
|
||||||
console.log('isExternal(subItem.path)',subItem.path,isExternal(subItem.path))
|
|
||||||
if (isExternal(subItem.path)) return window.open(subItem.path, "_blank");
|
if (isExternal(subItem.path)) return window.open(subItem.path, "_blank");
|
||||||
let path = props.basePath+'/'+subItem.path
|
let path = props.basePath+'/'+subItem.path
|
||||||
router.push(path);
|
router.push(path);
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue