Cadastro de van agora faz requisições ao backend

src/App.tsx

@@ -17,8 +17,9 @@ import Login from './pages/Login';
 import Home from './pages/Home';
 import Perfil from './pages/Perfil';
 import PerfilEditar from './pages/PerfilEditar';
-import CadastroCompletar from './pages/CadastroCompletar/CadastroCompletar';
 import CadastroVan from './pages/CadastroVan';
+import CadastroCompletar from './pages/CadastroCompletar/CadastroCompletar';
+import CompletarDocumentos from './pages/CadastroCompletar/CompletarDocumentos';
 
 /* Core CSS required for Ionic components to work properly */
 import '@ionic/react/css/core.css';
@@ -48,11 +49,16 @@ const routes = (
 <>
   <Route exact path="/cadastro" component={Cadastro}></Route>
   <Route exact path="/login" component={Login}></Route>
+
   <Route exact path="/home" component={Home}></Route>
+
   <Route exact path="/perfil" component={Perfil}></Route>
   <Route exact path="/perfil/editar" component={PerfilEditar}></Route>
   <Route exact path="/perfil/completar" component={CadastroCompletar}></Route>
+  <Route exact path="/perfil/completar/documentos" component={CompletarDocumentos}></Route>
+
   <Route exact path="/usuario/:id" component={Perfil}></Route>
+
   <Route exact path="/cadastro-van" component={CadastroVan}></Route>
   <Route exact path="/">
     <Redirect to="/login" />

src/constants/routes/vansLocatorsRoutes.ts

@@ -0,0 +1,17 @@
+const vansRoutesDefault = '/vans/locator';
+const vansRoutes = {
+  list: {
+    url: `${vansRoutesDefault}/list`
+  },
+  getById: {
+    url: `${vansRoutesDefault}/`
+  },
+  create: {
+    url: `${vansRoutesDefault}/`
+  },
+  update: {
+    url: `${vansRoutesDefault}/edit`
+  }
+}
+
+export default vansRoutes;

src/constants/routes/vansRoutes.ts

@@ -0,0 +1,17 @@
+const vansRoutesDefault = '/vans';
+const vansRoutes = {
+  list: {
+    url: `${vansRoutesDefault}/list`
+  },
+  getById: {
+    url: `${vansRoutesDefault}/`
+  },
+  create: {
+    url: `${vansRoutesDefault}/`
+  },
+  update: {
+    url: `${vansRoutesDefault}/`
+  }
+}
+
+export default vansRoutes;

src/pages/CadastroVan.tsx

@@ -20,12 +20,12 @@ import {
 
 import React, { useEffect, useReducer, useState } from "react";
 
-import * as yup from 'yup';
-
-import { ApiClient } from "../services/api-client.service";
+// import * as yup from 'yup';
 
 import carsService from '../services/functions/carsService'
 
+import * as vansRoutes from '../services/api/vans';
+
 import "./CadastroVan.css";
 
 const CadastroVan: React.FC = () => {
@@ -43,77 +43,34 @@ const CadastroVan: React.FC = () => {
       carPlate: '',
       carBrand: '',
       carModel: '',
-      maxPassengers: 1,
-      isRent: false,
-      carRentalName: '',
-      postalCode: '',
-      street: '',
-      number: '',
-      complement: '',
-      city: '',
-      state: '',
+      seats_number: 1,
+      isRented: false,
+      locator_name: '',
+      locator_address: '',
+      locator_complement: '',
+      locator_city: '',
+      locator_state: '',
     }
   );
 
-  // TODO, yup
-  let schema = yup.object().shape({
-    carPlate: yup.string().required(),
-    carBrand: yup.string().required(),
-    carModel: yup.string().required(),
-    maxPassengers: yup.number().integer().min(1).max(100).required(),
-    isRented: yup.boolean().required(),
-    carRentalName: yup.string(), // .required(),
-    postalCode: yup.string(), // .required(),
-    street: yup.string(), // .required(),
-    number: yup.number().integer(), // .required(),
-    complement: yup.string(), // .required(),
-    city: yup.string(), // .required(),
-    state: yup.string(), // .required(),
-
-    // name: yup.string().required(),
-    // age: yup.number().required().positive().integer(),
-    // email: yup.string().email(),
-    // website: yup.string().url(),
-    // createdOn: yup.date().default(function () {
-    //   return new Date();
-    // }),
-  });
-
-  const vanForm = {
-    carPlate: inputValues.carPlate,
-    carBrand: inputValues.carBrand,
-    carModel: inputValues.carModel,
-    maxPassengers: inputValues.maxPassengers,
-    isRented: inputValues.isRented,
-    carRentalName: inputValues.carRentalName,
-    carRentalAddress: {
-      postalCode: inputValues.postalCode,
-      street: inputValues.street,
-      number: inputValues.number,
-      complement: inputValues.complement,
-      city: inputValues.city,
-      state: inputValues.state,
-    }
-  };
-
   const clearRentalData = () => {
     setInputValues({
-        carPlate: '',
-        carBrand: '',
-        carModel: '',
-        maxPassengers: 1,
-        isRent: false,
-        carRentalName: '',
-        postalCode: '',
-        street: '',
-        number: '',
-        complement: '',
-        city: '',
-        state: '',
+      carRentalName: '',
+      complement: '',
+      city: '',
+      state: '',
     })
   };
 
   const validateForm = (): boolean => {
+    const vanForm = {
+      carPlate: inputValues.carPlate,
+      carBrand: inputValues.carBrand,
+      carModel: inputValues.carModel,
+      seats_number: inputValues.seats_number,
+      isRented: inputValues.isRented,
+    };
+
     if (
       !vanForm.carPlate ||
       vanForm.carPlate.length !== 7 ||
@@ -136,12 +93,18 @@ const CadastroVan: React.FC = () => {
       return false;
     }
 
-    if (!vanForm.maxPassengers || !parseInt(`${vanForm.maxPassengers}`)) {
+    if (!vanForm.seats_number || !parseInt(`${vanForm.seats_number}`)) {
       setToastMessage("Número de passageiros inválido");
       setShowToast(true);
       return false;
     }
 
+    if ((Number)(vanForm.seats_number) < 1) {
+      setToastMessage("Número de passageiros deve ser positivo!");
+      setShowToast(true);
+      return false;
+    }
+
     if (vanForm.isRented) {
       return validateRentalForm();
     } else {
@@ -152,43 +115,32 @@ const CadastroVan: React.FC = () => {
   };
 
   const validateRentalForm = (): boolean => {
-    if (!vanForm.carRentalName) {
+    const locatorForm = {
+      locator_name: inputValues.locator_name,
+      locator_address: inputValues.locator_address,
+      locator_complement: inputValues.locator_complement,
+      locator_city: inputValues.locator_city,
+      locator_state: inputValues.locator_state,
+    }
+
+    if (!locatorForm.locator_name) {
       setToastMessage("Nome do Locador é obrigatório");
       setShowToast(true);
       return false;
     }
 
     if (
-      !vanForm.carRentalAddress.postalCode ||
-      vanForm.carRentalAddress.postalCode.length !== 8 ||
-      !vanForm.carRentalAddress.postalCode.match(/([0-9]){8}/g)
+      !locatorForm.locator_city ||
+      !locatorForm.locator_city.match(/([A-zà-úÀ-Ú])/g)
     ) {
-      setToastMessage("Cep inválido");
+      setToastMessage("Cidade inválida");
       setShowToast(true);
       return false;
     }
 
     if (
-      !vanForm.carRentalAddress.number ||
-      !parseInt(`${vanForm.carRentalAddress.number}`)
-    ) {
-      setToastMessage("Número inválido");
-      setShowToast(true);
-      return false;
-    }
-
-    if (
-      !vanForm.carRentalAddress.city ||
-      !vanForm.carRentalAddress.city.match(/([A-zà-úÀ-Ú])/g)
-    ) {
-      setToastMessage("Cidade inválido");
-      setShowToast(true);
-      return false;
-    }
-
-    if (
-      !vanForm.carRentalAddress.state ||
-      !vanForm.carRentalAddress.state.match(/([A-zà-úÀ-Ú])/g)
+      !locatorForm.locator_state ||
+      !locatorForm.locator_state.match(/([A-zà-úÀ-Ú])/g)
     ) {
       setToastMessage("Estado inválido");
       setShowToast(true);
@@ -199,9 +151,34 @@ const CadastroVan: React.FC = () => {
   };
 
   const handleSubmit = async () => {
-    if (validateForm()) {
-      await ApiClient.doPost("/cadastro-van", vanForm);
+    if (!validateForm()) {
+      return
     }
+
+    // cria registro da van
+    await vansRoutes.create({
+      plate: inputValues.carPlate,
+      brand: inputValues.carBrand,
+      model: inputValues.carModel,
+      seats_number: inputValues.seats_number,
+      locator_name: inputValues.locator_name,
+      locator_address: inputValues.locator_address,
+      locator_complement: inputValues.locator_complement,
+      locator_city: inputValues.locator_city,
+      locator_state: inputValues.locator_state
+    }).then(response => {
+      if (response.status === 'error') {
+        setToastMessage(response.message);
+        setShowToast(true);
+
+        return
+      }
+
+      console.log(response)
+    }).catch((err) => {
+      setToastMessage(err);
+      setShowToast(true);
+    })
   };
 
   useEffect(() => {
@@ -248,24 +225,15 @@ const CadastroVan: React.FC = () => {
             <IonInput
               type='text'
               clearInput
+              maxlength={7}
               placeholder='Digite a Placa do Veículo'
-              onIonInput={(e: any) => setInputValues({ carPlate: e.target.value })}
+              onIonChange={(e: any) => setInputValues({ carPlate: e.target.value })}
             />
           </IonItem>
 
-          {/* <IonItem>
-            <IonLabel position='floating'>Marca </IonLabel>
-            <IonInput
-              type='text'
-              clearInput
-              placeholder='Digite a Marca do Veículo'
-              onIonInput={(e: any) => setInputValues({ carBrand: e.target.value })}
-            />
-          </IonItem> */}
-
           <IonItem>
             <IonLabel>Marca</IonLabel>
-            <IonSelect value={inputValues.marca}>
+            <IonSelect value={inputValues.carBrand} onIonChange={(e: any) => setInputValues({ carBrand: e.target.value })}>
               { carModels ? carModels.map((carModel, index) => {
                 return (<IonSelectOption key={index} value={carModel.name}>{carModel.name}</IonSelectOption>)
               }) : <></> }
@@ -278,19 +246,20 @@ const CadastroVan: React.FC = () => {
               type='text'
               clearInput
               placeholder='Digite o Modelo do Veículo'
-              onIonInput={(e: any) => setInputValues({ carModel: e.target.value })}
+              onIonChange={(e: any) => setInputValues({ carModel: e.target.value })}
             />
           </IonItem>
 
           <IonItem>
             <IonLabel position='floating'>
-              Número Máximo de Passageiros 
+              Número de assentos
             </IonLabel>
             <IonInput
-              type='text'
+              type='number'
+              min={1}
               clearInput
-              placeholder='Digite o número máximo de passageiros'
-              onIonInput={(e: any) => setInputValues({ maxPassengers: e.target.value })}
+              placeholder='podem ser ocupados por passageiros'
+              onIonChange={(e: any) => setInputValues({ seats_number: e.target.value })}
             />
           </IonItem>
         </IonList>
@@ -313,38 +282,32 @@ const CadastroVan: React.FC = () => {
                 type='text'
                 clearInput
                 placeholder='Nome completo do Locador'
-                onIonInput={(e: any) => setInputValues({ carRentalName: e.target.value })}
+                onIonChange={(e: any) => setInputValues({ locator_name: e.target.value })}
               />
 
               <IonInput
                 type='text'
                 clearInput
                 placeholder='Endereço do locador'
-                onIonInput={(e: any) => setInputValues({ postalCode: e.target.value })}
-              />
-              <IonInput
-                type='text'
-                clearInput
-                placeholder='Número'
-                onIonInput={(e: any) => setInputValues({ number: e.target.value })}
+                onIonChange={(e: any) => setInputValues({ locator_address: e.target.value })}
               />
               <IonInput
                 type='text'
                 clearInput
                 placeholder='Complemento'
-                onIonInput={(e: any) => setInputValues({ complement: e.target.value })}
+                onIonChange={(e: any) => setInputValues({ locator_complement: e.target.value })}
               />
               <IonInput
                 type='text'
                 clearInput
                 placeholder='Cidade'
-                onIonInput={(e: any) => setInputValues({ city: e.target.value })}
+                onIonChange={(e: any) => setInputValues({ locator_city: e.target.value })}
               />
               <IonInput
                 type='text'
                 clearInput
                 placeholder='Estado'
-                onIonInput={(e: any) => setInputValues({ state: e.target.value })}
+                onIonChange={(e: any) => setInputValues({ locator_state: e.target.value })}
               />
             </IonItem>
             </div>

src/services/api/users.ts

@@ -37,9 +37,11 @@ export interface CadastroRequest {
 }
 
 export interface UpdateUserRequest {
-  name: string;
-  email: string;
-  bio: string;
+  name?: string;
+  email?: string;
+  bio?: string;
+  cpf?: string;
+  cnpj?: string;
 }
 
 // export async function get(cpf) {

src/services/api/vans.ts

@@ -0,0 +1,63 @@
+import instance from "./api";
+
+import vansRoutes from "../../constants/routes/vansRoutes";
+import { AxiosRequestHeaders } from "axios";
+import LocalStorage from "../../LocalStorage";
+
+let token: string;
+let header: AxiosRequestHeaders;
+
+function updateHeader() {
+  token = LocalStorage.getToken();
+
+  header = {
+    Accept: "application/json",
+    "Content-Type": "application/json",
+    Authorization: "Bearer " + token,
+  };
+}
+
+export async function getById(vanId: string) {
+  updateHeader();
+
+  const response = await instance.get(vansRoutes.getById.url + `/${vanId}`, {
+    headers: header,
+  });
+
+  return response.data;
+}
+
+interface CreateVanBody {
+  plate: string;
+  brand: string;
+  model: string;
+  seats_number: string;
+  locator_name: string;
+  locator_address: string;
+  locator_complement: string;
+  locator_city: string;
+  locator_state: string;
+}
+
+export async function create(CreateVanBody: CreateVanBody) {
+  updateHeader();
+
+  const response = await instance.post(vansRoutes.create.url, CreateVanBody);
+  return response.data;
+}
+
+interface UpdateVanBody {
+  brand?: string;
+  model?: string;
+  seats_number?: string;
+}
+
+export async function update(vanData: UpdateVanBody) {
+  updateHeader();
+
+  const response = await instance.patch(vansRoutes.update.url, vanData, {
+    headers: header,
+  });
+
+  return response.data;
+}

src/services/functions/usersService.ts

@@ -7,6 +7,8 @@ interface getByIdReturn {
     email: string;
     birth_date: string;
     bio: string;
+    cpf: string;
+    cnpj: string;
   },
   error?: {
     errorMessage: string;
@@ -23,6 +25,8 @@ interface getByIdRes {
     email: string;
     birth_date: string;
     bio: string;
+    cpf: string;
+    cnpj: string;
   },
 }
 

src/services/validateCpf.ts

@@ -0,0 +1,25 @@
+export default function validateCpf(cpf: string): Boolean {
+  let soma = 0, resto;
+
+  if (cpf === "00000000000") return false;
+
+  for (let i = 1; i <= 9; i++)
+    soma = soma + parseInt(cpf.substring(i - 1, i)) * (11 - i);
+
+  resto = (soma * 10) % 11;
+
+  if (resto === 10 || resto === 11) resto = 0;
+  if (resto !== parseInt(cpf.substring(9, 10))) return false;
+
+  soma = 0;
+  for (let i = 1; i <= 10; i++)
+    soma = soma + parseInt(cpf.substring(i - 1, i)) * (12 - i);
+
+  resto = (soma * 10) % 11;
+
+  if (resto === 10 || resto === 11) resto = 0;
+
+  if (resto !== parseInt(cpf.substring(10, 11))) return false;
+
+  return true;
+};