朱兆平 / vue_cli · 提交

转到一个项目

作者 朱兆平
提交 0cef10f480fbc2b8b786afb18fef410274d37824 1 个父辈 16061210

菜单组件化继续优化

内嵌 并排对比
正在显示 7 个修改的文件 包含 62 行增加 和 44 行删除
... ... @@ -72,7 +72,7 @@ export default {
},
checkNull: params => {
if (params!==null && typeof(params)!="undefined"){
if (params!==null && typeof(params)!="undefined" && params !== ""){
return true;
}else {
return false;
... ...
... ... @@ -19,7 +19,7 @@
<!-- </el-radio-group>-->
<div align="center" style="height: 66px;line-height: 66px;">
<img id="logo" src="~@/assets/logo1.png">
<!-- <img id="logo" src="~@/assets/logo1.png">-->
<h1 id="logo-text" style="color:white;display: inline-block;font-weight: 600;font-size: 15px;line-height: 50px"> &nbsp; &nbsp;物流公共信息服务平台</h1>
</div>
<template v-for="(item,index) in menu">
... ...
... ... @@ -7,22 +7,22 @@
:closable = "tabCloseable"
@tab-click='tabClick'
@tab-remove="tabRemove"
style="width: 100%;margin-top: 0px;height: 50px">
style="width: 100%;margin-top: 0px;">
<el-tab-pane
v-for="(item, index) in this.$store.state.openTab"
:key="item.name"
:label="item.name"
:name="item.route">
<section class="content-container">
<div>
<el-col :span="24" class="content-wrapper">
<transition name="fade" mode="out-in">
<router-view></router-view>
</transition>
</el-col>
</div>
</section>
</el-tab-pane>
<section class="content-container">
<div>
<el-col :span="24" class="content-wrapper">
<transition name="fade" mode="out-in">
<router-view></router-view>
</transition>
</el-col>
</div>
</section>
</el-tabs>
</div>
</template>
... ... @@ -145,9 +145,12 @@
}
/*底层背景色*/
.el-tabs__nav-scroll{
background-color: rgb(239,243,246);
/*background-color: rgb(239,243,246);*/
}
/*首个内部边框*/
.el-tabs--card>.el-tabs__header{
border: none;
}
/*首个内部边框*/
.el-tabs--card>.el-tabs__header .el-tabs__item:first-child{
border: 1px solid rgba(80,109,130,.64);
}
... ... @@ -164,9 +167,9 @@
color:#495060;
height: 26px;
border: 1px solid rgba(80,109,130,.64);
margin: 4px 3px;
margin: 0px 3px;
line-height: 26px;
border-radius: 5px 5px 0 0;
border-radius: 0 0 5px 5px;
background-color: #fff;
font-size: 12px;
font-family: Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;
... ... @@ -174,7 +177,7 @@
/* 选中的黑框的样式*/
.el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
border-bottom: 1px solid rgba(80,109,130,.64);
border-radius: 5px 5px 0 0;
border-radius: 0 0 5px 5px;
background-color: #398af1;
color: #fff;
border-color: #398af1;
... ...
... ... @@ -189,20 +189,14 @@ let routes = [
// 货运系统--航班预配
{
path: '/domdep',
component: Home,
component: HomeNew,
name: '国内出港',
iconCls: 'el-icon-position',
children: [
{ path: '/preConfiguration', component: preConfiguration, name: '航班预配' },
{ path: '/allocate', component: allocate, name: '航班配载' },
{ 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: '/charge', component: charge, name: '付费处理' }
]
},
{
... ... @@ -234,7 +228,7 @@ let routes = [
},
{
path: '/output',
component: Home,
component: HomeNew,
name: '国际出港业务申报',
iconCls: 'el-icon-collection',
children: [
... ... @@ -310,7 +304,7 @@ let routes = [
{
path: '/nmms2',
component: Home,
component: HomeNew,
name: '进港业务申报',
iconCls: 'fa fa-id-card-o',
children: [
... ... @@ -328,7 +322,7 @@ let routes = [
// 货运系统--航班预配
{
path: '/flight_scheduling',
component: Home,
component: HomeNew,
name: '航班计划',
iconCls: 'el-icon-delete-location',
children: [
... ... @@ -348,7 +342,7 @@ let routes = [
},
{
path: '/airtransport',
component: Home,
component: HomeNew,
name: '通用业务申报',
iconCls:'el-icon-goods',
children:[
... ... @@ -362,7 +356,7 @@ let routes = [
},
{
path: '/querytransport',
component: Home,
component: HomeNew,
name: '通用业务查询',
iconCls:'el-icon-goods',
children:[
... ... @@ -376,7 +370,7 @@ let routes = [
},
{
path: '/input',
component: Home,
component: HomeNew,
name: '进港航班申报',
iconCls:'el-icon-goods',
children:[
... ... @@ -402,7 +396,7 @@ let routes = [
},
{
path: '/',
component: Home,
component: HomeNew,
name: '转关运抵',
iconCls: 'el-icon-delete-location',
children: [
... ... @@ -411,7 +405,7 @@ let routes = [
},
{
path: '/out',
component: Home,
component: HomeNew,
name: '出港航班申报',
iconCls:'el-icon-goods',
children:[
... ... @@ -425,7 +419,7 @@ let routes = [
},
{
path: '/at',
component: Home,
component: HomeNew,
name: '在港动态',
iconCls:'el-icon-goods',
children:[
... ...
... ... @@ -327,7 +327,7 @@
.header {
height: 70px;
line-height: 70px;
background: $color-primary url("~img/banner.png");
background: $color-primary url("~img/air-banner.png");
color:#fff;
.userinfo {
text-align: right;
... ...
... ... @@ -10,9 +10,9 @@
<!-- ;margin-top: 80px;z-index:9999;margin-left: 170px-->
<i style="color:#a6b6c6;vertical-align: middle;line-height: 60px;" :class="[collapsed?'el-icon-s-unfold':'el-icon-s-fold']"></i>
</div>
<i class="el-icon-question" style="vertical-align: middle;"></i>
<i class="el-icon-message-solid" style="vertical-align: middle;"></i>
<el-dropdown trigger="hover" style="margin-top:10px">
<i class="el-icon-question" style="vertical-align: middle;"></i>
<i class="el-icon-message-solid" style="vertical-align: middle;"></i>
<span class="el-dropdown-link userinfo-inner">
<img width="40" height="40" style="border-radius:50%;" src="~img/faceDefault.jpg"/></span>
<el-dropdown-menu slot="dropdown">
... ... @@ -25,7 +25,7 @@
</el-dropdown>
</el-header>
<el-main style="background-color:#f5f7fd;padding:10px">
<el-main>
<TabMenu></TabMenu>
</el-main>
</el-container>
... ... @@ -52,7 +52,7 @@
rotate:false,
sysName:'',
collapsed:false,
// sysUserName: '',
sysUserName: '',
sysUserId:'',
// sysUserAvatar: '',
isRouterAlive: true,
... ... @@ -181,8 +181,9 @@
width: 30px;
}
}
main{
main.el-main{
background-color:#f5f7fd;
padding:0 10px 10px 10px;
}
</style>
... ...
... ... @@ -15,7 +15,7 @@
<el-button type="success" @click="handleAdd" icon="el-icon-document">新&emsp;&emsp;增</el-button>
</el-form-item>
<el-form-item>
<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0" icon="el-icon-delete">批量删除</el-button>
</el-form-item>
... ... @@ -115,11 +115,24 @@
</el-dialog>
<!--权限设置界面-->
<el-dialog title="岗位的权限设置" :visible.sync="PermFormVisible" :close-on-click-modal="false">
<el-dialog title="岗位的权限设置"
:visible.sync="PermFormVisible"
:close-on-click-modal="false"
top="5vh"
>
<el-row>
<el-col :span="4" >
<el-button type="primary" @click.native="treeMerge(false)">合并节点</el-button>
</el-col>
<el-col :span="4">
<el-button type="success" @click.native="treeMerge(true)">展开节点</el-button>
</el-col>
</el-row>
<el-form :model="permForm" label-width="80px" ref="permForm">
<el-tree :data="permissons" :props="treeDefaultProps"
@check="clickDeal"
show-checkbox highlight-current default-expand-all check-on-click-node check-strictly
:default-expand-all = "treeExpand"
show-checkbox highlight-current check-on-click-node check-strictly
node-key="permissionId" ref="tree">
</el-tree>
</el-form>
... ... @@ -158,6 +171,7 @@
children: 'children',
label: 'name',
},
treeExpand: false,
departmentNameList:[],
roles: [],
permissons: [],
... ... @@ -209,6 +223,12 @@
}
},
methods: {
treeMerge: function (expand) {
this.treeExpand = expand;
for(var i=0;i<this.$refs.tree.store._getAllNodes().length;i++){
this.$refs.tree.store._getAllNodes()[i].expanded=this.treeExpand;
}
},
handleCurrentChange(val) {
this.pageNum = val;
this.getRoles();
... ...