|
|
|
|
@ -1,13 +1,22 @@
|
|
|
|
|
<template>
|
|
|
|
|
<el-dialog
|
|
|
|
|
class="blindDialog"
|
|
|
|
|
class="blindMenuDialog"
|
|
|
|
|
title="菜单功能绑定"
|
|
|
|
|
:visible.sync="isShow"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
width="470px"
|
|
|
|
|
@close="handleclose"
|
|
|
|
|
>
|
|
|
|
|
<div class="treeBoxList" v-loading="treeLoading">菜单</div>
|
|
|
|
|
<div class="treeBoxList" v-loading="treeLoading">
|
|
|
|
|
<el-checkbox-group v-model="checkedMenu">
|
|
|
|
|
<el-checkbox
|
|
|
|
|
v-for="item in menuCheckOption"
|
|
|
|
|
:label="item"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
>{{ item.desc }}</el-checkbox
|
|
|
|
|
>
|
|
|
|
|
</el-checkbox-group>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="isShow = false">取 消</el-button>
|
|
|
|
|
<el-button type="primary" @click="submitForm()">确 定</el-button>
|
|
|
|
|
@ -16,9 +25,9 @@
|
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
import {
|
|
|
|
|
getPermissionTree,
|
|
|
|
|
getPermission,
|
|
|
|
|
changePermission,
|
|
|
|
|
getMenuListApi,
|
|
|
|
|
getRolePermissionApi,
|
|
|
|
|
getRolechangePermissionApi,
|
|
|
|
|
} from "@/utils/api/index";
|
|
|
|
|
export default {
|
|
|
|
|
props: {},
|
|
|
|
|
@ -26,24 +35,12 @@ export default {
|
|
|
|
|
return {
|
|
|
|
|
roleUser: "",
|
|
|
|
|
isShow: false,
|
|
|
|
|
treeData: [],
|
|
|
|
|
defaultProps: {
|
|
|
|
|
//指定参数格式回显数据
|
|
|
|
|
children: "list",
|
|
|
|
|
label: "name",
|
|
|
|
|
key: "compositeKey", // 确保这里使用的是 uniqueKey
|
|
|
|
|
},
|
|
|
|
|
treeLoading: false,
|
|
|
|
|
rowData: "",
|
|
|
|
|
premissData: [],
|
|
|
|
|
selectTreeNode: [],
|
|
|
|
|
defaultExpandedArr: [],
|
|
|
|
|
rules: {
|
|
|
|
|
name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
|
|
|
|
|
},
|
|
|
|
|
xgrules: {
|
|
|
|
|
name: [{ required: true, message: "请输入用户名", trigger: "blur" }],
|
|
|
|
|
},
|
|
|
|
|
menuList: [],
|
|
|
|
|
checkedMenu: [],
|
|
|
|
|
menuCheckOption: [],
|
|
|
|
|
checkedIds: [], //权限返回的内容id
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
@ -51,70 +48,27 @@ export default {
|
|
|
|
|
getdataform(val) {
|
|
|
|
|
this.rowData = JSON.parse(JSON.stringify(val));
|
|
|
|
|
},
|
|
|
|
|
//获取权限树结构
|
|
|
|
|
getPermissionList() {
|
|
|
|
|
this.treeLoading = true;
|
|
|
|
|
getPermissionTree()
|
|
|
|
|
getMenuList() {
|
|
|
|
|
getMenuListApi()
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
console.log(res);
|
|
|
|
|
// this.treeLoading = false;
|
|
|
|
|
//this.treeData = res.data.list;
|
|
|
|
|
this.treeData = this.processData(res.data);
|
|
|
|
|
console.log(this.treeData);
|
|
|
|
|
// this.treeData.forEach((item) => {
|
|
|
|
|
// this.defaultExpandedArr.push(item.id);
|
|
|
|
|
// });
|
|
|
|
|
this.defaultExpandedArr.push(this.treeData[0].compositeKey);
|
|
|
|
|
// console.log("我是默认展开的id", this.defaultExpandedArr);
|
|
|
|
|
this.getPermissionRole();
|
|
|
|
|
this.menuCheckOption = res.data;
|
|
|
|
|
this.getRolePermission();
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(res.msg);
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {});
|
|
|
|
|
},
|
|
|
|
|
processData(data, level = 0) {
|
|
|
|
|
return data.map((node) => {
|
|
|
|
|
const compositeKey = `${level}-${node.id}`; // 创建复合标识符
|
|
|
|
|
node.compositeKey = compositeKey; // 将复合标识符添加到节点属性中
|
|
|
|
|
if (node.list) {
|
|
|
|
|
node.list = this.processData(node.list, level + 1); // 递归处理子节点
|
|
|
|
|
}
|
|
|
|
|
return node;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
//获取查询杈限
|
|
|
|
|
getPermissionRole() {
|
|
|
|
|
getRolePermission() {
|
|
|
|
|
console.log(this.rowData);
|
|
|
|
|
getPermission({ id: this.rowData.uid })
|
|
|
|
|
getRolePermissionApi({ id: this.rowData.id })
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
console.log(res);
|
|
|
|
|
this.premissData = res.data;
|
|
|
|
|
// let setCheckedKeysList = this.premissData.map(function (item) {
|
|
|
|
|
// return item.resourceId;
|
|
|
|
|
// });
|
|
|
|
|
let setCheckedKeysList = [];
|
|
|
|
|
this.premissData.forEach((node) => {
|
|
|
|
|
if (node.resourceType == 1) {
|
|
|
|
|
console.log(node);
|
|
|
|
|
setCheckedKeysList.push("0-" + node.resourceId);
|
|
|
|
|
} else if (node.resourceType == 2) {
|
|
|
|
|
setCheckedKeysList.push("1-" + node.resourceId);
|
|
|
|
|
} else if (node.resourceType == 3) {
|
|
|
|
|
setCheckedKeysList.push("2-" + node.resourceId);
|
|
|
|
|
} else if (node.resourceType == 4) {
|
|
|
|
|
setCheckedKeysList.push("3-" + node.resourceId);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
console.log(setCheckedKeysList);
|
|
|
|
|
this.$refs.tree.setCheckedKeys(setCheckedKeysList);
|
|
|
|
|
this.treeLoading = false;
|
|
|
|
|
// this.$nextTick(() => {
|
|
|
|
|
// this.$refs.tree.setCheckedKeys(setCheckedKeysList);
|
|
|
|
|
// this.treeLoading = false;
|
|
|
|
|
// });
|
|
|
|
|
this.checkedIds = res.data;
|
|
|
|
|
console.log(this.checkedIds);
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.error(res.msg);
|
|
|
|
|
}
|
|
|
|
|
@ -123,42 +77,14 @@ export default {
|
|
|
|
|
},
|
|
|
|
|
// 保存确定操作
|
|
|
|
|
submitForm() {
|
|
|
|
|
//获取勾选的父节点和子节点
|
|
|
|
|
let originData = this.$refs.tree.store;
|
|
|
|
|
// 定义数组
|
|
|
|
|
const checkedNodeIds = [];
|
|
|
|
|
// 判断是否为全选，若为全选状态返回被选中的父节点数据，不为全选状态正常返回被选中的子节点的数据
|
|
|
|
|
const isAllChecked = function (node) {
|
|
|
|
|
const childNodes = node.root ? node.root.childNodes : node.childNodes;
|
|
|
|
|
childNodes.forEach((child) => {
|
|
|
|
|
if (child.checked) {
|
|
|
|
|
checkedNodeIds.push(child.data);
|
|
|
|
|
}
|
|
|
|
|
if (child.indeterminate) {
|
|
|
|
|
isAllChecked(child);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
};
|
|
|
|
|
isAllChecked(originData);
|
|
|
|
|
console.log(checkedNodeIds);
|
|
|
|
|
//把获取到的节点遍历 组成想要的内容
|
|
|
|
|
console.log(this.checkedMenu);
|
|
|
|
|
let paramsList = [];
|
|
|
|
|
checkedNodeIds.forEach((node) => {
|
|
|
|
|
if ("dyValue" in node) {
|
|
|
|
|
console.log(node);
|
|
|
|
|
paramsList.push({ resourceType: 1, resourceId: node.id });
|
|
|
|
|
} else if ("bsManufacturer" in node) {
|
|
|
|
|
paramsList.push({ resourceType: 2, resourceId: node.id });
|
|
|
|
|
} else if ("lineid" in node) {
|
|
|
|
|
paramsList.push({ resourceType: 3, resourceId: node.id });
|
|
|
|
|
} else if ("towerid" in node) {
|
|
|
|
|
paramsList.push({ resourceType: 4, resourceId: node.id });
|
|
|
|
|
}
|
|
|
|
|
this.checkedMenu.forEach((node) => {
|
|
|
|
|
paramsList.push({ resourceId: node.id });
|
|
|
|
|
});
|
|
|
|
|
console.log(paramsList);
|
|
|
|
|
changePermission({
|
|
|
|
|
getRolechangePermissionApi({
|
|
|
|
|
list: paramsList,
|
|
|
|
|
userId: this.rowData.uid,
|
|
|
|
|
roleId: this.rowData.id,
|
|
|
|
|
})
|
|
|
|
|
.then((res) => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
@ -176,27 +102,31 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
.catch((err) => {});
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
display() {
|
|
|
|
|
this.isShow = true;
|
|
|
|
|
this.getPermissionList();
|
|
|
|
|
this.getMenuList();
|
|
|
|
|
},
|
|
|
|
|
hide() {
|
|
|
|
|
this.isShow = false;
|
|
|
|
|
},
|
|
|
|
|
handleclose() {
|
|
|
|
|
this.treeData = [];
|
|
|
|
|
},
|
|
|
|
|
handleclose() {},
|
|
|
|
|
},
|
|
|
|
|
mounted() {},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style lang="less">
|
|
|
|
|
.blindDialog {
|
|
|
|
|
.blindMenuDialog {
|
|
|
|
|
.treeBoxList {
|
|
|
|
|
height: 600px;
|
|
|
|
|
overflow: auto;
|
|
|
|
|
.el-dialog__body {
|
|
|
|
|
overflow: auto;
|
|
|
|
|
.el-checkbox-group {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
.el-checkbox {
|
|
|
|
|
height: 32px;
|
|
|
|
|
line-height: 32px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
fanluyan
1 year ago