|
@@ -1,56 +1,61 @@
|
|
|
<template>
|
|
|
- <div class='m-container'>
|
|
|
+ <div class="m-container">
|
|
|
<h2>
|
|
|
- <el-page-header @back="onCancel"
|
|
|
- :content="(pageType == 'create' ? '添加' : '修改') + '角色'"></el-page-header>
|
|
|
+ <el-page-header
|
|
|
+ @back="onCancel"
|
|
|
+ :content="(pageType == 'create' ? '添加' : '修改') + '角色'"
|
|
|
+ ></el-page-header>
|
|
|
</h2>
|
|
|
<div class="m-core">
|
|
|
- <el-form ref="form"
|
|
|
- label-width="120px"
|
|
|
- style="width: 500px">
|
|
|
- <el-form-item label="角色名称"
|
|
|
- prop="roleName">
|
|
|
+ <el-form ref="form" label-width="120px" style="width: 500px">
|
|
|
+ <el-form-item label="角色名称" prop="roleName">
|
|
|
<el-input v-model.trim="result.roleName"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="角色描述">
|
|
|
- <el-input type="textarea"
|
|
|
- v-model.trim="result.roleDesc"></el-input>
|
|
|
+ <el-input type="textarea" v-model.trim="result.roleDesc"></el-input>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="搜索">
|
|
|
- <el-input style="width:210px"
|
|
|
- v-model.trim="seachRoleValue" clearable></el-input>
|
|
|
- <el-button style="margin-left: 10px"
|
|
|
- type="danger"
|
|
|
- @click="seachRoles">搜索</el-button>
|
|
|
+ <el-input
|
|
|
+ style="width: 210px"
|
|
|
+ v-model.trim="seachRoleValue"
|
|
|
+ clearable
|
|
|
+ ></el-input>
|
|
|
+ <el-button style="margin-left: 10px" type="danger" @click="seachRoles"
|
|
|
+ >搜索</el-button
|
|
|
+ >
|
|
|
<!-- <el-button type="primary"
|
|
|
@click="onReSetRole">重置</el-button> -->
|
|
|
</el-form-item>
|
|
|
<el-form-item label="基本权限">
|
|
|
- <el-checkbox :indeterminate="isIndeterminate"
|
|
|
- @change="onCheckAll"
|
|
|
- v-model.trim="checkAll">全选</el-checkbox>
|
|
|
+ <el-checkbox
|
|
|
+ :indeterminate="isIndeterminate"
|
|
|
+ @change="onCheckAll"
|
|
|
+ v-model.trim="checkAll"
|
|
|
+ >全选</el-checkbox
|
|
|
+ >
|
|
|
|
|
|
- <el-tree :data="data"
|
|
|
- show-checkbox
|
|
|
- node-key="id"
|
|
|
- @check="onTreeCheck"
|
|
|
- :filter-node-method="filterNode"
|
|
|
- ref="tree"
|
|
|
- accordion
|
|
|
- highlight-current
|
|
|
- :default-checked-keys="result.menuIds"
|
|
|
- :props="defaultProps">
|
|
|
+ <el-tree
|
|
|
+ :data="data"
|
|
|
+ show-checkbox
|
|
|
+ node-key="id"
|
|
|
+ @check="onTreeCheck"
|
|
|
+ :filter-node-method="filterNode"
|
|
|
+ ref="tree"
|
|
|
+ accordion
|
|
|
+ highlight-current
|
|
|
+ :default-checked-keys="result.menuIds"
|
|
|
+ :props="defaultProps"
|
|
|
+ >
|
|
|
<div slot-scope="{ node, data }">
|
|
|
{{ node.label }}
|
|
|
- <el-tag v-if="data.type == 1"
|
|
|
-
|
|
|
- effect="dark">按钮</el-tag>
|
|
|
+ <el-tag v-if="data.type == 1" effect="dark">按钮</el-tag>
|
|
|
</div>
|
|
|
</el-tree>
|
|
|
</el-form-item>
|
|
|
<el-form-item>
|
|
|
- <el-button @click="onSubmit"
|
|
|
- type="primary">立即{{ pageType == "create" ? '创建' : '修改' }}</el-button>
|
|
|
+ <el-button @click="onSubmit" type="primary"
|
|
|
+ >立即{{ pageType == "create" ? "创建" : "修改" }}</el-button
|
|
|
+ >
|
|
|
<el-button @click="onReSet('form')">重置</el-button>
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
@@ -58,13 +63,18 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import { getUserRole } from '@/api/systemManage'
|
|
|
-import store from '@/store'
|
|
|
-import { getSilder } from '@/api/silder'
|
|
|
-import { roleGetMenus, getRoleInfo, roleUpdate, roleAdd } from '@/api/systemManage'
|
|
|
+import { getUserRole } from "@/api/systemManage";
|
|
|
+import store from "@/store";
|
|
|
+import { getSilder } from "@/api/silder";
|
|
|
+import {
|
|
|
+ roleGetMenus,
|
|
|
+ getRoleInfo,
|
|
|
+ roleUpdate,
|
|
|
+ roleAdd,
|
|
|
+} from "@/api/systemManage";
|
|
|
export default {
|
|
|
- name: 'adminOperation',
|
|
|
- data () {
|
|
|
+ name: "adminOperation",
|
|
|
+ data() {
|
|
|
return {
|
|
|
organId: null,
|
|
|
pageType: null,
|
|
@@ -73,8 +83,8 @@ export default {
|
|
|
isIndeterminate: false,
|
|
|
data: [],
|
|
|
defaultProps: {
|
|
|
- children: 'children',
|
|
|
- label: 'label'
|
|
|
+ children: "children",
|
|
|
+ label: "label",
|
|
|
},
|
|
|
result: {
|
|
|
roleName: null,
|
|
@@ -85,133 +95,141 @@ export default {
|
|
|
silderList: [],
|
|
|
allChildIds: [], // 所有子编号
|
|
|
slideCount: 0,
|
|
|
- seachRoleValue: '', //权限搜索字段
|
|
|
- filterIds: [4794, 4743, 3266, 3268, 3306, 3307, 3309, 3784, 4627]
|
|
|
- }
|
|
|
+ seachRoleValue: "", //权限搜索字段
|
|
|
+ filterIds: [4794, 4743, 3266, 3268, 3306, 3307, 3309, 3784, 4627],
|
|
|
+ };
|
|
|
},
|
|
|
- mounted () {
|
|
|
- this.onReSet()
|
|
|
- this.init()
|
|
|
+ mounted() {
|
|
|
+ this.onReSet();
|
|
|
+ this.init();
|
|
|
},
|
|
|
- activated () {
|
|
|
- this.onReSet()
|
|
|
- this.init()
|
|
|
+ activated() {
|
|
|
+ this.onReSet();
|
|
|
+ this.init();
|
|
|
},
|
|
|
methods: {
|
|
|
- init () {
|
|
|
- this.pageType = this.$route.query.type
|
|
|
- this.id = this.$route.query.id
|
|
|
- this.page = this.$route.query.page
|
|
|
- if(this.pageType == 'create') {
|
|
|
+ init() {
|
|
|
+ this.pageType = this.$route.query.type;
|
|
|
+ this.id = this.$route.query.id;
|
|
|
+ this.page = this.$route.query.page;
|
|
|
+ if (this.pageType == "create") {
|
|
|
this.$refs.tree.setCheckedKeys([4229]);
|
|
|
}
|
|
|
- this.lookSilder()
|
|
|
+ this.lookSilder();
|
|
|
},
|
|
|
- onSubmit () {
|
|
|
- let tempIds = this.$refs.tree.getCheckedKeys()
|
|
|
- let halfIds = this.$refs.tree.getHalfCheckedKeys()
|
|
|
- let allIds = [...tempIds, ...halfIds]
|
|
|
- if (this.pageType == 'update') {
|
|
|
+ onSubmit() {
|
|
|
+ let tempIds = this.$refs.tree.getCheckedKeys();
|
|
|
+ let halfIds = this.$refs.tree.getHalfCheckedKeys();
|
|
|
+ let allIds = [...tempIds, ...halfIds];
|
|
|
+ if (this.pageType == "update") {
|
|
|
roleUpdate({
|
|
|
id: this.id,
|
|
|
organId: this.organId,
|
|
|
roleDesc: this.result.roleDesc,
|
|
|
roleName: this.result.roleName,
|
|
|
- menuIds: allIds
|
|
|
- }).then(res => {
|
|
|
- this.messageTips('修改', res)
|
|
|
- })
|
|
|
- } else if (this.pageType == 'create') {
|
|
|
+ menuIds: allIds,
|
|
|
+ }).then((res) => {
|
|
|
+ this.messageTips("修改", res);
|
|
|
+ });
|
|
|
+ } else if (this.pageType == "create") {
|
|
|
roleAdd({
|
|
|
organId: this.organId,
|
|
|
roleDesc: this.result.roleDesc,
|
|
|
roleName: this.result.roleName,
|
|
|
- menuIds: allIds
|
|
|
- }).then(res => {
|
|
|
- this.messageTips('添加', res)
|
|
|
- })
|
|
|
+ menuIds: allIds,
|
|
|
+ }).then((res) => {
|
|
|
+ this.messageTips("添加", res);
|
|
|
+ });
|
|
|
}
|
|
|
},
|
|
|
- messageTips (title, res) {
|
|
|
+ messageTips(title, res) {
|
|
|
if (res.code == 200) {
|
|
|
- this.$message.success('修改成功')
|
|
|
- this.$store.dispatch('delVisitedViews', this.$route)
|
|
|
- this.$router.push({ path: '/adminManager', query: { page: this.page } })
|
|
|
+ this.$message.success("修改成功");
|
|
|
+ this.$store.dispatch("delVisitedViews", this.$route);
|
|
|
+ this.$router.push({
|
|
|
+ path: "/adminManager",
|
|
|
+ query: { page: this.page },
|
|
|
+ });
|
|
|
} else {
|
|
|
- this.$message.error(res.msg)
|
|
|
+ this.$message.error(res.msg);
|
|
|
}
|
|
|
},
|
|
|
- async lookSilder () {
|
|
|
- let silderList = await getSilder({ hid: 0 })
|
|
|
- let tempData = []
|
|
|
- if (silderList.code == 200) {
|
|
|
- this.silderList = silderList.data
|
|
|
- tempData = this.setTableData(silderList.data)
|
|
|
- this.data = tempData
|
|
|
- // console.log(this.data)
|
|
|
- }
|
|
|
- // console.log(this.pageType)
|
|
|
- if (this.pageType == 'update') {
|
|
|
- let roleInfo = await getRoleInfo({ id: this.id })
|
|
|
- if (roleInfo.code == 200) {
|
|
|
- let roleData = roleInfo.data
|
|
|
- // 是否是全部选中
|
|
|
- this.checkAll = roleData.menuIds.length >= this.slideCount
|
|
|
- // 是否是半选
|
|
|
- this.isIndeterminate = roleData.menuIds.length > 0 && roleData.menuIds.length < this.slideCount
|
|
|
- let tSplice = this.getParent(roleData.menuIds, tempData)
|
|
|
- roleData.menuIds = tSplice
|
|
|
- this.result = roleData
|
|
|
+ async lookSilder() {
|
|
|
+ // 修复反写没有loading request返回的不是Promise await无效
|
|
|
+ getSilder({ hid: 0 }).then(async (silderList) => {
|
|
|
+ let tempData = [];
|
|
|
+ if (silderList.code == 200) {
|
|
|
+ this.silderList = silderList.data;
|
|
|
+ tempData = this.setTableData(silderList.data);
|
|
|
+ this.data = tempData;
|
|
|
+ // console.log(this.data)
|
|
|
}
|
|
|
- } else {
|
|
|
- this.onReSet()
|
|
|
- }
|
|
|
+ // console.log(this.pageType)
|
|
|
+ if (this.pageType == "update") {
|
|
|
+ let roleInfo = await getRoleInfo({ id: this.id });
|
|
|
+ if (roleInfo.code == 200) {
|
|
|
+ let roleData = roleInfo.data;
|
|
|
+ // 是否是全部选中
|
|
|
+ this.checkAll = roleData.menuIds.length >= this.slideCount;
|
|
|
+ // 是否是半选
|
|
|
+ this.isIndeterminate =
|
|
|
+ roleData.menuIds.length > 0 &&
|
|
|
+ roleData.menuIds.length < this.slideCount;
|
|
|
+ let tSplice = this.getParent(roleData.menuIds, tempData);
|
|
|
+ roleData.menuIds = tSplice;
|
|
|
+ this.result = roleData;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.onReSet();
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
- onTreeCheck () {
|
|
|
- let checkTree = this.$refs.tree.getCheckedKeys()
|
|
|
- this.checkAll = checkTree.length >= this.slideCount
|
|
|
- this.isIndeterminate = checkTree.length > 0 && checkTree.length < this.slideCount
|
|
|
+ onTreeCheck() {
|
|
|
+ let checkTree = this.$refs.tree.getCheckedKeys();
|
|
|
+ this.checkAll = checkTree.length >= this.slideCount;
|
|
|
+ this.isIndeterminate =
|
|
|
+ checkTree.length > 0 && checkTree.length < this.slideCount;
|
|
|
},
|
|
|
- onCheckAll (val) {
|
|
|
+ onCheckAll(val) {
|
|
|
if (val) {
|
|
|
// 先去掉半选
|
|
|
- this.isIndeterminate = false
|
|
|
- this.$refs.tree.setCheckedNodes(this.data)
|
|
|
+ this.isIndeterminate = false;
|
|
|
+ this.$refs.tree.setCheckedNodes(this.data);
|
|
|
} else {
|
|
|
- this.$refs.tree.setCheckedNodes([])
|
|
|
+ this.$refs.tree.setCheckedNodes([]);
|
|
|
}
|
|
|
},
|
|
|
|
|
|
//递归获取到所有的为子级的ID
|
|
|
- getParent (checkIds, data) {
|
|
|
- let removeIds = JSON.parse(JSON.stringify(checkIds))
|
|
|
- this.getAllChildIds(data)
|
|
|
- let tempAllChildIds = this.allChildIds
|
|
|
+ getParent(checkIds, data) {
|
|
|
+ let removeIds = JSON.parse(JSON.stringify(checkIds));
|
|
|
+ this.getAllChildIds(data);
|
|
|
+ let tempAllChildIds = this.allChildIds;
|
|
|
for (let i = checkIds.length; i > 0; i--) {
|
|
|
if (!tempAllChildIds.includes(checkIds[i - 1])) {
|
|
|
- removeIds.splice(i - 1, 1)
|
|
|
+ removeIds.splice(i - 1, 1);
|
|
|
}
|
|
|
}
|
|
|
- return removeIds
|
|
|
+ return removeIds;
|
|
|
},
|
|
|
- getAllChildIds (data) {
|
|
|
+ getAllChildIds(data) {
|
|
|
// 获取所有最子集编号
|
|
|
- let child = this.allChildIds
|
|
|
- let tempList = []
|
|
|
+ let child = this.allChildIds;
|
|
|
+ let tempList = [];
|
|
|
data.forEach((item, index) => {
|
|
|
- let temp = []
|
|
|
+ let temp = [];
|
|
|
if (item.children && item.children.length > 0) {
|
|
|
- temp = this.getAllChildIds(item.children)
|
|
|
+ temp = this.getAllChildIds(item.children);
|
|
|
} else {
|
|
|
- child.push(item.id)
|
|
|
+ child.push(item.id);
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
},
|
|
|
- setTableData (result) {
|
|
|
- let list = []
|
|
|
- list = result.map(res => {
|
|
|
- if(!this.filterIds.includes(res.id)) {
|
|
|
- let tempList = {}
|
|
|
+ setTableData(result) {
|
|
|
+ let list = [];
|
|
|
+ list = result.map((res) => {
|
|
|
+ if (!this.filterIds.includes(res.id)) {
|
|
|
+ let tempList = {};
|
|
|
tempList = {
|
|
|
id: res.id,
|
|
|
name: res.name,
|
|
@@ -220,59 +238,58 @@ export default {
|
|
|
path: res.path,
|
|
|
permission: res.permission,
|
|
|
icon: res.icon,
|
|
|
- parentId: res.parentId
|
|
|
- }
|
|
|
- this.slideCount++
|
|
|
+ parentId: res.parentId,
|
|
|
+ };
|
|
|
+ this.slideCount++;
|
|
|
if (res.sysMenus && res.sysMenus.length > 0) {
|
|
|
- tempList.children = this.setTableData(res.sysMenus)
|
|
|
+ tempList.children = this.setTableData(res.sysMenus);
|
|
|
}
|
|
|
- return tempList
|
|
|
+ return tempList;
|
|
|
}
|
|
|
- return null
|
|
|
- })
|
|
|
- let tempList = []
|
|
|
- list.forEach(item => {
|
|
|
- if(item) {
|
|
|
- tempList.push(item)
|
|
|
+ return null;
|
|
|
+ });
|
|
|
+ let tempList = [];
|
|
|
+ list.forEach((item) => {
|
|
|
+ if (item) {
|
|
|
+ tempList.push(item);
|
|
|
}
|
|
|
- })
|
|
|
- return tempList
|
|
|
+ });
|
|
|
+ return tempList;
|
|
|
},
|
|
|
- onReSet () {
|
|
|
- this.$refs.tree.setCheckedNodes([])
|
|
|
+ onReSet() {
|
|
|
+ this.$refs.tree.setCheckedNodes([]);
|
|
|
this.result = {
|
|
|
roleName: null,
|
|
|
roleDesc: null,
|
|
|
- }
|
|
|
- this.isIndeterminate = false
|
|
|
- this.checkAll = false
|
|
|
+ };
|
|
|
+ this.isIndeterminate = false;
|
|
|
+ this.checkAll = false;
|
|
|
},
|
|
|
- onCancel () {
|
|
|
- this.$store.dispatch('delVisitedViews', this.$route)
|
|
|
+ onCancel() {
|
|
|
+ this.$store.dispatch("delVisitedViews", this.$route);
|
|
|
this.$router.push({
|
|
|
- path: '/adminManager',
|
|
|
+ path: "/adminManager",
|
|
|
query: {
|
|
|
- page: this.$route.query.page
|
|
|
- }
|
|
|
- })
|
|
|
+ page: this.$route.query.page,
|
|
|
+ },
|
|
|
+ });
|
|
|
},
|
|
|
- seachRoles () {
|
|
|
- this.$refs.tree.filter(this.seachRoleValue);
|
|
|
+ seachRoles() {
|
|
|
+ this.$refs.tree.filter(this.seachRoleValue);
|
|
|
},
|
|
|
filterNode(value, data) {
|
|
|
- console.log(data)
|
|
|
- if (!value) return true;
|
|
|
- return data.label.indexOf(value) !== -1;
|
|
|
- },
|
|
|
- onReSetRole () {
|
|
|
- this.seachRoleValue = ''
|
|
|
- this.data = this.setTableData(this.silderList)
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ console.log(data);
|
|
|
+ if (!value) return true;
|
|
|
+ return data.label.indexOf(value) !== -1;
|
|
|
+ },
|
|
|
+ onReSetRole() {
|
|
|
+ this.seachRoleValue = "";
|
|
|
+ this.data = this.setTableData(this.silderList);
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-
|
|
|
.el-row {
|
|
|
margin-top: 40px;
|
|
|
}
|