diff --git a/src/pages/CadastroVan.tsx b/src/pages/CadastroVan.tsx index 4fec045..7c4bcc6 100644 --- a/src/pages/CadastroVan.tsx +++ b/src/pages/CadastroVan.tsx @@ -11,62 +11,71 @@ import { IonHeader, IonPage, IonToolbar, - IonTitle, IonText, IonRadioGroup, IonRadio } from "@ionic/react"; -import React, { useState } from "react"; +import React, { useReducer, useState } from "react"; import { ApiClient } from "../services/api-client.service"; -import { arrowBack } from "ionicons/icons"; + import "./CadastroVan.css"; - const CadastroVan: React.FC = () => { - const [showToast, setShowToast] = useState(false); const [toastMessage, setToastMessage] = useState(""); - const [carPlate, setCarPlate] = useState(""); - const [carBrand, setCarBrand] = useState(""); - const [carModel, setCarModel] = useState(""); - const [maxPassengers, setMaxPassengers] = useState(1); - const [isRent, setIsRent] = useState(false); - const [carRentalName, setCarRentalName] = useState(""); - const [postalCode, setPostalCode] = useState(""); - const [street, setStreet] = useState(""); - const [number, setNumber] = useState(""); - const [complement, setComplement] = useState(""); - const [city, setCity] = useState(""); - const [state, setState] = useState(""); + const [inputValues, setInputValues] = useReducer( + (state: any, newState: any) => ({ ...state, ...newState }), + { + carPlate: '', + carBrand: '', + carModel: '', + maxPassengers: 1, + isRent: false, + carRentalName: '', + postalCode: '', + street: '', + number: '', + complement: '', + city: '', + state: '', + } + ); const vanForm = { - carPlate, - carBrand, - carModel, - maxPassengers, - isRent, - carRentalName, + carPlate: inputValues.carPlate, + carBrand: inputValues.carBrand, + carModel: inputValues.carModel, + maxPassengers: inputValues.maxPassengers, + isRent: inputValues.isRent, + carRentalName: inputValues.carRentalName, carRentalAddress: { - postalCode, - street, - number, - complement, - city, - state + postalCode: inputValues.postalCode, + street: inputValues.street, + number: inputValues.number, + complement: inputValues.complement, + city: inputValues.city, + state: inputValues.state, } }; const clearRentalData = () => { - setCarRentalName(""); - setPostalCode(""); - setStreet(""); - setNumber(""); - setComplement(""); - setCity(""); - setState(""); + setInputValues({ + carPlate: '', + carBrand: '', + carModel: '', + maxPassengers: 1, + isRent: false, + carRentalName: '', + postalCode: '', + street: '', + number: '', + complement: '', + city: '', + state: '', + }) }; const validateForm = (): boolean => { @@ -163,12 +172,9 @@ const CadastroVan: React.FC = () => { return ( - - VanMos App v1.0 + - - Return - + @@ -183,7 +189,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite a Placa do Veículo' - onIonInput={(e: any) => setCarPlate(e.target.value)} + onIonInput={(e: any) => setInputValues({ carPlate: e.target.value })} /> @@ -193,7 +199,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite a Marca do Veículo' - onIonInput={(e: any) => setCarBrand(e.target.value)} + onIonInput={(e: any) => setInputValues({ carBrand: e.target.value })} /> @@ -203,7 +209,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o Modelo do Veículo' - onIonInput={(e: any) => setCarModel(e.target.value)} + onIonInput={(e: any) => setInputValues({ carModel: e.target.value })} /> @@ -215,7 +221,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o número máximo de passageiros' - onIonInput={(e: any) => setMaxPassengers(e.target.value)} + onIonInput={(e: any) => setInputValues({ maxPassengers: e.target.value })} /> @@ -227,7 +233,7 @@ const CadastroVan: React.FC = () => {
setIsRent(e.target.value)} + onIonChange={(e: any) => setInputValues({ isRent: e.target.value })} > Sim @@ -243,7 +249,7 @@ const CadastroVan: React.FC = () => { - {isRent && ( + {inputValues.isRent && (
Nome do Locador * @@ -251,7 +257,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o nome do locador do veículo' - onIonInput={(e: any) => setCarRentalName(e.target.value)} + onIonInput={(e: any) => setInputValues({ carRentalName: e.target.value })} /> @@ -266,7 +272,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o endereço completo do locador do veículo' - onIonInput={(e: any) => setPostalCode(e.target.value)} + onIonInput={(e: any) => setInputValues({ postalCode: e.target.value })} /> @@ -275,7 +281,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o nome da rua' - onIonInput={(e: any) => setStreet(e.target.value)} + onIonInput={(e: any) => setInputValues({ street: e.target.value })} /> @@ -285,7 +291,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o número' - onIonInput={(e: any) => setNumber(e.target.value)} + onIonInput={(e: any) => setInputValues({ number: e.target.value })} /> @@ -295,7 +301,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o endereço completo' - onIonInput={(e: any) => setComplement(e.target.value)} + onIonInput={(e: any) => setInputValues({ complement: e.target.value })} /> @@ -305,7 +311,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite a cidade' - onIonInput={(e: any) => setCity(e.target.value)} + onIonInput={(e: any) => setInputValues({ city: e.target.value })} /> @@ -315,7 +321,7 @@ const CadastroVan: React.FC = () => { type='text' clearInput placeholder='Digite o estado' - onIonInput={(e: any) => setState(e.target.value)} + onIonInput={(e: any) => setInputValues({ state: e.target.value })} />