Browse Source

目录调整--支持添加外链菜单

master
buaixuexideshitongxue 19 hours ago
parent
commit
dc329a652c
  1. 4
      src/layout/components/Aside.vue
  2. 42
      src/router/index.ts
  3. 21
      src/views/ExternalLink.vue

4
src/layout/components/Aside.vue

@ -96,7 +96,9 @@ function handleSecondMenuClick(route) {
activeSecondMenuName.value = route.name; activeSecondMenuName.value = route.name;
if(route.meta.openOutside){ if(route.meta.openOutside){
console.log('route-------',route) console.log('route-------',route)
window.open(route.path); // window.open(route.path);
const url = route.meta.url || route.path
window.open(url, "_blank")
return; return;
} }
if (route.meta.openNewPage) { if (route.meta.openNewPage) {

42
src/router/index.ts

@ -11,11 +11,26 @@ export function getModulesKey() {
return Object.keys(modules).map((item) => item.replace('/src/views/', '').replace('.vue', '')) return Object.keys(modules).map((item) => item.replace('/src/views/', '').replace('.vue', ''))
} }
function normalizeUrl(url: string) {
if (/^https?:\/\//i.test(url)) return url
return "https://" + url
}
function genExternalPath(menu: any) {
return `/external/${menu.id}`
}
export function createRouteRecord(menus) { export function createRouteRecord(menus) {
return menus.map(menu => { return menus.map(menu => {
const isExternal = !!menu.openOutside
console.log("============menu==============")
console.log(menu)
const routeRecord: RouteRecordRaw = { const routeRecord: RouteRecordRaw = {
path: menu.paths, // ✅ 外链用站内 path,占位
name: Symbol(menu.paths), path: isExternal ? genExternalPath(menu) : menu.paths,
// ✅ name 用字符串,别用 Symbol
name: isExternal ? `external-${menu.id ?? menu.menuName}` : (menu.name ?? menu.paths),
meta: { meta: {
hidden: !menu.isShow, hidden: !menu.isShow,
keepAlive: !!menu.isCache, keepAlive: !!menu.isCache,
@ -23,19 +38,18 @@ export function createRouteRecord(menus) {
perms: menu.perms, perms: menu.perms,
icon: menu.icon, icon: menu.icon,
type: menu.menuType, type: menu.menuType,
openOutside:menu.openOutside, openOutside: menu.openOutside,
openNewPage: menu.openNewPage openNewPage: menu.openNewPage,
} // ✅ 把真正外链放到 meta.url
url: isExternal ? normalizeUrl(menu.paths) : undefined,
},
// ✅ 外链用一个固定组件
component: isExternal
? () => import("@/views/ExternalLink.vue")
: (menu.menuType === MenuEnum.CATALOGUE ? LAYOUT : loadRouteView(menu.component)),
} }
switch (menu.menuType) {
case MenuEnum.CATALOGUE: if (menu.children?.length) {
routeRecord.component = LAYOUT
break
case MenuEnum.MENU:
routeRecord.component = loadRouteView(menu.component)
break
}
if (menu.children.length) {
routeRecord.children = createRouteRecord(menu.children) routeRecord.children = createRouteRecord(menu.children)
} }
return routeRecord return routeRecord

21
src/views/ExternalLink.vue

@ -0,0 +1,21 @@
<script setup lang="ts">
import { onMounted } from "vue"
import { useRoute, useRouter } from "vue-router"
const route = useRoute()
const router = useRouter()
onMounted(() => {
const url = route.meta.url as string | undefined
const newPage = !!route.meta.openNewPage
if (url) window.open(url, newPage ? "_blank" : "_self")
// /
if (newPage) router.replace("/")
})
</script>
<template>
<div style="padding:16px;">正在打开外部页面...</div>
</template>
Loading…
Cancel
Save