parent
dc30111972
commit
24b40d76c5
@ -0,0 +1,238 @@ |
|||||||
|
import React, { FC, useState } from 'react' |
||||||
|
import { Alert, Button, Card, Col, Form, Modal, Row } from 'react-bootstrap' |
||||||
|
import DataTable from 'react-data-table-component' |
||||||
|
import { IconContext } from 'react-icons' |
||||||
|
import { useDispatch, useSelector } from 'react-redux' |
||||||
|
import ICatServicios from '../../Interfaces/Catalogos/ICatServicios' |
||||||
|
import { RootState } from '../../store/store' |
||||||
|
import { BsFillPencilFill, BsFillTrashFill, BsSave } from 'react-icons/bs' |
||||||
|
import DSCatServicios from '../../Services/Catalogos/CatServicios.Service' |
||||||
|
import { updateCatServicios, deleteCatServicios } from '../../store/features/Catalogos/CatServiciosSlice' |
||||||
|
|
||||||
|
interface IProps {} |
||||||
|
|
||||||
|
export const CatServicios: FC<IProps> = (props) => { |
||||||
|
const dispatch = useDispatch() |
||||||
|
const mCatServicios = useSelector((state: RootState) => state.CatServicios.CatServicios) |
||||||
|
const [showCatClientesDialog, setShowCatClientesDialog] = useState(false) |
||||||
|
const [deleteCatClientesDialog, setDeleteCatClientesDialog] = useState(false) |
||||||
|
const [IDServicio, setIDServicio] = useState(0) |
||||||
|
const [Servicio, setServicio] = useState('') |
||||||
|
const [Search, setSearch] = useState('') |
||||||
|
const columnsConcepts = [ |
||||||
|
{ |
||||||
|
name: 'id', |
||||||
|
width: '80px', |
||||||
|
selector: (row: ICatServicios) => row.id, |
||||||
|
sortable: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: 'Servicio', |
||||||
|
width: '450px', |
||||||
|
selector: (row: ICatServicios) => row.servicio, |
||||||
|
sortable: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: 'Editar', |
||||||
|
width: '100px', |
||||||
|
cell: (row: ICatServicios) => ( |
||||||
|
<div |
||||||
|
style={{ textAlign: 'center', cursor: 'pointer' }} |
||||||
|
onClick={() => { |
||||||
|
showInfo(row) |
||||||
|
}} |
||||||
|
> |
||||||
|
<IconContext.Provider value={{ color: 'blue', size: '21px' }}> |
||||||
|
<BsFillPencilFill /> |
||||||
|
</IconContext.Provider> |
||||||
|
</div> |
||||||
|
), |
||||||
|
sortable: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: 'Elimina', |
||||||
|
width: '100px', |
||||||
|
cell: (row: ICatServicios) => ( |
||||||
|
<div |
||||||
|
style={{ textAlign: 'center', cursor: 'pointer' }} |
||||||
|
onClick={() => { |
||||||
|
confirmDelete(row) |
||||||
|
}} |
||||||
|
> |
||||||
|
<IconContext.Provider value={{ color: 'red', size: '21px' }}> |
||||||
|
<BsFillTrashFill /> |
||||||
|
</IconContext.Provider> |
||||||
|
</div> |
||||||
|
), |
||||||
|
sortable: true, |
||||||
|
}, |
||||||
|
] |
||||||
|
|
||||||
|
const showInfo = (data: ICatServicios) => { |
||||||
|
setIDServicio(data.id) |
||||||
|
setServicio(data.servicio) |
||||||
|
setShowCatClientesDialog(true) |
||||||
|
} |
||||||
|
|
||||||
|
const confirmDelete = (data: ICatServicios) => { |
||||||
|
setIDServicio(data.id) |
||||||
|
setServicio(data.servicio) |
||||||
|
setDeleteCatClientesDialog(true) |
||||||
|
} |
||||||
|
|
||||||
|
const deleteInfo = () => { |
||||||
|
DSCatServicios.Delete(IDServicio) |
||||||
|
.then((response) => { |
||||||
|
dispatch(deleteCatServicios(IDServicio)) |
||||||
|
}) |
||||||
|
.catch((e: Error) => {}) |
||||||
|
setDeleteCatClientesDialog(false) |
||||||
|
} |
||||||
|
|
||||||
|
const saveInfo = () => { |
||||||
|
const data: ICatServicios = { |
||||||
|
id: IDServicio, |
||||||
|
servicio: Servicio, |
||||||
|
activo: 1, |
||||||
|
} |
||||||
|
DSCatServicios.Append(data) |
||||||
|
.then((response) => { |
||||||
|
dispatch(updateCatServicios(response.data)) |
||||||
|
}) |
||||||
|
.catch((e: Error) => {}) |
||||||
|
setShowCatClientesDialog(false) |
||||||
|
} |
||||||
|
|
||||||
|
return ( |
||||||
|
<div> |
||||||
|
<Row> |
||||||
|
<Col xs={12}> |
||||||
|
<Card style={{}}> |
||||||
|
<Card.Body> |
||||||
|
<Card.Title style={{ textAlign: 'left' }}> |
||||||
|
<Alert variant='primary'>Servicios</Alert> |
||||||
|
</Card.Title> |
||||||
|
<Row> |
||||||
|
<Col xs={12}> |
||||||
|
<Form.Control |
||||||
|
type='text' |
||||||
|
size='sm' |
||||||
|
placeholder='Search...' |
||||||
|
onChange={(e) => { |
||||||
|
setSearch(e.target.value) |
||||||
|
}} |
||||||
|
/> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
<Row> |
||||||
|
<Col xs={12}> |
||||||
|
<DataTable |
||||||
|
noHeader |
||||||
|
defaultSortFieldId={'id'} |
||||||
|
defaultSortAsc={true} |
||||||
|
striped={true} |
||||||
|
dense={true} |
||||||
|
paginationPerPage={10} |
||||||
|
pagination |
||||||
|
highlightOnHover |
||||||
|
columns={columnsConcepts} |
||||||
|
data={mCatServicios.filter(function (row: ICatServicios) { |
||||||
|
return row.servicio.includes(Search) |
||||||
|
})} |
||||||
|
pointerOnHover |
||||||
|
/> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Card.Body> |
||||||
|
</Card> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
<Modal |
||||||
|
show={showCatClientesDialog} |
||||||
|
onHide={() => { |
||||||
|
setShowCatClientesDialog(false) |
||||||
|
}} |
||||||
|
> |
||||||
|
<Modal.Header closeButton> |
||||||
|
<Modal.Title>Catalogo: Clientes</Modal.Title> |
||||||
|
</Modal.Header> |
||||||
|
<Modal.Body> |
||||||
|
<Row> |
||||||
|
<Col xs={3}>No cliente</Col> |
||||||
|
<Col xs={2}> |
||||||
|
<Form.Control type='text' id='IDServicio' value={IDServicio} disabled size='sm' /> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
<br /> |
||||||
|
<Row> |
||||||
|
<Col xs={2}>Cliente</Col> |
||||||
|
<Col xs={10}> |
||||||
|
<Form.Control |
||||||
|
type='text' |
||||||
|
id='Servicio' |
||||||
|
value={Servicio} |
||||||
|
size='sm' |
||||||
|
onChange={(e) => { |
||||||
|
setServicio(e.target.value) |
||||||
|
}} |
||||||
|
/> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Modal.Body> |
||||||
|
<Modal.Footer> |
||||||
|
<Row> |
||||||
|
<Col xs={2}></Col> |
||||||
|
<Col xs={3}> </Col> |
||||||
|
<Col xs={3}> |
||||||
|
<Button |
||||||
|
variant='primary' |
||||||
|
onClick={() => { |
||||||
|
saveInfo() |
||||||
|
}} |
||||||
|
> |
||||||
|
Guarda |
||||||
|
</Button> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Modal.Footer> |
||||||
|
</Modal> |
||||||
|
<Modal |
||||||
|
show={deleteCatClientesDialog} |
||||||
|
onHide={() => { |
||||||
|
setDeleteCatClientesDialog(false) |
||||||
|
}} |
||||||
|
> |
||||||
|
<Modal.Header closeButton> |
||||||
|
<Modal.Title>Catalogo: Clientes</Modal.Title> |
||||||
|
</Modal.Header> |
||||||
|
<Modal.Body> |
||||||
|
<br /> |
||||||
|
<Row> |
||||||
|
<Col xs={12}> |
||||||
|
<Alert variant='warning'> |
||||||
|
¿Esta seguro de que desea eliminar el servicio: <br /> |
||||||
|
<span style={{ fontWeight: 'bold', fontSize: '20px' }}>{Servicio}</span>? |
||||||
|
</Alert> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Modal.Body> |
||||||
|
<Modal.Footer> |
||||||
|
<Row> |
||||||
|
<Col xs={2}></Col> |
||||||
|
<Col xs={3}> </Col> |
||||||
|
<Col xs={3}> |
||||||
|
<Button |
||||||
|
variant='danger' |
||||||
|
onClick={() => { |
||||||
|
deleteInfo() |
||||||
|
}} |
||||||
|
> |
||||||
|
Elimina |
||||||
|
</Button> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Modal.Footer> |
||||||
|
</Modal> |
||||||
|
</div> |
||||||
|
) |
||||||
|
} |
||||||
@ -1,525 +0,0 @@ |
|||||||
import React, { FC, useEffect, useState } from 'react' |
|
||||||
import { Alert, Button, Card, Col, Form, Modal, Row } from 'react-bootstrap' |
|
||||||
import DataTable from 'react-data-table-component' |
|
||||||
import { IconContext } from 'react-icons' |
|
||||||
import { BsFillPencilFill, BsPatchPlusFill, BsPlusSquareFill } from 'react-icons/bs' |
|
||||||
import { useSelector } from 'react-redux' |
|
||||||
import { setOriginalNode } from 'typescript' |
|
||||||
import DTOOpViajes from '../../DTOs/Operaciones/DTOViajes' |
|
||||||
import DSOpViajes from '../../Services/Operaciones/OpViajes.Services' |
|
||||||
import { RootState } from '../../store/store' |
|
||||||
|
|
||||||
interface IProps {} |
|
||||||
|
|
||||||
export const OpViajes: FC<IProps> = (props) => { |
|
||||||
const Info = JSON.parse(localStorage.getItem('tokenInfo') || '[]') |
|
||||||
const UserID = Info.UserId |
|
||||||
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 [OpViajes, setOpViajes] = useState<DTOOpViajes[]>([]) |
|
||||||
const [showTripDialog, setShowTripDialog] = useState(false) |
|
||||||
const [NoCaja, setNoCaja] = useState('') |
|
||||||
const [IDViaje, setIDViaje] = useState(0) |
|
||||||
const [IDCliente, setIDCliente] = useState(0) |
|
||||||
const [IDProveedor, setIDProveedor] = useState(0) |
|
||||||
const [IDServicio, setIDServicio] = useState(0) |
|
||||||
const [IDTipoUnidad, setIDTipoUnidad] = useState(0) |
|
||||||
const [IDOrigen, setIDOrigen] = useState(0) |
|
||||||
const [IDDestino, setIDDestino] = useState(0) |
|
||||||
const [RefAA, setRefAA] = useState('') |
|
||||||
const [PickUpNumber, setPickUpNumber] = useState('') |
|
||||||
const [Hazmat, setHazmat] = useState(0) |
|
||||||
const [Search, setSearch] = useState('') |
|
||||||
const dataConcepts = [ |
|
||||||
{ |
|
||||||
name: 'id', |
|
||||||
width: '70px', |
|
||||||
selector: (row: DTOOpViajes) => row.id, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Cliente', |
|
||||||
width: '250px', |
|
||||||
selector: (row: DTOOpViajes) => row.sCliente, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Servicio', |
|
||||||
width: '150px', |
|
||||||
selector: (row: DTOOpViajes) => row.sServicio, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Proveedor', |
|
||||||
width: '250px', |
|
||||||
selector: (row: DTOOpViajes) => row.sProveedor, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Origen', |
|
||||||
width: '150px', |
|
||||||
selector: (row: DTOOpViajes) => row.sOrigen, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Destino', |
|
||||||
width: '150px', |
|
||||||
selector: (row: DTOOpViajes) => row.sDestino, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Tipo Unidad', |
|
||||||
width: '150px', |
|
||||||
selector: (row: DTOOpViajes) => row.sTipoUnidad, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'NoCaja', |
|
||||||
width: '150px', |
|
||||||
selector: (row: DTOOpViajes) => row.noCaja, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Hazmat', |
|
||||||
width: '90px', |
|
||||||
selector: (row: DTOOpViajes) => (row.hazmat === 1 ? 'Si' : 'No'), |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Ref A.A.', |
|
||||||
width: '110px', |
|
||||||
selector: (row: DTOOpViajes) => row.refAgenciaAduanal, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'PickUp No', |
|
||||||
width: '110px', |
|
||||||
selector: (row: DTOOpViajes) => row.pickUpNumber, |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
{ |
|
||||||
name: 'Editar', |
|
||||||
width: '80px', |
|
||||||
cell: (row: DTOOpViajes) => ( |
|
||||||
<div |
|
||||||
style={{ textAlign: 'center', cursor: 'pointer' }} |
|
||||||
onClick={() => { |
|
||||||
showInfo(row) |
|
||||||
}} |
|
||||||
> |
|
||||||
<IconContext.Provider value={{ color: 'blue', size: '21px' }}> |
|
||||||
<BsFillPencilFill /> |
|
||||||
</IconContext.Provider> |
|
||||||
</div> |
|
||||||
), |
|
||||||
sortable: true, |
|
||||||
}, |
|
||||||
] |
|
||||||
|
|
||||||
const showInfo = (row: DTOOpViajes) => { |
|
||||||
setIDViaje(row.id) |
|
||||||
setRefAA(row.refAgenciaAduanal) |
|
||||||
setIDCliente(row.cliente) |
|
||||||
setIDServicio(row.servicio) |
|
||||||
setIDProveedor(row.proveedor) |
|
||||||
setIDTipoUnidad(row.tipoUnidad) |
|
||||||
setNoCaja(row.noCaja) |
|
||||||
setIDOrigen(row.origen) |
|
||||||
setIDDestino(row.destino) |
|
||||||
setHazmat(row.hazmat) |
|
||||||
setPickUpNumber(row.pickUpNumber) |
|
||||||
setShowTripDialog(true) |
|
||||||
} |
|
||||||
|
|
||||||
const newTrip = () => { |
|
||||||
setIDViaje(0) |
|
||||||
setRefAA('') |
|
||||||
setIDCliente(0) |
|
||||||
setIDServicio(0) |
|
||||||
setIDProveedor(0) |
|
||||||
setIDTipoUnidad(0) |
|
||||||
setNoCaja('') |
|
||||||
setIDOrigen(0) |
|
||||||
setIDDestino(0) |
|
||||||
setHazmat(0) |
|
||||||
setPickUpNumber('') |
|
||||||
setShowTripDialog(true) |
|
||||||
} |
|
||||||
|
|
||||||
const saveInfo = () => { |
|
||||||
const data: DTOOpViajes = { |
|
||||||
id: IDViaje, |
|
||||||
fAlta: '', |
|
||||||
usuario: UserID, |
|
||||||
fCruce: '', |
|
||||||
refAgenciaAduanal: RefAA, |
|
||||||
cliente: IDCliente, |
|
||||||
sCliente: '', |
|
||||||
proveedor: IDProveedor, |
|
||||||
sProveedor: '', |
|
||||||
tipoUnidad: IDTipoUnidad, |
|
||||||
sTipoUnidad: '', |
|
||||||
servicio: IDServicio, |
|
||||||
sServicio: '', |
|
||||||
origen: IDOrigen, |
|
||||||
sOrigen: '', |
|
||||||
destino: IDDestino, |
|
||||||
sDestino: '', |
|
||||||
hazmat: Hazmat, |
|
||||||
noCaja: NoCaja, |
|
||||||
pickUpNumber: PickUpNumber, |
|
||||||
max: true, |
|
||||||
} |
|
||||||
DSOpViajes.Append(data) |
|
||||||
.then((response) => { |
|
||||||
loadTrips() |
|
||||||
}) |
|
||||||
.catch((e: Error) => {}) |
|
||||||
} |
|
||||||
|
|
||||||
useEffect(() => { |
|
||||||
loadTrips() |
|
||||||
}, []) |
|
||||||
|
|
||||||
/* useEffect(() => { |
|
||||||
console.log(UserID) |
|
||||||
}, [UserID]) */ |
|
||||||
|
|
||||||
const loadTrips = () => { |
|
||||||
DSOpViajes.Get() |
|
||||||
.then((response) => { |
|
||||||
setOpViajes(response.data) |
|
||||||
}) |
|
||||||
.catch((e: Error) => {}) |
|
||||||
} |
|
||||||
|
|
||||||
return ( |
|
||||||
<div> |
|
||||||
<Card> |
|
||||||
<Card.Title style={{ textAlign: 'left' }}> |
|
||||||
<Alert variant='primary'> |
|
||||||
<Row> |
|
||||||
<Col xs={2} style={{ textAlign: 'right' }}> |
|
||||||
AOL : Monitor de viajes |
|
||||||
</Col> |
|
||||||
<Col xs={1} style={{ textAlign: 'left', cursor: 'pointer' }}> |
|
||||||
<div |
|
||||||
onClick={() => { |
|
||||||
newTrip() |
|
||||||
}} |
|
||||||
title='De un click aqui para crear un nuevo viaje' |
|
||||||
> |
|
||||||
<IconContext.Provider value={{ color: 'green', size: '28px' }}> |
|
||||||
<BsPlusSquareFill /> |
|
||||||
</IconContext.Provider> |
|
||||||
</div> |
|
||||||
</Col> |
|
||||||
<Col xs={9}></Col> |
|
||||||
</Row> |
|
||||||
</Alert> |
|
||||||
</Card.Title> |
|
||||||
</Card> |
|
||||||
<Row> |
|
||||||
<Col xs={12}> </Col> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<Col xs={12}> |
|
||||||
<Form.Control |
|
||||||
type='text' |
|
||||||
size='sm' |
|
||||||
placeholder='Search...' |
|
||||||
onChange={(e) => { |
|
||||||
setSearch(e.target.value) |
|
||||||
}} |
|
||||||
/> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Card> |
|
||||||
<Card.Body> |
|
||||||
<DataTable |
|
||||||
noHeader |
|
||||||
defaultSortFieldId={'id'} |
|
||||||
defaultSortAsc={true} |
|
||||||
striped={true} |
|
||||||
dense={true} |
|
||||||
paginationPerPage={10} |
|
||||||
pagination |
|
||||||
highlightOnHover |
|
||||||
columns={dataConcepts} |
|
||||||
data={OpViajes.filter(function (row: DTOOpViajes) { |
|
||||||
return ( |
|
||||||
row.sCliente.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.sProveedor.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.sOrigen.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.sDestino.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.sServicio.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.sTipoUnidad.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.noCaja.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.refAgenciaAduanal.toLowerCase().includes(Search.toLowerCase()) || |
|
||||||
row.pickUpNumber.toLowerCase().includes(Search.toLowerCase()) |
|
||||||
) |
|
||||||
})} |
|
||||||
/> |
|
||||||
</Card.Body> |
|
||||||
</Card> |
|
||||||
<Modal |
|
||||||
show={showTripDialog} |
|
||||||
onHide={() => { |
|
||||||
setShowTripDialog(false) |
|
||||||
}} |
|
||||||
> |
|
||||||
<Modal.Header closeButton></Modal.Header> |
|
||||||
<Modal.Body> |
|
||||||
<Row> |
|
||||||
<Col xs={12} style={{ textAlign: 'center', fontSize: '23px', fontWeight: 'bold', fontFamily: 'Arial' }}> |
|
||||||
<Alert variant='primary'>Informacion del viaje</Alert> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Row> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
No viaje |
|
||||||
</Col> |
|
||||||
<Col xs={2}> |
|
||||||
<Form.Control type='text' id='IDCliente' value={IDCliente} disabled size='sm' /> |
|
||||||
</Col> |
|
||||||
<Col className='dialogLabel' xs={2}> |
|
||||||
Ref AA |
|
||||||
</Col> |
|
||||||
<Col> |
|
||||||
<Form.Control |
|
||||||
type='text' |
|
||||||
id='RefAA' |
|
||||||
value={RefAA} |
|
||||||
size='sm' |
|
||||||
onChange={(e) => { |
|
||||||
setRefAA(e.target.value) |
|
||||||
}} |
|
||||||
/> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
Cliente |
|
||||||
</Col> |
|
||||||
<Col xs={9}> |
|
||||||
<Form.Control |
|
||||||
as='select' |
|
||||||
onChange={(e) => { |
|
||||||
setIDCliente(parseInt(e.target.value)) |
|
||||||
}} |
|
||||||
value={IDCliente} |
|
||||||
className='form-select form-select-sm' |
|
||||||
> |
|
||||||
<option value='0'>-SELECCIONE-</option> |
|
||||||
{CatClientes |
|
||||||
? CatClientes.map((c) => { |
|
||||||
return ( |
|
||||||
<option key={c.id} value={c.id}> |
|
||||||
{c.cliente} |
|
||||||
</option> |
|
||||||
) |
|
||||||
}) |
|
||||||
: null} |
|
||||||
</Form.Control> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
Servicio |
|
||||||
</Col> |
|
||||||
<Col xs={9}> |
|
||||||
<Form.Control |
|
||||||
as='select' |
|
||||||
onChange={(e) => { |
|
||||||
setIDServicio(parseInt(e.target.value)) |
|
||||||
}} |
|
||||||
value={IDServicio} |
|
||||||
className='form-select form-select-sm' |
|
||||||
> |
|
||||||
<option value='0'>-SELECCIONE-</option> |
|
||||||
{CatServicios |
|
||||||
? CatServicios.map((c) => { |
|
||||||
return ( |
|
||||||
<option key={c.id} value={c.id}> |
|
||||||
{c.servicio} |
|
||||||
</option> |
|
||||||
) |
|
||||||
}) |
|
||||||
: null} |
|
||||||
</Form.Control> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
Tipo Unidad |
|
||||||
</Col> |
|
||||||
<Col xs={4}> |
|
||||||
<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.tipoUnidad} |
|
||||||
</option> |
|
||||||
) |
|
||||||
}) |
|
||||||
: null} |
|
||||||
</Form.Control> |
|
||||||
</Col> |
|
||||||
<Col xs={1}>Caja</Col> |
|
||||||
<Col xs={4}> |
|
||||||
<Form.Control |
|
||||||
type='text' |
|
||||||
id='NoCaja' |
|
||||||
value={NoCaja} |
|
||||||
size='sm' |
|
||||||
onChange={(e) => { |
|
||||||
setNoCaja(e.target.value) |
|
||||||
}} |
|
||||||
/> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
Proveedor |
|
||||||
</Col> |
|
||||||
<Col xs={9}> |
|
||||||
<Form.Control |
|
||||||
as='select' |
|
||||||
onChange={(e) => { |
|
||||||
setIDProveedor(parseInt(e.target.value)) |
|
||||||
}} |
|
||||||
value={IDProveedor} |
|
||||||
className='form-select form-select-sm' |
|
||||||
> |
|
||||||
<option value='0'>-SELECCIONE-</option> |
|
||||||
{CatProveedores |
|
||||||
? CatProveedores.map((c) => { |
|
||||||
return ( |
|
||||||
<option key={c.id} value={c.id}> |
|
||||||
{c.proveedor} |
|
||||||
</option> |
|
||||||
) |
|
||||||
}) |
|
||||||
: null} |
|
||||||
</Form.Control> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
Origen |
|
||||||
</Col> |
|
||||||
<Col xs={9}> |
|
||||||
<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> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col xs={3} className='dialogLabel'> |
|
||||||
Destino |
|
||||||
</Col> |
|
||||||
<Col xs={9}> |
|
||||||
<Form.Control |
|
||||||
as='select' |
|
||||||
onChange={(e) => { |
|
||||||
setIDDestino(parseInt(e.target.value)) |
|
||||||
}} |
|
||||||
value={IDDestino} |
|
||||||
className='form-select form-select-sm' |
|
||||||
> |
|
||||||
<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> |
|
||||||
</Row> |
|
||||||
<Row style={{ paddingTop: '10px' }}> |
|
||||||
<Col className='dialogLabel' xs={3}> |
|
||||||
HAZMAT |
|
||||||
</Col> |
|
||||||
<Col sx={3}> |
|
||||||
<Form.Control |
|
||||||
as='select' |
|
||||||
onChange={(e) => { |
|
||||||
setHazmat(parseInt(e.target.value)) |
|
||||||
}} |
|
||||||
value={Hazmat} |
|
||||||
className='form-select form-select-sm' |
|
||||||
> |
|
||||||
<option value='0'>No</option> |
|
||||||
<option value='1'>Si</option> |
|
||||||
</Form.Control> |
|
||||||
</Col> |
|
||||||
<Col className='dialogLabel'>Pickup no</Col> |
|
||||||
<Col xs={4}> |
|
||||||
<Form.Control |
|
||||||
type='text' |
|
||||||
id='PickUpNumber' |
|
||||||
value={PickUpNumber} |
|
||||||
size='sm' |
|
||||||
onChange={(e) => { |
|
||||||
setPickUpNumber(e.target.value) |
|
||||||
}} |
|
||||||
/> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
</Modal.Body> |
|
||||||
<Modal.Footer> |
|
||||||
<Row> |
|
||||||
<Col xs={2}></Col> |
|
||||||
<Col xs={3}> </Col> |
|
||||||
<Col xs={3}> |
|
||||||
<Button |
|
||||||
variant='primary' |
|
||||||
onClick={() => { |
|
||||||
saveInfo() |
|
||||||
}} |
|
||||||
> |
|
||||||
Guarda |
|
||||||
</Button> |
|
||||||
</Col> |
|
||||||
</Row> |
|
||||||
</Modal.Footer> |
|
||||||
</Modal> |
|
||||||
</div> |
|
||||||
) |
|
||||||
} |
|
||||||
@ -1,5 +1,5 @@ |
|||||||
export default interface ICatServicios { |
export default interface ICatServicios { |
||||||
id: number, |
id: number, |
||||||
servicio: string, |
servicio: string, |
||||||
precio: number |
activo: number |
||||||
} |
} |
||||||
@ -0,0 +1,14 @@ |
|||||||
|
.tripHeader { |
||||||
|
font-size: large; |
||||||
|
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; |
||||||
|
} |
||||||
|
|
||||||
|
.tripField { |
||||||
|
font-size:15px; |
||||||
|
font-weight: normal; |
||||||
|
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif |
||||||
|
} |
||||||
|
|
||||||
|
.rowSplit { |
||||||
|
padding-top: '5px' |
||||||
|
} |
||||||
Loading…
Reference in new issue