refactor(ui): refine semi account governance

This commit is contained in:
lingniu
2026-07-19 19:57:40 +08:00
parent 58f2a77033
commit e944b797e5
4 changed files with 214 additions and 42 deletions

View File

@@ -65,6 +65,7 @@ test('deduplicates vehicle candidates by VIN and renders granted vehicles plate
expect(directoryMetrics).toHaveTextContent('车辆授权1当前范围合计');
expect(customer).toHaveClass('semi-button', 'v2-user-list-item');
expect(customer.closest('.semi-list-item')).toHaveClass('v2-user-list-row');
expect(customer.querySelector('.v2-user-provider-tag')).toHaveTextContent('本地');
expect(customer).toHaveAttribute('aria-pressed', 'false');
expect(customer).toHaveAttribute('aria-expanded', 'false');
expect(document.querySelector('.v2-user-editor-sidesheet')).not.toBeInTheDocument();

View File

@@ -113,6 +113,12 @@ function accessBadgeColor(color: CustomerAccessState['color']): WorkspaceSideShe
return color;
}
function authProviderMeta(provider?: string) {
const normalized = provider?.trim();
if (!normalized || normalized === 'local') return { label: '本地', color: 'grey' as const, title: '本地账号' };
return { label: normalized, color: 'cyan' as const, title: `外部身份源:${normalized}` };
}
export default function UsersPage() {
const queryClient = useQueryClient();
const mobileLayout = useMobileLayout();
@@ -545,6 +551,7 @@ export default function UsersPage() {
emptyContent={<Empty className="v2-user-filter-empty" title="没有匹配账号" description="请调整关键词或访问状态筛选。" />}
renderItem={(user) => {
const accessState = customerAccessState(user.status, user.menuKeys.length, user.vehicles.length);
const authProvider = authProviderMeta(user.authProvider);
return <List.Item key={user.id} className={`v2-user-list-row is-access-${accessState.key}${accessState.attention ? ' has-attention' : ''}${selectedID === user.id && !creating ? ' is-active' : ''}`}>
<Button
className="v2-user-list-item"
@@ -556,7 +563,10 @@ export default function UsersPage() {
onClick={() => selectCustomer(user)}
>
<Avatar className="v2-user-avatar" color={user.status === 'enabled' ? 'light-blue' : 'grey'} shape="square" size="small">{user.displayName.slice(0, 1)}</Avatar>
<span className="v2-user-list-identity"><b>{user.displayName}</b><small>@{user.username}{user.customerRef ? ` · ${user.customerRef}` : ''}</small></span>
<span className="v2-user-list-identity">
<span className="v2-user-list-name"><b>{user.displayName}</b><span className="v2-user-provider-hint" title={authProvider.title}><Tag className="v2-user-provider-tag" color={authProvider.color} type="light" size="small">{authProvider.label}</Tag></span></span>
<small>@{user.username}{user.customerRef ? ` · ${user.customerRef}` : ''}</small>
</span>
<span className="v2-user-list-facts is-menu"><small></small><b>{user.menuKeys.length}<i> / {customerMenus.length}</i></b></span>
<span className="v2-user-list-facts is-vehicle"><small></small><b>{user.vehicles.length} </b></span>
<span className="v2-user-list-facts is-login"><small></small><b>{formatTime(user.lastLoginAt)}</b></span>