From 2ff8dd1f7d2f71944c25c9e116d12d9fb418ac0a Mon Sep 17 00:00:00 2001 From: ludc Date: 星期三, 17 一月 2024 17:00:08 +0800 Subject: [PATCH] 分类授权数据授权界面编写与接口修改,分类数据查询接口修改 --- Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue | 95 ++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 80 insertions(+), 15 deletions(-) diff --git a/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue b/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue index f6a26ad..3baa5c7 100644 --- a/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue +++ b/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue @@ -8,6 +8,7 @@ title="鍒嗙被鎺堟潈" top="-45px" @close="closeDialog"> <el-table + :key="itemKey" ref="dataTable" v-loading="isLoading" :data="classifyAuthData" @@ -40,6 +41,7 @@ v-if="item.type === 'select'" slot="prepend" v-model="row[item.prop]" + @change="selectChange(row.roleData,row)" > <el-option v-for="optionItem in roleList" @@ -58,16 +60,18 @@ </el-input> <el-checkbox v-if="item.type === 'checkbox'" - v-model="row[item.prop]"> + v-model="row[item.prop]" + :disabled="row.allDisabled ? true :typeof row[item.prop] == 'undefined' || typeof row[item.prop] == null"> </el-checkbox> </template> </el-table-column> </el-table> <div slot="footer" class="dialog-footer"> - <el-button class="el-icon-plus" type="success" @click="addClassifyAuth"></el-button> - <el-button class="el-icon-minus" type="warning" @click="subClassifyAuth"></el-button> - <el-button type="primary" @click="submit">鎻� 浜�</el-button> - <el-button type="danger" @click="isShowDialog = false">鍏� 闂�</el-button> + <el-button plain type="info" @click="selectAllButton">鎸夐挳鍏ㄩ��</el-button> + <el-button class="el-icon-plus" plain type="success" @click="addClassifyAuth"></el-button> + <el-button class="el-icon-minus" plain type="warning" @click="subClassifyAuth"></el-button> + <el-button plain type="primary" @click="submit">鎻� 浜�</el-button> + <el-button plain type="danger" @click="isShowDialog = false">鍏� 闂�</el-button> </div> </el-dialog> </template> @@ -75,7 +79,7 @@ <script> import {getButtonByParentCode} from "@/api/system/menu" import {getPage} from "@/api/system/role" -import {saveOrUpdate, getClassifyAuthList} from "@/api/system/classifyAuth" +import {saveOrUpdate, getClassifyAuthList, getButtonsByRoleId} from "@/api/system/classifyAuth" import {v4 as uuidv4} from 'uuid'; export default { @@ -96,7 +100,7 @@ // 瀵硅瘽妗嗘樉绀烘帶鍒� isShowDialog: this.visible, isLoading: false, - tableHeight: '520px', + tableHeight: 'calc(100vh - 550px)', classifyAuthData: [], //鍒楀ご classifyAuthHeader: [], @@ -106,6 +110,9 @@ roleList: [], //褰撳墠閫変腑鐨勮〃鏍艰 selectList: [], + itemKey: '', + viewStatus: false, + addIndex: Number, }; }, watch: { @@ -137,12 +144,13 @@ let columnItem = { label: item.name, prop: item.id, + code: item.code, type: "checkbox", width: 180, }; tempData.push(columnItem); }) - this.classifyAuthHeader = tempData + this.classifyAuthHeader = tempData; resolve(); }).catch(err => { reject(err) @@ -152,25 +160,29 @@ this.roleList = res.data.data.records; }); // 鑾峰彇璇ュ垎绫讳笅宸叉巿鏉冪殑鍒嗙被鎺堟潈淇℃伅 - getClassifyAuthList({classifyId: this.classifyData.oid}).then(res => { + getClassifyAuthList({classifyId: this.classifyData.oid, authType: "classify_auth"}).then(res => { //console.log(res.data.data); let authDatas = res.data.data; + console.log('authDatas', authDatas) if (authDatas.length > 0) { - authDatas.forEach(authData => { + authDatas.forEach((authData,index) => { let item = { oid: authData.oid, roleData: authData.roleId, - classifyItem: this.classifyData.text, + classifyItem: this.classifyData.label, + index:index, uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d } //灏嗘寜閽缃繘鍘� authData.buttonIdList.forEach(data => { Vue.set(item, data, true); }); - //console.log(item) this.classifyAuthData.push(item); + this.addIndex = this.classifyAuthData.length -1 ; + // console.log('classifyAuthData', this.classifyAuthData) }) } + this.roleHandlerMethods('', 'create', 0) }); }); } @@ -182,6 +194,41 @@ created() { }, methods: { + roleHandlerMethods(id, type, index) { + if (this.classifyAuthData.length > 0) { + let roleButtonId = type === 'select' ? id : this.classifyAuthData[0].roleData; + getButtonsByRoleId({roleId: roleButtonId, code: 'classifyTree'}).then(res => { + // 鎵惧埌this.classifyAuthButton涓病鏈夊搴旂殑灞炴�� + const filteredItems = this.classifyAuthButton.filter(item => { + return !res.data.data.find(x => x.id === item.id); + }); + + this.classifyAuthHeader.forEach((item) => { + if (filteredItems.some(x => x.id === item.prop)) { + this.$nextTick(() => { + + if(this.classifyAuthData[index] !== undefined && this.classifyAuthData[index] !== null){ + Object.keys(this.classifyAuthData[index]).forEach((key) => { + if (item.prop === key) { + this.classifyAuthData[index] = Object.assign({}, this.classifyAuthData[index], { [key]: undefined }); + if (item.code === "classify_view") { + this.$set(this.classifyAuthData[index],'allDisabled',true) + } + } + }); + } + // console.log('classifyAuthData', this.classifyAuthData) + // console.log('item', item.prop) + this.itemKey = uuidv4(); + }) + } + }); + }) + } + }, + selectChange(row,index) { + this.roleHandlerMethods(row, 'select',index.index); + }, // 鍏抽棴瀵硅瘽妗� closeDialog() { this.$emit('update:visible', false); @@ -189,9 +236,15 @@ }, // 澧炲姞琛� addClassifyAuth() { + if (this.roleList.length <= 0) { + this.$message.warning("褰撳墠绉熸埛涓嶅瓨鍦ㄨ鑹蹭俊鎭紒"); + return; + } + this.addIndex++; let item = { roleData: this.roleList[0].id, - classifyItem: this.classifyData.text, + classifyItem: this.classifyData.label, + index:this.addIndex, uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d } //灏嗘寜閽缃繘鍘� @@ -199,8 +252,8 @@ Vue.set(item, data.id, false); }) //console.log(item) - this.classifyAuthData.push(item) - // console.log(this.classifyAuthData); + this.classifyAuthData.push(item); + this.roleHandlerMethods('', 'add', this.addIndex) }, // 鍒犻櫎琛� subClassifyAuth() { @@ -288,6 +341,18 @@ window.console.log(error); }) }, + // 鍏ㄩ�夋寜閽� + selectAllButton() { + if (this.selectList.length !== 1) { + this.$message.warning("璇峰彧閫夋嫨涓�琛岄渶瑕佸叏閫夌殑鎸夐挳鐨勬暟鎹锛�"); + return; + } + this.classifyAuthButton.forEach(item => { + //console.log("item",item); + Vue.set(this.selectList[0], item.id, true); + }); + //console.log("this.selectList",this.selectList); + }, }, }; </script> -- Gitblit v1.9.3