forked from M3-Academy/desafio-react-e-typescript
feat(institucional):formatação de envio aplicada a cpf e birthdate
This commit is contained in:
parent
fa54adf96a
commit
0d5b77da84
14
desafio-5/package-lock.json
generated
14
desafio-5/package-lock.json
generated
@ -17,6 +17,7 @@
|
||||
"@types/react-dom": "^18.0.10",
|
||||
"cpf-check": "^3.0.0",
|
||||
"formik": "^2.2.9",
|
||||
"moment": "^2.29.4",
|
||||
"node-sass": "^7.0.3",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
@ -12703,6 +12704,14 @@
|
||||
"mkdirp": "bin/cmd.js"
|
||||
}
|
||||
},
|
||||
"node_modules/moment": {
|
||||
"version": "2.29.4",
|
||||
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz",
|
||||
"integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w==",
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
@ -27876,6 +27885,11 @@
|
||||
"minimist": "^1.2.6"
|
||||
}
|
||||
},
|
||||
"moment": {
|
||||
"version": "2.29.4",
|
||||
"resolved": "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz",
|
||||
"integrity": "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w=="
|
||||
},
|
||||
"ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
|
@ -12,6 +12,7 @@
|
||||
"@types/react-dom": "^18.0.10",
|
||||
"cpf-check": "^3.0.0",
|
||||
"formik": "^2.2.9",
|
||||
"moment": "^2.29.4",
|
||||
"node-sass": "^7.0.3",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
|
@ -1,5 +1,6 @@
|
||||
import React, { useState } from "react"
|
||||
import { Formik,Form, FormikHelpers } from 'formik';
|
||||
import moment from 'moment';
|
||||
|
||||
import Homeicon from "../components/assets/icons/home_icon.svg"
|
||||
import Leftarrow from "../components/assets/icons/Leftarrow.svg"
|
||||
@ -42,6 +43,8 @@ const Home = () =>{
|
||||
const handleFormikSubmit = (values:FormTypes, formik: FormikHelpers<FormTypes>) =>{
|
||||
console.log(values)
|
||||
setIsChecked(false)
|
||||
values.birthdate = moment(values.birthdate, 'DDMMYYYY').format('DD/MM/YYYY');
|
||||
values.cpf = values.cpf.replace(/(\d{3})(\d)/, "$1.$2").replace(/(\d{3})(\d)/, "$1.$2").replace(/(\d{3})(\d{1,2})$/, "$1-$2")
|
||||
formik.resetForm();
|
||||
}
|
||||
|
||||
@ -124,7 +127,6 @@ const Home = () =>{
|
||||
onSubmit={handleFormikSubmit}
|
||||
>
|
||||
{({errors,touched}) => (
|
||||
|
||||
<Form
|
||||
id={MainStyles["contact"]}
|
||||
className={activeSection === "Contato" ? MainStyles["active"] : MainStyles["hiden"]}
|
||||
@ -184,13 +186,11 @@ const Home = () =>{
|
||||
Simbol="*"
|
||||
Simbolclass={MainStyles.Symbol}
|
||||
/>
|
||||
|
||||
<button type="submit">
|
||||
CADASTRE-SE
|
||||
</button>
|
||||
</Form>
|
||||
)}
|
||||
|
||||
</Formik>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -1,5 +1,6 @@
|
||||
import * as Yup from "yup";
|
||||
import isCPF from 'cpf-check';
|
||||
import moment from 'moment';
|
||||
|
||||
|
||||
export default Yup.object().shape({
|
||||
@ -18,10 +19,14 @@ export default Yup.object().shape({
|
||||
.required("* Campo Obrigatório")
|
||||
.transform(value => isCPF.format(value))
|
||||
.test("cpf-valid", "* CPF inválido", value => isCPF.validate(value))
|
||||
|
||||
,
|
||||
|
||||
birthdate:Yup.string()
|
||||
.required("* Campo Obrigatório"),
|
||||
|
||||
birthdate: Yup.string()
|
||||
.matches(/^(0?[1-9]|[12][0-9]|3[01])\/?(0?[1-9]|1[012])\/?(\d{4})$/,"Data de nascimento inválida")
|
||||
.test('is-valid-date', '* Data de nascimento inválida', value => moment(value, "DD/MM/YYYY").isValid())
|
||||
.required("* Campo obrigatório")
|
||||
.transform(value => moment(value, "DD/MM/YYYY").format("DD/MM/YYYY")),
|
||||
|
||||
phone:Yup.string()
|
||||
.required("* Campo Obrigatório"),
|
||||
|
@ -7002,6 +7002,11 @@
|
||||
dependencies:
|
||||
"minimist" "^1.2.6"
|
||||
|
||||
"moment@^2.29.4":
|
||||
"integrity" "sha512-5LC9SOxjSc2HF6vO2CyuTDNivEdoz2IvyJJGj6X8DJ0eFyfszE0QiEd+iXmBvUP3WHxSjFH/vIsA0EN00cgr8w=="
|
||||
"resolved" "https://registry.npmjs.org/moment/-/moment-2.29.4.tgz"
|
||||
"version" "2.29.4"
|
||||
|
||||
"ms@^2.0.0", "ms@^2.1.1", "ms@2.1.2":
|
||||
"integrity" "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
|
||||
"resolved" "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz"
|
||||
|
Loading…
Reference in New Issue
Block a user