微调

frontend/src/views/authority/role/components/rolePopup.vue

@@ -7,22 +7,29 @@
                   ref='dialogFormRef'
                   :rules='rules'
                   >
-        <el-form-item label="名称" prop='name' :label-width="100">
-          <el-input v-model="formContent.name" placeholder="请输入名称" autocomplete="off" />
+        <el-form-item label="名称" prop='name' :label-width="100" >
+          <el-input v-model="formContent.name" placeholder="请输入名称" autocomplete="off" :disabled="rootIsEdit"/>
         </el-form-item>
 
         <el-form-item label="编码" prop='code' :label-width="100">
-          <el-input v-model="formContent.code" placeholder="请输入编码" autocomplete="off" />
+          <el-input v-model="formContent.code" placeholder="请输入编码" autocomplete="off" :disabled="rootIsEdit"/>
         </el-form-item>
+        <el-form-item label='类型'  prop='type' :label-width="100">
+          <el-select v-model="formContent.type"  clearable placeholder="请选择类型" :disabled="rootIsEdit">
+            <el-option label="普通角色" :value="2"></el-option>
+            <el-option label="管理员角色" :value="1"></el-option>     
+            <el-option label="超级管理员" :value="0" v-if="rootIsShow"></el-option>                              
+          </el-select>                           
+        </el-form-item>     
         <el-form-item label="描述" prop='remark' :label-width="100">
-          <el-input v-model="formContent.remark" :rows="2" type="textarea" placeholder="请输入备注" autocomplete="off" />
+          <el-input v-model="formContent.remark" :rows="2" type="textarea" placeholder="请输入备注" autocomplete="off" :disabled="rootIsEdit"/>
         </el-form-item>
       </el-form>
       </div>
     <template #footer>
       <div class="dialog-footer">
         <el-button @click="close()">取消</el-button>
-        <el-button type="primary" @click="save()">
+        <el-button type="primary" @click="save()" :disabled="rootIsEdit">
           保存
         </el-button>
       </div>
@@ -43,7 +50,10 @@
   const dictStore = useDictStore()
  // 定义弹出组件元信息
  const dialogFormRef = ref()
-
+ //超级管理员有3个下拉框，其他两个
+  const rootIsShow = ref(false)
+  //超级管理员下拉框不可编辑
+  const rootIsEdit = ref(false)
  function useMetaInfo() {
     const dialogVisible = ref(false)
     const titleType = ref('add')
@@ -87,6 +97,7 @@ const resetFormContent = () => {
     name: [{ required: true, message: '名称必填！', trigger: 'blur' },
     { pattern: /^[\u4e00-\u9fa5]{1,20}$/, message: '名称为长度1-20的中文', trigger: 'blur' }],
     code: [{ required: true, message: '编码必填！', trigger: 'blur' }],
+    type: { required: true, message: '类型必选！', trigger: 'change' },
   })
 
   
@@ -124,6 +135,15 @@ const close = () => {
   const open = async (sign: string, data: Role.RoleBO) => {
     titleType.value = sign
     dialogVisible.value = true
+
+    if(data.type == 0){
+      rootIsShow.value = true
+      rootIsEdit.value = true
+    }else{
+      rootIsShow.value = false
+      rootIsEdit.value = false
+    }
+    
     if (data.id) {
       formContent.value = { ...data }
     } else {

frontend/src/views/authority/role/index.vue

@@ -17,7 +17,7 @@
       <!-- 表格操作 -->
       <template #operation='scope'>
         <el-button type='primary' link :icon='EditPen' @click="openDrawer('编辑角色', scope.row)">编辑</el-button>
-        <el-button type='primary' link :icon='Delete' @click='deleteAccount(scope.row)'>删除</el-button>
+        <el-button v-if="scope.row.type !== 0 && scope.row.type !== 1" type='primary' link :icon='Delete' @click='deleteAccount(scope.row)'>删除</el-button>
         <el-button type='primary' link :icon='Share' @click="openDrawer('设置权限', scope.row)">设置权限</el-button>
       </template>
 
@@ -39,6 +39,7 @@ import RolePopup from './components/rolePopup.vue'
 import RoleResourcePopup from './components/roleResourcePopup.vue'
 import { onMounted, reactive, ref } from 'vue'
 import {useDictStore} from '@/stores/modules/dict'
+import { fa } from 'element-plus/es/locale/index.mjs'
 const rolePopup = ref()
 const roleResourcePopup = ref()
 const dictStore = useDictStore()
@@ -65,8 +66,20 @@ const getTableList = (params: any) => {
 
 // 表格配置项
 const columns = reactive<ColumnProps<Role.RoleBO>[]>([
-  { type: 'selection', fixed: 'left', width: 70 },
-  { type: 'index', fixed: 'left', width: 70, label: '序号' },
+  { 
+    type: 'selection', 
+    fixed: 'left', 
+    width: 70, 
+    selectable(row, index) {
+      return ![0, 1].includes(row.type);//类型是0-超级管理员，1-管理员，不可选择
+    },
+  },
+  { 
+    type: 'index', 
+    fixed: 'left', 
+    width: 70, 
+    label: '序号' 
+  },
   {
     prop: 'name',
     label: '名称',
@@ -94,7 +107,12 @@ const columns = reactive<ColumnProps<Role.RoleBO>[]>([
         )
       },
   },
-  { prop: 'operation', label: '操作', fixed: 'right', width: 250 },
+  { prop: 'operation', 
+    label: '操作', 
+    fixed: 'right', 
+    width: 250,
+    
+  }
 ])
 
 // 删除角色信息