角色权限管理显示逻辑

src/views/permissions/permission.vue

@@ -221,7 +221,7 @@ const getArea = async function () {
   try {
     const result = await request({
       url: '/general/adminMarkets',
-      data: {account:adminData.value.account}
+      data: { account: adminData.value.account }
     })
     market.value = result.data
   } catch (error) {
@@ -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 () {
@@ -572,7 +569,7 @@ const editAdminRules = {
 // 编辑用户权限提交
 const permissionEdit = async function () {
   let { adminName: userName, roleName: oldRole, roleId: newRoleId } = permissionEditObj.value;
-  if(oldRole ==null){
+  if (oldRole == null) {
     oldRole = '暂未分配角色'
   }
   const newRole = permissionList.value.find(item => item.value === newRoleId)?.label || '未知角色';
@@ -632,9 +629,8 @@ const permissionEdit = async function () {
     ElMessage.error('编辑用户权限失败')
   }
 }
-const throttledPermissionEdit = _.throttle(permissionEdit, 5000, {
-  trailing: false
-})
+
+
 // 删除初始化
 const del = function (row) {
   delObj.value = {}
@@ -695,7 +691,7 @@ const handleAddRole = async function () {
       });
     });
     addRole.value.roleName = addRole.value.roleName.replace(/\s+/g, '');
-    console.log('去除角色名空格：',addRole.value.roleName);
+    console.log('去除角色名空格：', addRole.value.roleName);
     const res = await API({
 
 
@@ -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)
@@ -813,8 +809,8 @@ const getLists = async function () {
       console.log('addRoleMarket.value', addRoleMarket.value);
     } else {
       addRoleMarket.value = RoleArea.value
-      console.log('elseRoleArea',RoleArea);
-      
+      console.log('elseRoleArea', RoleArea);
+
     }
 
   } catch (error) {
@@ -861,29 +857,29 @@ const handleEditRolePermissionCheck = (checkedNodes, { checkedKeys }) => {
 
 const handleCheckChange = async (checkedNodes, checkedInfo) => {
   const { checkedKeys, checkedNodes: allCheckedNodes } = checkedInfo;
-  
+
   // 判断是否有选中的节点
   if (allCheckedNodes.length === 0) {
     addRole.value.checkedKeys = [];
     return;
   }
-  
+
   // 创建一个Set存储所有需要选中的ID（包括父级）
   const allKeys = new Set(checkedKeys);
-  
+
   // 遍历所有选中的节点，为每个节点添加其父级
   allCheckedNodes.forEach(node => {
     // 为每个选中的节点单独查找父级
     selectParentNodes(data.value, node.id, allKeys);
   });
-  
+
   // 将Set转换为数组并更新
   addRole.value.checkedKeys = Array.from(allKeys);
   console.log('包含所有父级的选中项:', addRole.value.checkedKeys);
 };
 
 const selectParentNodes = (treeData, nodeId, checkedKeys) => {
- if (!Array.isArray(treeData)) return false;
+  if (!Array.isArray(treeData)) return false;
 
   for (const item of treeData) {
     // 先检查子节点
@@ -895,13 +891,13 @@ const selectParentNodes = (treeData, nodeId, checkedKeys) => {
         return true;
       }
     }
-    
+
     // 检查当前节点是否为目标节点
     if (item.id === nodeId) {
       return true;
     }
   }
-  
+
   return false;
 };
 //点击角色权限菜单树点击展示逻辑
@@ -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>