refactor(系统设置): 禁止修改系统管理员用户组与权限的读取和设置

frontend/src/business/components/settings/system/group/EditPermission.vue

@@ -35,7 +35,7 @@
           prop="permissions"
           :label="$t('group.permission')">
           <template v-slot:default="scope">
-            <group-permission :permissions="scope.row.permissions" :selected.sync="tableData" :read-only="readOnly"/>
+            <group-permission :permissions="scope.row.permissions" :selected.sync="tableData" :read-only="readOnly" :group="group"/>
           </template>
         </el-table-column>
         <el-table-column
@@ -43,7 +43,7 @@
           :label="$t('group.check_all')">
           <template v-slot:default="scope">
             <div style="text-align: center;">
-              <el-checkbox @change="handleSelectAll($event, scope.row.permissions)" :disabled="readOnly"/>
+              <el-checkbox @change="handleSelectAll($event, scope.row.permissions)" :disabled="isReadOnly(scope.row)"/>
             </div>
           </template>
         </el-table-column>
@@ -83,6 +83,12 @@ export default {
   computed: {
     userGroupType() {
       return USER_GROUP_SCOPE;
+    },
+    isReadOnly() {
+      return function (data) {
+        const isDefaultSystemGroup = this.group.id === 'admin' && data.resource.id === 'SYSTEM_GROUP';
+        return this.readOnly || isDefaultSystemGroup;
+      }
     }
   },
   methods: {

frontend/src/business/components/settings/system/group/GroupPermission.vue

@@ -6,7 +6,7 @@
         {{ $t(permission.name) }}
       </el-checkbox>
       <el-checkbox v-else class="permission-checkbox"
-                   v-model="permission['checked']" @change="change($event, permission)" :disabled="readOnly">
+                   v-model="permission['checked']" @change="change($event, permission)" :disabled="isReadOnly(permission)">
         {{ $t(permission.name) }}
       </el-checkbox>
     </span>
@@ -34,11 +34,22 @@ export default {
       default() {
         return false;
       }
+    },
+    group: {
+      type: Object,
+      default() {
+        return {};
+      }
     }
   },
-  data() {
-    return {
-
+  computed: {
+    isReadOnly() {
+      return function (permission) {
+        // 禁止取消系统管理员用户组的读取和设置权限
+        const isSystemGroupPermission = permission.id === 'SYSTEM_GROUP:READ' || permission.id === 'SYSTEM_GROUP:READ+SETTING_PERMISSION';
+        const isDefaultSystemGroup = this.group.id === 'admin' && isSystemGroupPermission;
+        return this.readOnly || isDefaultSystemGroup;
+      }
     }
   },
   methods: {