diff --git a/src/App.tsx b/src/App.tsx index 6ef9e27..cf440ae 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -15,6 +15,9 @@ import { IonReactRouter } from '@ionic/react-router'; import Cadastro from './pages/Cadastro/Cadastro'; import Login from './pages/Login'; import Home from './pages/Home'; +import Perfil from './pages/Perfil'; +import PerfilEditar from './pages/PerfilEditar'; +import PerfilCompletar from './pages/PerfilCompletar'; import CadastroVan from './pages/CadastroVan'; /* Core CSS required for Ionic components to work properly */ @@ -35,27 +38,26 @@ import '@ionic/react/css/display.css'; /* Theme variables */ import './theme/variables.css'; -import Perfil from './pages/Perfil'; -import PerfilEditar from './pages/PerfilEditar'; import { search, home, person } from 'ionicons/icons'; -import { useState, useContext, useEffect } from 'react'; +import { useState, useContext } from 'react'; import React from 'react'; setupIonicReact(); const routes = ( - <> - - - - - - - - - - - ) +<> + + + + + + + + + + + +) interface IUserManager { setIsLoggedIn: Function; diff --git a/src/pages/Perfil.tsx b/src/pages/Perfil.tsx index 73b6ada..a881373 100644 --- a/src/pages/Perfil.tsx +++ b/src/pages/Perfil.tsx @@ -188,7 +188,7 @@ const Perfil: React.FC = (props) => { Editar perfil - + history.push({ pathname: '/perfil/completar', state: { userData: inputValues } })}> Completar perfil diff --git a/src/pages/PerfilCompletar.tsx b/src/pages/PerfilCompletar.tsx new file mode 100644 index 0000000..bb06f01 --- /dev/null +++ b/src/pages/PerfilCompletar.tsx @@ -0,0 +1,149 @@ +import { +IonBackButton, +IonButton, +IonButtons, +IonCard, +IonCardContent, +IonContent, +IonHeader, +IonIcon, +IonItem, +IonLabel, +IonPage, +IonTitle, +IonToolbar +} from "@ionic/react"; +import React, { useEffect, useReducer, useState } from "react"; + +import './Perfil.css' +import { useHistory, useLocation } from "react-router"; +import { bookOutline, callOutline, documentTextOutline, homeOutline, logoWhatsapp } from "ionicons/icons"; + +import isEqual from 'lodash.isequal'; + +import * as usersRoutes from '../services/api/users'; + +import './Cadastro/Cadastro.css' + +interface userData { + name: string; + lastname: string; + email: string; + birth_date: string; + bio: string; +} + +interface LocationState { + userData: userData +} + +const items = [ + // TODO, CPF e CNH + { + icon: documentTextOutline, + label: 'Documentos', + description: 'Cadastre seus documentos para que seu perfil possa ser verificado.' + }, + // TODO, telefone e WhatsApp + { + icon: callOutline, + label: 'Informações de contato', + description: 'Cadastre seu número de telefone celular que para possam contatar você.' + }, + { + icon: homeOutline, + label: 'Endereço de residência', + description: 'Diga-nos seu endereço para que possa começar a solicitar vagas.' + }, + { + icon: bookOutline, + label: 'Instituição de ensino', + description: 'Diga-nos sua IES para que possa começar a solicitar vagas.' + }, +] + +const PerfilCompletar: React.FC = () => { + const history = useHistory(); + const location = useLocation(); + + const [showToast, setShowToast] = useState(false); + const [messageToast, setMessageToast] = useState(''); + + const [userData, setUserData] = useState({ + name: '', + lastname: '', + email: '', + birth_date: '', + bio: '', + }); + + const [inputValues, setInputValues] = useReducer( + (state: any, newState: any) => ({ ...state, ...newState }), + { + name: '', + lastname: '', + email: '', + birth_date: '', + bio: '', + } + ); + + useEffect(() => { + let userData = location.state.userData + + setUserData(location.state.userData) + setInputValues({ + 'name': userData.name, + 'lastname': userData.lastname, + 'email': userData.email, + 'birth_date': userData.birth_date, + 'bio': userData.bio + }); + }, [userData]); + + const handleUpdateUserData = () => { + usersRoutes.update(inputValues).then(response => { + if (response.status === 'error') { + setMessageToast(response.message); + setShowToast(true); + + return + } + + console.log(response) + }).catch((err) => { + setMessageToast(err); + setShowToast(true); + }) + } + + return ( + + + + Completar perfil + + + + + + + + { items.map((item, index) => { + return ( + + + + {item.label} + + + {item.description} + + ) + })} + + + ); +}; + +export default PerfilCompletar; diff --git a/src/pages/PerfilEditar.tsx b/src/pages/PerfilEditar.tsx index 7287b0f..e7c8d1f 100644 --- a/src/pages/PerfilEditar.tsx +++ b/src/pages/PerfilEditar.tsx @@ -112,12 +112,6 @@ const PerfilEditar: React.FC = () => { - - - Editar perfil - - -