feat(story012.009): 完成管理后台企业用户配置表单扩展

- 创建CompanySelectorWrapper组件处理NULL值兼容性
- 扩展用户创建/编辑表单添加企业选择字段
- 在用户列表中添加"关联企业"列显示企业名称
- 更新用户schema添加company字段
- 更新用户路由配置包含company关联
- 更新集成测试包含companyId字段

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>

packages/user-management-ui/package.json

@@ -58,7 +58,8 @@
     "react-router": "^7.1.3",
     "sonner": "^2.0.7",
     "tailwind-merge": "^3.3.1",
-    "zod": "^4.0.15"
+    "zod": "^4.0.15",
+    "@d8d/allin-company-management-ui": "workspace:*"
   },
   "devDependencies": {
     "@testing-library/jest-dom": "^6.8.0",

packages/user-management-ui/src/components/CompanySelectorWrapper.tsx

@@ -0,0 +1,44 @@
+import React from 'react';
+import { CompanySelector } from '@d8d/allin-company-management-ui';
+
+interface CompanySelectorWrapperProps {
+  value?: number | null;
+  onChange?: (value: number | null) => void;
+  placeholder?: string;
+  disabled?: boolean;
+  className?: string;
+  'data-testid'?: string;
+  platformId?: number;
+}
+
+export const CompanySelectorWrapper: React.FC<CompanySelectorWrapperProps> = ({
+  value,
+  onChange,
+  placeholder = "请选择公司",
+  disabled = false,
+  className,
+  'data-testid': testId,
+  platformId,
+}) => {
+  // 将null转换为undefined传递给CompanySelector
+  const handleChange = (newValue: number) => {
+    onChange?.(newValue);
+  };
+
+  // CompanySelector期望number | undefined，我们将null转换为undefined
+  const selectorValue = value === null ? undefined : value;
+
+  return (
+    <CompanySelector
+      value={selectorValue}
+      onChange={handleChange}
+      placeholder={placeholder}
+      disabled={disabled}
+      className={className}
+      data-testid={testId}
+      platformId={platformId}
+    />
+  );
+};
+
+export default CompanySelectorWrapper;

packages/user-management-ui/src/components/UserManagement.tsx

@@ -22,6 +22,7 @@ import { Popover, PopoverContent, PopoverTrigger } from '@d8d/shared-ui-componen
 import { Calendar } from '@d8d/shared-ui-components/components/ui/calendar';
 import { cn } from '@d8d/shared-ui-components/utils/cn';
 import { DisabledStatus } from '@d8d/shared-types';
+import { CompanySelectorWrapper } from './CompanySelectorWrapper';
 
 // 使用RPC方式提取类型
 type CreateUserRequest = InferRequestType<typeof userClient.index.$post>['json'];
@@ -63,6 +64,7 @@ export const UserManagement = () => {
       phone: null,
       name: null,
       password: '',
+      companyId: null,
       isDisabled: DisabledStatus.ENABLED,
     },
   });
@@ -76,6 +78,7 @@ export const UserManagement = () => {
       phone: null,
       name: null,
       password: '',
+      companyId: null,
       isDisabled: 0,
     },
   });
@@ -116,7 +119,7 @@ export const UserManagement = () => {
   const totalCount = usersData?.pagination?.total || 0;
 
   // 防抖搜索函数
-  const debounce = <T extends (...args: unknown[]) => void>(func: T, delay: number) => {
+  const debounce = <T extends (...args: any[]) => void>(func: T, delay: number) => {
     let timeoutId: NodeJS.Timeout;
     return (...args: Parameters<T>) => {
       clearTimeout(timeoutId);
@@ -184,6 +187,7 @@ export const UserManagement = () => {
       phone: null,
       name: null,
       password: '',
+      companyId: null,
       isDisabled: DisabledStatus.ENABLED,
     });
     setIsModalOpen(true);
@@ -200,6 +204,7 @@ export const UserManagement = () => {
       phone: user.phone,
       name: user.name,
       avatarFileId: user.avatarFileId,
+      companyId: user.companyId,
       isDisabled: user.isDisabled,
     });
     setIsModalOpen(true);
@@ -502,6 +507,7 @@ export const UserManagement = () => {
                   <TableHead>昵称</TableHead>
                   <TableHead>邮箱</TableHead>
                   <TableHead>真实姓名</TableHead>
+                  <TableHead>关联企业</TableHead>
                   <TableHead>角色</TableHead>
                   <TableHead>状态</TableHead>
                   <TableHead>创建时间</TableHead>
@@ -512,7 +518,7 @@ export const UserManagement = () => {
                 {isLoading ? (
                   // 显示表格骨架屏
                   <TableRow>
-                    <TableCell colSpan={8} className="p-4">
+                    <TableCell colSpan={10} className="p-4">
                       {renderTableSkeleton()}
                     </TableCell>
                   </TableRow>
@@ -541,6 +547,7 @@ export const UserManagement = () => {
                       <TableCell>{user.nickname || '-'}</TableCell>
                       <TableCell>{user.email || '-'}</TableCell>
                       <TableCell>{user.name || '-'}</TableCell>
+                      <TableCell>{user.company?.companyName || '无'}</TableCell>
                       <TableCell>
                         <Badge
                           variant={user.roles?.some((role) => role.name === 'admin') ? 'destructive' : 'default'}
@@ -718,6 +725,28 @@ export const UserManagement = () => {
                   )}
                 />
 
+                <FormField
+                  control={createForm.control}
+                  name="companyId"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>关联企业</FormLabel>
+                      <FormControl>
+                        <CompanySelectorWrapper
+                          value={field.value}
+                          onChange={field.onChange}
+                          placeholder="请选择关联企业（可选）"
+                          data-testid="company-selector"
+                        />
+                      </FormControl>
+                      <FormDescription>
+                        为用户分配关联的企业，留空表示不关联任何企业
+                      </FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+
                 <FormField
                   control={createForm.control}
                   name="isDisabled"
@@ -839,6 +868,28 @@ export const UserManagement = () => {
                   )}
                 />
 
+                <FormField
+                  control={updateForm.control}
+                  name="companyId"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>关联企业</FormLabel>
+                      <FormControl>
+                        <CompanySelectorWrapper
+                          value={field.value}
+                          onChange={field.onChange}
+                          placeholder="请选择关联企业（可选）"
+                          data-testid="company-selector-edit"
+                        />
+                      </FormControl>
+                      <FormDescription>
+                        为用户分配关联的企业，留空表示不关联任何企业
+                      </FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+
                 <FormField
                   control={updateForm.control}
                   name="isDisabled"

packages/user-management-ui/src/components/index.ts

@@ -1,2 +1,3 @@
 export { UserManagement } from './UserManagement';
-export { UserSelector } from './UserSelector';
+export { UserSelector } from './UserSelector';
+export { CompanySelectorWrapper } from './CompanySelectorWrapper';

packages/user-management-ui/tests/integration/userManagement.integration.test.tsx

@@ -140,6 +140,7 @@ describe('用户管理集成测试', () => {
           nickname: null,
           phone: null,
           name: null,
+          companyId: null,
           isDisabled: 0,
         },
       });