|
|
|
|
@ -0,0 +1,164 @@
|
|
|
|
|
<template>
|
|
|
|
|
<el-menu
|
|
|
|
|
default-active="1-4-1"
|
|
|
|
|
class="el-menu-vertical-demo"
|
|
|
|
|
:collapse="isCollapse"
|
|
|
|
|
background-color="#545c64"
|
|
|
|
|
text-color="#fff"
|
|
|
|
|
active-text-color="#ffd04b"
|
|
|
|
|
style="border: none;"
|
|
|
|
|
>
|
|
|
|
|
<h3 style="white-space:nowrap;color: #fff;text-align: center;line-height: 48px;font-size: 16px;">
|
|
|
|
|
{{ isCollapse ? '后台' :'花店后台管理系统' }}
|
|
|
|
|
</h3>
|
|
|
|
|
<el-submenu v-for="item in hasChildren" :key="item.label" :index="item.label">
|
|
|
|
|
<template slot="title">
|
|
|
|
|
<i :class="item.icon"></i>
|
|
|
|
|
<span slot="title">{{ item.label }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
<el-menu-item-group v-for="subItem in item.children" :key="subItem.name" >
|
|
|
|
|
<el-menu-item @click="clickMenu(subItem)" :index="subItem.name">
|
|
|
|
|
<i :class="subItem.icon"></i>
|
|
|
|
|
{{ subItem.label }}
|
|
|
|
|
</el-menu-item>
|
|
|
|
|
</el-menu-item-group>
|
|
|
|
|
</el-submenu>
|
|
|
|
|
<el-menu-item @click="clickMenu(item)" v-for="item in noChildren" :key="item.name" :index="item.name">
|
|
|
|
|
<i :class="item.icon"></i>
|
|
|
|
|
<span slot="title">{{ item.label }}</span>
|
|
|
|
|
</el-menu-item>
|
|
|
|
|
</el-menu>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import Cookie from "js-cookie";
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
// menuData: [
|
|
|
|
|
// {
|
|
|
|
|
// path: "/statistic",
|
|
|
|
|
// name: "statistic",
|
|
|
|
|
// label: "统计信息",
|
|
|
|
|
// icon: "el-icon-data-line",
|
|
|
|
|
// url: "statistic/statistic",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// label: "人员管理",
|
|
|
|
|
// icon: "el-icon-user",
|
|
|
|
|
// children: [
|
|
|
|
|
// {
|
|
|
|
|
// path: "/user",
|
|
|
|
|
// name: "user",
|
|
|
|
|
// label: "用户管理",
|
|
|
|
|
// icon: "el-icon-user-solid",
|
|
|
|
|
// url: "user/user",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/staff",
|
|
|
|
|
// name: "staff",
|
|
|
|
|
// label: "员工管理",
|
|
|
|
|
// icon: "el-icon-s-custom",
|
|
|
|
|
// url: "staff/staff",
|
|
|
|
|
// },
|
|
|
|
|
// ],
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// label: "商品管理",
|
|
|
|
|
// icon: "el-icon-box",
|
|
|
|
|
// children: [
|
|
|
|
|
// {
|
|
|
|
|
// path: "/class",
|
|
|
|
|
// name: "class",
|
|
|
|
|
// label: "类别管理",
|
|
|
|
|
// icon: "el-icon-menu",
|
|
|
|
|
// url: "class/class",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/flower",
|
|
|
|
|
// name: "flower",
|
|
|
|
|
// label: "花卉管理",
|
|
|
|
|
// icon: "el-icon-star-on",
|
|
|
|
|
// url: "flower/flower",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/pack",
|
|
|
|
|
// name: "pack",
|
|
|
|
|
// label: "花材管理",
|
|
|
|
|
// icon: "el-icon-s-shop",
|
|
|
|
|
// url: "pack/pack",
|
|
|
|
|
// },
|
|
|
|
|
// ],
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/order",
|
|
|
|
|
// name: "order",
|
|
|
|
|
// label: "订单管理",
|
|
|
|
|
// icon: "el-icon-document",
|
|
|
|
|
// url: "order/order",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/discount",
|
|
|
|
|
// name: "discount",
|
|
|
|
|
// label: "套餐管理",
|
|
|
|
|
// icon: "el-icon-shopping-bag-1",
|
|
|
|
|
// url: "discount/discount",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/notice",
|
|
|
|
|
// name: "notice",
|
|
|
|
|
// label: "发布公告",
|
|
|
|
|
// icon: "el-icon-news",
|
|
|
|
|
// url: "notice/notice",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/gift",
|
|
|
|
|
// name: "gift",
|
|
|
|
|
// label: "换赠设置",
|
|
|
|
|
// icon: "el-icon-present",
|
|
|
|
|
// url: "gift/gift",
|
|
|
|
|
// },
|
|
|
|
|
// {
|
|
|
|
|
// path: "/chat",
|
|
|
|
|
// name: "chat",
|
|
|
|
|
// label: "聊 天 室",
|
|
|
|
|
// icon: "el-icon-chat-dot-round",
|
|
|
|
|
// url: "chat/chat",
|
|
|
|
|
// },
|
|
|
|
|
// ],
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
clickMenu(item){ //点击菜单跳转
|
|
|
|
|
//当前页面路由与跳转路由不一致时才允许跳转(解决重复点击报错问题)
|
|
|
|
|
if(this.$route.path !== item.path && !(this.$route.path === '/statistic' && item.path === '/')){
|
|
|
|
|
this.$router.push(item.path)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
computed: {
|
|
|
|
|
//没有子菜单
|
|
|
|
|
noChildren() {
|
|
|
|
|
return this.menuData.filter((item) => !item.children);
|
|
|
|
|
},
|
|
|
|
|
//有子菜单
|
|
|
|
|
hasChildren() {
|
|
|
|
|
return this.menuData.filter((item) => item.children);
|
|
|
|
|
},
|
|
|
|
|
isCollapse(){
|
|
|
|
|
return this.$store.state.tab.isCollapse
|
|
|
|
|
},
|
|
|
|
|
menuData(){ //菜单权限
|
|
|
|
|
//判断当前菜单数据,如果缓存中没有,从store中获取
|
|
|
|
|
return JSON.parse(Cookie.get('menu')) || this.$store.state.tab.menu
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style>
|
|
|
|
|
.el-menu-vertical-demo{
|
|
|
|
|
width: 200px;
|
|
|
|
|
height: 130vh;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</style>
|