Commit e792984dbd0363b8a121f8a32dccf4a7726d210b
1 parent
777215f3
chore(usr): delete UserFormDrawer replaced by UserDetailPage
Showing
1 changed file
with
0 additions
and
171 deletions
frontend/src/pages/usr/UserFormDrawer.tsx deleted
| 1 | -import { useEffect, useState } from 'react' | |
| 2 | -import { | |
| 3 | - Drawer, Form, Input, Select, Checkbox, Button, message, Table | |
| 4 | -} from 'antd' | |
| 5 | -import type { ColumnsType } from 'antd/es/table' | |
| 6 | -import { getStaffs, getPermissionGroups, createUser, updateUser, StaffVO, PermissionGroupVO, UserCreateReq, UserUpdateReq } from '../../api/usr' | |
| 7 | - | |
| 8 | -interface InitialData { | |
| 9 | - userType: string | |
| 10 | - language: string | |
| 11 | - canEditDoc: boolean | |
| 12 | - isDisabled: boolean | |
| 13 | - employeeId?: string | null | |
| 14 | - permGroupIds?: string[] | |
| 15 | -} | |
| 16 | - | |
| 17 | -interface Props { | |
| 18 | - open: boolean | |
| 19 | - onClose: () => void | |
| 20 | - onSuccess: () => void | |
| 21 | - userId?: string | |
| 22 | - initialData?: InitialData | |
| 23 | -} | |
| 24 | - | |
| 25 | -export default function UserFormDrawer({ open, onClose, onSuccess, userId, initialData }: Props) { | |
| 26 | - const [form] = Form.useForm() | |
| 27 | - const [staffs, setStaffs] = useState<StaffVO[]>([]) | |
| 28 | - const [permGroups, setPermGroups] = useState<PermissionGroupVO[]>([]) | |
| 29 | - const [selectedPermIds, setSelectedPermIds] = useState<string[]>([]) | |
| 30 | - const [submitting, setSubmitting] = useState(false) | |
| 31 | - | |
| 32 | - const isEditMode = !!userId | |
| 33 | - | |
| 34 | - useEffect(() => { | |
| 35 | - if (open) { | |
| 36 | - getStaffs().then(setStaffs).catch(() => {}) | |
| 37 | - getPermissionGroups().then(setPermGroups).catch(() => {}) | |
| 38 | - if (isEditMode && initialData) { | |
| 39 | - form.setFieldsValue({ | |
| 40 | - userType: initialData.userType, | |
| 41 | - language: initialData.language, | |
| 42 | - canEditDoc: initialData.canEditDoc, | |
| 43 | - isDisabled: initialData.isDisabled, | |
| 44 | - employeeId: initialData.employeeId ?? null, | |
| 45 | - }) | |
| 46 | - setSelectedPermIds(initialData.permGroupIds ?? []) | |
| 47 | - } else { | |
| 48 | - form.resetFields() | |
| 49 | - setSelectedPermIds([]) | |
| 50 | - } | |
| 51 | - } | |
| 52 | - }, [open]) | |
| 53 | - | |
| 54 | - const permColumns: ColumnsType<PermissionGroupVO> = [ | |
| 55 | - { | |
| 56 | - title: '', | |
| 57 | - key: 'select', | |
| 58 | - width: 40, | |
| 59 | - render: (_, record) => ( | |
| 60 | - <Checkbox | |
| 61 | - checked={selectedPermIds.includes(record.sId)} | |
| 62 | - onChange={e => { | |
| 63 | - setSelectedPermIds(prev => | |
| 64 | - e.target.checked ? [...prev, record.sId] : prev.filter(id => id !== record.sId) | |
| 65 | - ) | |
| 66 | - }} | |
| 67 | - /> | |
| 68 | - ) | |
| 69 | - }, | |
| 70 | - { title: '权限组', dataIndex: 'sGroupName' }, | |
| 71 | - { title: '分类', dataIndex: 'sCategory' } | |
| 72 | - ] | |
| 73 | - | |
| 74 | - async function handleSubmit() { | |
| 75 | - try { | |
| 76 | - const values = await form.validateFields() | |
| 77 | - setSubmitting(true) | |
| 78 | - if (isEditMode) { | |
| 79 | - const req: UserUpdateReq = { | |
| 80 | - userType: values.userType, | |
| 81 | - language: values.language, | |
| 82 | - canEditDoc: values.canEditDoc ?? false, | |
| 83 | - isDisabled: values.isDisabled ?? false, | |
| 84 | - employeeId: values.employeeId ?? null, | |
| 85 | - permGroupIds: selectedPermIds | |
| 86 | - } | |
| 87 | - await updateUser(userId, req) | |
| 88 | - message.success('修改用户成功') | |
| 89 | - } else { | |
| 90 | - const req: UserCreateReq = { | |
| 91 | - userCode: values.userCode, | |
| 92 | - username: values.username, | |
| 93 | - userType: values.userType, | |
| 94 | - language: values.language, | |
| 95 | - canEditDoc: values.canEditDoc ?? false, | |
| 96 | - employeeId: values.employeeId ?? null, | |
| 97 | - permGroupIds: selectedPermIds | |
| 98 | - } | |
| 99 | - await createUser(req) | |
| 100 | - message.success('新增用户成功') | |
| 101 | - } | |
| 102 | - form.resetFields() | |
| 103 | - setSelectedPermIds([]) | |
| 104 | - onSuccess() | |
| 105 | - } catch (e: unknown) { | |
| 106 | - if (e instanceof Error) { | |
| 107 | - message.error(e.message) | |
| 108 | - } | |
| 109 | - } finally { | |
| 110 | - setSubmitting(false) | |
| 111 | - } | |
| 112 | - } | |
| 113 | - | |
| 114 | - return ( | |
| 115 | - <Drawer | |
| 116 | - title={isEditMode ? '修改用户' : '新增用户'} | |
| 117 | - open={open} | |
| 118 | - onClose={onClose} | |
| 119 | - width={520} | |
| 120 | - footer={ | |
| 121 | - <div style={{ textAlign: 'right' }}> | |
| 122 | - <Button onClick={onClose} style={{ marginRight: 8 }}>取消</Button> | |
| 123 | - <Button type="primary" onClick={handleSubmit} loading={submitting}>确认</Button> | |
| 124 | - </div> | |
| 125 | - } | |
| 126 | - > | |
| 127 | - <Form form={form} layout="vertical"> | |
| 128 | - {!isEditMode && ( | |
| 129 | - <> | |
| 130 | - <Form.Item name="userCode" label="用户号" rules={[{ required: true, message: '请输入用户号' }]}> | |
| 131 | - <Input placeholder="请输入用户号" /> | |
| 132 | - </Form.Item> | |
| 133 | - <Form.Item name="username" label="用户名" rules={[{ required: true, message: '请输入用户名' }]}> | |
| 134 | - <Input placeholder="请输入用户名" /> | |
| 135 | - </Form.Item> | |
| 136 | - </> | |
| 137 | - )} | |
| 138 | - <Form.Item name="userType" label="用户类型" rules={[{ required: true }]} initialValue="普通用户"> | |
| 139 | - <Select options={[{ value: '普通用户', label: '普通用户' }, { value: '超级管理员', label: '超级管理员' }]} /> | |
| 140 | - </Form.Item> | |
| 141 | - <Form.Item name="language" label="语言" rules={[{ required: true }]} initialValue="中文"> | |
| 142 | - <Select options={[{ value: '中文', label: '中文' }, { value: '英文', label: 'English' }, { value: '繁体', label: '繁體' }]} /> | |
| 143 | - </Form.Item> | |
| 144 | - <Form.Item name="canEditDoc" valuePropName="checked"> | |
| 145 | - <Checkbox>可编辑文档</Checkbox> | |
| 146 | - </Form.Item> | |
| 147 | - {isEditMode && ( | |
| 148 | - <Form.Item name="isDisabled" valuePropName="checked"> | |
| 149 | - <Checkbox>作废</Checkbox> | |
| 150 | - </Form.Item> | |
| 151 | - )} | |
| 152 | - <Form.Item name="employeeId" label="关联员工"> | |
| 153 | - <Select | |
| 154 | - allowClear | |
| 155 | - placeholder="选择员工(可选)" | |
| 156 | - options={staffs.map(s => ({ value: s.sId, label: s.sStaffName }))} | |
| 157 | - /> | |
| 158 | - </Form.Item> | |
| 159 | - <Form.Item label="权限组"> | |
| 160 | - <Table | |
| 161 | - size="small" | |
| 162 | - columns={permColumns} | |
| 163 | - dataSource={permGroups} | |
| 164 | - rowKey="sId" | |
| 165 | - pagination={false} | |
| 166 | - /> | |
| 167 | - </Form.Item> | |
| 168 | - </Form> | |
| 169 | - </Drawer> | |
| 170 | - ) | |
| 171 | -} |