You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
73 lines
2.1 KiB
73 lines
2.1 KiB
import React from "react"; |
|
import { Form, Input, Button, Row, Col, Select, Tag } from "antd"; |
|
import ClientService from "../service/ClientService"; |
|
import { useHistory } from "react-router-dom"; |
|
|
|
const { Option } = Select; |
|
|
|
export default function NewClientPage() { |
|
const history = useHistory(); |
|
const onSubmit = (values) => { |
|
ClientService.addClient(values).then((client) => |
|
history.push("/clients/" + client.id) |
|
); |
|
}; |
|
const tailLayout = { |
|
wrapperCol: { offset: 8, span: 4 }, |
|
}; |
|
|
|
return ( |
|
<> |
|
<Form onFinish={onSubmit}> |
|
<Row gutter={16}> |
|
<Col> |
|
<Form.Item label="Name" name="name" required="true"> |
|
<Input type="name"></Input> |
|
</Form.Item> |
|
</Col> |
|
<Col> |
|
<Form.Item label="Email" name="email"> |
|
<Input type="email"></Input> |
|
</Form.Item> |
|
</Col> |
|
<Col> |
|
<Form.Item label="status" name="status"> |
|
<Select defaultValue=""> |
|
<Option value="">Pick</Option> |
|
<Option value="potential"> |
|
<Tag color="default">Potential</Tag> |
|
</Option> |
|
<Option value="active"> |
|
<Tag color="success">Active</Tag> |
|
</Option> |
|
<Option value="on_hold"> |
|
<Tag color="purple">On Hold</Tag> |
|
</Option> |
|
<Option value="inactive"> |
|
<Tag color="error">Inactive</Tag> |
|
</Option> |
|
</Select> |
|
</Form.Item> |
|
</Col> |
|
</Row> |
|
<Row gutter={16}> |
|
<Col> |
|
<Form.Item label="Address" name="address"> |
|
<Input.TextArea></Input.TextArea> |
|
</Form.Item> |
|
</Col> |
|
<Col> |
|
<Form.Item label="Telephone" name="telephone"> |
|
<Input type="tel"></Input> |
|
</Form.Item> |
|
</Col> |
|
</Row> |
|
<Form.Item {...tailLayout}> |
|
<Button type="primary" htmlType="submit"> |
|
Submit |
|
</Button> |
|
</Form.Item> |
|
</Form> |
|
</> |
|
); |
|
}
|
|
|