From a56c7f5fbe4b171a82561dce3b3b0ff6c5c30386 Mon Sep 17 00:00:00 2001
From: ludc
Date: 星期一, 22 一月 2024 17:30:58 +0800
Subject: [PATCH] 可用字符集,前后缀,应用,可以用字符集接口下拉和正则接口提交

---
 Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue |  289 ++++++++++++++++++++++++++++++---------------------------
 1 files changed, 151 insertions(+), 138 deletions(-)

diff --git a/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue b/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue
index d161011..cedd531 100644
--- a/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue
+++ b/Source/UBCS-WEB/src/components/Theme/ClassifyAuthDialog.vue
@@ -6,7 +6,9 @@
     append-to-body
     class="avue-dialog avue-dialog--top"
     title="鍒嗙被鎺堟潈"
-    top="-45px" @close="closeDialog">
+    top="-45px"
+    @close="closeDialog"
+  >
     <el-table
       :key="itemKey"
       ref="dataTable"
@@ -20,10 +22,7 @@
       @select-all="handleSelectionAll"
       @selection-change="handleSelectionChange"
     >
-      <el-table-column
-        type="selection"
-        width="55"
-      ></el-table-column>
+      <el-table-column type="selection" width="55"></el-table-column>
       <el-table-column
         v-for="(item, index) in classifyAuthHeader"
         v-if="classifyAuthHeader.length !== 0"
@@ -39,7 +38,7 @@
             v-if="item.type === 'select'"
             slot="prepend"
             v-model="row[item.prop]"
-            @change="selectChange(row.roleData,row)"
+            @change="selectChange(row.roleData, row)"
           >
             <el-option
               v-for="optionItem in roleList"
@@ -59,26 +58,43 @@
           <el-checkbox
             v-if="item.type === 'checkbox'"
             v-model="row[item.prop]"
-            :disabled="row.allDisabled ? true :row[item.code]">
+            :disabled="row.authButton.allDisabled ? true : row.authButton[item.code]"
+          >
           </el-checkbox>
         </template>
       </el-table-column>
     </el-table>
     <div slot="footer" class="dialog-footer">
       <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
+        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>
+      <el-button plain type="danger" @click="isShowDialog = false"
+        >鍏� 闂�</el-button
+      >
     </div>
   </el-dialog>
 </template>
 
 <script>
-import {getButtonByParentCode} from "@/api/system/menu"
-import {getPage} from "@/api/system/role"
-import {saveOrUpdate, getClassifyAuthList, getButtonsByRoleId} from "@/api/system/classifyAuth"
-import {v4 as uuidv4} from 'uuid';
+import { getButtonByParentCode } from "@/api/system/menu";
+import { getPage } from "@/api/system/role";
+import {
+  saveOrUpdate,
+  getClassifyAuthList,
+  getButtonsByRoleId,
+} from "@/api/system/classifyAuth";
+import { v4 as uuidv4 } from "uuid";
 
 export default {
   name: "classifyAuthDialog.vue",
@@ -98,7 +114,7 @@
       // 瀵硅瘽妗嗘樉绀烘帶鍒�
       isShowDialog: this.visible,
       isLoading: false,
-      tableHeight: 'calc(100vh - 550px)',
+      tableHeight: "calc(100vh - 550px)",
       classifyAuthData: [],
       //鍒楀ご
       classifyAuthHeader: [],
@@ -108,62 +124,65 @@
       roleList: [],
       //褰撳墠閫変腑鐨勮〃鏍艰
       selectList: [],
-      itemKey: '',
+      itemKey: "",
       addIndex: Number,
-      currentRow: {}
+      currentRow: {},
     };
   },
   computed: {},
-  mounted() {
-  },
-  created() {
-  },
+  mounted() {},
+  created() {},
   watch: {
     // 鐩戝惉鐖剁粍浠朵紶鐨勭獥鍙f樉绀洪殣钘忕殑鍊�
     visible() {
       if (this.visible) {
         this.isShowDialog = this.visible;
         return new Promise((resolve, reject) => {
-          getButtonByParentCode({code: "classifyTree"}).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",
+          getButtonByParentCode({ code: "classifyTree" })
+            .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,
-              };
-              tempData.push(columnItem);
+              });
+              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();
             })
-            this.classifyAuthHeader = tempData;
-            resolve();
-          }).catch(err => {
-            reject(err)
-          });
+            .catch((err) => {
+              reject(err);
+            });
           // 鑾峰彇瑙掕壊鍒楄〃
