blob: 555fcde89ceaff1965c2bf09a5058ef5948a80b6 [file] [log] [blame]
import React, { useEffect } from 'react';
import {
ProForm,
ProFormDigit,
ProFormText,
ProFormRadio,
ProFormTextArea,
} from '@ant-design/pro-components';
import { Form, Modal} from 'antd';
import { useIntl, FormattedMessage } from '@umijs/max';
import { DictValueEnumObj } from '@/components/DictTag';
export type PostFormData = Record<string, unknown> & Partial<API.System.Post>;
export type PostFormProps = {
onCancel: (flag?: boolean, formVals?: PostFormData) => void;
onSubmit: (values: PostFormData) => Promise<void>;
open: boolean;
values: Partial<API.System.Post>;
statusOptions: DictValueEnumObj;
};
const PostForm: React.FC<PostFormProps> = (props) => {
const [form] = Form.useForm();
const { statusOptions, } = props;
useEffect(() => {
form.resetFields();
form.setFieldsValue({
postId: props.values.postId,
postCode: props.values.postCode,
postName: props.values.postName,
postSort: props.values.postSort,
status: props.values.status,
createBy: props.values.createBy,
createTime: props.values.createTime,
updateBy: props.values.updateBy,
updateTime: props.values.updateTime,
remark: props.values.remark,
});
}, [form, props]);
const intl = useIntl();
const handleOk = () => {
form.submit();
};
const handleCancel = () => {
props.onCancel();
};
const handleFinish = async (values: Record<string, any>) => {
props.onSubmit(values as PostFormData);
};
return (
<Modal
width={640}
title={intl.formatMessage({
id: 'system.post.title',
defaultMessage: '编辑岗位信息',
})}
open={props.open}
forceRender
destroyOnClose
onOk={handleOk}
onCancel={handleCancel}
>
<ProForm
form={form}
grid={true}
submitter={false}
layout="horizontal"
onFinish={handleFinish}>
<ProFormDigit
name="postId"
label={intl.formatMessage({
id: 'system.post.post_id',
defaultMessage: '岗位编号',
})}
placeholder="请输入岗位编号"
disabled
hidden={true}
rules={[
{
required: false,
message: <FormattedMessage id="请输入岗位编号!" defaultMessage="请输入岗位编号!" />,
},
]}
/>
<ProFormText
name="postName"
label={intl.formatMessage({
id: 'system.post.post_name',
defaultMessage: '岗位名称',
})}
placeholder="请输入岗位名称"
rules={[
{
required: true,
message: <FormattedMessage id="请输入岗位名称!" defaultMessage="请输入岗位名称!" />,
},
]}
/>
<ProFormText
name="postCode"
label={intl.formatMessage({
id: 'system.post.post_code',
defaultMessage: '岗位编码',
})}
placeholder="请输入岗位编码"
rules={[
{
required: true,
message: <FormattedMessage id="请输入岗位编码!" defaultMessage="请输入岗位编码!" />,
},
]}
/>
<ProFormDigit
name="postSort"
label={intl.formatMessage({
id: 'system.post.post_sort',
defaultMessage: '显示顺序',
})}
placeholder="请输入显示顺序"
rules={[
{
required: true,
message: <FormattedMessage id="请输入显示顺序!" defaultMessage="请输入显示顺序!" />,
},
]}
/>
<ProFormRadio.Group
valueEnum={statusOptions}
name="status"
label={intl.formatMessage({
id: 'system.post.status',
defaultMessage: '状态',
})}
placeholder="请输入状态"
rules={[
{
required: true,
message: <FormattedMessage id="请输入状态!" defaultMessage="请输入状态!" />,
},
]}
/>
<ProFormTextArea
name="remark"
label={intl.formatMessage({
id: 'system.post.remark',
defaultMessage: '备注',
})}
placeholder="请输入备注"
rules={[
{
required: false,
message: <FormattedMessage id="请输入备注!" defaultMessage="请输入备注!" />,
},
]}
/>
</ProForm>
</Modal>
);
};
export default PostForm;