ADD 菜单增加tag标签

src/layout/components/NavMenu.vue

@@ -8,12 +8,14 @@
 			<el-icon v-if="navMenu.meta&&navMenu.meta.icon"><component :is="navMenu.meta.icon || 'el-icon-menu'"/></el-icon>
 			<template #title>
 				<span>{{navMenu.meta.title}}</span>
+				<span v-if="navMenu.meta.tag" class="menu-tag">{{navMenu.meta.tag}}</span>
 			</template>
 		</el-menu-item>
 		<el-sub-menu v-else :index="navMenu.path">
 			<template #title>
 				<el-icon v-if="navMenu.meta&&navMenu.meta.icon"><component :is="navMenu.meta.icon || 'el-icon-menu'"/></el-icon>
 				<span>{{navMenu.meta.title}}</span>
+				<span v-if="navMenu.meta.tag" class="menu-tag">{{navMenu.meta.tag}}</span>
 			</template>
 			<NavMenu :navMenus="navMenu.children"></NavMenu>
 		</el-sub-menu>

src/style/app.scss

@@ -62,6 +62,9 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
 .adminui-side-bottom i {font-size: 16px;}
 .adminui-side-bottom:hover {color: var(--el-color-primary);}
 .aminui-side.isCollapse {width: 65px;}
+.el-menu .menu-tag {position: absolute;height: 18px;line-height: 18px;background: var(--el-color-danger);font-size: 12px;color: #fff;right: 20px;border-radius:18px;padding:0 6px;}
+.el-menu .el-sub-menu__title .menu-tag {right: 40px;}
+.el-menu--horizontal > li .menu-tag {display: none;}
 
 /* 右侧内容 */
 .aminui-body {flex: 1;display: flex;flex-flow: column;}

src/views/setting/menu/save.vue

@@ -53,6 +53,12 @@
 						<el-checkbox v-model="form.meta.hiddenBreadcrumb">隐藏面包屑</el-checkbox>
 						<div class="el-form-item-msg">菜单不显示在导航中，但用户依然可以访问，例如详情页</div>
 					</el-form-item>
+					<el-form-item label="整页路由" prop="fullpage">
+						<el-switch v-model="form.meta.fullpage" />
+					</el-form-item>
+					<el-form-item label="标签" prop="tag">
+						<el-input v-model="form.meta.tag" clearable placeholder=""></el-input>
+					</el-form-item>
 					<el-form-item>
 						<el-button type="primary" @click="save" :loading="loading">保 存</el-button>
 					</el-form-item>
@@ -103,7 +109,9 @@
 						icon: "",
 						active: "",
 						color: "",
-						type: "menu"
+						type: "menu",
+						fullpage: false,
+						tag: "",
 					},
 					apiList: []
 				},