UserFormFields.tsx
2.05 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
import { Form, Input, Select, Checkbox } from 'antd';
import { USER_TYPE_OPTIONS, LANGUAGE_OPTIONS, EMPLOYEE_OPTIONS } from './usersConstants';
interface Props {
mode: 'create' | 'edit';
disabled?: boolean;
}
export default function UserFormFields({ mode, disabled = false }: Props) {
return (
<>
<Form.Item
label="用户名"
name="username"
rules={
mode === 'create'
? [
{ required: true, message: '请输入用户名' },
{
pattern: /^[A-Za-z0-9_]{3,20}$/,
message: '用户名必须为 3-20 位字母数字下划线',
},
]
: []
}
>
<Input
placeholder="3-20 位字母数字下划线"
disabled={disabled || mode === 'edit'}
autoComplete="off"
/>
</Form.Item>
<Form.Item
label="用户号"
name="userCode"
rules={[
{ required: true, message: '请输入用户号' },
{ max: 50, message: '用户号不能超过 50 字符' },
]}
>
<Input placeholder="用户号" disabled={disabled} />
</Form.Item>
<Form.Item
label="类型"
name="userType"
rules={[{ required: true, message: '请选择类型' }]}
>
<Select options={USER_TYPE_OPTIONS as any} disabled={disabled} />
</Form.Item>
<Form.Item
label="语言"
name="language"
rules={[{ required: true, message: '请选择语言' }]}
>
<Select options={LANGUAGE_OPTIONS as any} disabled={disabled} />
</Form.Item>
<Form.Item label="单据修改权限" name="canEditDocument" valuePropName="checked">
<Checkbox disabled={disabled}>允许修改</Checkbox>
</Form.Item>
<Form.Item label="员工名" name="employeeId">
<Select
options={EMPLOYEE_OPTIONS}
disabled={disabled}
allowClear
placeholder="可选，不选 = 无关联"
/>
</Form.Item>
</>
);
}