提交 2a4a0176 authored 作者: 龙菲's avatar 龙菲

修改用户角色权限绑定为树形结构

上级 a8757360
......@@ -17,6 +17,7 @@
"axios": "0.18.1",
"core-js": "3.6.5",
"echarts": "^5.4.0",
"el-tree-transfer": "^2.4.7",
"element-ui": "2.13.2",
"js-cookie": "2.2.0",
"normalize.css": "7.0.0",
......
......@@ -125,6 +125,15 @@ export function getUserOwnRoles(id) {
})
}
export function getUserOwnRolesV1(id) {
return request({
url: 'sys/user/v1/roles/' + id,
method: 'get'
})
}
// 更新用户角色信息
export function updateUserOwnRoles(id,data) {
return request({
......
......@@ -67,7 +67,7 @@
<el-input v-else v-model="userInfoForm.phone"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click.native="handleSubmitUserInfo">{{
<el-button type="primary" @click.native="handleSubmitUserInfo" icon="el-icon-circle-check">{{
isEditingUserInfo ? "保存" : "修改个人信息"
}}</el-button>
<el-button
......@@ -95,7 +95,7 @@
<el-input v-model="pwdForm.checkPass" type="password"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click.native="handleSubmitPwd"
<el-button type="primary" icon="el-icon-circle-check" @click.native="handleSubmitPwd"
>保存</el-button
>
<el-button type="primary" @click.native="handleCancelChangePwd"
......
......@@ -262,7 +262,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit" :loading="loading"
>确定<i class="el-icon-s-promotion" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</div>
......
......@@ -5,7 +5,7 @@
<el-button
type="primary"
@click.native="handleOperation({ type: 'add' })"
icon="el-icon-s-promotion"
icon="el-icon-plus"
>
发布</el-button
>
......
......@@ -73,7 +73,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-s-promotion" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......
......@@ -2,8 +2,8 @@
<div class="app-container">
<div class="top-bar">
<SearchBar :config="searchConfig" @search="search" @reset="reset" />
<el-button type="primary" @click.native="handleOperation({ type: 'add' })" icon="el-icon-s-promotion">
发布</el-button>
<el-button type="primary" @click.native="handleOperation({ type: 'add' })" icon="el-icon-plus">
添加</el-button>
</div>
<TablePage :data="list.records" :tableTitle="tableTitle" :operates="tableOperates">
<template v-slot:status="data">
......
......@@ -88,7 +88,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-s-promotion" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......
......@@ -3,7 +3,7 @@
<div class="top-bar">
<SearchBar :config="searchConfig" @search="search" @reset="reset" />
<el-button type="primary" @click.native="handleOperation('add')">
<i class="el-icon-s-promotion"></i>
<i class="el-icon-plus"></i>
添加</el-button
>
</div>
......
......@@ -75,7 +75,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-right" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......
......@@ -47,7 +47,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>保存<i class="el-icon-s-promotion" style="margin-left: 5px"></i
>保存<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......@@ -92,7 +92,7 @@ export default {
dialogVisible: false,
options: [
{ label: "所有", value: 1 },
{ label: "自定义部门", value: 2 },
// { label: "自定义部门", value: 2 },
{ label: "本部门及以下部门", value: 3 },
{ label: "本部门", value: 4 },
{ label: "自己", value: 5 },
......
......@@ -51,7 +51,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-s-promotion" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......
<template>
<el-dialog
:visible="dialogVisible"
width="40%"
width="30%"
style="height: 98%"
:before-close="handleClose"
top="5vh"
......@@ -12,26 +12,35 @@
<div class="label">赋予角色</div>
</div>
<div class="dialog-content">
<el-transfer
v-model="own"
:data="roles"
:titles="['赋予角色', '拥有角色']"
></el-transfer>
<el-tree
:data="allRole"
show-checkbox
default-expand-all
node-key="id"
ref="myTree"
highlight-current
:props="{ label: 'name' }"
:default-checked-keys="ownRoles"
>
</el-tree>
</div>
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-right" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
</template>
<script>
import treeTransfer from "el-tree-transfer";
import { updateUserOwnRoles } from "@/api/user";
export default {
name: "EditRole",
components: {},
components: {
treeTransfer,
},
props: {
visible: {
type: Boolean,
......@@ -57,14 +66,34 @@ export default {
},
roleData(value) {
if (Object.keys(value).length > 0) {
let that = this;
const { allRole, ownRoles } = value;
this.roles = allRole.map((item) => {
return {
key: item.id,
label: item.name,
};
});
this.own = ownRoles;
this.allRole = allRole;
this.ownRoles = ownRoles;
// if (ownRoles.length > 0) {
// ownRoles.map((id) => {
// findObj(allRole, id);
// });
// function findObj(arr, id) {
// if (arr.length > 0) {
// arr.map((v) => {
// if (v.id == id) {
// that.toData.push(v);
// }
// if (v.children) {
// findObj(v.children, id);
// }
// });
// }
// }
// }
// this.allRolesData = JSON.parse(JSON.stringify(allRole));
// let fromData = JSON.parse(JSON.stringify(allRole));
// this.fromData = fromData.map((item) => {
// item.pid = 0;
// return item;
// });
}
},
id(value) {
......@@ -78,10 +107,12 @@ export default {
dialogForm: {},
formLabelWidth: "100px",
dialogVisible: false,
data: [],
roles: [],
own: [],
userId: null,
allRole: [],
ownRoles: [],
// fromData: [],
// toData: [],
// allRolesData: [], //留存数据,因为el-tree-transfer 左边数据需要pid为0 ,后期提交时根据该数据重新构造
};
},
methods: {
......@@ -91,14 +122,10 @@ export default {
},
async handleSubmit() {
console.log("this.own", this.own);
console.log("this.roles", this.roles);
let params = this.own;
// console.log(params);
// console.log(this.userId);
let ids = this.$refs.myTree.getCheckedKeys(true);
let params = ids;
let res = await updateUserOwnRoles(this.userId, params);
console.log("res", res);
if (res.code == 0) {
this.$message.success("修改成功!");
this.roles = [];
......@@ -107,6 +134,7 @@ export default {
this.$emit("handleClose");
}
},
reload() {
this.$emit("refresh");
this.$emit("handleClose");
......@@ -116,7 +144,8 @@ export default {
.then((_) => {
done();
this.$emit("handleClose");
this.files = [];
this.allRole = [];
this.ownRoles = [];
})
.catch((_) => {});
},
......
......@@ -86,7 +86,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-right" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......
......@@ -16,7 +16,7 @@
<el-button
type="primary"
@click.native="handleOperation({ type: 'add' })"
icon="el-icon-s-promotion"
icon="el-icon-plus"
>
新增</el-button
>
......@@ -86,6 +86,7 @@ import {
getUserList,
deleteUser,
getUserOwnRoles,
getUserOwnRolesV1
} from "@/api/user";
import InfoEditDialog from "./components/InfoEditDialog.vue";
import EditRole from "./components/EditRole.vue";
......@@ -239,7 +240,7 @@ export default {
break;
case "editRole":
this.editRoleVisible = true;
let roleRes = await getUserOwnRoles(row.id);
let roleRes = await getUserOwnRolesV1(row.id);
this.currentRoleData = roleRes.data;
this.currentId = row.id;
break;
......
......@@ -82,7 +82,7 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-right" style="margin-left: 5px"></i
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</el-dialog>
......
......@@ -5,9 +5,9 @@
<el-button
type="primary"
@click.native="handleOperation({ type: 'add' })"
icon="el-icon-s-promotion"
icon="el-icon-plus"
>
发布</el-button
添加</el-button
>
</div>
<TablePage
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论