fix(frontend): 修复 review round 1 must-fix

- HIGH: UserFormPage edit 模式 prefill canEditDocument from backend（之前硬编码 false 会静默覆盖） - MED: UsersTable 加 a11y 键盘可达（tabIndex/role=button/onKeyDown）+ 操作列编辑链接 - MED: UsersTable 列头加 sorter (username/userCode/lastLoginDate/createdDate) - MED: UserFormPage employeeId 三态映射（toCreate/toUpdate helpers，spec § 八） - MED: api/users.ts UpdateUserReq/CreateUserReq.employeeId 类型补 | null - LOW: UserPermissionPanel 补缺 2 个 disabled Tab (process/driver) 与 prototype 对齐 - LOW: UsersListPage 默认 sortField/sortOrder 显式发给后端 - LOW: usersConstants QUERY_FIELD_OPTIONS 补 lastLoginDate - TEST: 补 canEditDocument prefill 测试用例 + msw handler 返回该字段 REQ_ID: FE-02

fix(frontend): 修复 review round 1 must-fix
- HIGH: UserFormPage edit 模式 prefill canEditDocument from backend（之前硬编码 false 会静默覆盖） - MED: UsersTable 加 a11y 键盘可达（tabIndex/role=button/onKeyDown）+ 操作列编辑链接 - MED: UsersTable 列头加 sorter (username/userCode/lastLoginDate/createdDate) - MED: UserFormPage employeeId 三态映射（toCreate/toUpdate helpers，spec § 八） - MED: api/users.ts UpdateUserReq/CreateUserReq.employeeId 类型补 | null - LOW: UserPermissionPanel 补缺 2 个 disabled Tab (process/driver) 与 prototype 对齐 - LOW: UsersListPage 默认 sortField/sortOrder 显式发给后端 - LOW: usersConstants QUERY_FIELD_OPTIONS 补 lastLoginDate - TEST: 补 canEditDocument prefill 测试用例 + msw handler 返回该字段 REQ_ID: FE-02
zichun
1 parent 1bee98b1
Showing 8 changed files with 64 additions and 11 deletions
frontend/src/api/users.ts
frontend/src/pages/users/UserFormPage.test.tsx
frontend/src/pages/users/UserFormPage.tsx
frontend/src/pages/users/UserPermissionPanel.tsx
frontend/src/pages/users/UsersListPage.tsx
frontend/src/pages/users/UsersTable.tsx
frontend/src/pages/users/usersConstants.ts
frontend/src/test-utils/msw-handlers.ts
@@ -15,6 +15,7 @@ export interface UserListItem {
 }
  
 export interface UserDetail extends UserListItem {
+  canEditDocument?: boolean;
   employeeId?: number | null;
   permissionCategoryIds: number[];
   updatedBy?: string | null;
@@ -46,7 +47,7 @@ export interface CreateUserReq {
   userType: 'NORMAL' | 'SUPER_ADMIN';
   language: 'zh-CN' | 'en-US' | 'zh-TW';
   canEditDocument: boolean;
-  employeeId?: number;
+  employeeId?: number | null;
   permissionCategoryIds?: number[];
 }
  
@@ -55,7 +56,7 @@ export interface UpdateUserReq {
   userType?: 'NORMAL' | 'SUPER_ADMIN';
   language?: 'zh-CN' | 'en-US' | 'zh-TW';
   canEditDocument?: boolean;
-  employeeId?: number;
+  employeeId?: number | null;
   isDeleted?: boolean;
   permissionCategoryIds?: number[];
 }
@@ -84,6 +84,15 @@ describe(&#39;UserFormPage (edit)&#39;, () =&gt; {
     });
   });
  
+  it('prefills canEditDocument from backend (not hardcoded false)', async () => {
+    renderForm('edit', '/users/1');
+    // backend mock 返回 canEditDocument=true；UI 应反映为 checkbox.checked=true
+    await waitFor(() => {
+      const checkbox = document.querySelector('input[type="checkbox"]') as HTMLInputElement;
+      expect(checkbox?.checked).toBe(true);
+    });
+  });
+
   it('unknown userId (40401) shows 404 result', async () => {
     renderForm('edit', '/users/99999');
     await waitFor(() => expect(screen.getByTestId('user-not-found')).toBeInTheDocument());
@@ -47,7 +47,7 @@ export default function UserFormPage({ mode }: Props) {
           userCode: detail.userCode,
           userType: detail.userType,
           language: detail.language as FormValues['language'],
-          canEditDocument: false, // detail VO 当前不返回，默认 false
+          canEditDocument: detail.canEditDocument ?? false,
           employeeId: detail.employeeId ?? undefined,
         });
         setPermissionCategoryIds(detail.permissionCategoryIds ?? []);
@@ -69,6 +69,13 @@ export default function UserFormPage({ mode }: Props) {
     };
   }, [mode, userId, form]);
  
