feat: 外链路由添加
This commit is contained in:
wf
parent
ae1d573c53
commit
7305de45a0
1
src/assets/svgs/link.svg
Normal file
1
src/assets/svgs/link.svg
Normal file
@ -0,0 +1 @@
|
||||
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1719473821252" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1582" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M13 512a499 499 0 1 0 998 0 499 499 0 1 0-998 0z" fill="#008AFF" p-id="1583"></path><path d="M728.3 297.7l-2-2c-46.1-46.1-121.6-46.1-167.7 0L451.7 402.6c-46.1 46.1-46.1 121.6 0 167.7l2 2c3.8 3.8 7.9 7.3 12.1 10.5l39.1-39.1c-4.6-2.7-8.9-5.9-12.8-9.8l-2-2c-25-25-25-65.8 0-90.8L597 334.2c25-25 65.8-25 90.8 0l2 2c25 25 25 65.8 0 90.8l-48.3 48.3c8.4 20.7 12.4 42.8 12 64.9l74.8-74.8c46.1-46.1 46.1-121.6 0-167.7z m-158 154c-3.8-3.8-7.9-7.3-12.1-10.5l-39.1 39.1c4.6 2.7 8.9 5.9 12.8 9.8l2 2c25 25 25 65.8 0 90.8L427 689.8c-25 25-65.8 25-90.8 0l-2-2c-25-25-25-65.8 0-90.8l48.4-48.3c-8.4-20.7-12.4-42.8-12-64.9l-74.8 74.8c-46.1 46.1-46.1 121.6 0 167.7l2 2c46.1 46.1 121.6 46.1 167.7 0l106.9-106.9c46.1-46.1 46.1-121.6 0-167.7l-2.1-2z" fill="#FFFFFF" p-id="1584"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
@ -23,6 +23,8 @@ export default {
|
||||
["personal-center"]: "personal center",
|
||||
["userinfo"]: "userinfo",
|
||||
["user-settings"]: "user settings",
|
||||
["external-links"]: "external links",
|
||||
["link-gitee"]: "link gitee",
|
||||
["about-project"]: "about project",
|
||||
["not-power"]: "No permission",
|
||||
["not-found"]: "Page not found",
|
||||
|
||||
@ -24,6 +24,8 @@ export default {
|
||||
["userinfo"]: "用户信息",
|
||||
["user-settings"]: "用户设置",
|
||||
["about-project"]: "关于项目",
|
||||
["external-links"]: "外部链接",
|
||||
["link-gitee"]: "链接 gitee",
|
||||
["not-power"]: "没有权限",
|
||||
["not-found"]: "未找到页面",
|
||||
["zh-CN"]: "中文",
|
||||
|
||||
@ -81,7 +81,11 @@ const onMenuItem = (key: string) => {
|
||||
const find = findLinearArray(key);
|
||||
// 路由存在则存入并跳转，不存在则跳404
|
||||
if (find) {
|
||||
// 给左侧树赋值
|
||||
setAsideMenu(find);
|
||||
// 这里直接跳转父级path，因为父级路由做了重定向
|
||||
// 如果有子路由则重定向到自己的第一个菜单
|
||||
// 如果没有子路由则说明当前父级是一个菜单，直接跳转
|
||||
router.push(find.path);
|
||||
} else {
|
||||
router.push("/404");
|
||||
@ -105,7 +109,6 @@ const getAsideMenu = (key: string) => {
|
||||
const find = findLinearArray(key);
|
||||
setAsideMenu(find);
|
||||
};
|
||||
// getAsideMenu(aciveRoute.value as string);
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -103,9 +103,12 @@ export const currentlyRoute = (name: string) => {
|
||||
if (find === undefined) return;
|
||||
// 存入当前路由-高亮
|
||||
store.setCurrentRoute(find);
|
||||
// 存入tabs栏数据：如果系统配置里允许展示标签栏则存入
|
||||
|
||||
// 如果是外链路由则不做后续任何缓存操作: 有外链 && 内嵌false
|
||||
if (find.meta.link && !find.meta.iframe) return;
|
||||
// 存入tabs栏数据：开启tabs
|
||||
if (isTabs.value) store.setTabs(find);
|
||||
// 是否缓存路由 || 是否渲染tabs，符合任意条件则不缓存路由
|
||||
// 不缓存路由 || 不渲染tabs ，符合任意条件则不缓存路由
|
||||
if (!find.meta.keepAlive || !isTabs.value) return;
|
||||
store.setRouteNames(find.name); // 缓存路由name
|
||||
};
|
||||
|
||||
@ -6,10 +6,10 @@ import { testMultilevelMenu } from "@/mock/testRoute";
|
||||
* 路由meta对象参数，我们通常将属性放到meta对象中
|
||||
* meta: {
|
||||
* title: 菜单栏以及 tabsView 栏、菜单搜索名称（国际化）
|
||||
* link: 是否是超链接菜单，开启外链条件：1、 link：链接地址不为空 2、iframe: false
|
||||
* hide: 是否隐藏此路由
|
||||
* keepAlive: 是否缓存组件状态
|
||||
* affix: 是否固定在 tabsView 栏上
|
||||
* link: 是否是超链接菜单，开启外链条件：1、 link：链接地址不为空 2、iframe: false
|
||||
* iframe: 是否内嵌窗口，开启条件：1、iframe：true 2、link：链接地址不为空
|
||||
* roles: 当前路由权限表示，取角色管理。路由控制显示、隐藏。 超级管理员：admin；普通角色：common
|
||||
* icon: 菜单、tabsView 图标等
|
||||
@ -71,10 +71,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
redirect: "/table-management/common-table",
|
||||
meta: {
|
||||
title: "table-management",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: true,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
svgIcon: "table"
|
||||
@ -86,10 +86,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/table-management/common-table/common-table.vue"),
|
||||
meta: {
|
||||
title: "common-table",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -101,10 +101,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/table-management/custom-table/custom-table.vue"),
|
||||
meta: {
|
||||
title: "custom-table",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -118,10 +118,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
redirect: "/form-management/common-form",
|
||||
meta: {
|
||||
title: "form-management",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: true,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
svgIcon: "form"
|
||||
@ -133,10 +133,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/form-management/common-form/common-form.vue"),
|
||||
meta: {
|
||||
title: "common-form",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -148,10 +148,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/form-management/step-form/step-form.vue"),
|
||||
meta: {
|
||||
title: "step-form",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -165,10 +165,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
redirect: "/multilevel-menu/second-menu-1",
|
||||
meta: {
|
||||
title: "multilevel-menu",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: true,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
svgIcon: "switch"
|
||||
@ -180,10 +180,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/multilevel-menu/second-menu/second-menu-1.vue"),
|
||||
meta: {
|
||||
title: "second-menu-1",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -195,10 +195,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
redirect: "/multilevel-menu/third-menu-1",
|
||||
meta: {
|
||||
title: "second-menu-2",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -210,10 +210,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/multilevel-menu/third-menu/third-menu-1.vue"),
|
||||
meta: {
|
||||
title: "third-menu-1",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -225,10 +225,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/multilevel-menu/third-menu/third-menu-2.vue"),
|
||||
meta: {
|
||||
title: "third-menu-2",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -245,10 +245,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
redirect: "/personal-center/userinfo",
|
||||
meta: {
|
||||
title: "personal-center",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
svgIcon: "user"
|
||||
@ -260,10 +260,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/personal-center/userinfo/userinfo.vue"),
|
||||
meta: {
|
||||
title: "userinfo",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -276,10 +276,10 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
component: () => import("@/views/personal-center/user-settings/user-settings.vue"),
|
||||
meta: {
|
||||
title: "user-settings",
|
||||
link: "",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
@ -288,6 +288,39 @@ export const dynamicRoutes: RouteRecordRaw[] = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: "/external-links",
|
||||
name: "external-links",
|
||||
redirect: "/external-links/link-gitee",
|
||||
meta: {
|
||||
title: "external-links",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "",
|
||||
iframe: false,
|
||||
roles: ["admin"],
|
||||
svgIcon: "link"
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: "/external-links/link-gitee",
|
||||
name: "link-gitee",
|
||||
component: () => import("@/views/external-links/link-gitee/link-gitee.vue"),
|
||||
meta: {
|
||||
title: "link-gitee",
|
||||
hide: false,
|
||||
keepAlive: true,
|
||||
affix: false,
|
||||
link: "https://gitee.com/wang_fan_w", // 链接
|
||||
iframe: false, // 区分是否内链 true内链 false外链
|
||||
roles: ["admin"],
|
||||
icon: "icon-menu"
|
||||
},
|
||||
children: []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: "/internationalization",
|
||||
name: "internationalization",
|
||||
|
||||
@ -21,7 +21,6 @@
|
||||
|
||||
<script setup lang="ts">
|
||||
import packageJson from "../../../package.json";
|
||||
|
||||
const projectInfo = [
|
||||
{
|
||||
label: "版本号",
|
||||
|
||||
9
src/views/external-links/link-gitee/link-gitee.vue
Normal file
9
src/views/external-links/link-gitee/link-gitee.vue
Normal file
@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<div>外部链接 gitee <a-date-picker v-model="form" placeholder="请选择日期" /></div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const form = ref();
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@ -3,20 +3,15 @@
|
||||
<p>{{ $t(`language.switch-language-to-preview`) }}</p>
|
||||
<br />
|
||||
<div>
|
||||
<a-date-picker style="width: 200px" />
|
||||
<a-date-picker style="width: 200px" v-model="form.time" />
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<a-time-picker type="time-range" style="width: 252px" />
|
||||
<a-time-picker type="time-range" style="width: 252px" v-model="form.timeRange" />
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<a-range-picker
|
||||
style="width: 360px"
|
||||
show-time
|
||||
:time-picker-props="{ defaultValue: ['00:00:00', '09:09:06'] }"
|
||||
format="YYYY-MM-DD HH:mm"
|
||||
/>
|
||||
<a-range-picker style="width: 360px" show-time format="YYYY-MM-DD HH:mm" v-model="form.date" />
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
@ -25,6 +20,12 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts"></script>
|
||||
<script setup lang="ts">
|
||||
const form = reactive({
|
||||
time: null,
|
||||
timeRange: [],
|
||||
date: []
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user