优化

src/modules/tenant-management/views/MembersView.vue

@@ -157,7 +157,7 @@ async function resetPassword(member: TenantMember) {
 </script>
 
 <template>
-  <section v-loading="loading" class="members-page">
+  <section v-loading="loading" class="members-page" :aria-busy="loading">
     <div v-if="loadError" class="client-card collection-load-error" role="alert">
       <div><strong>企业成员加载失败</strong><span>{{ loadError }}</span></div>
       <el-button :loading="loading" @click="loadMembers">重新加载</el-button>
@@ -167,7 +167,7 @@ async function resetPassword(member: TenantMember) {
 
     <div class="client-card member-table-card">
       <div v-if="auth.hasPermission('company:member:write')" class="table-actions"><el-button type="primary" @click="openCreate"><Plus :size="17" />新增成员</el-button></div>
-      <DataTable v-model:page="memberPage" v-model:page-size="memberPageSize" class="desktop-member-table" :data="pagedMembers" :columns="memberTableColumns" :loading="loading" :total="filteredMembers.length" row-key="id">
+      <DataTable v-model:page="memberPage" v-model:page-size="memberPageSize" class="desktop-member-table" :data="pagedMembers" :columns="memberTableColumns" :total="filteredMembers.length" row-key="id">
         <template #actions="{ row }"><el-button v-if="auth.hasPermission('company:member:write')" link type="primary" @click="openEdit(row as TenantMember)"><Pencil :size="15" />编辑</el-button><el-button v-if="auth.hasPermission('company:member:reset-password')" link type="primary" @click="resetPassword(row as TenantMember)"><KeyRound :size="15" />重置密码</el-button><el-button v-if="auth.hasPermission('company:member:write') && !(row as TenantMember).isAdministrator" link :type="(row as TenantMember).status === 'ACTIVE' ? 'danger' : 'success'" @click="toggleStatus(row as TenantMember)">{{ (row as TenantMember).status === 'ACTIVE' ? '停用' : '启用' }}</el-button><span v-if="!auth.hasPermission('company:member:write') && !auth.hasPermission('company:member:reset-password')" class="readonly-action">仅查看</span></template>
         <template #member="{ row }"><div class="member-identity"><span>{{ (row as TenantMember).name.slice(0, 1) }}</span><div><strong>{{ (row as TenantMember).name }}</strong><small>{{ (row as TenantMember).account }}</small></div></div></template>
         <template #contact="{ row }"><div class="member-contact"><span>{{ (row as TenantMember).phone }}</span><small>{{ (row as TenantMember).email || '-' }}</small></div></template>
@@ -215,7 +215,7 @@ async function resetPassword(member: TenantMember) {
 .member-identity strong, .member-identity small, .member-contact small { overflow-wrap: anywhere; }
 .member-identity small, .member-contact small { color: var(--muted); font-size: 10px; }
 .role-tags { display: flex; gap: 5px; flex-wrap: wrap; }
-.mobile-member-list { display: none; }
+.mobile-member-list, .mobile-member-empty { display: none; }
 .member-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
 .member-form-tip { display: flex; gap: 10px; padding: 13px; border: 1px solid #cfe1dc; background: #f2f7f6; color: var(--muted); font-size: 11px; line-height: 1.6; }
 .member-form-tip svg { flex: 0 0 17px; color: var(--primary); }

src/modules/tenant-management/views/RolesView.vue

@@ -138,7 +138,7 @@ function assignPermissions(role: TenantRole) {
 </script>
 
 <template>
-  <section v-loading="loading" class="roles-page">
+  <section v-loading="loading" class="roles-page" :aria-busy="loading">
     <div v-if="loadError" class="client-card collection-load-error" role="alert">
       <div><strong>企业角色加载失败</strong><span>{{ loadError }}</span></div>
       <el-button :loading="loading" @click="loadRoles">重新加载</el-button>
@@ -148,7 +148,7 @@ function assignPermissions(role: TenantRole) {
 
     <div class="client-card role-table-card">
       <div v-if="auth.hasPermission('company:role:write')" class="table-actions"><el-button type="primary" @click="openCreate"><Plus :size="17" />新增角色</el-button></div>
-      <DataTable v-model:page="rolePage" v-model:page-size="rolePageSize" :data="pagedRoles" :columns="roleTableColumns" :loading="loading" :total="filteredRoles.length" row-key="id">
+      <DataTable v-model:page="rolePage" v-model:page-size="rolePageSize" :data="pagedRoles" :columns="roleTableColumns" :total="filteredRoles.length" row-key="id">
         <template #actions="{ row }"><el-button v-if="auth.hasPermission('company:permission:list')" link type="primary" :disabled="actionRoleId === (row as TenantRole).id" @click="assignPermissions(row as TenantRole)">{{ auth.hasPermission('company:permission:assign') && !(row as TenantRole).builtin ? '分配权限' : '查看权限' }}</el-button><el-button v-if="auth.hasPermission('company:role:write') && !(row as TenantRole).builtin" link type="primary" :disabled="actionRoleId === (row as TenantRole).id" @click="openEdit(row as TenantRole)"><Pencil :size="15" />编辑</el-button><el-button v-if="auth.hasPermission('company:role:write') && !(row as TenantRole).builtin" link :type="(row as TenantRole).status === 'ACTIVE' ? 'warning' : 'success'" :loading="actionRoleId === (row as TenantRole).id" @click="toggleStatus(row as TenantRole)">{{ (row as TenantRole).status === 'ACTIVE' ? '停用' : '启用' }}</el-button><el-button v-if="auth.hasPermission('company:role:write') && !(row as TenantRole).builtin" link type="danger" :disabled="actionRoleId === (row as TenantRole).id" @click="removeRole(row as TenantRole)"><Trash2 :size="15" />删除</el-button></template>
         <template #role="{ row }"><div class="role-identity"><span class="role-icon"><LockKeyhole v-if="(row as TenantRole).builtin" :size="20" /><ShieldCheck v-else :size="20" /></span><div><strong>{{ (row as TenantRole).name }}</strong><code>{{ (row as TenantRole).code }}</code></div></div></template>
         <template #memberCount="{ row }"><span>{{ store.roleMemberCount((row as TenantRole).id) }}</span></template>

src/modules/tenant-management/views/TenantAdministrationViews.test.mjs

@@ -92,6 +92,8 @@ test('implements member list, role assignment, password reset and status control
   assert.match(membersSource, /function toggleStatus\(member: TenantMember\)/)
   assert.match(membersSource, /v-model="form\.roleIds" multiple/)
   assert.match(membersSource, /class="mobile-member-list"/)
+  assert.match(membersSource, /\.mobile-member-list, \.mobile-member-empty \{ display: none; \}/)
+  assert.match(membersSource, /\.mobile-member-empty \{ display: grid; min-height: 150px; place-items: center; \}/)
   assert.match(membersSource, /store\.loadMembers\(\)/)
   assert.match(membersSource, /await store\.resetMemberPassword/)
   assert.match(membersSource, /await store\.toggleMemberStatus/)
@@ -106,6 +108,8 @@ test('implements member list, role assignment, password reset and status control
   assert.match(membersSource, /import DataTable.*DataTable\.vue/)
   assert.match(membersSource, /<QueryToolbar v-model="memberFilters"/)
   assert.match(membersSource, /<DataTable v-model:page="memberPage" v-model:page-size="memberPageSize"/)
+  assert.match(membersSource, /<section v-loading="loading" class="members-page" :aria-busy="loading">/)
+  assert.doesNotMatch(membersSource, /<DataTable[^>]*:loading="loading"/)
   assert.match(membersSource, /fixed: 'left'/)
   assert.match(membersSource, /class="table-actions"/)
   assert.doesNotMatch(membersSource, /template #actions><el-button v-if="auth\.hasPermission\('company:member:write'\)/)
@@ -133,6 +137,8 @@ test('protects built-in roles and exposes role permission assignment', () => {
   assert.match(rolesSource, /import DataTable.*DataTable\.vue/)
   assert.match(rolesSource, /<QueryToolbar v-model="roleFilters"/)
   assert.match(rolesSource, /<DataTable v-model:page="rolePage" v-model:page-size="rolePageSize"/)
+  assert.match(rolesSource, /<section v-loading="loading" class="roles-page" :aria-busy="loading">/)
+  assert.doesNotMatch(rolesSource, /<DataTable[^>]*:loading="loading"/)
   assert.match(rolesSource, /fixed: 'left'/)
   assert.match(rolesSource, /class="table-actions"/)
   assert.doesNotMatch(rolesSource, /template #actions><el-button v-if="auth\.hasPermission\('company:role:write'\)/)