import { memo, useEffect, useState } from 'react' import { LockFlag } from '#/enum' import { toast } from 'sonner' import { fetchTree } from '@/api/services/dept' import { fetchPostList } from '@/api/services/post' import { deptRoleList } from '@/api/services/role' import { addUser } from '@/api/services/user' import { Col, Form, Input, Modal, Radio, Row, Select, TreeSelect } from 'antd' export type AddModalProps = { show: boolean onCancel: VoidFunction getList: VoidFunction } const formData: Partial = {} export const AddModal = memo(({ show = false, onCancel, getList }: AddModalProps) => { // 查询部门树 const [treeDeptData, setTreeDeptData] = useState([]) const getDeptTree = async () => { const res = await fetchTree() if (res?.code === '2000') { setTreeDeptData(res.data) } } // 查询岗位列表 const [postOptions, setPostOptions] = useState([]) const getPostList = async () => { const res = await fetchPostList() if (res?.code === '2000') { setPostOptions(res.data) } } // 查询角色列表 const [rolesOptions, setRolesOptions] = useState([]) const getRoleList = async () => { const res = await deptRoleList() if (res?.code === '2000') { setRolesOptions(res.data) } } useEffect(() => { getDeptTree() getPostList() getRoleList() }, []) const [form] = Form.useForm() const onOkFn = () => { form.validateFields().then((values) => { console.log(values) addUser(values as API.AddUserParams).then((res) => { if (res) { console.log(res) getList() onCancelFn() toast.success('创建成功', { position: 'top-center' }) } }) }) } const onCancelFn = () => { form.resetFields() onCancel() } return ( {/* 表单名称,会作为表单字段 id 前缀使用,不加可能会造成表单id冲突 */}
label='用户名' name='username' rules={[ { required: true, message: '请输入用户名' }, { min: 3, max: 20, message: '长度在 3 到 20 个字符' } ]}> label='密码' name='password' rules={[ { required: true, message: '请输入密码' } ]}> label='真实姓名' name='realName' rules={[ { required: true, message: '请输入真实姓名' } ]}> label='所属部门' name='deptId' rules={[ { required: true, message: '请选择部门' } ]}> label='手机号' name='phone' rules={[ { required: true, message: '请输入手机号' } ]}> label='邮箱' name='email' rules={[ { required: true, message: '请输入邮箱' } ]}> label='岗位' name='postIds' rules={[ { required: true, message: '请选择岗位' } ]}> label='状态' name='lockFlag' rules={[ { required: true, message: '请选择状态' } ]}> 有效 锁定
) })