Source/UBCS-WEB/src/components/Theme/DataAuthDialog.vue

@@ -60,8 +60,8 @@
          <el-checkbox
            v-if="item.type === 'checkbox'"
            v-model="row[item.prop]"
            @change="checkBoxToChangeTheEvent(row[item.prop],item.code)"
            :disabled="row.authButton.allDisabled ? true : row.authButton[item.code]">
            :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>
@@ -96,15 +96,15 @@
      default: false,
    },
    // 当前点击的节点
    TreeNode:{
      type:Object
    TreeNode: {
      type: Object
    }
  },
  data() {
    return {
      // 对话框显示控制
      isShowDialog: this.visible,
      isLoading: false,
      isLoading: true,
      tableHeight: 'calc(100vh - 550px)',
      classifyAuthData: [],
      //列头
@@ -128,6 +128,9 @@
        this.loadAuthPage();
      }
    },
    classifyAuthData(newval) {
      this.addIndex = newval.length <= 0 ? 0 : newval.length - 1;
    }
  },
  computed: {},
  mounted() {
@@ -135,11 +138,21 @@
  created() {
  },
  methods: {
    checkBoxToChangeTheEvent(check,code){
      // console.log(check,code)
      // if(code === "data_view" && check){
      //
      // }
    checkBoxToChangeTheEvent(check, code, row, id) {
      if (code === "data_view") {
        row.checkTheStatus = check;
      } else if (!row.checkTheStatus) {
        this.$message.warning('清先勾选查看按钮！');
        // 在条件不满足时将多选框状态设置为false
        row[id] = false;
      }

      if (!row.checkTheStatus) {
        this.classifyAuthButton.forEach(key => {
          // 查看为false时将所有多选框状态设置为false
          row[key.id] = false;
        });
      }
    },
    // 关闭对话框
    closeDialog() {
@@ -155,34 +168,36 @@
        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);
                  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);
                  this.$set(this.classifyAuthData[index].authButton, item.code, false);
                });
                if(item.code === "data_view"){
                  this.classifyAuthData[index].authButton.allDisabled = false;
                }
              }
            }
          });
        });

        //添加‘查看’禁用
        if (this.classifyAuthData) {
          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;
            }
          });
        }
        // console.log(this.classifyAuthData)
        //强制刷新表格
        this.itemKey = uuidv4();
      });
@@ -204,14 +219,14 @@
              if (isMatched) {
                Object.keys(currentRow).forEach((key) => {
                  currentRow.authButton[item.code] = true;
                  if (!currentRow.authButton.classify_view) {
                  if (!currentRow.authButton.data_view) {
                    currentRow.authButton.allDisabled = false;
                  }
                });
              } else {
                Object.keys(currentRow).forEach((key) => {
                  currentRow.authButton[item.code] = false;
                  if (!currentRow.authButton.classify_view) {
                  if (!currentRow.authButton.data_view) {
                    currentRow.authButton.allDisabled = false;
                  }
                });
@@ -230,13 +245,13 @@
        this.$message.warning("当前租户不存在角色信息！");
        return;
      }
      this.addIndex++; //自定义生成添加行下标

      let item = {
        roleData: this.roleList[0].id,
        classifyItem: this.classifyData.label,
        authButton:{},
        authButton: {},
        uuid: uuidv4(),//生成唯一的id,
        index: this.addIndex,
        index: this.classifyAuthData.length -1,
      }
      //将按钮设置进去
      this.classifyAuthButton.forEach(data => {
@@ -244,7 +259,7 @@
      })
      //console.log(item)
      this.classifyAuthData.push(item)
      this.roleHandlerMethods(this.roleList[0].id, 'add', this.addIndex)
      this.roleHandlerMethods(this.roleList[0].id, 'add', this.classifyAuthData.length -1)
    },
    // 删除行
    subClassifyAuth() {
@@ -274,6 +289,7 @@
        classifyAuthList: [],
        isCLear: false, //默认是清空
        classifyId: this.TreeNode.oid,
        authType: 'data_auth',
      };
      let isRepeat = false;
      if (this.classifyAuthData.length > 0) {
@@ -299,7 +315,7 @@
          let itemButtonList = [];
          //筛选出按钮勾选为true的列
          for (let key in item) {
            if (item[key] === true) {
            if (item[key] === true && key !== 'checkTheStatus') {
              itemButtonList.push(key);
            }
          }
@@ -323,7 +339,7 @@
          return;
        }
        // console.log(form)
      }else{
      } else {
        // 为空证明是清空授权列表
        form.isCLear = true;
      }
@@ -354,7 +370,7 @@
    },
    loadAuthPage() {
      return new Promise((resolve, reject) => {
        // console.log(this.classifyData);
        this.isLoading = true;
        getButtonByParentCode({code: this.classifyData.attributes.id}).then(res => {
          // 记录按钮数据
          this.classifyAuthButton = res.data.data;
@@ -404,7 +420,7 @@
                roleData: authData.roleId,
                classifyItem: this.classifyData.label,
                index: index,
                authButton:{},
                authButton: {},
                uuid: uuidv4(),//生成唯一的id
              }
              //将按钮设置进去
@@ -412,11 +428,11 @@
                Vue.set(item, data, true);
              });
              this.classifyAuthData.push(item);
              this.addIndex = this.classifyAuthData.length - 1; //添加行下标等于classifyAuthData的长度-1
              this.roleHandlerMethods(authData.roleId, 'create', index)
            })
          }
        });
        this.isLoading = false;
      });
    },
  },