polish Semi UI admin and operations workspaces

vehicle-data-platform/apps/web/src/v2/pages/UsersPage.test.tsx

@@ -44,7 +44,11 @@ test('deduplicates vehicle candidates by VIN and renders granted vehicles plate
   const view = render(<QueryClientProvider client={client}><UsersPage /></QueryClientProvider>);
 
   const customer = await screen.findByRole('button', { name: /选择客户 华东客户/ });
+  expect(screen.getByRole('heading', { name: '账号范围', level: 5 })).toBeInTheDocument();
+  expect(screen.getByText('按客户名称、登录账号、客户标识与启停状态查找')).toBeInTheDocument();
+  expect(screen.getAllByText('1 / 1 个账号')).toHaveLength(2);
   expect(view.container.querySelector('.v2-user-list.semi-card')).toBeInTheDocument();
+  expect(view.container.querySelector('.v2-user-filter-panel.v2-workspace-filter-panel.semi-card')).toBeInTheDocument();
   expect(view.container.querySelector('.v2-customer-list.semi-list')).toBeInTheDocument();
   expect(customer).toHaveClass('semi-button', 'v2-user-list-item');
   expect(customer.closest('.semi-list-item')).toHaveClass('v2-user-list-row');
@@ -145,6 +149,10 @@ test('keeps the customer directory visible on mobile and opens details on demand
   expect(view.container.querySelector('.v2-user-mobile-picker')).not.toBeInTheDocument();
   expect(view.container.querySelector('.v2-customer-list.semi-list')).toBeInTheDocument();
   expect(screen.getByRole('textbox', { name: '搜索客户账号' })).toBeInTheDocument();
+  const filterToggle = screen.getByRole('button', { name: '修改账号范围：全部状态' });
+  expect(filterToggle).toHaveAttribute('aria-expanded', 'false');
+  fireEvent.click(filterToggle);
+  expect(screen.getByRole('button', { name: '收起账号范围：全部状态' })).toHaveAttribute('aria-expanded', 'true');
   expect(view.container.querySelector('.v2-user-editor')).not.toBeInTheDocument();
   fireEvent.click(customer);
   expect(await screen.findByRole('button', { name: '关闭账号详情' })).toBeInTheDocument();
@@ -155,6 +163,43 @@ test('keeps the customer directory visible on mobile and opens details on demand
   expect(screen.getAllByRole('button', { name: '新建客户账号' })).toHaveLength(1);
 });
 
+test('filters the customer directory by status and exposes the active result scope', async () => {
+  mocks.adminUsers.mockResolvedValue([
+    {
+      id: 7, username: 'customer-east', displayName: '华东客户', userType: 'customer', status: 'enabled',
+      customerRef: 'east', tenantRef: '', authProvider: 'local', menuKeys: ['monitor'], vehicleVins: [],
+      vehicles: [], grantHistory: [], createdAt: '2026-07-16T00:00:00Z', updatedAt: '2026-07-16T00:00:00Z'
+    },
+    {
+      id: 8, username: 'customer-west', displayName: '西部客户', userType: 'customer', status: 'disabled',
+      customerRef: 'west', tenantRef: '', authProvider: 'local', menuKeys: ['monitor'], vehicleVins: [],
+      vehicles: [], grantHistory: [], createdAt: '2026-07-16T00:00:00Z', updatedAt: '2026-07-16T00:00:00Z'
+    }
+  ]);
+  const client = new QueryClient({ defaultOptions: { queries: { retry: false } } });
+  render(<QueryClientProvider client={client}><UsersPage /></QueryClientProvider>);
+
+  expect(await screen.findByRole('button', { name: /选择客户 华东客户/ })).toBeInTheDocument();
+  expect(screen.getByRole('button', { name: /选择客户 西部客户/ })).toBeInTheDocument();
+  fireEvent.click(screen.getByRole('combobox', { name: '账号状态' }));
+  const disabledOption = await waitFor(() => {
+    const option = [...document.querySelectorAll<HTMLElement>('.semi-select-option')]
+      .find((item) => item.textContent?.includes('停用账号'));
+    expect(option).toBeInTheDocument();
+    return option!;
+  });
+  fireEvent.click(disabledOption);
+
+  await waitFor(() => expect(screen.queryByRole('button', { name: /选择客户 华东客户/ })).not.toBeInTheDocument());
+  expect(screen.getByRole('button', { name: /选择客户 西部客户/ })).toBeInTheDocument();
+  expect(screen.getAllByText('1 / 2 个账号')).toHaveLength(2);
+  expect(screen.getByText('启用账号').nextSibling).toHaveTextContent('0');
+
+  fireEvent.click(screen.getByRole('button', { name: '清空账号筛选' }));
+  await waitFor(() => expect(screen.getByRole('button', { name: /选择客户 华东客户/ })).toBeInTheDocument());
+  expect(screen.getByRole('button', { name: /选择客户 西部客户/ })).toBeInTheDocument();
+});
+
 test('uses a standard Semi empty state when no customer account exists', async () => {
   mocks.adminUsers.mockResolvedValue([]);
   const client = new QueryClient({ defaultOptions: { queries: { retry: false } } });