alfonso
/
AOLFrontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Primer display con catalogos de informacion real

Browse Source
develop
Al Garcia 2 years ago
parent d620503e50
commit 7edbed8b50
10 changed files with 223 additions and 22 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 1
      package.json
  2. 146
      src/Components/Catalogos/CatRutas.tsx
  3. 24
      src/Components/Catalogos/CatUbicaciones.tsx
  4. 7
      src/Components/Home/Home.tsx
  5. 5
      src/Interfaces/Catalogos/ICatServicios.ts
  6. 1
      src/Interfaces/Catalogos/ICatUbicaciones.ts
  7. 16
      src/Services/Catalogos/CatServicios.Service.ts
  8. 32
      src/store/features/Catalogos/CatServiciosSlice.ts
  9. 4
      src/store/store.ts
  10. 9
      yarn.lock

1
package.json
Unescape View File

@ -17,6 +17,7 @@
"jwt-decode": "^3.1.2",
"react": "^18.2.0",
"react-bootstrap": "^2.5.0",
"react-currency-format": "^1.1.0",
"react-data-table-component": "^7.5.3",
"react-dom": "^18.2.0",
"react-icons": "^4.4.0",

146
src/Components/Catalogos/CatRutas.tsx
Unescape View File

@ -2,17 +2,24 @@ import React, { FC, useState } from 'react'
import { Alert, Card, Col, Form, Row } from 'react-bootstrap'
import { useSelector } from 'react-redux'
import { RootState } from '../../store/store'
import * as CurrencyFormat from 'react-currency-format'
interface IProps {}
export const CatRutas: FC<IProps> = (props) => {
const CatClientes = useSelector((state: RootState) => state.CatClientes.CatClientes)
const CatProveedores = useSelector((state: RootState) => state.CatProveedores.CatProveedores)
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 [IDCliente, setIDCliente] = useState(0)
const [IDProveedor, setIDProveedor] = useState(0)
const [IDTipoUnidad, setIDTipoUnidad] = useState(0)
const [IDOrigen, setIDOrigen] = useState(0)
const [IDDestino, setIDDestino] = useState(0)
const [IDServicio, setIDServicio] = useState(0)
const [Precio, setPrecio] = useState(0)
const [Costo, setCosto] = useState(0)
return (
<div>
@ -24,8 +31,8 @@ export const CatRutas: FC<IProps> = (props) => {
<Alert variant='primary'>Rutas</Alert>
</Card.Title>
<Row>
<Col xs={2}>Cliente</Col>
<Col>
<Col xs={1}>Cliente</Col>
<Col xs={4}>
<Form.Control
as='select'
onChange={(e) => {
@ -46,57 +53,130 @@ export const CatRutas: FC<IProps> = (props) => {
: null}
</Form.Control>
</Col>
<Col xs={2}>Tipo unidad</Col>
<Col>
<Col xs={1}>Servicio</Col>
<Col xs={2}>
<Form.Control
as='select'
onChange={(e) => {
setIDTipoUnidad(parseInt(e.target.value))
setIDServicio(parseInt(e.target.value))
}}
value={IDTipoUnidad}
value={IDServicio}
className='form-select form-select-sm'
>
<option value='0'>-SELECCIONE-</option>
{CatTipoUnidades
? CatTipoUnidades.map((c) => {
{CatServicios
? CatServicios.map((c) => {
return (
<option key={c.id} value={c.id}>
{c.tipoUnidad}
{c.servicio}
</option>
)
})
: null}
</Form.Control>
</Col>
<Col xs={1}>&nbsp;</Col>
<Col xs={1}>Precio</Col>
<Col xs={2}>
<CurrencyFormat
value={Precio}
displayType={'input'}
thousandSeparator={true}
prefix={'$'}
onValueChange={(values: any) => {
const { value } = values
setPrecio(value)
}}
style={{
fontSize: '18px',
backgroundColor: '#F5FFED',
border: '2px solid #25D05B',
width: '150px',
textAlign: 'right',
borderRadius: '10px',
}}
/>
</Col>
</Row>
<Row>
<Col>&nbsp;</Col>
</Row>
<Row>
<Col xs={2}>Origen</Col>
<Col>
<Col xs={1}>Proveedor</Col>
<Col xs={4}>
<Form.Control
as='select'
onChange={(e) => {
setIDOrigen(parseInt(e.target.value))
setIDProveedor(parseInt(e.target.value))
}}
value={IDOrigen}
value={IDProveedor}
className='form-select form-select-sm'
>
<option value='0'>-SELECCIONE-</option>
{CatUbicaciones
? CatUbicaciones.map((c) => {
{CatProveedores
? CatProveedores.map((c) => {
return (
<option key={c.id} value={c.id}>
{c.ubicacion}
{c.proveedor}
</option>
)
})
: null}
</Form.Control>
</Col>
<Col xs={2}>Destino</Col>
<Col>
<Col xs={4}>&nbsp;</Col>
<Col xs={1}>Costo</Col>
<Col xs={2}>
<CurrencyFormat
value={Costo}
displayType={'input'}
thousandSeparator={true}
prefix={'$'}
onValueChange={(values: any) => {
const { value } = values
setCosto(value)
}}
style={{
fontSize: '18px',
backgroundColor: '#F5FFED',
border: '2px solid #25D05B',
width: '150px',
textAlign: 'right',
borderRadius: '10px',
}}
/>
</Col>
</Row>
<Row>
<Col>&nbsp;</Col>
</Row>
<Row>
<Col xs={1}>Origen</Col>
<Col xs={2}>
<Form.Control
as='select'
onChange={(e) => {
setIDOrigen(parseInt(e.target.value))
}}
value={IDOrigen}
className='form-select form-select-sm'
>
<option value='0'>-SELECCIONE-</option>
{CatUbicaciones
? CatUbicaciones.map((c) => {
if (c.clasificacion === 1) {
return (
<option key={c.id} value={c.id}>
{c.ubicacion}
</option>
)
}
})
: null}
</Form.Control>
</Col>
<Col xs={1}>Destino</Col>
<Col xs={2}>
<Form.Control
as='select'
onChange={(e) => {
@ -108,9 +188,33 @@ export const CatRutas: FC<IProps> = (props) => {
<option value='0'>-SELECCIONE-</option>
{CatUbicaciones
? CatUbicaciones.map((c) => {
if (c.clasificacion === 2) {
return (
<option key={c.id} value={c.id}>
{c.ubicacion}
</option>
)
}
})
: null}
</Form.Control>
</Col>
<Col xs={1}>Tipo unidad</Col>
<Col xs={2}>
<Form.Control
as='select'
onChange={(e) => {
setIDTipoUnidad(parseInt(e.target.value))
}}
value={IDTipoUnidad}
className='form-select form-select-sm'
>
<option value='0'>-SELECCIONE-</option>
{CatTipoUnidades
? CatTipoUnidades.map((c) => {
return (
<option key={c.id} value={c.id}>
{c.ubicacion}
{c.tipoUnidad}
</option>
)
})
@ -118,7 +222,9 @@ export const CatRutas: FC<IProps> = (props) => {
</Form.Control>
</Col>
</Row>
<Row></Row>
<Row>
<Col>&nbsp;</Col>
</Row>
</Card.Body>
</Card>
</Col>

24
src/Components/Catalogos/CatUbicaciones.tsx
Unescape View File

@ -17,6 +17,7 @@ export const CatUbicaciones: FC<IProps> = (props) => {
const [showCatUbicacionesDialog, setShowCatUbicacionesDialog] = useState(false)
const [deleteCatUbicacionesDialog, setDeleteCatUbicacionesDialog] = useState(false)
const [IDUbicacion, setIDUbicacion] = useState(0)
const [Clasificacion, setClasificacion] = useState(0)
const [Ubicacion, setUbicacion] = useState('')
const [Search, setSearch] = useState('')
const columnsConcepts = [
@ -26,6 +27,12 @@ export const CatUbicaciones: FC<IProps> = (props) => {
selector: (row: ICatUbicaciones) => row.id,
sortable: true,
},
{
name: 'O / D',
width: '80px',
selector: (row: ICatUbicaciones) => (row.clasificacion === 1 ? 'O' : 'D'),
sortable: true,
},
{
name: 'Ubicacion',
width: '450px',
@ -71,12 +78,14 @@ export const CatUbicaciones: FC<IProps> = (props) => {
const showInfo = (data: ICatUbicaciones) => {
setIDUbicacion(data.id)
setUbicacion(data.ubicacion)
setClasificacion(data.clasificacion)
setShowCatUbicacionesDialog(true)
}
const confirmDelete = (data: ICatUbicaciones) => {
setIDUbicacion(data.id)
setUbicacion(data.ubicacion)
setClasificacion(data.clasificacion)
setDeleteCatUbicacionesDialog(true)
}
@ -93,6 +102,7 @@ export const CatUbicaciones: FC<IProps> = (props) => {
const data: ICatUbicaciones = {
id: IDUbicacion,
ubicacion: Ubicacion,
clasificacion: Clasificacion,
activo: 1,
}
DSCatUbicaciones.Append(data)
@ -166,6 +176,20 @@ export const CatUbicaciones: FC<IProps> = (props) => {
<Col xs={2}>
<Form.Control type='text' id='IDUbicacion' value={IDUbicacion} disabled size='sm' />
</Col>
<Col xs={3}>Clasificacion</Col>
<Col>
<Form.Control
as='select'
onChange={(e) => {
setClasificacion(parseInt(e.target.value))
}}
value={Clasificacion}
className='form-select form-select-sm'
>
<option value={1}>Origen</option>
<option value={2}>Destino</option>
</Form.Control>
</Col>
</Row>
<br />
<Row>

7
src/Components/Home/Home.tsx
Unescape View File

@ -6,10 +6,12 @@ import DSCatClientes from '../../Services/Catalogos/CatClientes.Services'
import DSCatProveedores from '../../Services/Catalogos/CatProveedores.Services'
import DSCatTipoUnidades from '../../Services/Catalogos/CatTipoUnidades.Services'
import DSCatUbicaciones from '../../Services/Catalogos/CatUbicaciones.Services'
import DSCatServicios from '../../Services/Catalogos/CatServicios.Service'
import { populateCatClientes } from '../../store/features/Catalogos/CatClientesSlice'
import { populateCatProveedores } from '../../store/features/Catalogos/CatProveedoresSlice'
import { populateCatTipoUnidades } from '../../store/features/Catalogos/CatTipoUnidadesSlice'
import { populateCatUbicaciones } from '../../store/features/Catalogos/CatUbicacionesSlice'
import { populateCatServicios } from '../../store/features/Catalogos/CatServiciosSlice'
interface IProps {}
@ -38,6 +40,11 @@ export const Home: FC<IProps> = (props) => {
dispatch(populateCatUbicaciones(response.data))
})
.catch((e: Error) => {})
DSCatServicios.Get()
.then((response) => {
dispatch(populateCatServicios(response.data))
})
.catch((e: Error) => {})
}
useEffect(() => {

5
src/Interfaces/Catalogos/ICatServicios.ts
Unescape View File

@ -0,0 +1,5 @@
export default interface ICatServicios {
id: number,
servicio: string,
precio: number
}

1
src/Interfaces/Catalogos/ICatUbicaciones.ts
Unescape View File

@ -1,5 +1,6 @@
export default interface ICatUbicaciones {
id: number,
ubicacion: string,
clasificacion: number
activo: number
}

16
src/Services/Catalogos/CatServicios.Service.ts
Unescape View File

@ -0,0 +1,16 @@
import http from "../../Services/Auth/config/http-common";
import ICatServicios from "../../Interfaces/Catalogos/ICatServicios";
import IRespuesta from "../../Interfaces/Respuestas/IRespuesta";
class CatServiciosDataService {
Get() {
return http.get<ICatServicios[]>("Catalogos/CatServicios/Get");
}
Append(data: ICatServicios) {
return http.post<ICatServicios>(`Catalogos/CatServicios/Append`,data);
}
Delete(id: number) {
return http.delete<IRespuesta>(`/Catalogos/CatServicios/Delete/${id}`);
}
}
export default new CatServiciosDataService();

32
src/store/features/Catalogos/CatServiciosSlice.ts
Unescape View File

@ -0,0 +1,32 @@
import { createSlice, PayloadAction } from '@reduxjs/toolkit'
import ICatServicios from '../../../Interfaces/Catalogos/ICatServicios'
const CatServicios: ICatServicios[] = []
const initialState = { CatServicios }
export const CatServiciosSlice = createSlice({
name: 'CatServicios',
initialState: initialState,
reducers: {
resetCatServicios : (state, action: PayloadAction<string>) => {
state.CatServicios = []
},
populateCatServicios : (state, action: PayloadAction<ICatServicios[]>) => {
action.payload.forEach(element => {
const index = state.CatServicios.findIndex(object => object.id === element.id)
if (index<0) state.CatServicios.push(element)
})
},
updateCatServicios : (state, action: PayloadAction<ICatServicios>) => {
const i = state.CatServicios.findIndex(_element => _element.id === action.payload.id);
if (i > -1) state.CatServicios[i] = action.payload;
else state.CatServicios.push(action.payload);
},
deleteCatServicios : (state, action: PayloadAction<number>) => {
const newArr = state.CatServicios.filter(data => data.id != action.payload);
state.CatServicios=newArr
},
},
})
export const { resetCatServicios, populateCatServicios, updateCatServicios, deleteCatServicios } = CatServiciosSlice.actions;
export default CatServiciosSlice.reducer;

4
src/store/store.ts
Unescape View File

@ -4,6 +4,7 @@ import { MenuItemsSlice } from './features/Auth/MenuItemsSlice'
import { UserProfileSlice } from './features/Auth/UserProfileSlice'
import { CatClientesSlice } from './features/Catalogos/CatClientesSlice'
import { CatProveedoresSlice } from './features/Catalogos/CatProveedoresSlice'
import { CatServiciosSlice } from './features/Catalogos/CatServiciosSlice'
import { CatTipoUnidadesSlice } from './features/Catalogos/CatTipoUnidadesSlice'
import { CatUbicacionesSlice } from './features/Catalogos/CatUbicacionesSlice'
@ -14,7 +15,8 @@ export const store = configureStore({
CatClientes: CatClientesSlice.reducer,
CatProveedores: CatProveedoresSlice.reducer,
CatTipoUnidades: CatTipoUnidadesSlice.reducer,
CatUbicaciones: CatUbicacionesSlice.reducer
CatUbicaciones: CatUbicacionesSlice.reducer,
CatServicios: CatServiciosSlice.reducer
}
})

9
yarn.lock
Unescape View File

@ -7313,7 +7313,7 @@ prop-types-extra@^1.1.0:
react-is "^16.3.2"
warning "^4.0.0"
prop-types@^15.6.2, prop-types@^15.8.1:
prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.8.1:
version "15.8.1"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@ -7426,6 +7426,13 @@ react-bootstrap@^2.5.0:
uncontrollable "^7.2.1"
warning "^4.0.3"
react-currency-format@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/react-currency-format/-/react-currency-format-1.1.0.tgz#efef7f18045fc09a987de270b144f5eec8801dab"
integrity sha512-WWrEOIp/3GbDSk1wlhFXaBc7IHGT3IwL306DHbGP3GVr4YFa0iS5hHPbKjHa0haruGL4Ly+WG4/5jBHpUtgqZg==
dependencies:
prop-types "^15.6.0"
react-data-table-component@^7.5.3:
version "7.5.3"
resolved "https://registry.yarnpkg.com/react-data-table-component/-/react-data-table-component-7.5.3.tgz#a008b4c281574cc1a81315e2c1b34107b5d18fe0"

Write Preview
Loading…
Cancel
Save