-          getPage(1, -1, null).then(res => {
+          getPage(1, -1, null).then((res) => {
             this.roleList = res.data.data.records;
           });
           // 鑾峰彇璇ュ垎绫讳笅宸叉巿鏉冪殑鍒嗙被鎺堟潈淇℃伅
-          getClassifyAuthList({classifyId: this.classifyData.oid, authType: "classify_auth"}).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) {
@@ -172,18 +191,19 @@
                   oid: authData.oid,
                   roleData: authData.roleId,
                   classifyItem: this.classifyData.label,
+                  authButton:{},
                   index: index,
-                  uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d
-                }
+                  uuid: uuidv4(), //鐢熸垚鍞竴鐨刬d
+                };
                 //灏嗘寜閽缃繘鍘�
-                authData.buttonIdList.forEach(data => {
+                authData.buttonIdList.forEach((data) => {
                   Vue.set(item, data, true);
                 });
                 this.classifyAuthData.push(item);
                 this.addIndex = this.classifyAuthData.length - 1; //娣诲姞琛屼笅鏍囩瓑浜巆lassifyAuthData鐨勯暱搴�-1
-                this.roleHandlerMethods(authData.roleId, 'create', index)
+                this.roleHandlerMethods(authData.roleId, "create", index);
                 // console.log('index', index)
-              })
+              });
             }
           });
         });
@@ -196,87 +216,77 @@
         return;
       }
 
-      getButtonsByRoleId({roleId: id, code: 'classifyTree'}).then(res => {
+      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);
+        const filteredItems = this.classifyAuthButton.filter((item) => {
+          return !res.data.data.find((x) => x.id === item.id);
         });
-        // console.log('绂佺敤鎸夐挳',filteredItems)
-        // console.log('涓嶇鐢ㄦ寜閽�',res.data.data)
-        //鎷胯〃鏍煎垪澶村惊鐜拰娌℃湁瀵瑰簲鐨勫睘鎬ц繘琛屾瘮杈�
+
         this.classifyAuthHeader.forEach((item) => {
-          const isMatched = filteredItems.some(x => x.id === item.prop);
-          if (isMatched) {
-            this.$nextTick(() => {
-              if (this.classifyAuthData[index]) {
+          const isMatched = filteredItems.some((x) => x.id === item.prop);
+          this.$nextTick(() => {
+            if (this.classifyAuthData[index]) {
+              if (isMatched) {
                 Object.keys(this.classifyAuthData[index]).forEach((key) => {
-
-                    if (this.classifyAuthData[index].classify_view) {
-                      this.$set(this.classifyAuthData[index], item.code, true);
-                    } else {
-                      this.classifyAuthData[index][item.code] = false;
-                    }
-                    // console.log(item.code)
-                    // this.$set(this.classifyAuthData[index], item.code, true);
-
+                  this.$set(this.classifyAuthData[index].authButton,item.code,true);
+                });
+              } else {
+                Object.keys(this.classifyAuthData[index]).forEach((key) => {
+                  this.$set(this.classifyAuthData[index].authButton,item.code,false);
                 });
               }
-            })
-          } else {
-            this.$nextTick(() => {
-              if (this.classifyAuthData[index]) {
-                Object.keys(this.classifyAuthData[index]).forEach((key) => {
-                  if (item.prop === key) {
-                    this.$set(this.classifyAuthData[index], item.code, false);
-                  }
-                });
-              }
-            })
-          }
+            }
+          });
         });
 
         //娣诲姞 鈥滄煡鐪嬪叏閮ㄧ鐢ㄦ潯浠垛��
-        this.classifyAuthData.forEach((classkey, classIndex) => {
-          if (classkey.classify_view) {
-            this.$set(this.classifyAuthData[classIndex], 'allDisabled', true)
-          } else {
-            this.classifyAuthData[classIndex].allDisabled = false;
-          }
-        });
-        // console.log('classifyAuthData',this.classifyAuthData)
+        if (this.classifyAuthData.authButton) {
+          this.classifyAuthData.forEach((classkey, classIndex) => {
+            if (classkey.authButton.classify_view) {
+              this.$set(this.classifyAuthData[classIndex].authButton,"allDisabled",true);
+            } else {
+              this.classifyAuthData[classIndex].authButton.allDisabled = false;
+            }
+          });
+        }
+
         //寮哄埗鍒锋柊琛ㄦ牸
         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);
+        const res = await getButtonsByRoleId({
+          roleId: row,
+          code: "classifyTree",
         });
 
-        this.classifyAuthHeader.forEach(item => {
-          const isMatched = filteredItems.some(x => x.id === item.prop);
+        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;
+                Object.keys(currentRow).forEach((key) => {
+                  currentRow.authButton[item.code] = true;
+                  if (!currentRow.authButton.classify_view) {
+                    currentRow.authButton.allDisabled = false;
                   }
                 });
               } else {
-                Object.keys(currentRow).forEach(key => {
-                  currentRow[item.code] = item.prop === key ? true : false;
-                  if (!currentRow.classify_view) {
-                    currentRow.allDisabled = false;
+                Object.keys(currentRow).forEach((key) => {
+                  currentRow.authButton[item.code] = false;
+                  if (!currentRow.authButton.classify_view) {
+                    currentRow.authButton.allDisabled = false;
                   }
                 });
               }
             }
+              
             this.itemKey = uuidv4(); // 寮哄埗鍒锋柊琛ㄦ牸
           });
         });
