From 988cf8b273a2015833c024727deb9acc46060b3e Mon Sep 17 00:00:00 2001 From: ludc Date: 星期四, 22 八月 2024 10:41:20 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- Source/UBCS-WEB/src/components/Theme/DataAuthDialog.vue | 398 ++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 238 insertions(+), 160 deletions(-) diff --git a/Source/UBCS-WEB/src/components/Theme/DataAuthDialog.vue b/Source/UBCS-WEB/src/components/Theme/DataAuthDialog.vue index ed964a5..ad57d3a 100644 --- a/Source/UBCS-WEB/src/components/Theme/DataAuthDialog.vue +++ b/Source/UBCS-WEB/src/components/Theme/DataAuthDialog.vue @@ -40,7 +40,7 @@ v-if="item.type === 'select'" slot="prepend" v-model="row[item.prop]" - @change="roleChange" + @change="roleChange(row.roleData,row)" > <el-option v-for="optionItem in roleList" @@ -59,17 +59,19 @@ </el-input> <el-checkbox v-if="item.type === 'checkbox'" - v-model="row[item.prop]"> + v-model="row[item.prop]" + :disabled="row.authButton.allDisabled ? true : row.authButton[item.code]" + @change="checkBoxToChangeTheEvent(row[item.prop],item.code,row,item.prop)"> </el-checkbox> </template> </el-table-column> </el-table> <div slot="footer" class="dialog-footer"> - <el-button type="info" plain @click="selectAllButton">鎸夐挳鍏ㄩ��</el-button> - <el-button class="el-icon-plus" type="success" plain @click="addClassifyAuth"></el-button> - <el-button class="el-icon-minus" type="warning" plain @click="subClassifyAuth"></el-button> - <el-button type="primary" plain @click="submit">鎻� 浜�</el-button> - <el-button type="danger" plain @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> @@ -77,12 +79,13 @@ <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 { name: "dataAuthDialog.vue", props: { + // 褰撳墠鐐瑰嚮鑺傜偣鐨勯《灞傝妭鐐� classifyData: { type: "Object", default: "", @@ -92,12 +95,16 @@ type: "Boolean", default: false, }, + // 褰撳墠鐐瑰嚮鐨勮妭鐐� + TreeNode: { + type: Object + } }, data() { return { // 瀵硅瘽妗嗘樉绀烘帶鍒� isShowDialog: this.visible, - isLoading: false, + isLoading: true, tableHeight: 'calc(100vh - 550px)', classifyAuthData: [], //鍒楀ご @@ -118,71 +125,12 @@ visible() { if (this.visible) { this.isShowDialog = this.visible; - return new Promise((resolve, reject) => { - getButtonByParentCode({code: this.classifyData.attributes.id}).then(res => { - // 璁板綍鎸夐挳鏁版嵁 - this.classifyAuthButton = res.data.data; - const list = res.data.data; - let tempData = []; - // 瑙掕壊鍒� - tempData.push({ - label: "瑙掕壊", - prop: "roleData", - type: "select", - width: 150, - }); - // 缂栫爜椤瑰垎绫绘巿鏉� - tempData.push({ - label: "缂栫爜椤规暟鎹巿鏉�", - prop: "classifyItem", - type: "text", - width: 180, - }); - list.forEach(item => { - let columnItem = { - label: item.name, - prop: item.id, - code: item.code, - type: "checkbox", - width: 180, - }; - tempData.push(columnItem); - }) - this.classifyAuthHeader = tempData - resolve(); - }).catch(err => { - reject(err) - }); - // 鑾峰彇瑙掕壊鍒楄〃 - getPage(1, -1, null).then(res => { - this.roleList = res.data.data.records; - }); - // 鑾峰彇璇ュ垎绫讳笅宸叉巿鏉冪殑鍒嗙被鎺堟潈淇℃伅 - getClassifyAuthList({classifyId: this.classifyData.oid,authType: "data_auth"}).then(res => { - //console.log(res.data.data); - let authDatas = res.data.data; - if (authDatas.length > 0) { - authDatas.forEach(authData => { - let item = { - oid: authData.oid, - roleData: authData.roleId, - classifyItem: this.classifyData.label, - 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; //娣诲姞琛屼笅鏍囩瓑浜巆lassifyAuthData鐨勯暱搴�-1 - // this.roleHandlerMethods(authData.roleId, 'create', this.addIndex) - }) - } - }); - }); + this.loadAuthPage(); } }, + classifyAuthData(newval) { + this.addIndex = newval.length <= 0 ? 0 : newval.length - 1; + } }, computed: {}, mounted() { @@ -190,65 +138,120 @@ created() { }, methods: { - roleHandlerMethods(id, type, index) { - if (this.classifyAuthData.length < 0) { - return; + checkBoxToChangeTheEvent(check, code, row, id) { + if (code === "data_view") { + row.checkTheStatus = check; + } else if (!row.checkTheStatus) { + this.$message.warning('娓呭厛鍕鹃�夋煡鐪嬫寜閽紒'); + // 鍦ㄦ潯浠朵笉婊¤冻鏃跺皢澶氶�夋鐘舵�佽缃负false + row[id] = false; } - getButtonsByRoleId({roleId: id, code: 'classifyTree'}).then(res => { - // 鎵惧埌this.classifyAuthButton涓病鏈夊搴旂殑灞炴�� - const filteredItems = this.classifyAuthButton.filter(item => { - return !res.data.data.find(x => x.id === item.id); + if (!row.checkTheStatus) { + this.classifyAuthButton.forEach(key => { + // 鏌ョ湅涓篺alse鏃跺皢鎵�鏈夊閫夋鐘舵�佽缃负false + row[key.id] = false; }); - - //鎷胯〃鏍煎垪澶村惊鐜拰娌℃湁瀵瑰簲鐨勫睘鎬ц繘琛屾瘮杈� - 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}); - this.$set(this.classifyAuthData[index], item.code, true); - } - }); - } - }) - } - }); - - //娣诲姞 鈥滄煡鐪嬪叏閮ㄧ鐢ㄦ潯浠垛�� - this.classifyAuthData.forEach((classkey, classIndex) => { - if (classkey.classify_view) { - this.$set(this.classifyAuthData[classIndex], 'allDisabled', true) - } - }); - - //寮哄埗鍒锋柊琛ㄦ牸 - this.itemKey = uuidv4(); - }) + } }, // 鍏抽棴瀵硅瘽妗� closeDialog() { this.$emit('update:visible', false); this.classifyAuthData = []; }, - // 瑙掕壊鏀瑰彉鏃� - roleChange(roleId){ - console.log(roleId); + roleHandlerMethods(id, type, index) { + if (this.classifyAuthData.length === 0) { + return; + } + //filteredItems 鏈巿鏉冩暟缁� + getButtonsByRoleId({roleId: id, code: this.classifyData.attributes.id}).then(res => { + const filteredItems = this.classifyAuthButton.filter(item => + !res.data.data.some(x => x.id === item.id) + ); + //鍜岃〃鏍煎垪杩涜瀵规瘮 + this.classifyAuthHeader.forEach((item) => { + // if (item.code !== 'data_view') { + // this.$set(this.classifyAuthData[index].authButton, "allDisabled", true); + // } + const isMatched = filteredItems.some((x) => x.id === item.prop); + this.$nextTick(() => { + if (this.classifyAuthData[index]) { + if (isMatched) { + Object.keys(this.classifyAuthData[index]).forEach((key) => { + this.$set(this.classifyAuthData[index].authButton, item.code, true); + //娣诲姞 鈥滄煡鐪嬪叏閮ㄧ鐢ㄦ潯浠垛�� + if (item.code === "data_view") { + this.$set(this.classifyAuthData[index].authButton, "allDisabled", true); + } + }); + + } else { + Object.keys(this.classifyAuthData[index]).forEach((key) => { + this.$set(this.classifyAuthData[index].authButton, item.code, false); + }); + if(item.code === "data_view"){ + this.classifyAuthData[index].authButton.allDisabled = false; + } + } + } + }); + }); + // console.log(this.classifyAuthData) + //寮哄埗鍒锋柊琛ㄦ牸 + this.itemKey = uuidv4(); + }); + }, + // 瑙掕壊鏀瑰彉鏃� + async roleChange(row, currentRow) { + try { + this.currentRow = currentRow; + const res = await getButtonsByRoleId({roleId: row, code: this.classifyData.attributes.id}); + + const filteredItems = this.classifyAuthButton.filter(item => { + return !res.data.data.find(x => x.id === item.id); + }); + + this.classifyAuthHeader.forEach(item => { + const isMatched = filteredItems.some(x => x.id === item.prop); + this.$nextTick(() => { + if (currentRow) { + if (isMatched) { + Object.keys(currentRow).forEach((key) => { + currentRow.authButton[item.code] = true; + if (!currentRow.authButton.data_view) { + currentRow.authButton.allDisabled = false; + } + }); + } else { + Object.keys(currentRow).forEach((key) => { + currentRow.authButton[item.code] = false; + if (!currentRow.authButton.data_view) { + currentRow.authButton.allDisabled = false; + } + }); + } + } + this.itemKey = uuidv4(); // 寮哄埗鍒锋柊琛ㄦ牸 + }); + }); + } catch (error) { + console.error(error); + } }, // 澧炲姞琛� addClassifyAuth() { - if(this.roleList.length<=0){ + if (this.roleList.length <= 0) { this.$message.warning("褰撳墠绉熸埛涓嶅瓨鍦ㄨ鑹蹭俊鎭紒"); return; } + let item = { roleData: this.roleList[0].id, classifyItem: this.classifyData.label, - uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d - + authButton: {}, + uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d, + index: this.classifyAuthData.length -1, } //灏嗘寜閽缃繘鍘� this.classifyAuthButton.forEach(data => { @@ -256,7 +259,7 @@ }) //console.log(item) this.classifyAuthData.push(item) - // console.log(this.classifyAuthData); + this.roleHandlerMethods(this.roleList[0].id, 'add', this.classifyAuthData.length -1) }, // 鍒犻櫎琛� subClassifyAuth() { @@ -281,61 +284,67 @@ this.selectList = list; }, // 淇濆瓨鍒嗙被鎺堟潈淇℃伅 - submit() { - if (this.classifyAuthData.length <= 0) { - this.$message.warning('鎺堟潈鍒楄〃涓虹┖锛�') - return; - } + async submit() { + let form = { + classifyAuthList: [], + isCLear: false, //榛樿鏄竻绌� + classifyId: this.TreeNode.oid, + authType: 'data_auth', + }; let isRepeat = false; - // 閬嶅巻鏁扮粍锛屾瘮杈冨悗闈㈢殑瀵硅薄鐨剅oleData鏄惁涓庡墠闈㈢殑瀵硅薄鐩哥瓑 - for (let i = 0; i < this.classifyAuthData.length - 1; i++) { - let currentRoleId = this.classifyAuthData[i].roleData; - for (let j = i + 1; j < this.classifyAuthData.length; j++) { - if (currentRoleId === this.classifyAuthData[j].roleData) { - isRepeat = true; + if (this.classifyAuthData.length > 0) { + // 閬嶅巻鏁扮粍锛屾瘮杈冨悗闈㈢殑瀵硅薄鐨剅oleData鏄惁涓庡墠闈㈢殑瀵硅薄鐩哥瓑 + for (let i = 0; i < this.classifyAuthData.length - 1; i++) { + let currentRoleId = this.classifyAuthData[i].roleData; + for (let j = i + 1; j < this.classifyAuthData.length; j++) { + if (currentRoleId === this.classifyAuthData[j].roleData) { + isRepeat = true; + break; + } + } + if (isRepeat) { break; } } if (isRepeat) { - break; - } - } - if (isRepeat) { - this.$message.warning("瑙掕壊鍜屽垎绫诲凡缁忓瓨鍦紝璇烽噸鏂伴厤缃紒"); - return; - } - let form = []; - let flag = false; - this.classifyAuthData.forEach(item => { - let itemButtonList = []; - //绛涢�夊嚭鎸夐挳鍕鹃�変负true鐨勫垪 - for (let key in item) { - if (item[key] === true) { - itemButtonList.push(key); - } - } - /**濡傛灉itemButtonList涓虹┖璇佹槑鏄紝 - 娣诲姞浜嗚鑹蹭絾鏄病鍕鹃�変换浣曠殑鎸夐挳*/ - if (itemButtonList.length <= 0) { - flag = true; + this.$message.warning("瑙掕壊鍜屽垎绫诲凡缁忓瓨鍦紝璇烽噸鏂伴厤缃紒"); return; } - let data = { - oid: item.oid, - roleId: item.roleData, - classifyId: this.classifyData.oid, - buttonIds: itemButtonList.join(","), - authType: "data_auth", + let flag = false; + this.classifyAuthData.forEach(item => { + let itemButtonList = []; + //绛涢�夊嚭鎸夐挳鍕鹃�変负true鐨勫垪 + for (let key in item) { + if (item[key] === true && key !== 'checkTheStatus') { + itemButtonList.push(key); + } + } + /**濡傛灉itemButtonList涓虹┖璇佹槑鏄紝 + 娣诲姞浜嗚鑹蹭絾鏄病鍕鹃�変换浣曠殑鎸夐挳*/ + if (itemButtonList.length <= 0) { + flag = true; + return; + } + let data = { + oid: item.oid, + roleId: item.roleData, + classifyId: this.TreeNode.oid, + buttonIds: itemButtonList.join(","), + authType: "data_auth", + } + form.classifyAuthList.push(data); + }); + if (flag) { + this.$message.warning('鏈夋湭鍕鹃�夋搷浣滅殑鏉冮檺锛屼笉鍏佽鎺堟潈') + return; } - form.push(data); - }); - if (flag) { - this.$message.warning('鏈夋湭鍕鹃�夋搷浣滅殑鏉冮檺锛屼笉鍏佽鎺堟潈') - return; + // console.log(form) + } else { + // 涓虹┖璇佹槑鏄竻绌烘巿鏉冨垪琛� + form.isCLear = true; } - // console.log(form) // 璋冪敤淇濆瓨鍒嗙被鎺堟潈鐨勬帴鍙� - saveOrUpdate(form).then(res => { + await saveOrUpdate(form).then(res => { this.$message({ type: "success", message: res.data.msg, @@ -344,10 +353,12 @@ }, (error) => { window.console.log(error); }) + this.classifyAuthData = []; + this.loadAuthPage(); }, // 鍏ㄩ�夋寜閽� - selectAllButton(){ - if(this.selectList.length!==1){ + selectAllButton() { + if (this.selectList.length !== 1) { this.$message.warning("璇峰彧閫夋嫨涓�琛岄渶瑕佸叏閫夌殑鎸夐挳鐨勬暟鎹锛�"); return; } @@ -357,6 +368,73 @@ }); //console.log("this.selectList",this.selectList); }, + loadAuthPage() { + return new Promise((resolve, reject) => { + this.isLoading = true; + getButtonByParentCode({code: this.classifyData.attributes.id}).then(res => { + // 璁板綍鎸夐挳鏁版嵁 + this.classifyAuthButton = res.data.data; + const list = res.data.data; + let tempData = []; + // 瑙掕壊鍒� + tempData.push({ + label: "瑙掕壊", + prop: "roleData", + type: "select", + width: 150, + }); + // 缂栫爜椤瑰垎绫绘巿鏉� + tempData.push({ + label: "缂栫爜椤规暟鎹巿鏉�", + prop: "classifyItem", + type: "text", + width: 180, + }); + list.forEach(item => { + let columnItem = { + label: item.name, + prop: item.id, + code: item.code, + type: "checkbox", + width: 180, + }; + tempData.push(columnItem); + }) + this.classifyAuthHeader = tempData + resolve(); + }).catch(err => { + reject(err) + }); + // 鑾峰彇瑙掕壊鍒楄〃 + getPage(1, -1, null).then(res => { + this.roleList = res.data.data.records; + }); + // 鑾峰彇璇ュ垎绫讳笅宸叉巿鏉冪殑鍒嗙被鎺堟潈淇℃伅 + getClassifyAuthList({classifyId: this.TreeNode.oid, authType: "data_auth"}).then(res => { + //console.log(res.data.data); + let authDatas = res.data.data; + if (authDatas.length > 0) { + authDatas.forEach((authData, index) => { + let item = { + oid: authData.oid, + roleData: authData.roleId, + classifyItem: this.classifyData.label, + index: index, + authButton: {}, + uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d + } + //灏嗘寜閽缃繘鍘� + authData.buttonIdList.forEach(data => { + Vue.set(item, data, true); + }); + this.classifyAuthData.push(item); + this.roleHandlerMethods(authData.roleId, 'create', index) + }) + } + }); + this.isLoading = false; + }); + }, }, }; </script> -- Gitblit v1.9.3