bug

src/views/common/account-list.vue

@@ -113,10 +113,12 @@
                   clearable
                   size="small"
                   style="width: 180px"
+                  @input="handleLeftRoleSearch"
                 />
               </div>
               <div class="panel-body">
-                <ElCheckboxGroup v-model="rolesToAdd" class="role-list">
+                <ElEmpty v-if="filteredAvailableRoles.length === 0" description="暂无角色" />
+                <ElCheckboxGroup v-else v-model="rolesToAdd" class="role-list">
                   <div v-for="role in filteredAvailableRoles" :key="role.ID" class="role-item">
                     <ElCheckbox :label="role.ID" :disabled="selectedRoles.includes(role.ID)">
                       <span class="role-info">
@@ -201,7 +203,8 @@
     ElFormItem,
     ElInput,
     ElCheckbox,
-    ElCheckboxGroup
+    ElCheckboxGroup,
+    ElEmpty
   } from 'element-plus'
   import { ArrowLeft } from '@element-plus/icons-vue'
   import type { FormInstance, FormRules } from 'element-plus'
@@ -407,7 +410,7 @@
       const entityId = Number(route.params.id)
       const params: any = {
         page: pagination.page,
-        pageSize: pagination.pageSize,
+        page_size: pagination.pageSize,
         username: searchForm.username || undefined,
         phone: searchForm.phone || undefined,
         user_type: isShopType.value ? 3 : 4, // 根据页面类型自动设置: 3:代理账号, 4:企业账号
@@ -553,9 +556,16 @@
   }
 
   // 加载所有角色列表
-  const loadAllRoles = async () => {
+  const loadAllRoles = async (keyword: string = '') => {
     try {
-      const res = await RoleService.getRoles({ page: 1, pageSize: 100 })
+      const params: any = {
+        page: 1,
+        page_size: 20
+      }
+      if (keyword) {
+        params.role_name = keyword
+      }
+      const res = await RoleService.getRoles(params)
       if (res.code === 0) {
         allRoles.value = res.data.items || []
       }
@@ -564,6 +574,17 @@
     }
   }
 
+  // 左侧角色搜索防抖
+  let leftSearchTimer: ReturnType<typeof setTimeout> | null = null
+  const handleLeftRoleSearch = (val: string) => {
+    if (leftSearchTimer) {
+      clearTimeout(leftSearchTimer)
+    }
+    leftSearchTimer = setTimeout(() => {
+      loadAllRoles(val)
+    }, 300)
+  }
+
   // 计算属性：过滤后的可分配角色（根据账号类型过滤）
   const filteredAvailableRoles = computed(() => {
     let roles = allRoles.value
@@ -580,10 +601,7 @@
       roles = roles.filter((role) => role.role_type === 2)
     }
 
-    // 根据搜索关键词过滤
-    if (!leftRoleFilter.value) return roles
-    const keyword = leftRoleFilter.value.toLowerCase()
-    return roles.filter((role) => role.role_name.toLowerCase().includes(keyword))
+    return roles
   })
 
   // 计算属性：过滤后的已分配角色
@@ -675,7 +693,6 @@
 
   onMounted(() => {
     getTableData()
-    loadAllRoles()
   })
 </script>