ZengTao
2023-12-07 de6afc2ec06724885de7cc0eb8b8cad61f8c0b3b
CanadaMes-ui/src/views/role/index.vue
@@ -114,14 +114,14 @@
  <el-form label-width="130px">
    <el-form-item :label="$t('langPermissions')" prop="permissionList">
      <el-checkbox-group v-model="selectedPermissions">
        <el-checkbox
          v-for="(permission, index) in permissionList"
          :key="index"
          :label="permission.name"
          :checked="permission.state === 1"
          @change="updatePermissionState(permission.name, $event)"
        >{{ permission.name }}</el-checkbox>
      </el-checkbox-group>
  <el-checkbox
    v-for="(permission, index) in permissionList"
    :key="index"
    :label="permission.name"
    @change="updatePermissionState(permission.name, $event)"
  >{{ permission.name }}</el-checkbox>
</el-checkbox-group>
    </el-form-item>
  </el-form>
  <span slot="footer" class="dialog-footer">
@@ -178,16 +178,16 @@
      // 添加角色的验证规则
      addRoleRules: {
        name: [
          {required: true, message:  '请输入名称', trigger: 'blur'},
          {min: 2, max: 15, message: '长度在 2 到 15 个字符', trigger: 'blur'}
          {required: true, message:  this.$t('请输入名称'), trigger: 'blur'},
          {min: 2, max: 15, message: this.$t('长度在 2 到 15 个字符'), trigger: 'blur'}
        ],
        state: [
          {required: true, message: '请输入状态', trigger: 'blur'}
          {required: true, message: this.$t('请输入状态'), trigger: 'blur'}
        ]
      },
      options: [
        {label: '有效', value: 1},
        {label: '无效', value: 0}
        {label: this.$t('有效'), value: 1},
        {label: this.$t('无效'), value: 0}
      ]
    }
  },
@@ -251,22 +251,37 @@
    },
    showPermissionDialog(role) {
      this.selectedPermissions=[];
      this.permissionList=[];
      getById2({ roleId: role.id }).then((res) => {
        this.permissionList = res.data.permissionList;
   // 在 showPermissionDialog 方法中,只将选中的权限名称添加到 selectedPermissions 数组中
showPermissionDialog(role) {
  this.selectedPermissions = [];
  this.permissionList = [];
  getById2({ roleId: role.id }).then((res) => {
    this.permissionList = res.data.permissionList;
    // 只有状态为 1 的权限名称会被添加到 selectedPermissions 数组中
    this.selectedPermissions = this.permissionList
      .filter(permission => permission.state === 1)
      .map(permission => permission.name);
    this.permissionDialogVisible = true;
  });
},
        this.selectedPermissions = this.permissionList.map(({ name, state }) => ({
          name,
          state: state === 1,
        }));
        console.log(this.selectedPermissions);
        this.permissionDialogVisible = true;
      });
    },
// 在 updatePermissionState 方法中,根据复选框的勾选状态更新 selectedPermissions 数组
// updatePermissionState(name, isChecked) {
//   if (isChecked) {
//     // 如果复选框被勾选,将权限名称添加到数组中
//     if (!this.selectedPermissions.includes(name)) {
//       this.selectedPermissions.push(name);
//     }
//   } else {
//     // 如果复选框被取消勾选,将权限名称从数组中移除
//     const index = this.selectedPermissions.indexOf(name);
//     if (index !== -1) {
//       this.selectedPermissions.splice(index, 1);
//     }
//   }
// },
// 取消编辑权限弹出框
cancelEditPermissions() {
  this.permissionDialogVisible = false;
@@ -277,6 +292,7 @@
    if (permission) {
      permission.state = isChecked ? 1 : 0;
    }
  },
  
@@ -293,6 +309,7 @@
    // 成功更新权限后执行的操作
    const 更新状态成功 = this.$t('更新状态成功');
        this.$message.success(更新状态成功);
        this.permissionDialogVisible = false;
  });
},
    // 展示添加角色的对话框