diff --git a/package-lock.json b/package-lock.json index d2e89da..de4adac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,6 +14,7 @@ "@capacitor/keyboard": "1.2.2", "@capacitor/status-bar": "1.0.8", "@hookform/error-message": "^2.0.0", + "@ionic-selectable/core": "^5.0.0-alpha.13", "@ionic/react": "^6.0.0", "@ionic/react-router": "^6.0.0", "@testing-library/jest-dom": "^5.11.9", @@ -2404,6 +2405,14 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, + "node_modules/@ionic-selectable/core": { + "version": "5.0.0-alpha.13", + "resolved": "https://registry.npmjs.org/@ionic-selectable/core/-/core-5.0.0-alpha.13.tgz", + "integrity": "sha512-AdwGuPSD3Qy6uyo0jJp05JZMQr5KS1r/ojDEsyvBNjl1agxWJn7cQC0nagF29CPzaCQjwUh8qYa+FKsyCll2jA==", + "peerDependencies": { + "@ionic/core": "5.x" + } + }, "node_modules/@ionic/cli-framework-output": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/@ionic/cli-framework-output/-/cli-framework-output-2.2.3.tgz", @@ -2419,35 +2428,16 @@ } }, "node_modules/@ionic/core": { - "version": "6.0.13", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.0.13.tgz", - "integrity": "sha512-FY3+q3cIcyadQ6CWi/l/B57DlUO+MHOFCNl/4RjxCBqdwpgx1N4H2lLYGUk/V6j6AVjFNxef63hHr8z7xfTqVg==", + "version": "5.9.4", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-5.9.4.tgz", + "integrity": "sha512-Ngz9yVT6fIiGdSxxBer8uJxP4w6PasvohYpLxhtMgYiWnyIu0vZra2ui3HrYukCzUo5/SbNPiUr1l7cj1E+7qw==", + "peer": true, "dependencies": { - "@stencil/core": "^2.14.2", - "ionicons": "^6.0.0", + "@stencil/core": "^2.4.0", + "ionicons": "^5.5.3", "tslib": "^2.1.0" } }, - "node_modules/@ionic/core/node_modules/ionicons": { - "version": "6.0.1", - "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.1.tgz", - "integrity": "sha512-xQekOJsxH82O7oB+3F60zeRggCdND9pJ/k0E6IJDVUGGlCj5mlyFqNgxUimytKgstPGv3S+3EmCxjefvtGgWUg==", - "dependencies": { - "@stencil/core": "~2.12.0" - } - }, - "node_modules/@ionic/core/node_modules/ionicons/node_modules/@stencil/core": { - "version": "2.12.1", - "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.12.1.tgz", - "integrity": "sha512-u24TZ+FEvjnZt5ZgIkLjLpUNsO6Ml3mUZqwmqk81w6RWWz75hgB5p4RFI5rvuErFeh2xvMIGo+pNdG24XUBz1A==", - "bin": { - "stencil": "bin/stencil" - }, - "engines": { - "node": ">=12.10.0", - "npm": ">=6.0.0" - } - }, "node_modules/@ionic/react": { "version": "6.0.13", "resolved": "https://registry.npmjs.org/@ionic/react/-/react-6.0.13.tgz", @@ -2477,6 +2467,28 @@ "react-router-dom": "^5.0.1" } }, + "node_modules/@ionic/react/node_modules/@ionic/core": { + "version": "6.1.7", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.1.7.tgz", + "integrity": "sha512-CUbH7xtKcPejHTyMvvUJZq4GIyLbL2YflzFH+mad1PoLN4TLwFTTKTDB1oeFNqwnTzaByeBvhEWSayxCbLgvjQ==", + "dependencies": { + "@stencil/core": "^2.14.2", + "ionicons": "^6.0.0", + "tslib": "^2.1.0" + } + }, + "node_modules/@ionic/react/node_modules/@ionic/core/node_modules/@stencil/core": { + "version": "2.15.2", + "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.15.2.tgz", + "integrity": "sha512-D6dv2KAXlWt9mjC28q0s6anghQgXRn0k93suOf+4pqsv1Uq19zNJXpYL68N5GxMSiNZyMPTU4Tt2NCbut7DVGg==", + "bin": { + "stencil": "bin/stencil" + }, + "engines": { + "node": ">=12.10.0", + "npm": ">=6.0.0" + } + }, "node_modules/@ionic/react/node_modules/@stencil/core": { "version": "2.12.1", "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.12.1.tgz", @@ -3172,6 +3184,7 @@ "version": "2.14.2", "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.14.2.tgz", "integrity": "sha512-NMC5Xi8sPFJxaO4rz6CbMHuD6PteE/RJWtjrbkusmpjKRtMXkfZJPIgOrleZ4xO+vXcNyL535Ru7vUADqEsTiQ==", + "peer": true, "bin": { "stencil": "bin/stencil" }, @@ -18353,6 +18366,12 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, + "@ionic-selectable/core": { + "version": "5.0.0-alpha.13", + "resolved": "https://registry.npmjs.org/@ionic-selectable/core/-/core-5.0.0-alpha.13.tgz", + "integrity": "sha512-AdwGuPSD3Qy6uyo0jJp05JZMQr5KS1r/ojDEsyvBNjl1agxWJn7cQC0nagF29CPzaCQjwUh8qYa+FKsyCll2jA==", + "requires": {} + }, "@ionic/cli-framework-output": { "version": "2.2.3", "resolved": "https://registry.npmjs.org/@ionic/cli-framework-output/-/cli-framework-output-2.2.3.tgz", @@ -18365,30 +18384,14 @@ } }, "@ionic/core": { - "version": "6.0.13", - "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.0.13.tgz", - "integrity": "sha512-FY3+q3cIcyadQ6CWi/l/B57DlUO+MHOFCNl/4RjxCBqdwpgx1N4H2lLYGUk/V6j6AVjFNxef63hHr8z7xfTqVg==", + "version": "5.9.4", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-5.9.4.tgz", + "integrity": "sha512-Ngz9yVT6fIiGdSxxBer8uJxP4w6PasvohYpLxhtMgYiWnyIu0vZra2ui3HrYukCzUo5/SbNPiUr1l7cj1E+7qw==", + "peer": true, "requires": { - "@stencil/core": "^2.14.2", - "ionicons": "^6.0.0", + "@stencil/core": "^2.4.0", + "ionicons": "^5.5.3", "tslib": "^2.1.0" - }, - "dependencies": { - "ionicons": { - "version": "6.0.1", - "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.0.1.tgz", - "integrity": "sha512-xQekOJsxH82O7oB+3F60zeRggCdND9pJ/k0E6IJDVUGGlCj5mlyFqNgxUimytKgstPGv3S+3EmCxjefvtGgWUg==", - "requires": { - "@stencil/core": "~2.12.0" - }, - "dependencies": { - "@stencil/core": { - "version": "2.12.1", - "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.12.1.tgz", - "integrity": "sha512-u24TZ+FEvjnZt5ZgIkLjLpUNsO6Ml3mUZqwmqk81w6RWWz75hgB5p4RFI5rvuErFeh2xvMIGo+pNdG24XUBz1A==" - } - } - } } }, "@ionic/react": { @@ -18401,6 +18404,23 @@ "tslib": "*" }, "dependencies": { + "@ionic/core": { + "version": "6.1.7", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.1.7.tgz", + "integrity": "sha512-CUbH7xtKcPejHTyMvvUJZq4GIyLbL2YflzFH+mad1PoLN4TLwFTTKTDB1oeFNqwnTzaByeBvhEWSayxCbLgvjQ==", + "requires": { + "@stencil/core": "^2.14.2", + "ionicons": "^6.0.0", + "tslib": "^2.1.0" + }, + "dependencies": { + "@stencil/core": { + "version": "2.15.2", + "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.15.2.tgz", + "integrity": "sha512-D6dv2KAXlWt9mjC28q0s6anghQgXRn0k93suOf+4pqsv1Uq19zNJXpYL68N5GxMSiNZyMPTU4Tt2NCbut7DVGg==" + } + } + }, "@stencil/core": { "version": "2.12.1", "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.12.1.tgz", @@ -18934,7 +18954,8 @@ "@stencil/core": { "version": "2.14.2", "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.14.2.tgz", - "integrity": "sha512-NMC5Xi8sPFJxaO4rz6CbMHuD6PteE/RJWtjrbkusmpjKRtMXkfZJPIgOrleZ4xO+vXcNyL535Ru7vUADqEsTiQ==" + "integrity": "sha512-NMC5Xi8sPFJxaO4rz6CbMHuD6PteE/RJWtjrbkusmpjKRtMXkfZJPIgOrleZ4xO+vXcNyL535Ru7vUADqEsTiQ==", + "peer": true }, "@surma/rollup-plugin-off-main-thread": { "version": "2.2.3", diff --git a/package.json b/package.json index e51de74..58690e5 100644 --- a/package.json +++ b/package.json @@ -9,6 +9,7 @@ "@capacitor/keyboard": "1.2.2", "@capacitor/status-bar": "1.0.8", "@hookform/error-message": "^2.0.0", + "@ionic-selectable/core": "^5.0.0-alpha.13", "@ionic/react": "^6.0.0", "@ionic/react-router": "^6.0.0", "@testing-library/jest-dom": "^5.11.9", diff --git a/src/constants/routes/carsRoutes.ts b/src/constants/routes/carsRoutes.ts new file mode 100644 index 0000000..9c6f85d --- /dev/null +++ b/src/constants/routes/carsRoutes.ts @@ -0,0 +1,8 @@ +const carsRoutesDefault = '/cars'; +const carsRoutes = { + list: { + url: `${carsRoutesDefault}/list` + } +} + +export default carsRoutes; \ No newline at end of file diff --git a/src/pages/CadastroVan.tsx b/src/pages/CadastroVan.tsx index c6dd9f4..7862f9d 100644 --- a/src/pages/CadastroVan.tsx +++ b/src/pages/CadastroVan.tsx @@ -10,26 +10,33 @@ import { IonHeader, IonPage, IonToolbar, - IonText, IonTitle, IonList, IonCheckbox, - IonItemDivider, IonListHeader, + IonSelect, + IonSelectOption, } from "@ionic/react"; -import React, { useReducer, useState } from "react"; +import React, { useEffect, useReducer, useState } from "react"; import * as yup from 'yup'; import { ApiClient } from "../services/api-client.service"; +import carsService from '../services/functions/carsService' + import "./CadastroVan.css"; const CadastroVan: React.FC = () => { const [showToast, setShowToast] = useState(false); const [toastMessage, setToastMessage] = useState(""); + const [carModels, setCarModels] = useState([{ + id_model: '', + name: '' + }]); + const [inputValues, setInputValues] = useReducer( (state: any, newState: any) => ({ ...state, ...newState }), { @@ -197,6 +204,29 @@ const CadastroVan: React.FC = () => { } }; + useEffect(() => { + let isMounted = true + + const getCarsModels = async () => { + const carModelsRes = await carsService.getAllCarModels() + + if (carModelsRes.error) { + console.log('Houve um erro') + return + } + + if (carModelsRes.data) { + if (isMounted) { + setCarModels(carModelsRes.data) + } + } + } + + getCarsModels() + + return () => { isMounted = false } + }, []) + return ( @@ -223,7 +253,7 @@ const CadastroVan: React.FC = () => { /> - + {/* Marca { placeholder='Digite a Marca do Veículo' onIonInput={(e: any) => setInputValues({ carBrand: e.target.value })} /> + */} + + + Marca + + { carModels ? carModels.map((carModel, index) => { + return ({carModel.name}) + }) : <> } + diff --git a/src/services/api/cars.ts b/src/services/api/cars.ts new file mode 100644 index 0000000..b81cc93 --- /dev/null +++ b/src/services/api/cars.ts @@ -0,0 +1,25 @@ +import instance from './api'; + +import carsRoutes from '../../constants/routes/carsRoutes'; +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 list() { + updateHeader(); + + const response = await instance.get(carsRoutes.list.url, { headers: header }); + + return response.data; +} \ No newline at end of file diff --git a/src/services/functions/carsService.ts b/src/services/functions/carsService.ts new file mode 100644 index 0000000..e46855e --- /dev/null +++ b/src/services/functions/carsService.ts @@ -0,0 +1,51 @@ +import * as carsRoutes from "../api/cars"; + +interface getAllCarModelsReturn { + data?: { + id_model: string; + name: string; + }[]; + + error?: { + errorMessage: string; + } +} + +interface getAllCarModelsRes { + status?: string; + + message: string + + data?: { + id_model: string; + name: string; + }[]; + + +} + +const getAllCarModels = async (): Promise => { + try { + let res: getAllCarModelsRes = await carsRoutes.list(); + + if (res.status === "error") { + return { + error: { + errorMessage: res.message, + }, + }; + } + + return { + data: res.data, + }; + } catch (err) { + return { + error: { + errorMessage: "Por favor, autentique-se.", + }, + }; + } +}; + +export default { getAllCarModels };