From d62867ab69883fdff35bf225cbac31111b10676a Mon Sep 17 00:00:00 2001 From: Al Garcia Date: Tue, 30 Aug 2022 17:59:19 -0500 Subject: [PATCH] Se agrega catalogo de rutas --- src/Components/Catalogos/CatRutas.tsx | 170 +++++++++++++++++++- src/Components/Home/Home.tsx | 29 +++- src/DTOs/Catalogos/DTOCatRutas.ts | 18 +++ src/Interfaces/Catalogos/ICatRutas.ts | 12 ++ src/Services/Catalogos/CatRutas.Services.ts | 17 ++ src/store/features/Auth/MenuItemsSlice.ts | 10 +- 6 files changed, 243 insertions(+), 13 deletions(-) create mode 100644 src/DTOs/Catalogos/DTOCatRutas.ts create mode 100644 src/Interfaces/Catalogos/ICatRutas.ts create mode 100644 src/Services/Catalogos/CatRutas.Services.ts diff --git a/src/Components/Catalogos/CatRutas.tsx b/src/Components/Catalogos/CatRutas.tsx index 7d9a801..d693ada 100644 --- a/src/Components/Catalogos/CatRutas.tsx +++ b/src/Components/Catalogos/CatRutas.tsx @@ -1,8 +1,14 @@ -import React, { FC, useState } from 'react' -import { Alert, Card, Col, Form, Row } from 'react-bootstrap' +import React, { FC, useEffect, useState } from 'react' +import { Alert, Button, Card, Col, Form, Row } from 'react-bootstrap' import { useSelector } from 'react-redux' import { RootState } from '../../store/store' import * as CurrencyFormat from 'react-currency-format' +import ICatRutas from '../../Interfaces/Catalogos/ICatRutas' +import DSCatRutas from '../../Services/Catalogos/CatRutas.Services' +import DTOCatRutas from '../../DTOs/Catalogos/DTOCatRutas' +import DataTable from 'react-data-table-component' +import { IconContext } from 'react-icons' +import { BsFillPencilFill } from 'react-icons/bs' interface IProps {} @@ -12,6 +18,7 @@ export const CatRutas: FC = (props) => { const CatTipoUnidades = useSelector((state: RootState) => state.CatTipoUnidades.CatTipoUnidades) const CatUbicaciones = useSelector((state: RootState) => state.CatUbicaciones.CatUbicaciones) const CatServicios = useSelector((state: RootState) => state.CatServicios.CatServicios) + const [IDRuta, setIDRuta] = useState(0) const [IDCliente, setIDCliente] = useState(0) const [IDProveedor, setIDProveedor] = useState(0) const [IDTipoUnidad, setIDTipoUnidad] = useState(0) @@ -20,6 +27,136 @@ export const CatRutas: FC = (props) => { const [IDServicio, setIDServicio] = useState(0) const [Precio, setPrecio] = useState(0) const [Costo, setCosto] = useState(0) + const [CatRutas, setCatRutas] = useState([]) + const columnsConcepts = [ + { + name: 'id', + width: '80px', + selector: (row: DTOCatRutas) => row.id, + sortable: true, + }, + { + name: 'Cliente', + width: '300px', + selector: (row: DTOCatRutas) => row.sCliente, + sortable: true, + }, + { + name: 'Servicio', + width: '150px', + selector: (row: DTOCatRutas) => row.sServicio, + sortable: true, + }, + { + name: 'Precio', + width: '100px', + selector: (row: DTOCatRutas) => '$ ' + row.precio, + sortable: true, + }, + { + name: 'Costo', + width: '100px', + selector: (row: DTOCatRutas) => '$ ' + row.costo, + sortable: true, + }, + { + name: 'Proveedor', + width: '300px', + selector: (row: DTOCatRutas) => row.sProveedor, + sortable: true, + }, + { + name: 'Origen', + width: '150px', + selector: (row: DTOCatRutas) => row.sOrigen, + sortable: true, + }, + { + name: 'Destino', + width: '150px', + selector: (row: DTOCatRutas) => row.sDestino, + sortable: true, + }, + { + name: 'Tipo Unidad', + width: '150px', + selector: (row: DTOCatRutas) => row.sTipoUnidad, + sortable: true, + }, + { + name: 'Editar', + width: '80px', + cell: (row: DTOCatRutas) => ( +
{ + showInfo(row) + }} + > + + + +
+ ), + sortable: true, + }, + ] + + const showInfo = (row: DTOCatRutas) => { + setIDRuta(row.id) + setIDCliente(row.cliente) + setIDServicio(row.servicio) + setPrecio(row.precio) + setIDProveedor(row.proveedor) + setCosto(row.costo) + setIDOrigen(row.origen) + setIDDestino(row.destino) + setIDTipoUnidad(row.tipoUnidad) + } + + const clearForm = () => { + setIDRuta(0) + setIDCliente(0) + setIDServicio(0) + setPrecio(0) + setIDProveedor(0) + setCosto(0) + setIDOrigen(0) + setIDDestino(0) + setIDTipoUnidad(0) + } + + useEffect(() => { + loadData() + }, []) + + const loadData = () => { + DSCatRutas.Get() + .then((response) => { + setCatRutas(response.data) + }) + .catch((e: Error) => {}) + } + + const saveInfo = () => { + const data: ICatRutas = { + id: IDRuta, + cliente: IDCliente, + proveedor: IDProveedor, + tipoUnidad: IDTipoUnidad, + origen: IDOrigen, + destino: IDDestino, + servicio: IDServicio, + precio: Precio, + costo: Costo, + activo: 1, + } + DSCatRutas.Append(data) + .then((response) => { + loadData() + }) + .catch((e: Error) => {}) + } return (
@@ -223,7 +360,34 @@ export const CatRutas: FC = (props) => { -   + + + +   + + + + + + + + diff --git a/src/Components/Home/Home.tsx b/src/Components/Home/Home.tsx index 4f14078..b8d87dc 100644 --- a/src/Components/Home/Home.tsx +++ b/src/Components/Home/Home.tsx @@ -1,7 +1,8 @@ -import { FC, useEffect } from 'react' +import { FC, useEffect, useState } from 'react' import { useDispatch, useSelector } from 'react-redux' -import { Outlet } from 'react-router-dom' +import { Outlet, useNavigate } from 'react-router-dom' import { RootState } from '../../store/store' +import DSAuth from '../../Services/Auth/Auth.Services' import DSCatClientes from '../../Services/Catalogos/CatClientes.Services' import DSCatProveedores from '../../Services/Catalogos/CatProveedores.Services' import DSCatTipoUnidades from '../../Services/Catalogos/CatTipoUnidades.Services' @@ -12,14 +13,23 @@ import { populateCatProveedores } from '../../store/features/Catalogos/CatProvee import { populateCatTipoUnidades } from '../../store/features/Catalogos/CatTipoUnidadesSlice' import { populateCatUbicaciones } from '../../store/features/Catalogos/CatUbicacionesSlice' import { populateCatServicios } from '../../store/features/Catalogos/CatServiciosSlice' +import { populateUserProfile } from '../../store/features/Auth/UserProfileSlice' +import { populateMenuItems } from '../../store/features/Auth/MenuItemsSlice' interface IProps {} export const Home: FC = (props) => { const dispatch = useDispatch() + const navigate = useNavigate() const UserLogued = useSelector((state: RootState) => state.UserProfile.UserProfile.logueado) + const [token, setToken] = useState( + (window.localStorage.getItem('token') ? window.localStorage.getItem('token') : '')! + ) + const [menuStr, setMenuStr] = useState( + (window.localStorage.getItem('menu') ? window.localStorage.getItem('menu') : '')! + ) - const ValidateToken = () => { + const loadCatalogs = () => { DSCatClientes.Get() .then((response) => { dispatch(populateCatClientes(response.data)) @@ -47,8 +57,19 @@ export const Home: FC = (props) => { .catch((e: Error) => {}) } + const validateToken = () => { + DSAuth.Validate() + .then((response) => { + dispatch(populateMenuItems(JSON.parse(menuStr))) + dispatch(populateUserProfile(token)) + loadCatalogs() + navigate('/', { replace: true }) + }) + .catch((e: Error) => {}) + } + useEffect(() => { - ValidateToken() + if (!UserLogued) validateToken() }, [UserLogued]) return ( diff --git a/src/DTOs/Catalogos/DTOCatRutas.ts b/src/DTOs/Catalogos/DTOCatRutas.ts new file mode 100644 index 0000000..40c6da6 --- /dev/null +++ b/src/DTOs/Catalogos/DTOCatRutas.ts @@ -0,0 +1,18 @@ +export default interface DTOCatRutas { + id: number, + cliente: number, + sCliente: string, + servicio: number, + sServicio: string, + precio: number, + proveedor: number, + sProveedor: string, + costo: number, + origen: number, + sOrigen: string, + destino: number, + sDestino: string + tipoUnidad: number, + sTipoUnidad: string, + activo: number +} \ No newline at end of file diff --git a/src/Interfaces/Catalogos/ICatRutas.ts b/src/Interfaces/Catalogos/ICatRutas.ts new file mode 100644 index 0000000..c7abc52 --- /dev/null +++ b/src/Interfaces/Catalogos/ICatRutas.ts @@ -0,0 +1,12 @@ +export default interface ICatRutas { + id: number, + cliente: number, + proveedor: number, + servicio: number, + precio: number, + costo: number, + origen: number, + destino: number, + tipoUnidad: number, + activo: number +} \ No newline at end of file diff --git a/src/Services/Catalogos/CatRutas.Services.ts b/src/Services/Catalogos/CatRutas.Services.ts new file mode 100644 index 0000000..8f5507c --- /dev/null +++ b/src/Services/Catalogos/CatRutas.Services.ts @@ -0,0 +1,17 @@ +import http from "../../Services/Auth/config/http-common"; +import ICatRutas from "../../Interfaces/Catalogos/ICatRutas"; +import IRespuesta from "../../Interfaces/Respuestas/IRespuesta"; +import DTOCatRutas from "../../DTOs/Catalogos/DTOCatRutas"; + +class CatRutasDataService { + Get() { + return http.get("Catalogos/CatRutas/Get"); + } + Append(data: ICatRutas) { + return http.post(`Catalogos/CatRutas/Append`,data); + } + Delete(id: number) { + return http.delete(`Catalogos/CatRutas/Delete/${id}`); + } +} +export default new CatRutasDataService(); \ No newline at end of file diff --git a/src/store/features/Auth/MenuItemsSlice.ts b/src/store/features/Auth/MenuItemsSlice.ts index 3eb3e8a..74446e1 100644 --- a/src/store/features/Auth/MenuItemsSlice.ts +++ b/src/store/features/Auth/MenuItemsSlice.ts @@ -11,12 +11,10 @@ export const MenuItemsSlice = createSlice({ state.MenuItems = [] }, populateMenuItems : (state, action: PayloadAction) => { - //alert('populate IMenu '+JSON.stringify(action.payload)) - // state.MenuItems = [{ id:0, descripcion:'', padreId:0, posicion:0, url:''}] - // state.MenuItems.push(... action.payload) - action.payload.forEach(element => state.MenuItems.push(element)); - /* if (action.payload.length>0) - state.MenuItems.push(... action.payload) */ + action.payload.forEach(element => { + const index = state.MenuItems.findIndex(object => object.id === element.id) + if (index<0) state.MenuItems.push(element) + }) }, }, })