前后端分目录
This commit is contained in:
andywang
378
h5-auth-manager/src/components/models/addResourceDialog.vue
Normal file
378
h5-auth-manager/src/components/models/addResourceDialog.vue
Normal file
@@ -0,0 +1,378 @@
|
||||
<template>
|
||||
<div class="user-edit-wrapper">
|
||||
<el-dialog title="资源配置" :visible.sync="dialogVisible" width="50%" :before-close="handleClose">
|
||||
<el-form ref="myform" :model="form" :rules="rules" label-width="80px" label-position="left">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="资源编号" prop="code">
|
||||
<el-input v-model="form.code" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="资源名" prop="name">
|
||||
<el-input v-model="form.name" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="icon" prop="icon">
|
||||
<el-input v-model="form.icon" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="资源描述" prop="des">
|
||||
<el-input v-model="form.des" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="访问路径" prop="url">
|
||||
<el-input v-model="form.url" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="菜单排序" prop="sort">
|
||||
<el-input v-model="form.sort" autocomplete="off" minlength="1" maxlength="3"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="系统分类" prop="sort">
|
||||
|
||||
<el-select v-model="form.resourceSystem" placeholder="请选择" @change="gettreeList(parentId)">
|
||||
<el-option :label="value.label" :value="value.value" v-for="value in systemList" :key="value.value"></el-option>
|
||||
|
||||
</el-select>
|
||||
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<div class="grid-conten">
|
||||
<h3 style="margin-bottom:30px">
|
||||
父类资源：
|
||||
</h3>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<div class="grid-conten">
|
||||
<el-tree ref="tree" :props="props" node-key="resourceId" :data="systemList.find(x=>x.value==this.form.resourceSystem)?systemList.find(x=>x.value==this.form.resourceSystem).data:[]" :key="num"
|
||||
:current-node-key="checkedKeys" :highlight-current="true" @node-click="handleNodeClick">
|
||||
</el-tree>
|
||||
<div style="padding: 20px;display: flex;justify-content: flex-end;">
|
||||
<el-button type="primary" @click="stick" size="mini">置为顶层目录</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item class="btn-group">
|
||||
<el-button type="primary" @click="onSubmit('myform')">确认</el-button>
|
||||
<el-button @click="handleClose()">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getResourceTreeMenu,
|
||||
resourceUpdate,
|
||||
resourceSave
|
||||
} from '@/api/index.js'
|
||||
import mixin from '@/utils/mixin.js'
|
||||
export default {
|
||||
name: 'resourceDialog',
|
||||
mixins:[mixin],
|
||||
props: {
|
||||
dialogVisible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
dataItem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataItem(newVal) {
|
||||
console.log(newVal)
|
||||
|
||||
},
|
||||
dialogVisible: function(val, oldVla) {
|
||||
if (this.$refs['myform'] != undefined) {
|
||||
this.$refs["myform"].resetFields();
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.form.resourceSystem =this.systemList[0]?this.systemList[0].value:''
|
||||
|
||||
if(this.dataItem.name){
|
||||
// this.dataItem = newVal;
|
||||
if (JSON.stringify(this.dataItem) !== '{}') {
|
||||
this.form = {
|
||||
"name": this.dataItem.name,
|
||||
"code": this.dataItem.code,
|
||||
"url": this.dataItem.url,
|
||||
"parentId": this.dataItem.parentId,
|
||||
"des": this.dataItem.des,
|
||||
"icon": this.dataItem.icon,
|
||||
"sort": this.dataItem.sort,
|
||||
"resourceSystem": this.dataItem.resourceSystem,
|
||||
}
|
||||
this.parentId = this.dataItem.parentId;
|
||||
this.checkedKeys = this.dataItem.parentId;
|
||||
console.log(this.dataItem,this.form)
|
||||
// this.resourceSystem = this.dataItem.resourceSystem
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
this.gettreeList(this.parentId);
|
||||
},
|
||||
|
||||
data() {
|
||||
let checkSort = (rule, value, callback) => {
|
||||
console.log(value)
|
||||
if (value === 0) {
|
||||
return callback(new Error('超出可选范围（1-100）'));
|
||||
}
|
||||
if (!value) {
|
||||
return callback(new Error('菜单排序不能为空'));
|
||||
} else {
|
||||
if (value > 0 && value <= 100) {
|
||||
callback();
|
||||
} else {
|
||||
return callback(new Error('超出可选范围（1-100）'));
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
return {
|
||||
num:0,
|
||||
form: {
|
||||
name: "",
|
||||
code: "",
|
||||
url: "",
|
||||
parentId: 0,
|
||||
des: "",
|
||||
icon: "",
|
||||
sort: 1,
|
||||
resourceSystem: ""
|
||||
},
|
||||
parentId: 0,
|
||||
rules: {
|
||||
name: [{
|
||||
required: true,
|
||||
message: '请输入资源名称',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
code: [{
|
||||
required: true,
|
||||
message: '请输入资源编号',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
des: [{
|
||||
required: true,
|
||||
message: '请输入资源描述',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
sort: [{
|
||||
validator: checkSort,
|
||||
required: true,
|
||||
trigger: 'blur'
|
||||
}],
|
||||
resourceSystem: [{
|
||||
required: true,
|
||||
message: '请选择系统分类',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
},
|
||||
props: {
|
||||
label: 'name',
|
||||
children: 'children'
|
||||
},
|
||||
|
||||
// 默认选中节点
|
||||
checkedKeys: ""
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
stick(){
|
||||
this.parentId = 0
|
||||
this.form.parentId = 0
|
||||
this.checkedKeys = 0
|
||||
this.num++
|
||||
|
||||
console.log(this.parentId,this.form.parentId,this.checkedKeys)
|
||||
},
|
||||
handleNodeClick(data) {
|
||||
this.form.parentId = data.resourceId;
|
||||
},
|
||||
getTreeData(data) {
|
||||
let treeArr = data;
|
||||
let result = []
|
||||
for (let i = 0; i < treeArr.length; i++) {
|
||||
let item = treeArr[i];
|
||||
if (item.parentId === 0) {
|
||||
result.push(item);
|
||||
}
|
||||
}
|
||||
this.data2treeDG(treeArr, result);
|
||||
},
|
||||
data2treeDG(datas, dataArray, type) {
|
||||
for (let j = 0; j < dataArray.length; j++) {
|
||||
let dataArrayIndex = dataArray[j];
|
||||
let childrenArray = [];
|
||||
let Id = dataArrayIndex.resourceId;
|
||||
if (dataArrayIndex.checked) {
|
||||
this.checkedKeys = dataArrayIndex.resourceId
|
||||
}
|
||||
for (let i = 0; i < datas.length; i++) {
|
||||
let data = datas[i];
|
||||
let parentId = data.parentId;
|
||||
if (parentId == Id) { //判断是否为儿子节点
|
||||
childrenArray.push(data);
|
||||
}
|
||||
}
|
||||
dataArrayIndex.children = childrenArray;
|
||||
if (childrenArray.length > 0) { //有儿子节点则递归
|
||||
this.data2treeDG(datas, childrenArray)
|
||||
}
|
||||
}
|
||||
|
||||
this.systemList.find(x=>x.value==this.form.resourceSystem).data = dataArray;
|
||||
// console.log(this.systemList)
|
||||
},
|
||||
// 新增或编辑
|
||||
onSubmit(myForm) {
|
||||
let form = this.form;
|
||||
this.$refs[myForm].validate((valid) => {
|
||||
if (valid) {
|
||||
if (JSON.stringify(this.dataItem) == '{}') {
|
||||
// 新增
|
||||
this.saveResource(form);
|
||||
} else {
|
||||
// 编辑
|
||||
form.resourceId = this.dataItem.resourceId
|
||||
this.updateResource(form);
|
||||
}
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
async updateResource(form) {
|
||||
const data = await resourceUpdate(form)
|
||||
if (data.status != "0") {
|
||||
if (data.data) {
|
||||
this.$message({
|
||||
message: '修改成功！',
|
||||
type: 'success'
|
||||
});
|
||||
this.handleClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
async saveResource(form) {
|
||||
const data = await resourceSave(form)
|
||||
if (data.status != "0") {
|
||||
if (data.data) {
|
||||
this.$message({
|
||||
message: '添加成功！',
|
||||
type: 'success'
|
||||
});
|
||||
this.handleClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
async gettreeList(id) {
|
||||
if(this.systemList.find(x=>x.value==this.form.resourceSystem).data) return
|
||||
const data = await getResourceTreeMenu({
|
||||
"parentId": id,
|
||||
entity:{
|
||||
"resourceSystem":this.form.resourceSystem
|
||||
}
|
||||
})
|
||||
if (data.status != "0") {
|
||||
this.getTreeData(data.data);
|
||||
this.$nextTick(() => {
|
||||
if (this.parentId != 0) {
|
||||
this.$refs.tree.setCurrentKey(this.checkedKeys)
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
handleClose() {
|
||||
this.form = {
|
||||
"name": "",
|
||||
"code": "",
|
||||
"url": "",
|
||||
"parentId": null,
|
||||
"des": "",
|
||||
"icon": "",
|
||||
"sort": 1,
|
||||
"resourceSystem": "EngineX"
|
||||
}
|
||||
this.systemList.forEach(value=>{
|
||||
value.data = null
|
||||
})
|
||||
|
||||
|
||||
this.$refs["myform"].resetFields();
|
||||
this.$emit('closeEvent');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-dialog__body {
|
||||
padding: 20px 40px;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .el-input {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .btn-group {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
|
||||
background: #409EFF;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .is-checked {
|
||||
background: #F5F7FA;
|
||||
}
|
||||
</style>
|
||||
275
h5-auth-manager/src/components/models/addUserDialog.vue
Normal file
275
h5-auth-manager/src/components/models/addUserDialog.vue
Normal file
@@ -0,0 +1,275 @@
|
||||
<template>
|
||||
<div class="user-edit-wrapper">
|
||||
<el-dialog title="配置账号" :visible.sync="dialogVisible" width="50%" @open="open" :before-close="handleClose">
|
||||
<el-form ref="myform" :model="form" :rules="rules" label-width="80px" label-position="left">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="账号" prop="account">
|
||||
<el-input v-model="form.account"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="组织" prop="organId">
|
||||
<el-select v-model="form.organId" :disabled="listOrganArr.length==1?true:false" placeholder="" @change="organChange">
|
||||
<el-option v-for="item in listOrganArr" :key="item.organId" :label="item.name" :value="item.organId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="角色">
|
||||
<el-select v-model="form.sysRole" placeholder="">
|
||||
<el-option v-for="item in validRoleArr" :key="item.roleId" :label="item.roleName" :value="item.roleId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-divider></el-divider>
|
||||
<h3 style="margin-bottom:40px">
|
||||
使用人信息：
|
||||
</h3>
|
||||
|
||||
<el-row>
|
||||
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="姓名" prop="nickName">
|
||||
<el-input v-model="form.nickName"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="手机号" prop="cellphone">
|
||||
<el-input v-model="form.cellphone"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="form.email"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
|
||||
<el-form-item class="btn-group">
|
||||
<el-button type="primary" @click="onSubmit('myform')">确认</el-button>
|
||||
<el-button @click="handleClose()">取消</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getAllValidRole,
|
||||
saveUser,
|
||||
updateUser
|
||||
} from '@/api/index.js'
|
||||
export default {
|
||||
name: 'userDialog',
|
||||
props: {
|
||||
dialogVisible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
dataItem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
listOrganArr: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
watch: {
|
||||
dataItem(newVal) {
|
||||
this.dataItem = newVal;
|
||||
if (JSON.stringify(newVal) !== '{}') {
|
||||
this.validRole(newVal.sysOrgan.organId);
|
||||
this.disabled = true;
|
||||
this.form = {
|
||||
organId: newVal.organId,
|
||||
remark: newVal.remark,
|
||||
account: newVal.account,
|
||||
nickName: newVal.nickName,
|
||||
cellphone: newVal.cellphone,
|
||||
email: newVal.email,
|
||||
sysRole: newVal.sysRole.roleId
|
||||
}
|
||||
}else{
|
||||
this.form = {
|
||||
organId: '',
|
||||
remark: '',
|
||||
account: '',
|
||||
nickName: '',
|
||||
cellphone: '',
|
||||
email: '',
|
||||
sysRole: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
dialogVisible: function(val, oldVla) {
|
||||
console.log(1)
|
||||
if (this.$refs['myform'] != undefined) {
|
||||
this.$refs["myform"].resetFields();
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
return {
|
||||
text: "text",
|
||||
form: {
|
||||
organId: '',
|
||||
remark: '',
|
||||
account: '',
|
||||
nickName: '',
|
||||
cellphone: '',
|
||||
email: '',
|
||||
sysRole: ''
|
||||
},
|
||||
disabled: false,
|
||||
validRoleArr: [],
|
||||
rules: {
|
||||
account: [{
|
||||
required: true,
|
||||
message: '请输入账号',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
nickName: [{
|
||||
required: true,
|
||||
message: '请输入姓名',
|
||||
trigger: 'blur'
|
||||
}],
|
||||
|
||||
organId: [{
|
||||
required: true,
|
||||
message: '请选择组织',
|
||||
trigger: 'change'
|
||||
}]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
if (this.listOrganArr.length == 1) {
|
||||
this.form.organId = this.listOrganArr[0].id
|
||||
this.organChange(this.listOrganArr[0].id)
|
||||
}
|
||||
},
|
||||
organChange(e) {
|
||||
this.validRoleArr = [];
|
||||
this.form.sysRole = "";
|
||||
this.validRole(e);
|
||||
},
|
||||
// 新增或编辑名单库
|
||||
onSubmit(myForm) {
|
||||
let form = JSON.parse(JSON.stringify(this.form));
|
||||
form.sysRole = {
|
||||
roleId: form.sysRole
|
||||
}
|
||||
this.$refs[myForm].validate((valid) => {
|
||||
if (valid) {
|
||||
if (JSON.stringify(this.dataItem) == '{}') {
|
||||
// 新增
|
||||
this.save(form);
|
||||
} else {
|
||||
// 编辑
|
||||
form.userId = this.dataItem.userId
|
||||
this.update(form);
|
||||
}
|
||||
} else {
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
async save(form) {
|
||||
const data = await saveUser(form)
|
||||
if (data.status != "0") {
|
||||
this.$message({
|
||||
message: '添加成功！',
|
||||
type: 'success'
|
||||
});
|
||||
this.handleClose();
|
||||
}
|
||||
|
||||
},
|
||||
async update(form) {
|
||||
const data = await updateUser(form)
|
||||
if (data.status != "0") {
|
||||
if (data.data) {
|
||||
this.$message({
|
||||
message: '修改成功！',
|
||||
type: 'success'
|
||||
});
|
||||
this.handleClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
async validRole(id) {
|
||||
const data = await getAllValidRole({
|
||||
"organId": id
|
||||
})
|
||||
if (data.status != "0") {
|
||||
this.validRoleArr = data.data
|
||||
}
|
||||
},
|
||||
handleClose() {
|
||||
this.form = {
|
||||
organId: '',
|
||||
remark: '',
|
||||
account: '',
|
||||
nickName: '',
|
||||
cellphone: '',
|
||||
email: '',
|
||||
sysRole: ''
|
||||
}
|
||||
this.validRoleArr = [];
|
||||
this.disabled = false;
|
||||
this.$emit('closeEvent');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-dialog__body {
|
||||
padding: 20px 40px;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .el-input {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .btn-group {
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,365 @@
|
||||
<template>
|
||||
<div class="user-edit-wrapper">
|
||||
<el-dialog title="角色配置" :visible.sync="dialogVisible" width="50%" :before-close="handleClose">
|
||||
<el-form ref="myform" :model="form" label-width="80px" label-position="left">
|
||||
<el-row>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="角色名">
|
||||
<el-input v-model="form.roleName" autocomplete="off" :disabled="disabled"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<div class="grid-conten">
|
||||
<el-form-item label="所属组织">
|
||||
<el-select v-model="form.organId" :disabled="disabled">
|
||||
<el-option v-for="item in listOrganArr" :key="item.organId" :label="item.name" :value="item.organId"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-divider></el-divider>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<h3 style="margin-bottom:30px">
|
||||
功能权限：
|
||||
</h3>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<!-- <h3 style="margin-bottom:30px">
|
||||
搜索引擎子权限：
|
||||
</h3> -->
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-tabs v-model="tabs" >
|
||||
<el-tab-pane :label="value.value" :name="value.value" v-for="value in systemList"></el-tab-pane>
|
||||
|
||||
</el-tabs>
|
||||
|
||||
|
||||
<div class="grid-conten">
|
||||
<el-tree ref="tree" :props="props" :data="treeList[tabs]" show-checkbox node-key="resourceId" :default-checked-keys="checkedKeys[tabs]"
|
||||
@check-change="findTreeChange">
|
||||
</el-tree>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="grid-conten">
|
||||
<!-- <el-tree
|
||||
ref="engineTree"
|
||||
:props="props"
|
||||
:data="engineList"
|
||||
show-checkbox
|
||||
node-key="id"
|
||||
:default-checked-keys="engineCheckedKeys"
|
||||
@check-change="engineTreeChange"
|
||||
>
|
||||
</el-tree> -->
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
|
||||
<el-form-item class="btn-group">
|
||||
|
||||
<el-button @click="handleClose()">取消</el-button>
|
||||
<el-button type="primary" @click="onSubmit()">确认</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getFindtreeList,
|
||||
getEngineTree,
|
||||
insertRoleMenu,
|
||||
insertRoleEngine
|
||||
} from '@/api/index.js'
|
||||
import mixin from '@/utils/mixin.js'
|
||||
export default {
|
||||
name: 'authorityAssignmentDialog',
|
||||
mixins:[mixin],
|
||||
props: {
|
||||
dialogVisible: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
dataItem: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
listOrganArr: {
|
||||
type: Array,
|
||||
default () {
|
||||
return []
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
dataItem(newVal) {
|
||||
this.dataItem = newVal;
|
||||
if (JSON.stringify(newVal) !== '{}') {
|
||||
|
||||
this.tabs = this.systemList[0].value
|
||||
// console.log(this.systemList[0].value)
|
||||
this.systemList.forEach(value=>{
|
||||
|
||||
this.$set(this.treeList,value.value,null)
|
||||
this.$set(this.checkedKeys,value.value,[])
|
||||
|
||||
this.gettreeList(newVal.roleId,value.value);
|
||||
})
|
||||
// this.getEnginetreeList(newVal.id);
|
||||
this.form = {
|
||||
roleId: newVal.roleId,
|
||||
organId: newVal.organId,
|
||||
roleName: newVal.roleName
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
roleId: '',
|
||||
organId: '',
|
||||
roleName: ''
|
||||
},
|
||||
tabs:"",
|
||||
disabled: true,
|
||||
props: {
|
||||
label: 'name',
|
||||
children: 'children'
|
||||
},
|
||||
count: 1,
|
||||
treeList: {
|
||||
|
||||
},
|
||||
engineList: [],
|
||||
// 默认选中节点
|
||||
checkedKeys: {
|
||||
|
||||
},
|
||||
engineCheckedKeys: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
findTreeChange(data, checked, indeterminate) {
|
||||
let nodes = this.$refs.tree.getCheckedNodes()
|
||||
this.checkedKeys[this.tabs] = nodes.map(item => {
|
||||
return item.resourceId
|
||||
})
|
||||
|
||||
},
|
||||
// 搜索引擎子权限：
|
||||
// engineTreeChange(data,checked,indeterminate){
|
||||
// let nodes = this.$refs.engineTree.getCheckedNodes()
|
||||
// this.engineCheckedKeys = nodes.map(item => {
|
||||
// return item.id
|
||||
// })
|
||||
// },
|
||||
getTreeData(data, type,str) {
|
||||
|
||||
let treeArr = data;
|
||||
let result = []
|
||||
for (let i = 0; i < treeArr.length; i++) {
|
||||
let item = treeArr[i];
|
||||
if (item.parentId == 0) {
|
||||
result.push(item);
|
||||
}
|
||||
}
|
||||
this.data2treeDG(treeArr, result, type,str);
|
||||
},
|
||||
data2treeDG(datas, dataArray, type,str) {
|
||||
// console.log(datas, dataArray, type)
|
||||
|
||||
|
||||
for (let j = 0; j < dataArray.length; j++) {
|
||||
let dataArrayIndex = dataArray[j];
|
||||
let childrenArray = [];
|
||||
let Id = dataArrayIndex.resourceId;
|
||||
if (dataArrayIndex.checked) {
|
||||
(type == 1) ? this.checkedKeys[str].push(dataArrayIndex.resourceId): this.engineCheckedKeys.push(dataArrayIndex.resourceId)
|
||||
}
|
||||
for (let i = 0; i < datas.length; i++) {
|
||||
let data = datas[i];
|
||||
let parentId = data.parentId;
|
||||
if (parentId == Id) { //判断是否为儿子节点
|
||||
childrenArray.push(data);
|
||||
if (data.checked) {
|
||||
(type == 1) ? this.checkedKeys[str].push(data.resourceId): this.engineCheckedKeys.push(data.resourceId)
|
||||
}
|
||||
}
|
||||
}
|
||||
dataArrayIndex.children = childrenArray;
|
||||
if (childrenArray.length > 0) { //有儿子节点则递归
|
||||
this.data2treeDG(datas, childrenArray)
|
||||
}
|
||||
}
|
||||
if (type == 1) {
|
||||
this.treeList[str] = dataArray;
|
||||
console.log(this.treeList)
|
||||
} else {
|
||||
this.engineList = dataArray;
|
||||
}
|
||||
},
|
||||
// 新增或编辑
|
||||
onSubmit() {
|
||||
|
||||
console.log(this.checkedKeys)
|
||||
|
||||
this.checkedKeys.EngineX.forEach(value => {
|
||||
if (this.deepparentId(value,'EngineX')) {
|
||||
this.checkedKeys.EngineX.push(this.deepparentId(value,'EngineX'))
|
||||
}
|
||||
|
||||
})
|
||||
this.checkedKeys.DataX.forEach(value => {
|
||||
if (this.deepparentId(value,'DataX')) {
|
||||
this.checkedKeys.DataX.push(this.deepparentId(value,'DataX'))
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
let arr = []
|
||||
this.systemList.forEach(value=>{
|
||||
arr.push(...this.checkedKeys[value.value])
|
||||
})
|
||||
console.log(arr)
|
||||
arr = this.unique(arr)
|
||||
this.updateInsertRoleMenu({
|
||||
roleId: this.dataItem.roleId,
|
||||
ids: arr.join(',')
|
||||
})
|
||||
// 搜索引擎子权限：
|
||||
// this.updateInsertRoleEngine({
|
||||
// roleId:this.dataItem.id,
|
||||
// ids:this.engineCheckedKeys.join(',')
|
||||
// })
|
||||
},
|
||||
unique(arr) {
|
||||
return Array.from(new Set(arr))
|
||||
},
|
||||
deepparentId(id,str) {
|
||||
let num
|
||||
this.treeList[str].forEach(value => {
|
||||
if (value.resourceId == id) {
|
||||
num = value.parentId
|
||||
}
|
||||
if (value.children.length > 0) {
|
||||
value.children.forEach(item => {
|
||||
if (item.resourceId == id) {
|
||||
num = item.parentId
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
return num
|
||||
|
||||
|
||||
|
||||
},
|
||||
async updateInsertRoleMenu(form) {
|
||||
const data = await insertRoleMenu(form)
|
||||
if (data.status != "0") {
|
||||
if (data.data) {
|
||||
this.$message({
|
||||
message: '修改成功！',
|
||||
type: 'success'
|
||||
});
|
||||
this.handleClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
async updateInsertRoleEngine(form) {
|
||||
const data = await insertRoleEngine(form)
|
||||
if (data.status != "0") {
|
||||
if (data.data) {
|
||||
this.$message({
|
||||
message: '修改成功！',
|
||||
type: 'success'
|
||||
});
|
||||
this.handleClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
async gettreeList(id,str) {
|
||||
if(this.treeList[str]) return
|
||||
const data = await getFindtreeList({
|
||||
"roleId": id,
|
||||
"entity":{
|
||||
"resourceSystem":str
|
||||
}
|
||||
})
|
||||
if (data.status != "0") {
|
||||
data.data.forEach(value=>{
|
||||
if(!value.checked){
|
||||
data.data.forEach(item=>{
|
||||
if(item.resourceId==value.parentId){
|
||||
item.checked = false
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
this.getTreeData(data.data, 1,str);
|
||||
}
|
||||
},
|
||||
async getEnginetreeList(id) {
|
||||
const data = await getEngineTree({
|
||||
"roleId": id,
|
||||
|
||||
})
|
||||
if (data.status != "0") {
|
||||
|
||||
this.getTreeData(data.data, 2);
|
||||
}
|
||||
},
|
||||
handleClose() {
|
||||
this.form = {
|
||||
roleId: '',
|
||||
organId: '',
|
||||
roleName: ''
|
||||
}
|
||||
this.checkedKeys.EngineX = []
|
||||
this.checkedKeys.DataX = []
|
||||
|
||||
this.treeList.EngineX=null
|
||||
this.treeList.DataX=null
|
||||
|
||||
this.tabs = 'EngineX'
|
||||
this.$emit('closeEvent');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-dialog__body {
|
||||
padding: 20px 40px;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .el-input {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.user-edit-wrapper .btn-group {
|
||||
margin-top: 30px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user