4 changed files with 180 additions and 27 deletions
@ -0,0 +1,121 @@ |
|||||
|
import React, { useState, useRef } from 'react'; |
||||
|
import { Button, Form, Row, Col, Table, Popconfirm, Input, message } from 'antd'; |
||||
|
import { |
||||
|
ModalForm, |
||||
|
ProFormRadio, |
||||
|
ProFormSelect, |
||||
|
ProFormTextArea, |
||||
|
ProFormDigit, |
||||
|
ProFormDependency, |
||||
|
ProFormText |
||||
|
} from '@ant-design/pro-form'; |
||||
|
|
||||
|
import moment from 'moment'; |
||||
|
|
||||
|
export default (props) => { |
||||
|
const { title, triggerRender, editData = null, onFinish, readOnly, } = props; |
||||
|
const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 16 } }; |
||||
|
const initialValues = editData ? { |
||||
|
...editData, |
||||
|
} : {}; |
||||
|
|
||||
|
return ( |
||||
|
<ModalForm |
||||
|
title={title || ''} |
||||
|
initialValues={initialValues} |
||||
|
trigger={ |
||||
|
triggerRender ? triggerRender : <Button type="primary" > |
||||
|
{title || ''} |
||||
|
</Button> |
||||
|
} |
||||
|
layout="horizontal" |
||||
|
grid={true} |
||||
|
{...formItemLayout} |
||||
|
modalProps={{ |
||||
|
destroyOnClose: true, |
||||
|
onCancel: () => { }, |
||||
|
// bodyStyle: { height: 800, overflowY: 'auto' }
|
||||
|
}} |
||||
|
onFinish={async (values) => { |
||||
|
onFinish && await onFinish(values, editData) |
||||
|
return true; |
||||
|
}} |
||||
|
submitter={!readOnly} |
||||
|
width={500} |
||||
|
|
||||
|
> |
||||
|
<ProFormText |
||||
|
rules={[{ required: true, message: '请输入属性名称' }]} |
||||
|
disabled={readOnly || editData} |
||||
|
name="attributeName" |
||||
|
label="属性名称" |
||||
|
/> |
||||
|
|
||||
|
<ProFormText |
||||
|
rules={[{ required: true, message: '请输入属性代码' }]} |
||||
|
disabled={readOnly || editData} |
||||
|
name="attributeCode" |
||||
|
label="属性代码" |
||||
|
/> |
||||
|
|
||||
|
<ProFormSelect |
||||
|
rules={[{ required: true, message: '请选择检查类型' }]} |
||||
|
options={[ |
||||
|
{ label: '整型', value: '整型' }, |
||||
|
{ label: '字符型', value: '字符型' }, |
||||
|
{ label: '布尔型', value: '布尔型' },]} |
||||
|
disabled={readOnly || editData} |
||||
|
name="dataType" |
||||
|
label="数据类型" |
||||
|
fieldProps={{ |
||||
|
showSearch: true |
||||
|
}} |
||||
|
/> |
||||
|
<ProFormDigit |
||||
|
disabled={readOnly || editData} |
||||
|
name="length" |
||||
|
label="长度" |
||||
|
fieldProps={{ precision: 0 }} |
||||
|
/> |
||||
|
|
||||
|
<ProFormSelect |
||||
|
rules={[{ required: true, message: '请选择输入控件' }]} |
||||
|
options={[ |
||||
|
{ label: '数字输入框', value: '数字输入框' }, |
||||
|
{ label: '文本框', value: '文本框' }, |
||||
|
{ label: '下拉框', value: '下拉框' }, |
||||
|
]} |
||||
|
disabled={readOnly || editData} |
||||
|
name="control" |
||||
|
label="输入控件" |
||||
|
/> |
||||
|
|
||||
|
<ProFormSelect |
||||
|
rules={[{ required: true, message: '请选择是否允许为空' }]} |
||||
|
options={[ |
||||
|
{ label: '是', value: true }, |
||||
|
{ label: '否', value: false }]} |
||||
|
disabled={readOnly || editData} |
||||
|
name="nullable" |
||||
|
label="是否允许为空" |
||||
|
/> |
||||
|
|
||||
|
<ProFormSelect |
||||
|
rules={[{ required: true, message: '请选是否只读' }]} |
||||
|
options={[ |
||||
|
{ label: '是', value: true }, |
||||
|
{ label: '否', value: false }]} |
||||
|
disabled={readOnly || editData} |
||||
|
name="readOnly" |
||||
|
label="是否只读" |
||||
|
/> |
||||
|
|
||||
|
<ProFormTextArea |
||||
|
disabled={readOnly || editData} |
||||
|
name="description" |
||||
|
label="描述" |
||||
|
/> |
||||
|
|
||||
|
</ModalForm> |
||||
|
); |
||||
|
}; |
Loading…
Reference in new issue