@@ -286,7 +296,7 @@
     },
     // 鍏抽棴瀵硅瘽妗�
     closeDialog() {
-      this.$emit('update:visible', false);
+      this.$emit("update:visible", false);
       this.classifyAuthData = [];
     },
     // 澧炲姞琛�
@@ -300,20 +310,23 @@
       let item = {
         roleData: this.roleList[0].id,
         classifyItem: this.classifyData.label,
+        authButton:{},
         index: this.addIndex,
-        uuid: uuidv4(),//鐢熸垚鍞竴鐨刬d
-      }
+        uuid: uuidv4(), //鐢熸垚鍞竴鐨刬d
+      };
       //灏嗘寜閽缃繘鍘�
-      this.classifyAuthButton.forEach(data => {
+      this.classifyAuthButton.forEach((data) => {
         Vue.set(item, data.id, false);
-      })
+      });
       this.classifyAuthData.push(item);
-      this.roleHandlerMethods(this.roleList[0].id, 'add', this.addIndex)
+      this.roleHandlerMethods(this.roleList[0].id, "add", this.addIndex);
     },
     // 鍒犻櫎琛�
     subClassifyAuth() {
       for (let item of this.selectList) {
-        let index = this.classifyAuthData.findIndex(data => data.index === item.index);
+        let index = this.classifyAuthData.findIndex(
+          (data) => data.index === item.index
+        );
         if (index !== -1) {
           this.classifyAuthData.splice(index, 1);
         }
@@ -335,7 +348,7 @@
     // 淇濆瓨鍒嗙被鎺堟潈淇℃伅
     submit() {
       if (this.classifyAuthData.length <= 0) {
-        this.$message.warning('鎺堟潈鍒楄〃涓虹┖锛�')
+        this.$message.warning("鎺堟潈鍒楄〃涓虹┖锛�");
         return;
       }
       let isRepeat = false;
@@ -358,7 +371,7 @@
       }
       let form = [];
       let flag = false;
-      this.classifyAuthData.forEach(item => {
+      this.classifyAuthData.forEach((item) => {
         let itemButtonList = [];
         //绛涢�夊嚭鎸夐挳鍕鹃�変负true鐨勫垪
         for (let key in item) {
@@ -378,24 +391,27 @@
           classifyId: this.classifyData.oid,
           buttonIds: itemButtonList.join(","),
           authType: "classify_auth",
-        }
+        };
         form.push(data);
       });
       if (flag) {
-        this.$message.warning('鏈夋湭鍕鹃�夋搷浣滅殑鏉冮檺锛屼笉鍏佽鎺堟潈')
+        this.$message.warning("鏈夋湭鍕鹃�夋搷浣滅殑鏉冮檺锛屼笉鍏佽鎺堟潈");
         return;
       }
       // console.log(form)
       // 璋冪敤淇濆瓨鍒嗙被鎺堟潈鐨勬帴鍙�
-      saveOrUpdate(form).then(res => {
-        this.$message({
-          type: "success",
-          message: res.data.msg,
-        });
-        // this.isShowDialog = false
-      }, (error) => {
-        window.console.log(error);
-      })
+      saveOrUpdate(form).then(
+        (res) => {
+          this.$message({
+            type: "success",
+            message: res.data.msg,
+          });
+          // this.isShowDialog = false
+        },
+        (error) => {
+          window.console.log(error);
+        }
+      );
     },
     // 鍏ㄩ�夋寜閽�
     selectAllButton() {
@@ -403,7 +419,7 @@
         this.$message.warning("璇峰彧閫夋嫨涓�琛岄渶瑕佸叏閫夌殑鎸夐挳鐨勬暟鎹锛�");
         return;
       }
-      this.classifyAuthButton.forEach(item => {
+      this.classifyAuthButton.forEach((item) => {
         //console.log("item",item);
         Vue.set(this.selectList[0], item.id, true);
       });
@@ -414,7 +430,6 @@
 </script>
 
 <style lang="scss" scoped>
-
 // 婊氬姩鏉℃牱寮忎慨鏀�
 // 婊氬姩鏉$殑瀹藉害
 /deep/ .el-table__body-wrapper::-webkit-scrollbar {
@@ -422,7 +437,6 @@
   background: white;
   border: white;
   width: 10px;
-
 }
 
 // 婊氬姩鏉$殑婊戝潡
@@ -435,5 +449,4 @@
 /deep/ .el-table__body-wrapper {
   height: calc(100% - 50px) !important;
 }
-
 </style>

--
Gitblit v1.9.3