From 134402cea23f11760853dfb25b8a63a3554ce636 Mon Sep 17 00:00:00 2001
From: 田源 <lastanimals@163.com>
Date: 星期四, 18 一月 2024 10:59:20 +0800
Subject: [PATCH] 分类授权完善

---
 Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue |  125 +++++++++++++++++++++++++++++++++++------
 1 files changed, 105 insertions(+), 20 deletions(-)

diff --git a/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue b/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue
index afb086d..902cabf 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"
@@ -15,11 +16,9 @@
       :height="tableHeight"
       border
       class="cus-table"
-      @select="handleSelection"
       @row-click="handleRowClick"
       @select-all="handleSelectionAll"
       @selection-change="handleSelectionChange"
-      @sort-change="sortChange"
     >
       <el-table-column
         type="selection"
@@ -40,6 +39,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,17 +58,18 @@
           </el-input>
           <el-checkbox
             v-if="item.type === 'checkbox'"
-            v-model="row[item.prop]">
+            v-model="row[item.prop]"
+            :disabled="row.allDisabled ? true :row[item.code]">
           </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>
@@ -76,7 +77,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 {
@@ -107,6 +108,9 @@
       roleList: [],
       //褰撳墠閫変腑鐨勮〃鏍艰
       selectList: [],
+      itemKey: '',
+      addIndex: Number,
+      currentRow: {}
     };
   },
   watch: {
@@ -138,12 +142,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)
@@ -153,26 +158,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;
             if (authDatas.length > 0) {
-              authDatas.forEach(authData => {
+              authDatas.forEach((authData, index) => {
                 let item = {
                   oid: authData.oid,
                   roleData: authData.roleId,
                   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; //娣诲姞琛屼笅鏍囩瓑浜巆lassifyAuthData鐨勯暱搴�-1
+                this.roleHandlerMethods(authData.roleId, 'create', this.addIndex)
               })
             }
           });
+          console.log('created', this.classifyAuthData)
         });
       }
     },
@@ -183,6 +191,80 @@
   created() {
   },
   methods: {
+    roleHandlerMethods(id, type, index) {
+      if (this.classifyAuthData.length < 0) {
+        return;
+      }
+
+      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);
+        });
+
+        //鎷胯〃鏍煎垪澶村惊鐜拰娌℃湁瀵瑰簲鐨勫睘鎬ц繘琛屾瘮杈�
+        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();
+      })
+    },
+    async selectChange(row, currentRow) {
+      try {
+        this.currentRow = currentRow;
+        const res = await getButtonsByRoleId({roleId: row, code: 'classifyTree'});
+
+        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[item.code] = item.prop === key ? false : true;
+                  if (!currentRow.classify_view) {
+                    currentRow.allDisabled = false;
+                  }
+                });
+              } else {
+                Object.keys(currentRow).forEach(key => {
+                  currentRow[item.code] = item.prop === key ? true : false;
+                  if (!currentRow.classify_view) {
+                    currentRow.allDisabled = false;
+                  }
+                });
+              }
+            }
+            this.itemKey = uuidv4(); // 寮哄埗鍒锋柊琛ㄦ牸
+          });
+        });
+      } catch (error) {
+        console.error(error);
+      }
+    },
     // 鍏抽棴瀵硅瘽妗�
     closeDialog() {
       this.$emit('update:visible', false);
@@ -190,13 +272,16 @@
     },
     // 澧炲姞琛�
     addClassifyAuth() {
-      if(this.roleList.length<=0){
+      if (this.roleList.length <= 0) {
         this.$message.warning("褰撳墠绉熸埛涓嶅瓨鍦ㄨ鑹蹭俊鎭紒");
         return;
       }
+      console.log('this.roleList', this.roleList)
+      this.addIndex++; //鑷畾涔夌敓鎴愭坊鍔犺涓嬫爣
       let item = {
         roleData: this.roleList[0].id,
         classifyItem: this.classifyData.label,
+        index: this.addIndex,
         uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d
       }
       //灏嗘寜閽缃繘鍘�
@@ -204,8 +289,8 @@
         Vue.set(item, data.id, false);
       })
       //console.log(item)
-      this.classifyAuthData.push(item)
-      // console.log(this.classifyAuthData);
+      this.classifyAuthData.push(item);
+      this.roleHandlerMethods(this.roleList[0].id, 'add', this.addIndex)
     },
     // 鍒犻櫎琛�
     subClassifyAuth() {
@@ -294,16 +379,16 @@
       })
     },
     // 鍏ㄩ�夋寜閽�
-    selectAllButton(){
-      if(this.selectList.length!==1){
+    selectAllButton() {
+      if (this.selectList.length !== 1) {
         this.$message.warning("璇峰彧閫夋嫨涓�琛岄渶瑕佸叏閫夌殑鎸夐挳鐨勬暟鎹锛�");
         return;
       }
       this.classifyAuthButton.forEach(item => {
         //console.log("item",item);
-        Vue.set(this.classifyAuthData[0], item.id, true);
+        Vue.set(this.selectList[0], item.id, true);
       });
-      //console.log("this.classifyAuthData",this.classifyAuthData);
+      //console.log("this.selectList",this.selectList);
     },
   },
 };

--
Gitblit v1.9.3