From 27daffe9875aa64efae0fb8da5f9c603ca2db186 Mon Sep 17 00:00:00 2001 From: Luis Angel Rendon Arrazola Date: Fri, 2 Jun 2023 16:33:57 -0500 Subject: [PATCH] 2-Junio-2023 --- package-lock.json | 65 +++++++++++++++++++------ package.json | 3 +- src/App.tsx | 5 +- src/Componentes/AmazonInvoice.tsx | 67 +++++++++++++++++++++----- src/Componentes/Formulario.tsx | 1 + src/Componentes/Home.tsx | 5 +- src/Componentes/Tabla.AmazonInvoice.ts | 0 src/HojasDeEstilo/AmazonInovice.css | 21 ++++++++ src/HojasDeEstilo/Formulario.css | 11 ++++- src/HojasDeEstilo/Home.css | 8 ++- yarn.lock | 38 ++++++++++----- 11 files changed, 177 insertions(+), 47 deletions(-) delete mode 100644 src/Componentes/Tabla.AmazonInvoice.ts diff --git a/package-lock.json b/package-lock.json index d3af4f0..1a4e9be 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,12 +19,13 @@ "@types/react": "^18.2.6", "@types/react-dom": "^18.2.4", "axios": "^1.4.0", - "bootstrap": "^5.2.3", + "bootstrap": "^5.3.0", "buffer": "^6.0.3", "jsonwebtoken": "^9.0.0", "jwt-decode": "^3.1.2", "react": "^18.2.0", "react-bootstrap": "^2.7.4", + "react-bootstrap-table-next": "^4.0.3", "react-dom": "^18.2.0", "react-router-dom": "^6.11.2", "react-scripts": "5.0.1", @@ -3532,9 +3533,9 @@ } }, "node_modules/@restart/ui": { - "version": "1.6.5", - "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.5.tgz", - "integrity": "sha512-kDjhH8lk+aVGc+dPb8wEBXRDx4B1WX6/pqyWi22R3Oim6KQokeLGO2g8MYzwd2/UdjsrDt+HyYFpKihLIN7+/A==", + "version": "1.6.6", + "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.6.tgz", + "integrity": "sha512-eC3puKuWE1SRYbojWHXnvCNHGgf3uzHCb6JOhnF4OXPibOIPEkR1sqDSkL643ydigxwh+ruCa1CmYHlzk7ikKA==", "dependencies": { "@babel/runtime": "^7.21.0", "@popperjs/core": "^2.11.6", @@ -5779,9 +5780,9 @@ "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" }, "node_modules/bootstrap": { - "version": "5.2.3", - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.3.tgz", - "integrity": "sha512-cEKPM+fwb3cT8NzQZYEu4HilJ3anCrWqh3CHAok1p9jXqMPsPTBhU25fBckEJHJ/p+tTxTFTsFQGM+gaHpi3QQ==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.0.tgz", + "integrity": "sha512-UnBV3E3v4STVNQdms6jSGO2CvOkjUMdDAVR2V5N4uCMdaIkaQjbcEAMqRimDHIs4uqBYzDAKCQwCB+97tJgHQw==", "funding": [ { "type": "github", @@ -5793,7 +5794,7 @@ } ], "peerDependencies": { - "@popperjs/core": "^2.11.6" + "@popperjs/core": "^2.11.7" } }, "node_modules/brace-expansion": { @@ -14726,6 +14727,22 @@ } } }, + "node_modules/react-bootstrap-table-next": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/react-bootstrap-table-next/-/react-bootstrap-table-next-4.0.3.tgz", + "integrity": "sha512-uKxC73qUdUfusRf2uzDfMiF9LvTG5vuhTZa0lbAgHWSLLLaKTsI0iHf1e4+c7gP71q8dFsp7StvkP65SxC1JRg==", + "dependencies": { + "classnames": "^2.2.5", + "react-transition-group": "^4.2.0", + "underscore": "1.9.1" + }, + "peerDependencies": { + "classnames": "^2.2.5", + "prop-types": "^15.0.0", + "react": "^16.3.0", + "react-dom": "^16.3.0" + } + }, "node_modules/react-dev-utils": { "version": "12.0.1", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz", @@ -16761,6 +16778,11 @@ "react": ">=15.0.0" } }, + "node_modules/underscore": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.9.1.tgz", + "integrity": "sha512-5/4etnCkd9c8gwgowi5/om/mYO5ajCaOgdzj/oW+0eQV9WxKBDZw5+ycmKmeaTXjInS/W0BzpGLo2xR2aBwZdg==" + }, "node_modules/unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", @@ -20225,9 +20247,9 @@ } }, "@restart/ui": { - "version": "1.6.5", - "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.5.tgz", - "integrity": "sha512-kDjhH8lk+aVGc+dPb8wEBXRDx4B1WX6/pqyWi22R3Oim6KQokeLGO2g8MYzwd2/UdjsrDt+HyYFpKihLIN7+/A==", + "version": "1.6.6", + "resolved": "https://registry.npmjs.org/@restart/ui/-/ui-1.6.6.tgz", + "integrity": "sha512-eC3puKuWE1SRYbojWHXnvCNHGgf3uzHCb6JOhnF4OXPibOIPEkR1sqDSkL643ydigxwh+ruCa1CmYHlzk7ikKA==", "requires": { "@babel/runtime": "^7.21.0", "@popperjs/core": "^2.11.6", @@ -21929,9 +21951,9 @@ "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" }, "bootstrap": { - "version": "5.2.3", - "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.3.tgz", - "integrity": "sha512-cEKPM+fwb3cT8NzQZYEu4HilJ3anCrWqh3CHAok1p9jXqMPsPTBhU25fBckEJHJ/p+tTxTFTsFQGM+gaHpi3QQ==", + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.0.tgz", + "integrity": "sha512-UnBV3E3v4STVNQdms6jSGO2CvOkjUMdDAVR2V5N4uCMdaIkaQjbcEAMqRimDHIs4uqBYzDAKCQwCB+97tJgHQw==", "requires": {} }, "brace-expansion": { @@ -28197,6 +28219,16 @@ "warning": "^4.0.3" } }, + "react-bootstrap-table-next": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/react-bootstrap-table-next/-/react-bootstrap-table-next-4.0.3.tgz", + "integrity": "sha512-uKxC73qUdUfusRf2uzDfMiF9LvTG5vuhTZa0lbAgHWSLLLaKTsI0iHf1e4+c7gP71q8dFsp7StvkP65SxC1JRg==", + "requires": { + "classnames": "^2.2.5", + "react-transition-group": "^4.2.0", + "underscore": "1.9.1" + } + }, "react-dev-utils": { "version": "12.0.1", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz", @@ -29700,6 +29732,11 @@ "react-lifecycles-compat": "^3.0.4" } }, + "underscore": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/underscore/-/underscore-1.9.1.tgz", + "integrity": "sha512-5/4etnCkd9c8gwgowi5/om/mYO5ajCaOgdzj/oW+0eQV9WxKBDZw5+ycmKmeaTXjInS/W0BzpGLo2xR2aBwZdg==" + }, "unicode-canonical-property-names-ecmascript": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz", diff --git a/package.json b/package.json index 85fdf64..bc4e484 100644 --- a/package.json +++ b/package.json @@ -14,12 +14,13 @@ "@types/react": "^18.2.6", "@types/react-dom": "^18.2.4", "axios": "^1.4.0", - "bootstrap": "^5.2.3", + "bootstrap": "^5.3.0", "buffer": "^6.0.3", "jsonwebtoken": "^9.0.0", "jwt-decode": "^3.1.2", "react": "^18.2.0", "react-bootstrap": "^2.7.4", + "react-bootstrap-table-next": "^4.0.3", "react-dom": "^18.2.0", "react-router-dom": "^6.11.2", "react-scripts": "5.0.1", diff --git a/src/App.tsx b/src/App.tsx index 5498509..213320f 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -47,7 +47,8 @@ const App: React.FC = () => { localStorage.setItem('jwtToken', response.data.token); } } catch (error) { - console.log(error); + console.log(error) + alert("Credenciales erroneas"); } finally { setIsLoading(false); } @@ -73,7 +74,7 @@ const App: React.FC = () => { } }; - checkTokenValidity(); + checkTokenValidity(); }, []); const handleLogout = () => { diff --git a/src/Componentes/AmazonInvoice.tsx b/src/Componentes/AmazonInvoice.tsx index 4e47244..b61bea0 100644 --- a/src/Componentes/AmazonInvoice.tsx +++ b/src/Componentes/AmazonInvoice.tsx @@ -2,6 +2,16 @@ import React, { useState } from 'react'; import axios from 'axios'; import '../Interfaces/InvoiceDetail' import '../Interfaces/Invoice' +import '../HojasDeEstilo/AmazonInovice.css' + + + +// import 'bootstrap/dist/css/bootstrap.min.css'; + + + // + + const AmazonInvoice: React.FC = () => { @@ -29,6 +39,8 @@ const AmazonInvoice: React.FC = () => { }; return ( + +

Amazon Invoice

{invoice && ( -
-

Master:

-

ID: {invoice.id}

-

Referencia: {invoice.referencia}

-

Fecha de la factura: {invoice.commercialInvoiceDate}

-

Fecha de creación: {invoice.fCreacion}

-

Clasificador: {invoice.clasificador}

-

Estatus: {invoice.estatus}

-

Trailer ID: {invoice.trailerId || 'N/A'}

- -

Detail

- + +
+

Master:

+
+ + + + + + + + + + + + + + + + + + + + + + +
IdReferenciaFechaFacturaFechaCreacionClasificadorEstatusTrailer Id
ID: {invoice.id}Referencia: {invoice.referencia}Fecha de la factura: {invoice.commercialInvoiceDate}Fecha de creación: {invoice.fCreacion}Clasificador: {invoice.clasificador}Estatus: {invoice.estatus}Trailer ID: {invoice.trailerId || 'N/A'}
+ + + + + {/*

Detail

*/} + @@ -70,10 +103,18 @@ const AmazonInvoice: React.FC = () => { ))}
Id Header
-
+
+ )} ); }; export default AmazonInvoice; + + + + + + + diff --git a/src/Componentes/Formulario.tsx b/src/Componentes/Formulario.tsx index 379ba54..13c3628 100644 --- a/src/Componentes/Formulario.tsx +++ b/src/Componentes/Formulario.tsx @@ -41,6 +41,7 @@ function Formulario({ handleLogin, handlePasswordReset }: FormularioProps) { return (
+

Usuario

void; @@ -12,7 +14,7 @@ interface HomeProps { const Home: React.FC = ({ user, handleLogout }) => { return (
-

BIENVENIDOS AL HOME

+ No Le Click Cerrar Sesión + {/*

BIENVENIDOS AL HOME

*/}
); }; diff --git a/src/Componentes/Tabla.AmazonInvoice.ts b/src/Componentes/Tabla.AmazonInvoice.ts deleted file mode 100644 index e69de29..0000000 diff --git a/src/HojasDeEstilo/AmazonInovice.css b/src/HojasDeEstilo/AmazonInovice.css index e69de29..adacf72 100644 --- a/src/HojasDeEstilo/AmazonInovice.css +++ b/src/HojasDeEstilo/AmazonInovice.css @@ -0,0 +1,21 @@ +.table-container { + margin-top: 20px; +} + +.table { + width: 100%; +} + +.table th { + background-color: #95c030; + text-align: center; +} + +.table td { + text-align: center; +} + +h1{ + background-color: grey; + color: white; +} \ No newline at end of file diff --git a/src/HojasDeEstilo/Formulario.css b/src/HojasDeEstilo/Formulario.css index c65cc41..3168e3f 100644 --- a/src/HojasDeEstilo/Formulario.css +++ b/src/HojasDeEstilo/Formulario.css @@ -45,8 +45,11 @@ h2 { flex-direction: column; gap: 1rem; font-size: 1rem; - color: white; - margin-top: 2rem; /* Ajusta el valor según tu necesidad */ + color: white; + margin-top: 2rem; /* A + bjusta el valor según tu necesidad */ + + } h3 { @@ -106,6 +109,10 @@ button { +.white-label { + color: white; +} + diff --git a/src/HojasDeEstilo/Home.css b/src/HojasDeEstilo/Home.css index b3ca18b..747e83e 100644 --- a/src/HojasDeEstilo/Home.css +++ b/src/HojasDeEstilo/Home.css @@ -20,7 +20,7 @@ -h1{ +.h1{ display: flex; justify-content: center; align-items: center; @@ -29,6 +29,8 @@ h1{ font-size: 3rem; background-color: rgb(255, 255, 255); text-shadow: 1px 1px #FFFFFF; + color: white; + } button{ @@ -41,4 +43,6 @@ button{ background-color: rgb(255, 255, 255); text-shadow: 1px 1px #FFFFFF; - } \ No newline at end of file + } + + \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index b5f4054..1845c55 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1783,9 +1783,9 @@ "dequal" "^2.0.2" "@restart/ui@^1.6.3": - "integrity" "sha512-kDjhH8lk+aVGc+dPb8wEBXRDx4B1WX6/pqyWi22R3Oim6KQokeLGO2g8MYzwd2/UdjsrDt+HyYFpKihLIN7+/A==" - "resolved" "https://registry.npmjs.org/@restart/ui/-/ui-1.6.5.tgz" - "version" "1.6.5" + "integrity" "sha512-eC3puKuWE1SRYbojWHXnvCNHGgf3uzHCb6JOhnF4OXPibOIPEkR1sqDSkL643ydigxwh+ruCa1CmYHlzk7ikKA==" + "resolved" "https://registry.npmjs.org/@restart/ui/-/ui-1.6.6.tgz" + "version" "1.6.6" dependencies: "@babel/runtime" "^7.21.0" "@popperjs/core" "^2.11.6" @@ -3167,10 +3167,10 @@ "resolved" "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz" "version" "1.0.0" -"bootstrap@^5.2.3": - "integrity" "sha512-cEKPM+fwb3cT8NzQZYEu4HilJ3anCrWqh3CHAok1p9jXqMPsPTBhU25fBckEJHJ/p+tTxTFTsFQGM+gaHpi3QQ==" - "resolved" "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.3.tgz" - "version" "5.2.3" +"bootstrap@^5.3.0": + "integrity" "sha512-UnBV3E3v4STVNQdms6jSGO2CvOkjUMdDAVR2V5N4uCMdaIkaQjbcEAMqRimDHIs4uqBYzDAKCQwCB+97tJgHQw==" + "resolved" "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.0.tgz" + "version" "5.3.0" "brace-expansion@^1.1.7": "integrity" "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==" @@ -3399,7 +3399,7 @@ "resolved" "https://registry.npmjs.org/cjs-module-lexer/-/cjs-module-lexer-1.2.2.tgz" "version" "1.2.2" -"classnames@^2.3.2": +"classnames@^2.2.5", "classnames@^2.3.2": "integrity" "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" "resolved" "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz" "version" "2.3.2" @@ -7780,7 +7780,7 @@ "react-is" "^16.3.2" "warning" "^4.0.0" -"prop-types@^15.6.2", "prop-types@^15.8.1": +"prop-types@^15.0.0", "prop-types@^15.6.2", "prop-types@^15.8.1": "integrity" "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==" "resolved" "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz" "version" "15.8.1" @@ -7875,6 +7875,15 @@ "regenerator-runtime" "^0.13.9" "whatwg-fetch" "^3.6.2" +"react-bootstrap-table-next@^4.0.3": + "integrity" "sha512-uKxC73qUdUfusRf2uzDfMiF9LvTG5vuhTZa0lbAgHWSLLLaKTsI0iHf1e4+c7gP71q8dFsp7StvkP65SxC1JRg==" + "resolved" "https://registry.npmjs.org/react-bootstrap-table-next/-/react-bootstrap-table-next-4.0.3.tgz" + "version" "4.0.3" + dependencies: + "classnames" "^2.2.5" + "react-transition-group" "^4.2.0" + "underscore" "1.9.1" + "react-bootstrap@^2.7.4": "integrity" "sha512-EPKPwhfbxsKsNBhJBitJwqul9fvmlYWSft6jWE2EpqhEyjhqIqNihvQo2onE5XtS+QHOavUSNmA+8Lnv5YeAyg==" "resolved" "https://registry.npmjs.org/react-bootstrap/-/react-bootstrap-2.7.4.tgz" @@ -7923,7 +7932,7 @@ "strip-ansi" "^6.0.1" "text-table" "^0.2.0" -"react-dom@^17.0.0 || ^18.0.0", "react-dom@^18.0.0", "react-dom@^18.2.0", "react-dom@>=16.14.0", "react-dom@>=16.6.0", "react-dom@>=16.8": +"react-dom@^16.3.0", "react-dom@^17.0.0 || ^18.0.0", "react-dom@^18.0.0", "react-dom@^18.2.0", "react-dom@>=16.14.0", "react-dom@>=16.6.0", "react-dom@>=16.8": "integrity" "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==" "resolved" "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz" "version" "18.2.0" @@ -8046,7 +8055,7 @@ optionalDependencies: "fsevents" "^2.3.2" -"react-transition-group@^4.4.5": +"react-transition-group@^4.2.0", "react-transition-group@^4.4.5": "integrity" "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==" "resolved" "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz" "version" "4.4.5" @@ -8056,7 +8065,7 @@ "loose-envify" "^1.4.0" "prop-types" "^15.6.2" -"react@^16.8.0 || ^17.0.0-rc.1 || ^18.0.0", "react@^17.0.0 || ^18.0.0", "react@^18.0.0", "react@^18.2.0", "react@>= 16", "react@>=0.14.0", "react@>=15.0.0", "react@>=16.14.0", "react@>=16.6.0", "react@>=16.8", "react@>=16.8.0": +"react@^16.3.0", "react@^16.8.0 || ^17.0.0-rc.1 || ^18.0.0", "react@^17.0.0 || ^18.0.0", "react@^18.0.0", "react@^18.2.0", "react@>= 16", "react@>=0.14.0", "react@>=15.0.0", "react@>=16.14.0", "react@>=16.6.0", "react@>=16.8", "react@>=16.8.0": "integrity" "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==" "resolved" "https://registry.npmjs.org/react/-/react-18.2.0.tgz" "version" "18.2.0" @@ -9239,6 +9248,11 @@ "resolved" "https://registry.npmjs.org/uncontrollable/-/uncontrollable-8.0.2.tgz" "version" "8.0.2" +"underscore@1.9.1": + "integrity" "sha512-5/4etnCkd9c8gwgowi5/om/mYO5ajCaOgdzj/oW+0eQV9WxKBDZw5+ycmKmeaTXjInS/W0BzpGLo2xR2aBwZdg==" + "resolved" "https://registry.npmjs.org/underscore/-/underscore-1.9.1.tgz" + "version" "1.9.1" + "unicode-canonical-property-names-ecmascript@^2.0.0": "integrity" "sha512-yY5PpDlfVIU5+y/BSCxAJRBIS1Zc2dDG3Ujq+sR0U+JjUevW2JhocOF+soROYDSaAezOzOKuyyixhD6mBknSmQ==" "resolved" "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz"