Formação do Netuno Maranhão.
https://www.linkedin.com/groups/9048260/
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.
147 lines
4.6 KiB
147 lines
4.6 KiB
import React, { useEffect, useState} from 'react';
|
|
|
|
import { Form, Input, Button, Select } from 'antd';
|
|
|
|
import _service from '@netuno/service-client';
|
|
|
|
import './index.less';
|
|
|
|
const layout = {
|
|
labelCol: { span: 8 },
|
|
wrapperCol: { span: 16 },
|
|
};
|
|
const tailLayout = {
|
|
wrapperCol: { offset: 8, span: 16 },
|
|
};
|
|
|
|
export default ()=> {
|
|
const [ cities, setCities ] = useState([]);
|
|
useEffect(() => {
|
|
_service({
|
|
url: "cities",
|
|
success: (response) => {
|
|
if (response.json) {
|
|
setCities(response.json);
|
|
}
|
|
},
|
|
fail: (e) => {
|
|
console.log("Service Error", e);
|
|
}
|
|
});
|
|
}, []);
|
|
|
|
const onFinish = (values) => {
|
|
console.log('Success:', values);
|
|
};
|
|
|
|
const onFinishFailed = (errorInfo) => {
|
|
console.log('Failed:', errorInfo);
|
|
};
|
|
|
|
return (
|
|
<div className="register">
|
|
<h1>Criar Conta</h1>
|
|
<div className="register__form">
|
|
<Form
|
|
{...layout}
|
|
name="basic"
|
|
initialValues={{
|
|
remember: true,
|
|
}}
|
|
onFinish={onFinish}
|
|
onFinishFailed={onFinishFailed}
|
|
>
|
|
<Form.Item
|
|
label="Nome"
|
|
name="name"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Por favor preencha o seu nome.',
|
|
},
|
|
]}
|
|
>
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="Sobrenome"
|
|
name="surname"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Por favor preencha o seu nome.',
|
|
},
|
|
]}
|
|
>
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="E-mail"
|
|
name="email"
|
|
rules={[
|
|
{
|
|
type: 'email',
|
|
message: 'Por favor preencha um e-mail válido.',
|
|
},
|
|
{
|
|
required: true,
|
|
message: 'Por favor preencha o seu e-mail.',
|
|
},
|
|
]}
|
|
>
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="Usuário"
|
|
name="username"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Por favor preencha o seu usuário.',
|
|
},
|
|
]}
|
|
>
|
|
<Input />
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="Senha"
|
|
name="password"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Por favor preencha o seu senha.',
|
|
},
|
|
]}
|
|
>
|
|
<Input.Password />
|
|
</Form.Item>
|
|
|
|
|
|
<Form.Item
|
|
label="Cidade"
|
|
name="city_uid"
|
|
rules={[
|
|
{
|
|
required: true,
|
|
message: 'Por favor preencha a sua cidade.',
|
|
},
|
|
]}
|
|
>
|
|
<Select allowClear>
|
|
{
|
|
cities.map(({ uid, name })=>
|
|
<Select.Option value={uid}>{name}</Select.Option>
|
|
)
|
|
}
|
|
</Select>
|
|
</Form.Item>
|
|
<Form.Item {...tailLayout}>
|
|
<Button type="primary" htmlType="submit">
|
|
Enviar
|
|
</Button>
|
|
</Form.Item>
|
|
</Form>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|