From 5d6cf04b1f27c254b114f36e62ec4cc8326f131c Mon Sep 17 00:00:00 2001
From: wangting <675591594@qq.com>
Date: 星期日, 29 九月 2024 16:57:12 +0800
Subject: [PATCH] UI授权
---
Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/UIDialog.vue | 110 ++++++++++++++++-----
Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue | 158 +++++++++++++++++++++++++++----
2 files changed, 221 insertions(+), 47 deletions(-)
diff --git a/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/UIDialog.vue b/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/UIDialog.vue
index 255cce2..8347c23 100644
--- a/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/UIDialog.vue
+++ b/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/UIDialog.vue
@@ -8,8 +8,9 @@
:destroy-on-close="true"
:close-on-click-modal="false"
@close="cancelDialog">
+ <el-container style="height: 550px">
<el-aside>
- <basic-container>
+ <basic-container style="height: 500px">
<avue-tree ref="tree" :data="treeData" :option="treeOption" @node-click="nodeClick">
<span slot-scope="{ node, data }" class="el-tree-node__label">
<span style="font-size: 15px">
@@ -22,17 +23,21 @@
</el-aside>
<el-main>
- <basic-container>
- <avue-tree ref="uiTree" :data="uiTreeData" :option="uiTreeOption">
+ <basic-container style="height: 500px">
+ <h3 style="margin: 0">妯″潡鏉冮檺閰嶇疆</h3>
+ <div style="height: 445px;">
+ <avue-tree ref="uiTree" :data="uiTreeData" :option="uiTreeOption">
<span slot-scope="{ node, data }" class="el-tree-node__label">
- <span style="font-size: 15px">
- <i class="el-icon-user-solid"></i>
+ <span style="font-size: 15px">
+ <i :class="data.icon"></i>
{{ (node || {}).label }}
</span>
</span>
- </avue-tree>
+ </avue-tree>
+ </div>
</basic-container>
</el-main>
+ </el-container>
<div class="dialog-footer avue-dialog__footer">
<el-button type="primary" plain size="small" @click="submitDialog" >鎺堟潈</el-button>
<el-button type="primary" plain size="small" @click="clearValue" >閲嶇疆</el-button>
@@ -58,7 +63,6 @@
type:'',//涓氬姟绫诲瀷
context:'',//UI涓婁笅鏂嘽ode
treeOption: {
- height: '500px',
menu: false,
addBtn: false,
props: {
@@ -69,13 +73,17 @@
},
nodeRow: {},
treeData: [],
+ defaultExpandKeys:[],
uiTreeOption: {
- height: '500px',
+ nodeKey:'oid',
+ checkOnClickNode:true,
+ defaultExpandKeys:[],
+ multiple: true,
menu: false,
addBtn: false,
filter:false,
props: {
- label: 'name',
+ label: 'label',
value: 'oid',
children: 'children'
}
@@ -89,7 +97,7 @@
this.context=context;
this.dialog.showDialog = true;
this.getTreeList()
-
+ this.uiTreeData=[];
},
cancelDialog() {
this.dialog.loading = false;
@@ -105,31 +113,81 @@
})
},
// 瑙掕壊鐐瑰嚮
- nodeClick(row) {
+ nodeClick(row,node) {
this.nodeRow = row;
-
const loading = this.$loading({});
- getUIAuthor().then(res => {
- this.uiTreeData = res.data.data;
+ const params = {
+ 'conditionMap[roleId]': this.nodeRow.oid,
+ 'conditionMap[type]': this.type,
+ 'conditionMap[context]': this.context
+ }
+ this.defaultExpandKeys=['root'];
+ getUIAuthor(params).then(res => {
+ this.processChildren(res.data.data[0]); // 澶勭悊姣忎釜鑺傜偣
+ this.uiTreeOption.defaultExpandKeys=this.defaultExpandKeys;
+ this.uiTreeData = [{
+ attributes: {},
+ checked: false,
+ expanded: true,
+ data: "root",
+ level: 0,
+ icon: 'el-icon-s-home',
+ oid: res.data.data[0].oid,
+ label: res.data.data[0].text,
+ children: res.data.data[0].children
+ }];
loading.close();
- }).catch(error=>{
+ }).catch(error => {
loading.close();
})
},
+ //澶勭悊鏍�
+ processChildren(item) {
+ if (item.children && item.children.length > 0) {
+ item.children = item.children.map(child => {
+ if(child.level<5){
+ this.defaultExpandKeys.push(child.oid)
+ }
+ if(child.level==1){
+ child.icon='el-icon-s-promotion';
+ child.label=child.data.label+'锛�'+child.data.name+'锛�'
+ }else if(child.level==2){
+ child.icon='el-icon-s-order';
+ child.label=child.text
+ }else if(child.level==3){
+ child.icon='el-icon-office-building';
+ child.label=child.text
+ }else if(child.level==4){
+ child.icon='el-icon-document';
+ child.label=child.text
+ }else if(child.level==5){
+ child.icon='el-icon-s-ticket';
+ child.label=child.text
+ }
+ this.processChildren(child); // 閫掑綊澶勭悊姣忎釜瀛愯妭鐐�
+ return child; // 鍙繑鍥炲瓙鑺傜偣鐨� attributes
+ });
+ }
+ },
submitDialog() {
- this.$refs.form.validate((valid) => {
- if (valid) {
- const formData={}
- authorizedUI(formData).then(res => {
- if (res.data.success) {
- this.$message.success("淇濆瓨鎴愬姛");
- this.cancelDialog();
- }
- });
- } else {
- return false;
+ const selectTreeList = this.$refs.uiTree.getCheckedNodes();
+ if (selectTreeList.length == 0) {
+ this.$message.error("璇烽�夋嫨鍔熻兘妯″潡");
+ return;
+ }
+ const formData = {
+ roleId: this.nodeRow.oid,
+ type: this.type,
+ context: this.context,
+ selectTreeList: selectTreeList
+ }
+ authorizedUI(formData).then(res => {
+ if (res.data.success) {
+ this.$message.success("鎺堟潈鎴愬姛");
+ this.cancelDialog();
}
});
+
},
clearValue(){
this.$refs.uiTree.setCheckedNodes([])
diff --git a/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue b/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue
index e29f4a0..ad0703b 100644
--- a/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue
+++ b/Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue
@@ -20,6 +20,37 @@
<el-main>
<basic-container>
+ <h3 style="margin: 0 0 10px 0">UI鏉冮檺閰嶇疆</h3>
+ <div>
+ <el-button icon="el-icon-place" plain size="small" type="primary" @click="saveHandler">鎺堟潈</el-button>
+ <el-button icon="el-icon-close" plain size="small" type="primary" @click="clearValue" style="margin-right: 40px;">閲嶇疆</el-button>
+ 涓氬姟绫诲瀷锛�<el-select v-model="type" placeholder="璇烽�夋嫨" :clearable="true" @change="typeChange" style="width: 350px;margin-right: 20px;">
+ <el-option
+ v-for="item in typeData"
+ :key="item.oid"
+ :label="item.text"
+ :value="item.attributes.name">
+ </el-option>
+ </el-select>
+ UI涓婁笅鏂囷細<el-select v-model="context" placeholder="璇烽�夋嫨" :clearable="true" @change="contextChange" style="width: 350px;">
+ <el-option
+ v-for="item in contextData"
+ :key="item.oid"
+ :label="item.plCode+' '+item.plName"
+ :value="item.plCode">
+ </el-option>
+ </el-select>
+ </div>
+ <div style="height: calc(100vh - 277px);margin-top: 10px;">
+ <avue-tree ref="uiTree" :data="uiTreeData" :option="uiTreeOption">
+ <span slot-scope="{ node, data }" class="el-tree-node__label">
+ <span style="font-size: 15px">
+ <i :class="data.icon"></i>
+ {{ (node || {}).label }}
+ </span>
+ </span>
+ </avue-tree>
+ </div>
</basic-container>
</el-main>
@@ -29,14 +60,15 @@
<script>
import {gridRoles} from "@/api/system/role/api";
import {getUIAuthor,authorizedUI} from "@/api/authority/ui/uiAuthor";
+import {getBizTree, gridUIContextData} from "@/api/UI/uiDefine";
export default {
name: "index",
data() {
return {
type:'',//涓氬姟绫诲瀷
+ context:'',//UI涓婁笅鏂嘽ode
treeOption: {
- height: '500px',
menu: false,
addBtn: false,
props: {
@@ -47,22 +79,27 @@
},
nodeRow: {},
treeData: [],
+ defaultExpandKeys:[],
uiTreeOption: {
- height: '500px',
+ defaultExpandKeys:[],
+ multiple: true,
menu: false,
addBtn: false,
filter:false,
props: {
- label: 'name',
+ label: 'label',
value: 'oid',
children: 'children'
}
},
uiTreeData: [],
+ typeData:[],
+ contextData:[]
}
},
created() {
- this.getTreeList()
+ this.getTreeList();
+ this.getTypeList()
},
methods:{
getTreeList() {
@@ -77,26 +114,105 @@
// 瑙掕壊鐐瑰嚮
nodeClick(row) {
this.nodeRow = row;
- const loading = this.$loading({});
- getUIAuthor().then(res => {
- this.uiTreeData = res.data.data;
- loading.close();
- }).catch(error=>{
- loading.close();
+ this.getUITree();
+ },
+ getUITree() {
+ if (this.nodeRow && this.nodeRow.oid) {
+ const loading = this.$loading({});
+ const params = {
+ 'conditionMap[roleId]': this.nodeRow.oid,
+ 'conditionMap[type]': this.type,
+ 'conditionMap[context]': this.context
+ }
+ this.defaultExpandKeys=['root'];
+ getUIAuthor(params).then(res => {
+ this.processChildren(res.data.data[0]); // 澶勭悊姣忎釜鑺傜偣
+ this.uiTreeOption.defaultExpandKeys=this.defaultExpandKeys;
+ this.uiTreeData = [{
+ attributes: {},
+ checked: false,
+ expanded: true,
+ data: "root",
+ level: 0,
+ icon: 'el-icon-s-home',
+ oid: res.data.data[0].oid,
+ label: res.data.data[0].text,
+ children: res.data.data[0].children
+ }];
+ loading.close();
+ }).catch(error => {
+ loading.close();
+ })
+ }
+ },
+ //澶勭悊鏍�
+ processChildren(item) {
+ if (item.children && item.children.length > 0) {
+ item.children = item.children.map(child => {
+ if(child.level<5){
+ this.defaultExpandKeys.push(child.oid)
+ }
+ if(child.level==1){
+ child.icon='el-icon-s-promotion';
+ child.label=child.data.label+'锛�'+child.data.name+'锛�'
+ }else if(child.level==2){
+ child.icon='el-icon-s-order';
+ child.label=child.text
+ }else if(child.level==3){
+ child.icon='el-icon-office-building';
+ child.label=child.text
+ }else if(child.level==4){
+ child.icon='el-icon-document';
+ child.label=child.text
+ }else if(child.level==5){
+ child.icon='el-icon-s-ticket';
+ child.label=child.text
+ }
+ this.processChildren(child); // 閫掑綊澶勭悊姣忎釜瀛愯妭鐐�
+ return child; // 鍙繑鍥炲瓙鑺傜偣鐨� attributes
+ });
+ }
+ },
+ getTypeList() {
+ getBizTree().then(res => {
+ this.typeData=res.data.obj.children;
})
},
+ typeChange(data){
+ this.contextData=[];
+ this.type=data;
+ if(data){
+ const params = {
+ 'conditionMap[btmName]': data,
+ }
+ gridUIContextData(1, 500, params).then(res => {
+ this.contextData = res.data.data;
+ })
+ }else {
+ this.contextData = [];
+ }
+ this.getUITree();
+ },
+ contextChange(data){
+ this.context=data;
+ this.getUITree();
+ },
saveHandler() {
- this.$refs.form.validate((valid) => {
- if (valid) {
- const formData={}
- authorizedUI(formData).then(res => {
- if (res.data.success) {
- this.$message.success("淇濆瓨鎴愬姛");
- this.cancelDialog();
- }
- });
- } else {
- return false;
+ const selectTreeList = this.$refs.uiTree.getCheckedNodes();
+ if (selectTreeList.length == 0) {
+ this.$message.error("璇烽�夋嫨鍔熻兘妯″潡");
+ return;
+ }
+ const formData = {
+ roleId: this.nodeRow.oid,
+ type: this.type,
+ context: this.context,
+ selectTreeList: selectTreeList
+ }
+ authorizedUI(formData).then(res => {
+ if (res.data.success) {
+ this.$message.success("鎺堟潈鎴愬姛");
+ this.cancelDialog();
}
});
},
--
Gitblit v1.9.3