From a34c10535d130c4be667301434a0e8072ee82716 Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期一, 14 十月 2024 15:21:48 +0800 Subject: [PATCH] 整合代码,修改表单定义按钮排列方式 --- Source/plt-web/plt-web-ui/src/views/authority/ui/uiAuthorization/index.vue | 188 +++++++++++++++++++++++++++++++++++++++------- 1 files changed, 157 insertions(+), 31 deletions(-) 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..3fb919b 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 @@ -4,7 +4,7 @@ <basic-container> <div ref="TreeBox" style="height: calc(100vh - 154px);!important;"> <!-- 宸︿晶鏍� --> - <div style="height: calc(100vh - 200px);"> + <div style="height: calc(100vh - 195px);"> <avue-tree :data="treeData" :option="treeOption" @node-click="nodeClick"> <span slot-scope="{ node, data }" class="el-tree-node__label"> <span style="font-size: 15px"> @@ -20,6 +20,44 @@ <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" style="margin-right: 40px;" type="primary" + @click="clearValue">閲嶇疆 + </el-button> + 涓氬姟绫诲瀷锛� + <el-select v-model="type" :clearable="true" placeholder="璇烽�夋嫨" size="small" + style="width: 300px;margin-right: 20px;" + @change="typeChange"> + <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" :clearable="true" placeholder="璇烽�夋嫨" size="small" style="width: 350px;" + @change="contextChange"> + <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 - 232px);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> @@ -28,15 +66,16 @@ <script> import {gridRoles} from "@/api/system/role/api"; -import {getUIAuthor,authorizedUI} from "@/api/authority/ui/uiAuthor"; +import {getUIAuthor, authorizedUI} from "@/api/authority/ui/uiAuthor"; +import {getBizTree, gridUIContextData} from "@/api/UI/uiDefine"; export default { name: "index", data() { return { - type:'',//涓氬姟绫诲瀷 + type: '',//涓氬姟绫诲瀷 + context: '',//UI涓婁笅鏂嘽ode treeOption: { - height: '500px', menu: false, addBtn: false, props: { @@ -47,61 +86,147 @@ }, nodeRow: {}, treeData: [], + defaultExpandKeys: [], uiTreeOption: { - height: '500px', + defaultExpandedKeys: this.defaultExpandKeys, + multiple: true, menu: false, addBtn: false, - filter:false, + filter: false, props: { - label: 'name', + label: 'label', value: 'oid', children: 'children' } }, uiTreeData: [], + typeData: [], + contextData: [] } }, created() { - this.getTreeList() + this.getTreeList(); + this.getTypeList() }, - methods:{ + methods: { getTreeList() { const loading = this.$loading({}); gridRoles().then(res => { this.treeData = res.data.data; loading.close(); - }).catch(error=>{ + }).catch(error => { loading.close(); }) }, // 瑙掕壊鐐瑰嚮 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, + 'conditionMap[showCheckbox]': true + } + this.defaultExpandKeys = ['root']; + getUIAuthor(params).then(res => { + this.processChildren(res.data.data[0]); // 澶勭悊姣忎釜鑺傜偣 + this.uiTreeOption.defaultExpandedKeys = 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 < 2) { + // 榛樿鏍戣妭鐐瑰睍寮�涓ゅ眰鏁堟灉 + 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-tools'; + 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(); } }); }, - clearValue(){ - this.$refs.uiTree.setCheckedNodes([]) + clearValue() { + this.$refs.uiTree.setCheckedNodes([]); } } } @@ -112,8 +237,9 @@ .el-scrollbar__wrap { overflow: auto !important; } - .headerCon{ - .el-button{ + + .headerCon { + .el-button { width: 82px; } } -- Gitblit v1.9.3