作者 朱兆平

菜单组件化

... ... @@ -36,3 +36,6 @@ export const add = params => { return axios({
'Content-Type': 'application/json;charset=UTF-8'
}
})};
export const userMenu = params => { return axios.get(`${base}/userMenu`, { params: params }); };
... ...
<template>
<el-menu default-active="$route.path"
class="el-menu-vertical-demo"
background-color="#26384c"
text-color="#fff"
active-text-color="#ffd04b"
style="overflow-y:scroll"
@open="handleopen"
@close="handleclose"
@select="handleselect"
unique-opened
router
:collapse="collapsed">
<el-radio-group v-model="collapsed" style="margin-bottom: 20px;">
<el-radio-button :label="false">展开</el-radio-button>
<el-radio-button :label="true">收起</el-radio-button>
</el-radio-group>
<div align="center" style="background-color: #2b2f3a;height: 67px">
<img src="~@/assets/logo1.png">
<h1 style="color:white;display: inline-block;font-weight: 600;font-size: 15px;line-height: 50px">航空物流公共信息服务平台</h1>
</div>
<template v-for="(item,index) in menu">
<el-submenu :index="index+''" v-if="item.hasChild">
<template slot="title">
<i :class="item.iconCls"></i>
<span slot="title">{{item.name}}</span>
</template>
<el-menu-item v-for="child in item.children"
:index="child.path"
:key="child.permissionId"
v-if="!child.hidden">
{{child.name}}
</el-menu-item>
</el-submenu>
<el-menu-item v-if="!item.hasChild" :index="item.path">
<i :class="item.iconCls"></i>
<span slot="title">{{item.name}}</span>
</el-menu-item>
</template>
</el-menu>
</template>
<script>
import userInfo from '@/api/base';
import {userMenu} from '@/api/perm_api';
export default {
name: 'NavMenus',
data() {
return {
collapsed: false,
menu:[
{
permissionId:1,
name:'系统设置',
permissionOrder:'1',
description:'',
ismenu:true,
hidden:false,
parentId:0,
path:'/',
url:'/',
method:'',
iconCls:'el-icon-setting',
component:'',
hasChild:true,
children:[
{
permissionId:2,
name:'用户管理',
permissionOrder:'1',
description:'',
ismenu:true,
hidden:false,
parentId:0,
path:'/user',
url:'/user/**',
method:'',
iconCls:'',
component:'',
children:[]
},
{
permissionId:3,
name:'权限管理',
permissionOrder:'2',
description:'',
ismenu:true,
hidden:false,
parentId:0,
path:'/user1',
url:'/user/**',
method:'',
iconCls:'',
component:'',
children:[]
}
]
},
{
permissionId:4,
name:'舱单申报',
permissionOrder:'1',
description:'',
ismenu:true,
hidden:false,
parentId:0,
path:'/main',
url:'/',
method:'',
iconCls:'el-icon-setting',
component:'',
children:[]
}
]
}
},
methods: {
onSubmit() {
console.log('submit!');
},
handleopen() {
console.log('handleopen');
},
handleclose() {
console.log('handleclose');
},
handleselect: function (a, b) {
this.reload()
},
showMenu(i,status){
this.$refs.menuCollapsed.getElementsByClassName('submenu-hook-'+i)[0].style.display=status?'block':'none';
},
getUserMenu:function(){
const _this=this;
const para={
userId:userInfo.userId
};
userMenu(para).then((res) => {
console.log("ce"+res.data);
_this.menu = res.data.data;
}).catch((error) => {
if(null!= error.response && error.response!==undefined){
let status= error.response.status;
let msg = error.response.statusText;
_this.$message({
// 饿了么的消息弹窗组件
message: msg,
type: "error"
});
}else {
_this.$message({
// 饿了么的消息弹窗组件
message: error,
type: "error"
});
}
});
},
reload() {
this.$nextTick(function () {
this.$router.push({
path: this.$router.path,
query:{
t: new Date().getTime()
}
})
})
},
},
mounted() {
console.log(userInfo)
this.getUserMenu();
}
}
</script>
<style scoped lang="scss">
</style>
<style>
</style>
... ...
... ... @@ -136,27 +136,27 @@ let routes = [
{path: '/main', component: Main, name: '首页'},
]
},
// {
// path: '/',
// component: Home,
// name: 'Charts',
// iconCls: 'fa fa-bar-chart',
// children: [
// {path: '/echarts', component: echarts, name: 'echarts'},
// {path: '/earthCharts', component: earthCharts, name: '统计表'}
// ]
// },
// { path: '/test', component: Main },
// {
// path: '/bill',
// component: Home,
// name: '货运单',
// iconCls: 'el-icon-collection',
// children: [
// {path: '/Way', component: Way, name: '货运单'},
// {path: '/Webdialog', component: Webdialog, name: '在线客服'}
// ]
// },
{
path: '/',
component: Home,
name: 'Charts',
iconCls: 'fa fa-bar-chart',
children: [
{path: '/echarts', component: echarts, name: 'echarts'},
{path: '/earthCharts', component: earthCharts, name: '统计表'}
]
},
{ path: '/test', component: Main },
{
path: '/bill',
component: Home,
name: '货运单',
iconCls: 'el-icon-collection',
children: [
{path: '/Way', component: Way, name: '货运单'},
{path: '/Webdialog', component: Webdialog, name: '在线客服'}
]
},
{
path: '/',
component: Home,
... ... @@ -195,11 +195,11 @@ let routes = [
{ path: '/documents', component: documents, name: '航班文件' },
{ path: '/charge', component: charge, name: '付费处理' },
// { path: '/perm', component: Perm, name: '权限管理' },
// { path: '/log', component: LOG, name: '系统日志' },
// { path: '/department', component: Department, name: '部门管理' },
// { path: '/company', component: Company, name: '公司管理'},
// { path: '/group', component: Group, name: '集团管理'}
{ path: '/perm', component: Perm, name: '权限管理' },
{ path: '/log', component: LOG, name: '系统日志' },
{ path: '/department', component: Department, name: '部门管理' },
{ path: '/company', component: Company, name: '公司管理'},
{ path: '/group', component: Group, name: '集团管理'}
]
},
{
... ... @@ -207,6 +207,7 @@ let routes = [
component: Home,
name: '系统设置',
iconCls: 'el-icon-setting',//图标样式class
leaf: false,
children: [
{ path: '/user', component: User, name: '用户管理' },
{ path: '/role', component: Role, name: '组织机构' },
... ... @@ -217,30 +218,30 @@ let routes = [
{ path: '/group', component: Group, name: '集团管理'}
]
},
// {
// path: '/guestService',
// component: Home,
// name: '客服系统',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/process', component: Process, name: '工单管理' },
// { path: '/job', component: Job, name: '任务管理' },
// {path: '/pre1', component: PreManifest, name: '预配'},
// ]
// },
{
path: '/guestService',
component: Home,
name: '客服系统',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/process', component: Process, name: '工单管理' },
{ path: '/job', component: Job, name: '任务管理' },
{path: '/pre1', component: PreManifest, name: '预配'},
]
},
{
path: '/output',
component: Home,
name: '国际出港业务申报',
iconCls: 'el-icon-collection',
children: [
// {path: '/flight', component: ExitFlight, name: '出港航班申报'},
// {path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/flight', component: ExitFlight, name: '出港航班申报'},
{path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/pre', component: ExitPre, name: '国际出港预配舱单'},
// {path: '/arrive', component: ExitArrive, name: '出港运抵'},
// {path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
// {path: '/loading', component: ExitLoading, name: '出港装载'},
// {path: '/tidy', component: ExitTidy, name: '出港理货'}
{path: '/arrive', component: ExitArrive, name: '出港运抵'},
{path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
{path: '/loading', component: ExitLoading, name: '出港装载'},
{path: '/tidy', component: ExitTidy, name: '出港理货'}
]
},
{
... ... @@ -270,13 +271,13 @@ let routes = [
name: '国内出港业务申报',
iconCls: 'el-icon-collection',
children: [
// {path: '/flight', component: ExitFlight, name: '出港航班申报'},
// {path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/flight', component: ExitFlight, name: '出港航班申报'},
{path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/pre', component: ExitPre, name: '国内出港预配舱单'},
// {path: '/arrive', component: ExitArrive, name: '出港运抵'},
// {path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
// {path: '/loading', component: ExitLoading, name: '出港装载'},
// {path: '/tidy', component: ExitTidy, name: '出港理货'}
{path: '/arrive', component: ExitArrive, name: '出港运抵'},
{path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
{path: '/loading', component: ExitLoading, name: '出港装载'},
{path: '/tidy', component: ExitTidy, name: '出港理货'}
]
},
{
... ... @@ -285,13 +286,13 @@ let routes = [
name: '国内进港业务申报',
iconCls: 'el-icon-collection',
children: [
// {path: '/flight', component: ExitFlight, name: '出港航班申报'},
// {path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/flight', component: ExitFlight, name: '出港航班申报'},
{path: '/manifest', component: ExitManifest, name: '出港运单申报'},
{path: '/pre', component: ExitPre, name: '国内进港预配舱单'},
// {path: '/arrive', component: ExitArrive, name: '出港运抵'},
// {path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
// {path: '/loading', component: ExitLoading, name: '出港装载'},
// {path: '/tidy', component: ExitTidy, name: '出港理货'}
{path: '/arrive', component: ExitArrive, name: '出港运抵'},
{path: '/loadingView', component: ExitFlightDesc, name: '出港航班信息'},
{path: '/loading', component: ExitLoading, name: '出港装载'},
{path: '/tidy', component: ExitTidy, name: '出港理货'}
]
},
{
... ... @@ -304,44 +305,44 @@ let routes = [
]
},
// {
// path: '/nmms2',
// component: Home,
// name: '进港业务申报',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/orig', component: OrigFlightList, name: '进港航班申报' },
// {path:'/waybill',component:Waybill,name:'进港运单申报'},
// {path:'/allocateSearch',component:AllocateSearch,name:'运单分拨申报'},
// { path: '/enter', component: EnterFlightInfo, name: '原始舱单'},
// { path:'/origmaster',component:OrigMaster,name:'进港原始舱单'},
// {path:'/entertall',component:EnterTally,name:'进港理货'},
// {path:'/tallymaster',component:TallyMster,name:'进港理货舱单'},
// {path:'/importallocation',component:Importallocation,name:'进港分拨'},
// {path:'/allocatearrive',component:Allocatearrive,name:'分拨运抵'},
// ]
// },
{
path: '/nmms2',
component: Home,
name: '进港业务申报',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/orig', component: OrigFlightList, name: '进港航班申报' },
{path:'/waybill',component:Waybill,name:'进港运单申报'},
{path:'/allocateSearch',component:AllocateSearch,name:'运单分拨申报'},
{ path: '/enter', component: EnterFlightInfo, name: '原始舱单'},
{ path:'/origmaster',component:OrigMaster,name:'进港原始舱单'},
{path:'/entertall',component:EnterTally,name:'进港理货'},
{path:'/tallymaster',component:TallyMster,name:'进港理货舱单'},
{path:'/importallocation',component:Importallocation,name:'进港分拨'},
{path:'/allocatearrive',component:Allocatearrive,name:'分拨运抵'},
]
},
// 货运系统--航班预配
// {
// path: '/flight_scheduling',
// component: Home,
// name: '航班计划',
// iconCls: 'el-icon-delete-location',
// children: [
// { path: '/inquiry', component: inquiry, name: '航班计划查询' },
// ]
// },
// {
// path: '/lost',
// component: Home,
// name: '落装改配申报',
// iconCls:'el-icon-goods',
// children:[
// {path:'/lostLoad',component:LostLoad,name:'落装业务申报'},
// {path:'/lostLoadChange',component:LostLoadChange,name:'改配业务申报'}
//
// ]
// },
{
path: '/flight_scheduling',
component: Home,
name: '航班计划',
iconCls: 'el-icon-delete-location',
children: [
{ path: '/inquiry', component: inquiry, name: '航班计划查询' },
]
},
{
path: '/lost',
component: Home,
name: '落装改配申报',
iconCls:'el-icon-goods',
children:[
{path:'/lostLoad',component:LostLoad,name:'落装业务申报'},
{path:'/lostLoadChange',component:LostLoadChange,name:'改配业务申报'}
]
},
{
path: '/airtransport',
component: Home,
... ... @@ -384,18 +385,18 @@ let routes = [
{path:'/queryConfigure',component:queryConfigure,name:'航班配置查询'},
]
},
// {
// path: '/con',
// component: Home,
// name: '收发货人管理',
// iconCls:'el-icon-goods',
// children:[
// {path:'/consigner',component:Consigner,name:'发货人管理'},
// {path:'/consignee',component:Consignee,name:'收货人管理'},
// {path:'/transport',component:Transport,name:'转运申请'},
//
// ]
// },
{
path: '/con',
component: Home,
name: '收发货人管理',
iconCls:'el-icon-goods',
children:[
{path:'/consigner',component:Consigner,name:'发货人管理'},
{path:'/consignee',component:Consignee,name:'收货人管理'},
{path:'/transport',component:Transport,name:'转运申请'},
]
},
{
path: '/out',
component: Home,
... ... @@ -419,71 +420,71 @@ let routes = [
{path:'/dynamics',component:dynamics,name:'在港动态信息'},
]
},
// {
// path: '/express-system',
// component: Home,
// name: '快邮舱单申报',
// iconCls:'el-icon-wind-power',
// children:[
// {path:'/express',component:Express,name:'快邮舱单申报'},
// ]
// },
{
path: '/express-system',
component: Home,
name: '快邮舱单申报',
iconCls:'el-icon-wind-power',
children:[
{path:'/express',component:Express,name:'快邮舱单申报'},
]
},
{
path: '/',
component: Home,
name: '场站管理',
iconCls: 'el-icon-setting',//图标样式class
children: [
{path: '/yard', component: Yard, name: '场站管理'},
{path: '/bayonet', component: Bayonet, name: '卡口管理'},
{path: '/warehouse', component: Warehouse, name: '仓库管理'},
]
},
// {
// path: '/',
// component: Home,
// name: '场站管理',
// iconCls: 'el-icon-setting',//图标样式class
// children: [
// {path: '/yard', component: Yard, name: '场站管理'},
// {path: '/bayonet', component: Bayonet, name: '卡口管理'},
// {path: '/warehouse', component: Warehouse, name: '仓库管理'},
// ]
// },
//
// {
// path: '/empt',
// component: Home,
// name: '能源管理',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/location', component: Location, name: '能源缴费' },
//
// ]
// },
// {
// path: '/satff',
// component: Home,
// name: '生活保障部门',
// iconCls: 'fa fa-id-card-o',
// children: [
// { path: '/security_inspection', component: SecrityInspection, name: '职工公寓安全巡视管理' },
// { path: '/key', component: Key, name: '职工公寓备用钥匙使用登记管理' },
// { path: '/maintain', component: Maintain, name: '职工公寓设施设备维修记录管理' },
// { path: '/come_car', component: ComeCar, name: '职工公寓外来人员车辆登记管理' },
// { path: '/on_duty', component: OnDuty, name: '职工公寓值班巡视记录管理' },
// ]
// },
// {
// path: '/water_heating_chamber',
// component: Home,
// name: '水暖室',
// iconCls: 'fa fa-address-card',
// // leaf: true,//只有一个节点
// children: [
// { path: '/water_stations_patrol', component: WaterStationsPatrol, name: '二水厂-水站巡视记录单管理' },
// // { path: '/page6', component: Page6, name: '水质量检测' },
// // { path: '/page6', component: Page6, name: '污水站' },
// // { path: '/page6', component: Page6, name: '一水厂' },
// // { path: '/page6', component: Page6, name: '综合楼空调站' },
// ]
// },
{
path: '/empt',
component: Home,
name: '能源管理',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/location', component: Location, name: '能源缴费' },
// {
// path: '*',
// hidden: true,
// redirect: {path: '/404'}
// }
]
},
{
path: '/satff',
component: Home,
name: '生活保障部门',
iconCls: 'fa fa-id-card-o',
children: [
{ path: '/security_inspection', component: SecrityInspection, name: '职工公寓安全巡视管理' },
{ path: '/key', component: Key, name: '职工公寓备用钥匙使用登记管理' },
{ path: '/maintain', component: Maintain, name: '职工公寓设施设备维修记录管理' },
{ path: '/come_car', component: ComeCar, name: '职工公寓外来人员车辆登记管理' },
{ path: '/on_duty', component: OnDuty, name: '职工公寓值班巡视记录管理' },
]
},
{
path: '/water_heating_chamber',
component: Home,
name: '水暖室',
iconCls: 'fa fa-address-card',
// leaf: true,//只有一个节点
children: [
{ path: '/water_stations_patrol', component: WaterStationsPatrol, name: '二水厂-水站巡视记录单管理' },
// { path: '/page6', component: Page6, name: '水质量检测' },
// { path: '/page6', component: Page6, name: '污水站' },
// { path: '/page6', component: Page6, name: '一水厂' },
// { path: '/page6', component: Page6, name: '综合楼空调站' },
]
},
{
path: '*',
hidden: true,
redirect: {path: '/404'}
}
];
let initRouters = routes.concat();
let setUserMenus = function (list) {
... ...
... ... @@ -4,14 +4,14 @@
<el-col :span="14" class="logo" :class="collapsed?'logo-collapse-width':'logo-width'">
{{collapsed?'':sysName}}
</el-col>
<el-col :span="6">
<div class="tools" @click.prevent="collapse" style="width: 15px;margin-top: 72px;margin-left:1px;z-index:9999;position:absolute;">
<!-- ;margin-top: 80px;z-index:9999;margin-left: 170px-->
<!-- <i class="el-icon-s-operation" style="color: rgb(38,56,76)"></i>-->
<img :class="[rotate?'go':'aa']" @click="start" width="20" height="44" src="data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABCCAYAAABAfGYuAAAArklEQVRYhe3YIQ4CMRBG4b+IOhyS26DXEjySBE6A4QSINasRSAx3guBJECTdLMn6dtp0Be8loz/Tjhh3OLVBEzSbAhUwMDAwMDAwMDAw8B/A5+PuNzEtF/NycGwDut9u6sIj6r2vB6eiRWALmg1b0SzYOWndrExoFhyC1F3vejxfdeGh9+er9nIz4dmPy4oX+U4WvNgCScWLrswRj4k7FzAwMDAwMDAwMDBwYnLqAfLHOpMP7/PBAAAAAElFTkSuQmCC">
</div>
<!-- 标签i的图标 fa-align-justify-->
</el-col>
<!-- <el-col :span="6">-->
<!-- <div class="tools" @click.prevent="collapse" style="width: 15px;margin-top: 72px;margin-left:1px;z-index:9999;position:absolute;">-->
<!--&lt;!&ndash; ;margin-top: 80px;z-index:9999;margin-left: 170px&ndash;&gt;-->
<!--&lt;!&ndash; <i class="el-icon-s-operation" style="color: rgb(38,56,76)"></i>&ndash;&gt;-->
<!-- <img :class="[rotate?'go':'aa']" @click="start" width="20" height="44" src="data:img/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABCCAYAAABAfGYuAAAArklEQVRYhe3YIQ4CMRBG4b+IOhyS26DXEjySBE6A4QSINasRSAx3guBJECTdLMn6dtp0Be8loz/Tjhh3OLVBEzSbAhUwMDAwMDAwMDAw8B/A5+PuNzEtF/NycGwDut9u6sIj6r2vB6eiRWALmg1b0SzYOWndrExoFhyC1F3vejxfdeGh9+er9nIz4dmPy4oX+U4WvNgCScWLrswRj4k7FzAwMDAwMDAwMDBwYnLqAfLHOpMP7/PBAAAAAElFTkSuQmCC">-->
<!-- </div>-->
<!--&lt;!&ndash; 标签i的图标 fa-align-justify&ndash;&gt;-->
<!-- </el-col>-->
<!-- <el-col :span="4" class="userinfo">-->
<!-- <el-dropdown trigger="hover" >-->
<!-- <span class="el-dropdown-link userinfo-inner">{{sysUserName}}<img :src="this.sysUserAvatar"/></span>-->
... ... @@ -44,42 +44,43 @@
<!-- </el-dialog>-->
<!-- </el-col>-->
<el-col :span="24" class="main">
<aside :class="collapsed?'menu-collapsed':'menu-expanded'">
<!--导航菜单-->
<el-menu :default-active="$route.path" class="el-menu-vertical-demo" @open="handleopen"
@close="handleclose" @select="handleselect" unique-opened router v-show="!collapsed"
style="width: 380px;height: 100%;margin-right: -18px">
<!-- ;overflow: scroll-->
<div align="center" style="background-color: #2b2f3a;height: 67px">
<img src="./logo1.png">
<h1 style="color:white;display: inline-block">航空物流公共信息服务平台</h1>
<!-- ;font-weight: 600;font-size: 15px;line-height: 50px-->
</div>
<template v-for="(item,index) in $router.options.routes" v-if="!item.hidden">
<el-submenu :index="index+''" v-if="!item.leaf">
<template slot="title"><i :class="item.iconCls"></i>{{item.name}}</template>
<el-menu-item v-for="child in item.children" :index="child.path" :key="child.path" v-if="!child.hidden">{{child.name}}</el-menu-item>
</el-submenu>
<el-menu-item v-if="item.leaf&&item.children.length>0" :index="item.children[0].path"><i :class="item.iconCls"></i>{{item.children[0].name}}</el-menu-item>
</template>
</el-menu>
<!--导航菜单-折叠后-->
<ul class="el-menu el-menu-vertical-demo collapsed" v-show="collapsed" ref="menuCollapsed">
<li v-for="(item,index) in $router.options.routes" v-if="!item.hidden" class="el-submenu item">
<template v-if="!item.leaf">
<div class="el-submenu__title" style="padding-left: 20px;" @mouseover="showMenu(index,true)" @mouseout="showMenu(index,false)"><i :class="item.iconCls"></i></div>
<ul class="el-menu submenu" :class="'submenu-hook-'+index" @mouseover="showMenu(index,true)" @mouseout="showMenu(index,false)">
<li v-for="child in item.children" v-if="!child.hidden" :key="child.path" class="el-menu-item" style="padding-left: 40px;" :class="$route.path==child.path?'is-active':''" @click="$router.push(child.path)">{{child.name}}</li>
</ul>
</template>
<template v-else>
<li class="el-submenu">
<div class="el-submenu__title el-menu-item" style="padding-left: 20px;height: 56px;line-height: 56px;padding: 0 20px;" :class="$route.path==item.children[0].path?'is-active':''" @click="$router.push(item.children[0].path)"><i :class="item.iconCls"></i></div>
</li>
</template>
</li>
</ul>
</aside>
<NavMenu></NavMenu>
<!-- <aside :class="collapsed?'menu-collapsed':'menu-expanded'">-->
<!-- &lt;!&ndash;导航菜单&ndash;&gt;-->
<!-- <el-menu :default-active="$route.path" class="el-menu-vertical-demo" @open="handleopen"-->
<!-- @close="handleclose" @select="handleselect" unique-opened router v-show="!collapsed"-->
<!-- style="width: 380px;height: 100%;margin-right: -18px">-->
<!-- &lt;!&ndash; ;overflow: scroll&ndash;&gt;-->
<!-- <div align="center" style="background-color: #2b2f3a;height: 67px">-->
<!-- <img src="./logo1.png">-->
<!-- <h1 style="color:white;display: inline-block">航空物流公共信息服务平台</h1>-->
<!-- &lt;!&ndash; ;font-weight: 600;font-size: 15px;line-height: 50px&ndash;&gt;-->
<!-- </div>-->
<!-- <template v-for="(item,index) in $router.options.routes" v-if="!item.hidden">-->
<!-- <el-submenu :index="index+''" v-if="!item.leaf">-->
<!-- <template slot="title"><i :class="item.iconCls"></i>{{item.name}}</template>-->
<!-- <el-menu-item v-for="child in item.children" :index="child.path" :key="child.path" v-if="!child.hidden">{{child.name}}</el-menu-item>-->
<!-- </el-submenu>-->
<!-- <el-menu-item v-if="item.leaf&&item.children.length>0" :index="item.children[0].path"><i :class="item.iconCls"></i>{{item.children[0].name}}</el-menu-item>-->
<!-- </template>-->
<!-- </el-menu>-->
<!-- &lt;!&ndash;导航菜单-折叠后&ndash;&gt;-->
<!-- <ul class="el-menu el-menu-vertical-demo collapsed" v-show="collapsed" ref="menuCollapsed">-->
<!-- <li v-for="(item,index) in $router.options.routes" v-if="!item.hidden" class="el-submenu item">-->
<!-- <template v-if="!item.leaf">-->
<!-- <div class="el-submenu__title" style="padding-left: 20px;" @mouseover="showMenu(index,true)" @mouseout="showMenu(index,false)"><i :class="item.iconCls"></i></div>-->
<!-- <ul class="el-menu submenu" :class="'submenu-hook-'+index" @mouseover="showMenu(index,true)" @mouseout="showMenu(index,false)">-->
<!-- <li v-for="child in item.children" v-if="!child.hidden" :key="child.path" class="el-menu-item" style="padding-left: 40px;" :class="$route.path==child.path?'is-active':''" @click="$router.push(child.path)">{{child.name}}</li>-->
<!-- </ul>-->
<!-- </template>-->
<!-- <template v-else>-->
<!-- <li class="el-submenu">-->
<!-- <div class="el-submenu__title el-menu-item" style="padding-left: 20px;height: 56px;line-height: 56px;padding: 0 20px;" :class="$route.path==item.children[0].path?'is-active':''" @click="$router.push(item.children[0].path)"><i :class="item.iconCls"></i></div>-->
<!-- </li>-->
<!-- </template>-->
<!-- </li>-->
<!-- </ul>-->
<!-- </aside>-->
<div class="tabM" >
<TabMenu></TabMenu>
</div>
... ... @@ -96,6 +97,7 @@
import { editPass,resetToken} from '../api/user';
import ElFormItem from "element-ui/packages/form/src/form-item";
import TabMenu from "@/components/TabMenu"
import NavMenu from "@/components/NavMenu"
export default {
... ... @@ -104,7 +106,7 @@
reload: this.reload
}
},
components: {ElFormItem,TabMenu},
components: {ElFormItem,TabMenu,NavMenu},
data() {
// var validatePass = (rule, value, callback) => {
// if (!value) {
... ... @@ -284,8 +286,7 @@
this.collapsed=!this.collapsed;
},
showMenu(i,status){
this.$refs.menuColl
apsed.getElementsByClassName('submenu-hook-'+i)[0].style.display=status?'block':'none';
this.$refs.menuCollapsed.getElementsByClassName('submenu-hook-'+i)[0].style.display=status?'block':'none';
},
},
... ... @@ -385,8 +386,8 @@
bottom: 0px;
overflow: hidden;
aside {
flex:0 0 300px;
width: 300px;
flex:0 0 380px;
width: 380px;
overflow-x: hidden;
overflow-y: scroll;
position: relative;
... ...