+  // spec § 八三态 employeeId 映射：
+  //  - 新增模式：values.employeeId === undefined 或 0 → 不传 / 显式 null；正整数 → 传 ID
+  //  - 编辑模式：undefined → 不变（PATCH 缺省 = 保留原值）；0 → 显式发 0（解除关联约定）；正整数 → 传 ID
+  const toCreateEmployeeId = (v: number | undefined): number | null | undefined =>
+    v == null || v === 0 ? null : v;
+  const toUpdateEmployeeId = (v: number | undefined): number | undefined => v;
+
   const handleSubmit = async (values: FormValues) => {
     setSubmitting(true);
     setErrorMessage(null);
@@ -85,7 +92,7 @@ export default function UserFormPage({ mode }: Props) {
           userType: values.userType!,
           language: values.language!,
           canEditDocument: !!values.canEditDocument,
-          employeeId: values.employeeId,
+          employeeId: toCreateEmployeeId(values.employeeId),
           permissionCategoryIds,
         });
         message.success('新增用户成功');
@@ -95,7 +102,7 @@ export default function UserFormPage({ mode }: Props) {
           userType: values.userType,
           language: values.language,
           canEditDocument: values.canEditDocument,
-          employeeId: values.employeeId,
+          employeeId: toUpdateEmployeeId(values.employeeId),
           permissionCategoryIds,
         };
         await usersApi.update(userId, patch);
@@ -28,6 +28,8 @@ export default function UserPermissionPanel({ value, onChange, disabled = false 
           { key: 'customer', label: '客户查看权限', disabled: true, children: null },
           { key: 'supplier', label: '供应商查看权限', disabled: true, children: null },
           { key: 'person', label: '人员查看权限', disabled: true, children: null },
+          { key: 'process', label: '工序查看权限', disabled: true, children: null },
+          { key: 'driver', label: '司机查看权限', disabled: true, children: null },
         ]}
       />
     </div>
@@ -12,7 +12,12 @@ import UsersTable from &#39;./UsersTable&#39;;
  
 export default function UsersListPage() {
   const navigate = useNavigate();
-  const [query, setQuery] = useState<UsersListQuery>({ page: 1, size: 20 });
+  const [query, setQuery] = useState<UsersListQuery>({
+    page: 1,
+    size: 20,
+    sortField: 'tCreateDate',
+    sortOrder: 'desc',
+  });
   const [records, setRecords] = useState<UserListItem[]>([]);
   const [total, setTotal] = useState(0);
   const [loading, setLoading] = useState(false);
-import { Table, Tag } from 'antd';
+import { Table, Tag, Button } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
 import type { UserListItem } from '../../api/users';
  
@@ -28,9 +28,9 @@ export default function UsersTable({
       width: 60,
       render: (_: unknown, __: unknown, idx: number) => (page - 1) * size + idx + 1,
     },
-    { title: '用户名', dataIndex: 'username', key: 'username' },
+    { title: '用户名', dataIndex: 'username', key: 'username', sorter: true },
     { title: '员工名', dataIndex: 'employeeName', key: 'employeeName' },
-    { title: '用户号', dataIndex: 'userCode', key: 'userCode' },
+    { title: '用户号', dataIndex: 'userCode', key: 'userCode', sorter: true },
     { title: '部门', dataIndex: 'departmentName', key: 'departmentName' },
     {
       title: '用户类型',
@@ -46,9 +46,27 @@ export default function UsersTable({
       render: (v: boolean) =>
         v ? <Tag color="error">作废</Tag> : <Tag color="success">启用</Tag>,
     },
-    { title: '登录日期', dataIndex: 'lastLoginDate', key: 'lastLoginDate' },
+    { title: '登录日期', dataIndex: 'lastLoginDate', key: 'lastLoginDate', sorter: true },
     { title: '制单人', dataIndex: 'createdBy', key: 'createdBy' },
-    { title: '制单日期', dataIndex: 'createdDate', key: 'createdDate' },
+    { title: '制单日期', dataIndex: 'createdDate', key: 'createdDate', sorter: true },
+    {
+      title: '操作',
+      key: 'action',
+      width: 80,
+      render: (_: unknown, row: UserListItem) => (
+        <Button
+          type="link"
+          size="small"
+          data-testid={`edit-link-${row.userId}`}
+          onClick={(e) => {
+            e.stopPropagation();
+            onRowClick(row);
+          }}
+        >
+          编辑
+        </Button>
+      ),
+    },
   ];
  
   return (
@@ -59,7 +77,16 @@ export default function UsersTable({
       loading={loading}
       onRow={(row) => ({
         onClick: () => onRowClick(row),
+        onKeyDown: (e: React.KeyboardEvent) => {
+          if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            onRowClick(row);
+          }
+        },
         style: { cursor: 'pointer' },
+        tabIndex: 0,
+        role: 'button',
+        'aria-label': `查看用户 ${row.username}`,
         'data-testid': `user-row-${row.userId}`,
       })}
       pagination={{
@@ -16,6 +16,7 @@ export const QUERY_FIELD_OPTIONS = [
   { value: 'departmentName', label: '部门' },
   { value: 'userType', label: '用户类型' },
   { value: 'isDeleted', label: '作废' },
+  { value: 'lastLoginDate', label: '登录日期' },
   { value: 'createdBy', label: '制单人' },
 ] as const;
  
@@ -148,6 +148,7 @@ export const handlers = [
         language: 'zh-CN',
         isDeleted: false,
         lastLoginDate: '2026-05-15T08:00:00',
+        canEditDocument: true,
         employeeId: 1,
         permissionCategoryIds: [1, 2],
         createdBy: 'admin',