Commit 62a20016 authored by 黄奎's avatar 黄奎

权限设置样式调整

parent b384cda2
...@@ -2018,7 +2018,7 @@ ...@@ -2018,7 +2018,7 @@
this.allWindowWidth = allWindowWidth - 50 - 220 - 60; this.allWindowWidth = allWindowWidth - 50 - 220 - 60;
let maxLength = parseInt(allWindowWidth / 110); let maxLength = parseInt(allWindowWidth / 110);
this.maxLength = maxLength; this.maxLength = maxLength;
this.testApi(); //this.testApi();
//this.testEmp(); //this.testEmp();
let userinfo = this.getLocalStorage(); let userinfo = this.getLocalStorage();
let ActionMenuCode = userinfo.ActionMenuCode; let ActionMenuCode = userinfo.ActionMenuCode;
...@@ -2194,7 +2194,7 @@ ...@@ -2194,7 +2194,7 @@
//测试方法 //测试方法
testEmp() { testEmp() {
var postMsg = { var postMsg = {
EmPassword: "US9TjP7aGsU=" EmPassword: ""
}; };
this.apipost( this.apipost(
"admin_get_AnalysisPassword", postMsg, "admin_get_AnalysisPassword", postMsg,
......
<style> <style>
.per_title { .per_title {
font-size: 14px; font-size: 14px;
color: #333; color: #333;
border-left: 3px solid #e95252; border-left: 3px solid #e95252;
height: 14px; height: 14px;
line-height: 14px; line-height: 14px;
margin: 40px 0; margin: 40px 0;
padding-left: 15px; padding-left: 15px;
} }
.mentTable {
background: #bcbcbc; .mentTable {
width: 100%; background: #bcbcbc;
font-size: 14px; width: 100%;
} font-size: 14px;
.mentTable td { }
background: #fff;
height: 30px; .mentTable td {
} background: #fff;
.per_first_menu { height: 30px;
overflow: hidden; }
}
.per_first_menu li { .per_first_menu {
float: left; overflow: hidden;
margin-right: 30px; }
position: relative;
cursor: pointer; .per_first_menu li {
background: #fff; float: left;
color: #999; margin-right: 30px;
width: 80px; margin-top: 5px;
font-size: 12px; position: relative;
height: 60px; cursor: pointer;
padding: 10px 0; background: #fff;
border-radius: 4px; color: #999;
text-align: center; width: 80px;
} font-size: 12px;
.per_first_menu li.FirsrMenuCked { height: 60px;
background: #e95252; padding: 10px 0;
color: #f1f1f1; border-radius: 4px;
} text-align: center;
.per_first_menu li i { }
font-size: 30px;
line-height: 35px; .per_first_menu li.FirsrMenuCked {
} background: #e95252;
.per_first_menu-set { color: #f1f1f1;
overflow: hidden; }
}
.per_first_menu-set li { .per_first_menu li i {
float: left; font-size: 30px;
margin-right: 30px; line-height: 35px;
position: relative; }
cursor: pointer;
background: #fff; .per_first_menu-set {
color: #999; overflow: hidden;
width: 140px; }
font-size: 12px;
height: 80px; .per_first_menu-set li {
padding: 0 10px; float: left;
border-radius: 4px; margin-right: 30px;
border-bottom: 1px solid #eee margin-top: 5px;
} position: relative;
.per_first_menu-set li.FirsrMenuCked { cursor: pointer;
background: #e95252; background: #fff;
color: #f1f1f1; color: #999;
} width: 140px;
.per_first_menu-set li i { font-size: 12px;
font-size: 30px; height: 80px;
} padding: 0 10px;
.per_detail_menu { border-radius: 4px;
width: 100%; border-bottom: 1px solid #eee
height: 300px; }
padding: 20px;
margin: 40px 0; .per_first_menu-set li.FirsrMenuCked {
background: #fff; background: #e95252;
border-radius: 8px; color: #f1f1f1;
} }
.per_secondMenu {
height: auto; .per_first_menu-set li i {
overflow: hidden; font-size: 30px;
margin-bottom: 20px; }
}
.per_secondMenu li { .per_detail_menu {
float: left; width: 100%;
height: 24px; height: 300px;
font-size: 12px; padding: 20px;
cursor: pointer; margin: 40px 0;
padding: 0 30px; background: #fff;
position: relative; border-radius: 8px;
} }
.per_secondMenu li > div {
width: 0; .per_secondMenu {
height: 3px; height: auto;
background: #f26262; overflow: hidden;
margin: 5px auto 0; margin-bottom: 20px;
} }
.per_secondMenu li:hover > div {
width: 17px; .per_secondMenu li {
transition: width 0.3s; float: left;
} height: 24px;
.per_secondMenu li.per_secondLevelCked > div { font-size: 12px;
width: 17px; cursor: pointer;
} padding: 0 30px;
.per_secondMenu li .liSplit { position: relative;
height: 12px; }
width: 1px;
background: #dcdfe6; .per_secondMenu li>div {
position: absolute; width: 0;
right: 0; height: 3px;
top: 2px; background: #f26262;
} margin: 5px auto 0;
.per_thirdMenu li { }
float: left;
margin: 0 50px 50px 0; .per_secondMenu li:hover>div {
width: 80px; width: 17px;
cursor: pointer; transition: width 0.3s;
height: 85px; }
padding: 15px 10px 0;
position: relative; .per_secondMenu li.per_secondLevelCked>div {
font-size: 12px; width: 17px;
color: #666; }
text-align: center;
border-radius: 4px; .per_secondMenu li .liSplit {
background: #ebebeb; height: 12px;
} width: 1px;
.per_thirdMenu li i { background: #dcdfe6;
position: absolute; position: absolute;
bottom: 10px; right: 0;
right: 10px; top: 2px;
font-size: 20px; }
}
.per_SaveBtn { .per_thirdMenu li {
float: right; float: left;
margin-top: 50px; margin: 0 50px 50px 0;
margin-left: 15px; width: 80px;
} cursor: pointer;
.per_thirdMenu li.thirdLevelMenuCked { height: 85px;
background: #e95252; padding: 15px 10px 0;
color: #f1f1f1; position: relative;
} font-size: 12px;
.per_firstLevelCkbox { color: #666;
position: absolute !important; text-align: center;
right: 3px; border-radius: 4px;
top: 0; background: #ebebeb;
} }
.per_thirdLevelAllCked {
float: right; .per_thirdMenu li i {
} position: absolute;
bottom: 10px;
right: 10px;
font-size: 20px;
}
.per_SaveBtn {
float: right;
margin-top: 50px;
margin-left: 15px;
}
.per_thirdMenu li.thirdLevelMenuCked {
background: #e95252;
color: #f1f1f1;
}
.per_firstLevelCkbox {
position: absolute !important;
right: 3px;
top: 0;
}
.per_thirdLevelAllCked {
float: right;
}
</style> </style>
<template> <template>
<div> <div>
<div class="per_title">{{$t('objFill.quanxianshezhi')}}</div> <div class="per_title">{{$t('objFill.quanxianshezhi')}}</div>
<div class="per_first_menu"> <div class="per_first_menu">
<ul> <ul>
<li <template v-for="(item, index) in MenuList">
v-model="item.IsShow" <li v-model="item.IsShow" @click="getSecondLevelMenu(index)" :class="{ FirsrMenuCked: index == firstLevel }"
v-for="(item, index) in MenuList" :key="`f_`+index">
@click="getSecondLevelMenu(index)" <i :class="[fontPub, item.icon]"></i><br />{{ item.MenuName }}
:class="{ FirsrMenuCked: index == firstLevel }" <el-checkbox :indeterminate="item.choseParent" class="per_firstLevelCkbox" type="checkbox"
> :value="item.IsShow" v-model="item.IsShow" @change="firstCheckAll" v-bind:checked="item.IsShow">
<i :class="[fontPub, item.icon]"></i><br />{{ item.MenuName }} </el-checkbox>
<el-checkbox </li>
:indeterminate="item.choseParent" </template>
class="per_firstLevelCkbox" <el-button type="primary" class="normalBtn per_SaveBtn" :loading="saveLoading" @click="updateMenu()">
type="checkbox" {{$t('pub.saveBtn')}}</el-button>
:value="item.IsShow"
v-model="item.IsShow"
@change="firstCheckAll"
v-bind:checked="item.IsShow"
></el-checkbox>
</li>
<input
type="button"
:value="$t('pub.saveBtn')"
class="normalBtn per_SaveBtn"
@click="updateMenu()"
/>
<!-- <input type="button" :value="$t('pub.returnBack')" class="hollowFixedBtn per_SaveBtn" @click="goback"/>-->
</ul> </ul>
</div> </div>
<div class="per_detail_menu"> <div class="per_detail_menu">
<div <div class="per_secondMenu" v-if="MenuList.length > 0 && MenuList[firstLevel].ChildMenu != null">
class="per_secondMenu" <template v-for="(item, index) in MenuList[firstLevel].ChildMenu">
v-if="MenuList.length > 0 && MenuList[firstLevel].ChildMenu != null" <li v-model="item.IsShow" :class="{ per_secondLevelCked: index == secondLevel }"
> @click="getThirdLevelMenu(index)" :key="`f_`+firstLevel+`_s_`+index">
<li {{ item.MenuName }}
v-model="item.IsShow" <div></div>
:class="{ per_secondLevelCked: index == secondLevel }" <span class="liSplit"></span>
v-for="(item, index) in MenuList[firstLevel].ChildMenu" </li>
@click="getThirdLevelMenu(index)" </template>
> <el-checkbox class="per_thirdLevelAllCked" @change="checkedAll($event)" v-model="secondChkAllState">
{{ item.MenuName }} {{$t('system.table_chekAll')}}</el-checkbox>
<div></div>
<span class="liSplit"></span>
</li>
<el-checkbox
class="per_thirdLevelAllCked"
@change="checkedAll($event)"
v-model="secondChkAllState"
>{{$t('system.table_chekAll')}}</el-checkbox
>
</div> </div>
<div <div class="per_thirdMenu" v-if="MenuList.length > 0 && MenuList[firstLevel].ChildMenu != null">
class="per_thirdMenu" <template v-for="(item, index) in MenuList[firstLevel].ChildMenu[secondLevel]
v-if="MenuList.length > 0 && MenuList[firstLevel].ChildMenu != null" .ChildMenu">
> <li v-model="item.IsShow" @click="thirdLevelMenuCked(item)" :class="{ thirdLevelMenuCked: item.IsShow }"
<li :key="`f_`+firstLevel+`_s_`+secondLevel+`_t_`+index">
v-model="item.IsShow" {{ item.MenuName }}<i :class="[fontPub, item.icon]"></i>
@click="thirdLevelMenuCked(item)" </li>
:class="{ thirdLevelMenuCked: item.IsShow }" </template>
v-for="(item, index) in MenuList[firstLevel].ChildMenu[secondLevel]
.ChildMenu"
>
{{ item.MenuName }}<i :class="[fontPub, item.icon]"></i>
</li>
</div> </div>
</div> </div>
<el-row>
<div class="per_title">{{$t('objFill.gongnenggl')}}</div> <el-col :span="12">
<div class="per_title">{{$t('objFill.gongnenggl')}}</div>
</el-col>
<el-col :span="12">
<el-tooltip class="item" effect="dark" content="保存功能权限" placement="top-start">
<el-button type="primary" class="normalBtn per_SaveBtn" :loading="saveLoading" @click="saveAction()">
{{$t('pub.saveBtn')}}</el-button>
</el-tooltip>
</el-col>
</el-row>
<div class="per_first_menu-set"> <div class="per_first_menu-set">
<ul> <ul>
<li <template v-for="(item, index) in actionList">
v-model="item.IsShow" <el-tooltip :key="`a_t_`+index" class="item" effect="dark" :content="item.Remarks" v-if="item.Remarks!=''"
v-for="(item, index) in actionList" placement="top-start">
@click="item.IsShow = !item.IsShow" <li v-model="item.IsShow" @click="item.IsShow = !item.IsShow" :key="`a_`+index">
> <el-checkbox type="checkbox" :value="item.IsShow" v-model="item.IsShow" v-bind:checked="item.IsShow">
<el-checkbox </el-checkbox>
type="checkbox" <i :class="[fontPub, item.icon]"></i><span>{{ item.ActionName }}</span>
:value="item.IsShow" <div></div>
v-model="item.IsShow" <span>{{ item.ActionCode }}</span>
v-bind:checked="item.IsShow" </li>
></el-checkbox> </el-tooltip>
<i :class="[fontPub, item.icon]"></i </template>
><span>{{ item.ActionName }}</span>
<div></div>
<span>{{ item.ActionCode }}</span>
</li>
<input
type="button"
:value="$t('pub.saveBtn')"
class="normalBtn per_SaveBtn"
@click="saveAction()"
/>
</ul> </ul>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
fontPub: "iconfont", fontPub: "iconfont",
MenuList: [], MenuList: [],
thirdLevelMenu: [], thirdLevelMenu: [],
msg: { msg: {
RoleId: 0, RoleId: 0,
},
updateMsg: {
RoleId: 0,
Permission: [],
},
firstLevel: 0,
secondLevel: 0,
secondChkAllState: false,
//功能菜单
actionList: [],
};
},
mounted() {
this.updateMsg.RoleId = this.msg.RoleId = this.$route.query.id;
let sysId = this.$route.query.sysId;
this.getMenu();
this.getActionMenu();
},
methods: {
getActionMenu() {
this.apipost(
"admin_get_RoleGetPostPermissionAction",
this.updateMsg,
(res) => {
if (res.data.resultCode == 1) {
let tempList = res.data.data;
this.actionList = tempList;
} else {
}
}, },
(err) => {} updateMsg: {
); RoleId: 0,
}, Permission: [],
getMenu() {
this.apipost(
"admin_get_RoleGetPostPermission",
this.updateMsg,
(res) => {
if (res.data.resultCode == 1) {
let tempList = res.data.data;
tempList.forEach((x) => {
if (x.ParentId == 0) {
let menuStyle = JSON.parse(x.MenuStyle);
x.icon = menuStyle.icon;
x.color = menuStyle.color;
x.choseParent = false;
this.initParentChk(x);
this.MenuList.push(x);
}
});
} else {
}
}, },
(err) => {} firstLevel: 0,
); secondLevel: 0,
secondChkAllState: false,
//功能菜单
actionList: [],
saveLoading: false,
};
}, },
updateMenu() { mounted() {
this.MenuList.forEach((x) => {}); this.updateMsg.RoleId = this.msg.RoleId = this.$route.query.id;
this.updateMsg.Permission = []; let sysId = this.$route.query.sysId;
this.getCkdId(this.MenuList); this.getMenu();
this.apipost( this.getActionMenu();
"admin_post_RoleUpdateRolePermission",
this.updateMsg,
(res) => {
if (res.data.resultCode == 1) {
this.$message.success(this.$t('tips.saveYes'));
} else {
this.$message.error(this.$t('objFill.baocunshibai'));
}
},
(err) => {}
);
}, },
getSecondLevelMenu(index) { methods: {
this.firstLevel = index; getActionMenu() {
this.secondLevel = 0; this.apipost(
this.threeChange(); "admin_get_RoleGetPostPermissionAction",
this.getThirdLevelMenu(0); this.updateMsg,
}, (res) => {
getThirdLevelMenu(index) { if (res.data.resultCode == 1) {
//三级菜单 let tempList = res.data.data;
this.secondLevel = index; this.actionList = tempList;
this.MenuList[this.firstLevel].ChildMenu[index].ChildMenu.forEach((x) => { } else {}
let menuStyle = JSON.parse(x.MenuStyle); },
x.icon = menuStyle.icon; (err) => {}
x.color = menuStyle.color; );
this.thirdLevelMenu.push(x); },
}); getMenu() {
this.threeChange(); this.apipost(
}, "admin_get_RoleGetPostPermission",
thirdLevelMenuCked(item) { this.updateMsg,
item.IsShow = !item.IsShow; (res) => {
this.threeChange(); if (res.data.resultCode == 1) {
}, let tempList = res.data.data;
firstCheckAll() { tempList.forEach((x) => {
this.MenuList[this.firstLevel].ChildMenu.forEach((x) => { if (x.ParentId == 0) {
x.IsShow = this.MenuList[this.firstLevel].IsShow; let menuStyle = JSON.parse(x.MenuStyle);
x.ChildMenu.forEach((item, index) => { x.icon = menuStyle.icon;
item.IsShow = x.IsShow; x.color = menuStyle.color;
x.choseParent = false;
this.initParentChk(x);
this.MenuList.push(x);
}
});
} else {}
},
(err) => {}
);
},
updateMenu() {
this.MenuList.forEach((x) => {});
this.updateMsg.Permission = [];
this.getCkdId(this.MenuList);
this.saveLoading = true;
this.apipost(
"admin_post_RoleUpdateRolePermission",
this.updateMsg,
(res) => {
this.saveLoading = false;
if (res.data.resultCode == 1) {
this.$message.success(this.$t('tips.saveYes'));
} else {
this.$message.error(this.$t('objFill.baocunshibai'));
}
},
(err) => {
this.saveLoading = false;
}
);
},
getSecondLevelMenu(index) {
this.firstLevel = index;
this.secondLevel = 0;
this.threeChange();
this.getThirdLevelMenu(0);
},
getThirdLevelMenu(index) {
//三级菜单
this.secondLevel = index;
this.MenuList[this.firstLevel].ChildMenu[index].ChildMenu.forEach((x) => {
let menuStyle = JSON.parse(x.MenuStyle);
x.icon = menuStyle.icon;
x.color = menuStyle.color;
this.thirdLevelMenu.push(x);
}); });
}); this.threeChange();
this.MenuList[this.firstLevel].choseParent = false; },
this.threeChange(); thirdLevelMenuCked(item) {
}, item.IsShow = !item.IsShow;
checkedAll() { this.threeChange();
let thirdMenuLength = },
this.MenuList[this.firstLevel].ChildMenu[this.secondLevel].ChildMenu firstCheckAll() {
.length; this.MenuList[this.firstLevel].ChildMenu.forEach((x) => {
let chkNo = 0; x.IsShow = this.MenuList[this.firstLevel].IsShow;
this.MenuList[this.firstLevel].ChildMenu[ x.ChildMenu.forEach((item, index) => {
this.secondLevel item.IsShow = x.IsShow;
].ChildMenu.forEach((item) => { });
if (item.IsShow == true) chkNo++;
});
if (chkNo == thirdMenuLength) {
this.MenuList[this.firstLevel].ChildMenu[
this.secondLevel
].ChildMenu.forEach((item) => {
item.IsShow = false;
}); });
} else { this.MenuList[this.firstLevel].choseParent = false;
this.threeChange();
},
checkedAll() {
let thirdMenuLength =
this.MenuList[this.firstLevel].ChildMenu[this.secondLevel].ChildMenu
.length;
let chkNo = 0;
this.MenuList[this.firstLevel].ChildMenu[ this.MenuList[this.firstLevel].ChildMenu[
this.secondLevel this.secondLevel
].ChildMenu.forEach((item) => { ].ChildMenu.forEach((item) => {
item.IsShow = true; if (item.IsShow == true) chkNo++;
}); });
} if (chkNo == thirdMenuLength) {
this.threeChange(); this.MenuList[this.firstLevel].ChildMenu[
}, this.secondLevel
threeChange() { ].ChildMenu.forEach((item) => {
let chkCount = 0; item.IsShow = false;
let count = 0; });
this.MenuList[this.firstLevel].ChildMenu.forEach((x, i) => { } else {
let secondCheckCount = 0; this.MenuList[this.firstLevel].ChildMenu[
x.ChildMenu.forEach((item, index) => { this.secondLevel
count++; ].ChildMenu.forEach((item) => {
if (item.IsShow) { item.IsShow = true;
chkCount++; });
secondCheckCount++; }
this.threeChange();
},
threeChange() {
let chkCount = 0;
let count = 0;
this.MenuList[this.firstLevel].ChildMenu.forEach((x, i) => {
let secondCheckCount = 0;
x.ChildMenu.forEach((item, index) => {
count++;
if (item.IsShow) {
chkCount++;
secondCheckCount++;
}
});
if (this.secondLevel == i) {
if (x.ChildMenu.length > 0) {
this.secondChkAllState = x.ChildMenu.length == secondCheckCount;
} else this.secondChkAllState = false;
} }
x.IsShow = secondCheckCount > 0;
}); });
if (this.secondLevel == i) {
if (x.ChildMenu.length > 0) {
this.secondChkAllState = x.ChildMenu.length == secondCheckCount;
} else this.secondChkAllState = false;
}
x.IsShow = secondCheckCount > 0;
});
this.MenuList[this.firstLevel].IsShow = chkCount > 0; this.MenuList[this.firstLevel].IsShow = chkCount > 0;
this.MenuList[this.firstLevel].choseParent = this.MenuList[this.firstLevel].choseParent =
chkCount > 0 && chkCount < count; chkCount > 0 && chkCount < count;
}, },
initParentChk(p) { initParentChk(p) {
if (!p.ChildMenu || p.ChildMenu.length == 0 || p.ChildMenu) return; if (!p.ChildMenu || p.ChildMenu.length == 0 || p.ChildMenu) return;
let chkCount = 0; let chkCount = 0;
let count = 0; let count = 0;
p.ChildMenu.forEach((x) => { p.ChildMenu.forEach((x) => {
x.ChildMenu.forEach((item, index) => { x.ChildMenu.forEach((item, index) => {
count++; count++;
if (item.IsShow) { if (item.IsShow) {
chkCount++; chkCount++;
} }
});
}); });
}); p.choseParent = chkCount > 0 && chkCount < count;
p.choseParent = chkCount > 0 && chkCount < count; p.IsShow = chkCount > 0;
p.IsShow = chkCount > 0; },
}, //保存功能管理
//保存功能管理 saveAction() {
saveAction() { this.updateMsg.Permission = [];
this.updateMsg.Permission = []; this.getCkdActionId(this.actionList);
this.getCkdActionId(this.actionList); this.saveLoading = true;
this.apipost( this.apipost(
"admin_post_RoleUpdateRolePermissionAction", "admin_post_RoleUpdateRolePermissionAction",
this.updateMsg, this.updateMsg,
(res) => { (res) => {
if (res.data.resultCode == 1) { this.saveLoading = false;
this.$message.success(this.$t('tips.saveYes')); if (res.data.resultCode == 1) {
} else { this.$message.success(this.$t('tips.saveYes'));
this.$message.error(this.$t('objFill.baocunshibai')); } else {
this.$message.error(this.$t('objFill.baocunshibai'));
}
},
(err) => {
this.saveLoading = false;
} }
}, );
(err) => {} },
);
},
getCkdId(array) { getCkdId(array) {
array.forEach((x) => { array.forEach((x) => {
if (x.IsShow == 1 || x.IsShow == true) { if (x.IsShow == 1 || x.IsShow == true) {
this.updateMsg.Permission.push(x.MenuId); this.updateMsg.Permission.push(x.MenuId);
if (x.ChildMenu) { if (x.ChildMenu) {
this.getCkdId(x.ChildMenu); this.getCkdId(x.ChildMenu);
}
} }
} });
}); },
}, //过滤获取功能管理id
//过滤获取功能管理id getCkdActionId(array) {
getCkdActionId(array) { array.forEach((x) => {
array.forEach((x) => { if (x.IsShow == 1 || x.IsShow == true) {
if (x.IsShow == 1 || x.IsShow == true) { this.updateMsg.Permission.push(x.Id);
this.updateMsg.Permission.push(x.Id); }
} });
}); },
}, goback() {
goback() { history.back(-1);
history.back(-1); },
}, },
}, };
};
</script>
</script>
...@@ -27,6 +27,7 @@ ...@@ -27,6 +27,7 @@
.per_first_menu li { .per_first_menu li {
float: left; float: left;
margin-right: 30px; margin-right: 30px;
margin-top: 5px;
position: relative; position: relative;
cursor: pointer; cursor: pointer;
background: #fff; background: #fff;
...@@ -141,54 +142,102 @@ ...@@ -141,54 +142,102 @@
float: right; float: right;
} }
.per_first_menu-set {
overflow: hidden;
}
.per_first_menu-set li {
float: left;
margin-right: 30px;
margin-top: 5px;
position: relative;
cursor: pointer;
background: #fff;
color: #999;
width: 140px;
font-size: 12px;
height: 80px;
padding: 0 10px;
border-radius: 4px;
border-bottom: 1px solid #eee
}
.per_first_menu-set li.FirsrMenuCked {
background: #e95252;
color: #f1f1f1;
}
.per_first_menu-set li i {
font-size: 30px;
}
</style> </style>
<template> <template>
<div> <div>
<div class="per_title">{{$t('objFill.quanxianshezhi')}}</div> <div class="per_title">{{$t('objFill.quanxianshezhi')}}</div>
<div class="per_first_menu"> <div class="per_first_menu">
<ul> <ul>
<li v-model="item.IsShow" v-for="(item,index) in MenuList" @click="getSecondLevelMenu(index)" <template v-for="(item,index) in MenuList">
:class="{FirsrMenuCked:index==firstLevel}"> <li v-model="item.IsShow" @click="getSecondLevelMenu(index)" :key="`f_`+index"
<i :class="[fontPub,item.icon]"></i><br />{{item.MenuName}} :class="{FirsrMenuCked:index==firstLevel}">
<el-checkbox :indeterminate="item.choseParent" class="per_firstLevelCkbox" type="checkbox" <i :class="[fontPub,item.icon]"></i><br />{{item.MenuName}}
:value="item.IsShow" v-model="item.IsShow" @change="firstCheckAll" v-bind:checked="item.IsShow"> <el-checkbox :indeterminate="item.choseParent" class="per_firstLevelCkbox" type="checkbox"
</el-checkbox> :value="item.IsShow" v-model="item.IsShow" @change="firstCheckAll" v-bind:checked="item.IsShow">
</li> </el-checkbox>
</li>
<input type="button" :value="$t('pub.saveBtn')" class="normalBtn per_SaveBtn" @click="updateMenu()" /> </template>
<!-- <input type="button" :value="$t('pub.returnBack')" class="hollowFixedBtn per_SaveBtn" @click="goback"/>--> <el-tooltip class="item" effect="dark" content="保存菜单权限" placement="top-start">
<el-button type="primary" class="normalBtn per_SaveBtn" :loading="saveLoading" @click="updateMenu()">
{{$t('pub.saveBtn')}}</el-button>
</el-tooltip>
</ul> </ul>
</div> </div>
<div class="per_detail_menu"> <div class="per_detail_menu">
<div class="per_secondMenu" v-if="MenuList.length>0 && MenuList[firstLevel].ChildMenu!=null"> <div class="per_secondMenu" v-if="MenuList.length>0 && MenuList[firstLevel].ChildMenu!=null">
<li v-model="item.IsShow" :class="{per_secondLevelCked:index==secondLevel}" <template v-for="(item,index) in MenuList[firstLevel].ChildMenu">
v-for="(item,index) in MenuList[firstLevel].ChildMenu" @click="getThirdLevelMenu(index)">{{item.MenuName}} <li v-model="item.IsShow" :class="{per_secondLevelCked:index==secondLevel}" :key="`f_`+firstLevel+`_s_`+index"
<div></div><span class="liSplit"></span></li> @click="getThirdLevelMenu(index)">{{item.MenuName}}
<div></div><span class="liSplit"></span></li>
</template>
<el-checkbox class='per_thirdLevelAllCked' @change='checkedAll($event)' v-model='secondChkAllState'>全选 <el-checkbox class='per_thirdLevelAllCked' @change='checkedAll($event)' v-model='secondChkAllState'>全选
</el-checkbox> </el-checkbox>
</div> </div>
<div class="per_thirdMenu" v-if="MenuList.length>0 && MenuList[firstLevel].ChildMenu!=null"> <div class="per_thirdMenu" v-if="MenuList.length>0 && MenuList[firstLevel].ChildMenu!=null">
<li v-model="item.IsShow" @click="thirdLevelMenuCked(item)" :class="{thirdLevelMenuCked:item.IsShow}" <template v-for="(item,index) in MenuList[firstLevel].ChildMenu[secondLevel].ChildMenu">
v-for="(item,index) in MenuList[firstLevel].ChildMenu[secondLevel].ChildMenu">{{item.MenuName}}<i <li v-model="item.IsShow" @click="thirdLevelMenuCked(item)" :class="{thirdLevelMenuCked:item.IsShow}"
:class="[fontPub,item.icon]"></i></li> :key="`f_`+firstLevel+`_s_`+secondLevel+`_t_`+index">{{item.MenuName}}<i :class="[fontPub,item.icon]"></i>
</li>
</template>
</div> </div>
</div> </div>
<el-row>
<div class="per_title">{{$t('objFill.gongnenggl')}}</div> <el-col :span="12">
<div class="per_first_menu"> <div class="per_title">{{$t('objFill.gongnenggl')}}</div>
</el-col>
<el-col :span="12">
<el-tooltip class="item" effect="dark" content="保存功能权限" placement="top-start">
<el-button type="primary" class="normalBtn per_SaveBtn" :loading="saveLoading" @click="saveAction()">
{{$t('pub.saveBtn')}}</el-button>
</el-tooltip>
</el-col>
</el-row>
<div class="per_first_menu-set">
<ul> <ul>
<li v-model="item.IsShow" v-for="(item,index) in actionList" @click="item.IsShow = !item.IsShow;"> <template v-for="(item,index) in actionList">
<i :class="[fontPub,item.icon]"></i><br />{{item.ActionName}} <el-tooltip :key="`a_t_`+index" class="item" effect="dark" :content="item.Remarks" v-if="item.Remarks!=''"
<el-checkbox class="per_firstLevelCkbox" type="checkbox" :value="item.IsShow" v-model="item.IsShow" placement="top-start">
v-bind:checked="item.IsShow"></el-checkbox> <li v-model="item.IsShow" @click="item.IsShow = !item.IsShow" :key="`a_`+index">
</li> <el-checkbox type="checkbox" :value="item.IsShow" v-model="item.IsShow" v-bind:checked="item.IsShow">
<input type="button" :value="$t('pub.saveBtn')" class="normalBtn per_SaveBtn" @click="saveAction()" /> </el-checkbox>
<i :class="[fontPub,item.icon]"></i>{{item.ActionName}}
<div></div>
<span>{{ item.ActionCode }}</span>
</li>
</el-tooltip>
</template>
</ul> </ul>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
...@@ -208,10 +257,9 @@ ...@@ -208,10 +257,9 @@
firstLevel: 0, firstLevel: 0,
secondLevel: 0, secondLevel: 0,
secondChkAllState: false, secondChkAllState: false,
//功能菜单 //功能菜单
actionList: [], actionList: [],
saveLoading: false,
} }
}, },
mounted() { mounted() {
...@@ -226,7 +274,7 @@ ...@@ -226,7 +274,7 @@
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
let tempList = res.data.data; let tempList = res.data.data;
this.actionList = tempList; this.actionList = tempList;
} else {} }
}, err => {}) }, err => {})
}, },
getMenu() { getMenu() {
...@@ -250,29 +298,35 @@ ...@@ -250,29 +298,35 @@
this.MenuList.forEach(x => {}) this.MenuList.forEach(x => {})
this.updateMsg.Permission = [] this.updateMsg.Permission = []
this.getCkdId(this.MenuList); this.getCkdId(this.MenuList);
this.saveLoading = true;
this.apipost("admin_post_UpdateVersionsPermission", this.updateMsg, res => { this.apipost("admin_post_UpdateVersionsPermission", this.updateMsg, res => {
this.saveLoading = false;
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.$message.success('保存成功!') this.$message.success('保存成功!')
} else { } else {
this.$message.error('保存失败!') this.$message.error('保存失败!')
} }
}, err => {}) }, err => {
this.saveLoading = false;
})
}, },
//保存功能管理 //保存功能管理
saveAction() { saveAction() {
this.updateMsg.Permission = [] this.updateMsg.Permission = []
this.getCkdActionId(this.actionList); this.getCkdActionId(this.actionList);
this.saveLoading = true;
this.apipost("admin_post_UpdateVersionsPermissionAction", this.updateMsg, res => { this.apipost("admin_post_UpdateVersionsPermissionAction", this.updateMsg, res => {
this.saveLoading = false;
if (res.data.resultCode == 1) { if (res.data.resultCode == 1) {
this.$message.success('保存成功!') this.$message.success('保存成功!')
} else { } else {
this.$message.error('保存失败!') this.$message.error('保存失败!')
} }
}, err => {}) }, err => {
this.saveLoading = false;
})
}, },
getSecondLevelMenu(index) { getSecondLevelMenu(index) {
this.firstLevel = index; this.firstLevel = index;
this.secondLevel = 0; this.secondLevel = 0;
this.threeChange(); this.threeChange();
...@@ -319,7 +373,6 @@ ...@@ -319,7 +373,6 @@
}) })
} }
this.threeChange() this.threeChange()
}, },
threeChange() { threeChange() {
let chkCount = 0 let chkCount = 0
...@@ -341,7 +394,6 @@ ...@@ -341,7 +394,6 @@
} }
x.IsShow = secondCheckCount > 0 x.IsShow = secondCheckCount > 0
}) })
this.MenuList[this.firstLevel].IsShow = chkCount > 0 this.MenuList[this.firstLevel].IsShow = chkCount > 0
this.MenuList[this.firstLevel].choseParent = chkCount > 0 && chkCount < count this.MenuList[this.firstLevel].choseParent = chkCount > 0 && chkCount < count
}, },
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment