角色权限管理显示逻辑

src/views/permissions/permission.vue

@@ -260,6 +260,13 @@ const openUserAddVisible = function () {
 // 新增角色弹窗
 const openPermissionAddVisible = function () {
   permissionAddVisible.value = true
+  const addRole = ref({
+    roleName: '',
+    parentId: null,
+    checkedKeys: [],
+    grade: '',
+    market: ''
+  })
   getRoles()
   getLists()
 }
@@ -298,13 +305,6 @@ const userAddInit = function () {
 }
 // 新增角色初始化
 const permissionAddInit = function () {
-  const addRole = ref({
-    roleName: '',
-    parentId: null,
-    checkedKeys: [],
-    grade: '',
-    market: ''
-  })
   openPermissionAddVisible()
 }
 //新增用户
@@ -394,10 +394,7 @@ const addUserRules = {
 };
 // 表单验证ref
 const Ref = ref(null)
-// 使用 _.throttle 并设置 trailing 为 false 实现严格节流，只执行一次
-const throttledPermissionAdd = _.throttle(permissionAdd, 5000, {
-  trailing: false
-})
+
 // 权限类别
 const permissionList = ref([])
 const getRoles = async function () {
@@ -632,9 +629,8 @@ const permissionEdit = async function () {
     ElMessage.error('编辑用户权限失败')
   }
 }
-const throttledPermissionEdit = _.throttle(permissionEdit, 5000, {
-  trailing: false
-})
+
+
 // 删除初始化
 const del = function (row) {
   delObj.value = {}
@@ -780,10 +776,10 @@ const getLists = async function () {
       data: { id: roleId }
     })
     data.value = res.data
-    if (addRole.value.parentId == null || addRole.value.parentId == undefined) {
-      data.value = data.value
-    } else if (addRole.value.parentId != 2) {
+    if (addRole.value.parentId == null || addRole.value.parentId == undefined || addRole.value.parentId != 2) {
       data.value = data.value.filter(item => item.id !== 9);
+    } else {
+      //不做处理
     }
     console.log('看看data', data.value)
     console.log('parentID:', addRole.value.parentId, 'roleId:', roleId)
@@ -1052,7 +1048,7 @@ const permissionEditRoleInit = async function (row) {
       data: { id: roleId }
     });
     data.value = res.data;
-
+    data.value = data.value.filter(item => item.id !== 9);
     // 收集当前行权限树的所有 id
     if (row.tree && row.tree.length > 0) {
       permissionEditRoleObj.value.checkedKeys = collectIds2(row.tree);
@@ -1143,6 +1139,18 @@ const Rolerules = reactive({
     }
   ]
 });
+
+const throttledPermissionEdit = _.throttle(permissionEdit, 5000, {
+  trailing: false
+})
+const throttledHandleAddRole = _.throttle(handleAddRole, 5000, {
+  trailing: false
+})
+// 使用 _.throttle 并设置 trailing 为 false 实现严格节流，只执行一次
+const throttledPermissionAdd = _.throttle(permissionAdd, 5000, {
+  trailing: false
+})
+
 // 挂载
 onMounted(async function () {
   await getAdminData()
@@ -1331,7 +1339,7 @@ onMounted(async function () {
           </el-table-column> -->
           <el-table-column prop="operation" label="操作" width="200px">
             <template #default="scope">
-              <el-button type="warning" text @click="permissionEditRoleInit(scope.row)">
+              <el-button type="warning"  text @click="permissionEditRoleInit(scope.row)" :disabled="scope.row.id === 2">
                 编辑
               </el-button>
             </template>
@@ -1513,7 +1521,7 @@ onMounted(async function () {
 
       <div>
         <el-button @click="closePermissionAddVisible()">取消</el-button>
-        <el-button type="primary" @click="handleAddRole">
+        <el-button type="primary" @click="throttledHandleAddRole">
           提交
         </el-button>
       </div>