parent
ec1361cae9
commit
cca221993c
@ -0,0 +1,114 @@
|
|||||||
|
import React from 'react'
|
||||||
|
import { Modal ,Form} from 'antd';
|
||||||
|
|
||||||
|
const CollectionCreateForm = Form.create({ name: 'form_in_modal' })(
|
||||||
|
// eslint-disable-next-line
|
||||||
|
class extends React.Component {
|
||||||
|
render() {
|
||||||
|
const { visible, onCancel, onCreate, form } = this.props;
|
||||||
|
const { getFieldDecorator } = form;
|
||||||
|
return (
|
||||||
|
<Modal
|
||||||
|
visible={visible}
|
||||||
|
title="Create a new collection"
|
||||||
|
okText="Create"
|
||||||
|
onCancel={onCancel}
|
||||||
|
onOk={onCreate}
|
||||||
|
>
|
||||||
|
<Form layout="vertical">
|
||||||
|
<Form.Item label="Title">
|
||||||
|
{getFieldDecorator('title', {
|
||||||
|
rules: [{ required: true, message: 'Please input the title of collection!' }],
|
||||||
|
})(<Input />)}
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="Description">
|
||||||
|
{getFieldDecorator('description')(<Input type="textarea" />)}
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item className="collection-create-form_last-form-item">
|
||||||
|
{getFieldDecorator('modifier', {
|
||||||
|
initialValue: 'public',
|
||||||
|
})(
|
||||||
|
<Radio.Group>
|
||||||
|
<Radio value="public">Public</Radio>
|
||||||
|
<Radio value="private">Private</Radio>
|
||||||
|
</Radio.Group>,
|
||||||
|
)}
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
);
|
||||||
|
|
||||||
|
class CollectionsPage extends React.Component {
|
||||||
|
state = {
|
||||||
|
visible: false,
|
||||||
|
};
|
||||||
|
|
||||||
|
showModal = () => {
|
||||||
|
this.setState({ visible: true });
|
||||||
|
};
|
||||||
|
|
||||||
|
handleCancel = () => {
|
||||||
|
this.setState({ visible: false });
|
||||||
|
};
|
||||||
|
|
||||||
|
handleCreate = () => {
|
||||||
|
const { form } = this.formRef.props;
|
||||||
|
form.validateFields((err, values) => {
|
||||||
|
if (err) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('Received values of form: ', values);
|
||||||
|
form.resetFields();
|
||||||
|
this.setState({ visible: false });
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
saveFormRef = formRef => {
|
||||||
|
this.formRef = formRef;
|
||||||
|
};
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
|
||||||
|
<CollectionCreateForm
|
||||||
|
wrappedComponentRef={this.saveFormRef}
|
||||||
|
visible={this.state.visible}
|
||||||
|
onCancel={this.handleCancel}
|
||||||
|
onCreate={this.handleCreate}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class Createsignmodel extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props)
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
console.log(this.props)
|
||||||
|
return(
|
||||||
|
<React.Fragment>
|
||||||
|
{this.props.visible?<Modal
|
||||||
|
title="创建签到"
|
||||||
|
visible={this.props.visible}
|
||||||
|
closable={false}
|
||||||
|
footer={null}
|
||||||
|
>
|
||||||
|
<p>Some contents...</p>
|
||||||
|
<p>Some contents...</p>
|
||||||
|
<p>Some contents...</p>
|
||||||
|
</Modal>:""}
|
||||||
|
</React.Fragment>
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
Loading…
Reference in new issue