|
|
@ -17,7 +17,9 @@ import 'react-data-table-component-extensions/dist/index.css' |
|
|
|
import { BsPlusSquareFill } from 'react-icons/bs' |
|
|
|
import { BsPlusSquareFill } from 'react-icons/bs' |
|
|
|
import IClientes from '../../../Interfaces/Catalogos/IClientes' |
|
|
|
import IClientes from '../../../Interfaces/Catalogos/IClientes' |
|
|
|
import { FcTimeline } from 'react-icons/fc' |
|
|
|
import { FcTimeline } from 'react-icons/fc' |
|
|
|
import { FaEraser, FaTimesCircle } from 'react-icons/fa' |
|
|
|
import { FaEraser, FaPencilAlt, FaSave, FaTimesCircle } from 'react-icons/fa' |
|
|
|
|
|
|
|
import CorresponsalesServices from '../../../Services/Catalogos/Corresponsales.Services' |
|
|
|
|
|
|
|
import ICatCorresponsales from '../../../Interfaces/Catalogos/ICatCorresponsales' |
|
|
|
|
|
|
|
|
|
|
|
interface IProps {} |
|
|
|
interface IProps {} |
|
|
|
|
|
|
|
|
|
|
@ -47,27 +49,38 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
const [show, setShowMsg] = useState(false) |
|
|
|
const [show, setShowMsg] = useState(false) |
|
|
|
const [msg, setMsg] = useState('') |
|
|
|
const [msg, setMsg] = useState('') |
|
|
|
const [DialogTabs, setDialogTabs] = useState(false) |
|
|
|
const [DialogTabs, setDialogTabs] = useState(false) |
|
|
|
|
|
|
|
const [Corresponsal, setCorresponsal] = useState(0) |
|
|
|
|
|
|
|
const [Corresponsales, setCorresponsales] = useState<ICatCorresponsales[]>([]) |
|
|
|
|
|
|
|
|
|
|
|
const columnsConcepts = [ |
|
|
|
const columnsConcepts = [ |
|
|
|
{ |
|
|
|
|
|
|
|
name: 'id', |
|
|
|
|
|
|
|
selector: (row: ITabuladorConceptos) => row.id, |
|
|
|
|
|
|
|
sortable: true, |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
{ |
|
|
|
name: 'Concepto', |
|
|
|
name: 'Concepto', |
|
|
|
width: '70%', |
|
|
|
width: '85%', |
|
|
|
selector: (row: ITabuladorConceptos) => row.concepto, |
|
|
|
selector: (row: ITabuladorConceptos) => row.concepto, |
|
|
|
sortable: true, |
|
|
|
sortable: true, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
name: 'Costo', |
|
|
|
name: 'Costo Cliente', |
|
|
|
|
|
|
|
width: '15%', |
|
|
|
cell: (row: ITabuladorConceptos) => ( |
|
|
|
cell: (row: ITabuladorConceptos) => ( |
|
|
|
<ControlledInput |
|
|
|
<ControlledInput |
|
|
|
id={row.id} |
|
|
|
id={row.id} |
|
|
|
value={row.costo} |
|
|
|
value={row.costo} |
|
|
|
postCost={(id, value) => { |
|
|
|
postCost={(id, value) => { |
|
|
|
postCost(id, value) |
|
|
|
postCost(id, value, row.costoCorresponsal) |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
), |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
|
|
|
|
name: 'Costo Corresponsal', |
|
|
|
|
|
|
|
width: '15%', |
|
|
|
|
|
|
|
cell: (row: ITabuladorConceptos) => ( |
|
|
|
|
|
|
|
<ControlledInput |
|
|
|
|
|
|
|
id={row.id} |
|
|
|
|
|
|
|
value={row.costoCorresponsal} |
|
|
|
|
|
|
|
postCost={(id, value) => { |
|
|
|
|
|
|
|
postCost(id, row.costo, value) |
|
|
|
}} |
|
|
|
}} |
|
|
|
/> |
|
|
|
/> |
|
|
|
), |
|
|
|
), |
|
|
@ -76,25 +89,32 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
|
|
|
|
|
|
|
|
const columnsTabs = [ |
|
|
|
const columnsTabs = [ |
|
|
|
{ |
|
|
|
{ |
|
|
|
name: 'id', |
|
|
|
name: 'Nombre', |
|
|
|
selector: (row: ITabulador) => row.id, |
|
|
|
width: '70%', |
|
|
|
|
|
|
|
cell: (row: ITabulador) => ( |
|
|
|
|
|
|
|
<div> |
|
|
|
|
|
|
|
{row.nombre} |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
), |
|
|
|
sortable: true, |
|
|
|
sortable: true, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
name: 'Nombre', |
|
|
|
name: 'Editar', |
|
|
|
width: '70%', |
|
|
|
width: '10%', |
|
|
|
cell: (row: ITabulador) => ( |
|
|
|
cell: (row: ITabulador) => ( |
|
|
|
<div |
|
|
|
<div |
|
|
|
style={{ width: '450px', cursor: 'pointer' }} |
|
|
|
style={{ textAlign: 'center', cursor: 'pointer' }} |
|
|
|
onClick={() => { |
|
|
|
onClick={() => { |
|
|
|
setTabulador(row.id) |
|
|
|
setTabulador(row.id) |
|
|
|
setNombreTabulador(row.nombre) |
|
|
|
setNombreTabulador(row.nombre) |
|
|
|
|
|
|
|
setCorresponsal(row.idCorresponsal!) |
|
|
|
}} |
|
|
|
}} |
|
|
|
> |
|
|
|
> |
|
|
|
{row.nombre} |
|
|
|
<IconContext.Provider value={{ color: 'blue', size: '25px' }}> |
|
|
|
|
|
|
|
<FaPencilAlt /> |
|
|
|
|
|
|
|
</IconContext.Provider> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
), |
|
|
|
), |
|
|
|
sortable: true, |
|
|
|
|
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
{ |
|
|
|
name: 'Elimina', |
|
|
|
name: 'Elimina', |
|
|
@ -115,14 +135,15 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
}, |
|
|
|
}, |
|
|
|
] |
|
|
|
] |
|
|
|
|
|
|
|
|
|
|
|
const postCost = (id: number, Cost: number) => { |
|
|
|
const postCost = (id: number, costoCliente: number, costoCorresponsal: number) => { |
|
|
|
const data: ITabuladorConceptos = { |
|
|
|
const data: ITabuladorConceptos = { |
|
|
|
id: id, |
|
|
|
id: id, |
|
|
|
idTabulador: Tabulador, |
|
|
|
idTabulador: Tabulador, |
|
|
|
idConcepto: Concepto, |
|
|
|
idConcepto: Concepto, |
|
|
|
concepto: '', |
|
|
|
concepto: '', |
|
|
|
costo: Cost, |
|
|
|
costo: costoCliente, |
|
|
|
activo: 1, |
|
|
|
activo: 1, |
|
|
|
|
|
|
|
costoCorresponsal: costoCorresponsal |
|
|
|
} |
|
|
|
} |
|
|
|
CTabDetDataService.Append(data) |
|
|
|
CTabDetDataService.Append(data) |
|
|
|
.then((response) => { |
|
|
|
.then((response) => { |
|
|
@ -130,6 +151,7 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
setHeader('Confirmacion') |
|
|
|
setHeader('Confirmacion') |
|
|
|
setMsg('La informacion se guardo corrctamente') |
|
|
|
setMsg('La informacion se guardo corrctamente') |
|
|
|
setShowMsg(true) |
|
|
|
setShowMsg(true) |
|
|
|
|
|
|
|
setConcepto(0) |
|
|
|
}) |
|
|
|
}) |
|
|
|
.catch((e: Error) => { |
|
|
|
.catch((e: Error) => { |
|
|
|
setHeader('Error') |
|
|
|
setHeader('Error') |
|
|
@ -181,9 +203,19 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
setShowMsg(true) |
|
|
|
setShowMsg(true) |
|
|
|
return |
|
|
|
return |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
CorresponsalesServices.getAll() |
|
|
|
|
|
|
|
.then((response) => { |
|
|
|
|
|
|
|
setCorresponsales(response.data) |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
.catch((e: Error) => { |
|
|
|
|
|
|
|
setHeader('Error') |
|
|
|
|
|
|
|
setMsg('Ocurrio un error: ' + e) |
|
|
|
|
|
|
|
setShowMsg(true) |
|
|
|
|
|
|
|
return |
|
|
|
|
|
|
|
}) |
|
|
|
}, []) |
|
|
|
}, []) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => {//Consulta los conceptos del tabulador
|
|
|
|
CTabDetDataService.GetDetailByIdTab(Tabulador) |
|
|
|
CTabDetDataService.GetDetailByIdTab(Tabulador) |
|
|
|
.then((response) => { |
|
|
|
.then((response) => { |
|
|
|
setDetalleConceptos(response.data) |
|
|
|
setDetalleConceptos(response.data) |
|
|
@ -197,12 +229,12 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
console.log(Tabulador) |
|
|
|
console.log(Tabulador) |
|
|
|
}, [Tabulador]) |
|
|
|
}, [Tabulador]) |
|
|
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
useEffect(() => {//Consulta los tabuladores de un cliente
|
|
|
|
if (Cliente > 0) { |
|
|
|
if (Cliente > 0) { |
|
|
|
setNombreTabulador('') |
|
|
|
setNombreTabulador('') |
|
|
|
setTabuladores([]) |
|
|
|
setTabuladores([]) |
|
|
|
setDetalleConceptos([]) |
|
|
|
setDetalleConceptos([]) |
|
|
|
CTabDataService.GetByCustomer(Cliente) |
|
|
|
CTabDataService.GetByCustomer(Cliente, null) |
|
|
|
.then((response) => { |
|
|
|
.then((response) => { |
|
|
|
setTabuladores(response.data) |
|
|
|
setTabuladores(response.data) |
|
|
|
}) |
|
|
|
}) |
|
|
@ -228,12 +260,14 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const saveForm = () => { |
|
|
|
const saveForm = () => { |
|
|
|
const data: ITabulador = { |
|
|
|
if(NombreTabulador){ |
|
|
|
id: Tabulador, |
|
|
|
const data: ITabulador = { |
|
|
|
idCliente: Cliente, |
|
|
|
id: Tabulador, |
|
|
|
nombre: NombreTabulador, |
|
|
|
idCliente: Cliente, |
|
|
|
} |
|
|
|
nombre: NombreTabulador, |
|
|
|
CTabDataService.Append(data) |
|
|
|
idCorresponsal:Corresponsal |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
CTabDataService.Append(data) |
|
|
|
.then((response) => { |
|
|
|
.then((response) => { |
|
|
|
if (response.status === 200) { |
|
|
|
if (response.status === 200) { |
|
|
|
setHeader('Informativo') |
|
|
|
setHeader('Informativo') |
|
|
@ -260,6 +294,13 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
setShowMsg(true) |
|
|
|
setShowMsg(true) |
|
|
|
return |
|
|
|
return |
|
|
|
}) |
|
|
|
}) |
|
|
|
|
|
|
|
}else{ |
|
|
|
|
|
|
|
setHeader('Error') |
|
|
|
|
|
|
|
setMsg('Favor de capturar el nombre del tabulador') |
|
|
|
|
|
|
|
setShowMsg(true) |
|
|
|
|
|
|
|
setCorresponsal(0) |
|
|
|
|
|
|
|
return |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const addConcept = () => { |
|
|
|
const addConcept = () => { |
|
|
@ -275,7 +316,14 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
setShowMsg(true) |
|
|
|
setShowMsg(true) |
|
|
|
return |
|
|
|
return |
|
|
|
} |
|
|
|
} |
|
|
|
postCost(0, 0) |
|
|
|
postCost(0, 0, 0) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const clearForm = () => { |
|
|
|
|
|
|
|
setTabulador(0) |
|
|
|
|
|
|
|
setNombreTabulador('') |
|
|
|
|
|
|
|
setCorresponsal(0) |
|
|
|
|
|
|
|
setConcepto(0) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
return ( |
|
|
@ -283,7 +331,7 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
<Card> |
|
|
|
<Card> |
|
|
|
<Card.Body> |
|
|
|
<Card.Body> |
|
|
|
<Card style={{ height: '100%' }}> |
|
|
|
<Card style={{ height: '100%' }}> |
|
|
|
<Card.Header as='h4'>Tabuladores</Card.Header> |
|
|
|
<Card.Header as='h4'>Tabuladores Clientes</Card.Header> |
|
|
|
<Card.Body> |
|
|
|
<Card.Body> |
|
|
|
<Container fluid> |
|
|
|
<Container fluid> |
|
|
|
<Alert variant='primary'> |
|
|
|
<Alert variant='primary'> |
|
|
@ -314,48 +362,6 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
</Form.Control> |
|
|
|
</Form.Control> |
|
|
|
</h4> |
|
|
|
</h4> |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
<Col |
|
|
|
|
|
|
|
xs={1} |
|
|
|
|
|
|
|
style={{ textAlign: 'right', paddingTop: '5px', cursor: 'pointer' }} |
|
|
|
|
|
|
|
onClick={() => { |
|
|
|
|
|
|
|
setTabulador(0) |
|
|
|
|
|
|
|
setNombreTabulador('') |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<IconContext.Provider value={{ color: 'orange', size: '25px' }}> |
|
|
|
|
|
|
|
<FaEraser /> |
|
|
|
|
|
|
|
</IconContext.Provider> |
|
|
|
|
|
|
|
</Col> |
|
|
|
|
|
|
|
<Col xs={1} style={{ paddingTop: '5px' }}> |
|
|
|
|
|
|
|
<div> |
|
|
|
|
|
|
|
<h5>Tabulador</h5> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</Col> |
|
|
|
|
|
|
|
<Col xs={3}> |
|
|
|
|
|
|
|
<h4> |
|
|
|
|
|
|
|
<Form.Control |
|
|
|
|
|
|
|
type='text' |
|
|
|
|
|
|
|
id='NombreTabulador' |
|
|
|
|
|
|
|
size='sm' |
|
|
|
|
|
|
|
value={NombreTabulador} |
|
|
|
|
|
|
|
onChange={(e) => { |
|
|
|
|
|
|
|
setNombreTabulador(e.target.value) |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
placeholder='Nombre del tabulador' |
|
|
|
|
|
|
|
style={{ fontSize: '18px' }} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</h4> |
|
|
|
|
|
|
|
</Col> |
|
|
|
|
|
|
|
<Col> |
|
|
|
|
|
|
|
<Button |
|
|
|
|
|
|
|
variant='primary' |
|
|
|
|
|
|
|
size='sm' |
|
|
|
|
|
|
|
style={{ paddingLeft: '10px', paddingRight: '10px' }} |
|
|
|
|
|
|
|
onClick={() => saveForm()} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
Guardar |
|
|
|
|
|
|
|
</Button> |
|
|
|
|
|
|
|
</Col> |
|
|
|
|
|
|
|
</Row> |
|
|
|
</Row> |
|
|
|
</Alert> |
|
|
|
</Alert> |
|
|
|
<Row> |
|
|
|
<Row> |
|
|
@ -364,18 +370,39 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
<Card.Body> |
|
|
|
<Card.Body> |
|
|
|
<Card.Subtitle className='mb-2 text-muted'> |
|
|
|
<Card.Subtitle className='mb-2 text-muted'> |
|
|
|
<Row> |
|
|
|
<Row> |
|
|
|
<Col xs={2} style={{ paddingTop: '8px' }}> |
|
|
|
<Col |
|
|
|
Tabulador |
|
|
|
xs={1} |
|
|
|
|
|
|
|
style={{ textAlign: 'right', paddingTop: '5px', cursor: 'pointer' }} |
|
|
|
|
|
|
|
onClick={() => {clearForm()}} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<IconContext.Provider value={{ color: 'orange', size: '25px' }}> |
|
|
|
|
|
|
|
<FaEraser /> |
|
|
|
|
|
|
|
</IconContext.Provider> |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
<Col xs={10}> |
|
|
|
<Col xs={2} style={{ paddingTop: '5px' }}> |
|
|
|
<Form.Control |
|
|
|
<div> |
|
|
|
type='text' |
|
|
|
<h5>Tabulador</h5> |
|
|
|
size='sm' |
|
|
|
</div> |
|
|
|
placeholder='Busqueda de tabulador...' |
|
|
|
</Col> |
|
|
|
onChange={(e) => { |
|
|
|
<Col xs={8}> |
|
|
|
filtraTabulador(e) |
|
|
|
<h4> |
|
|
|
}} |
|
|
|
<Form.Control |
|
|
|
/> |
|
|
|
type='text' |
|
|
|
|
|
|
|
id='NombreTabulador' |
|
|
|
|
|
|
|
size='sm' |
|
|
|
|
|
|
|
value={NombreTabulador} |
|
|
|
|
|
|
|
onChange={(e) => { |
|
|
|
|
|
|
|
setNombreTabulador(e.target.value) |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
placeholder='Ingrese el nombre del tabulador...' |
|
|
|
|
|
|
|
style={{ fontSize: '18px' }} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</h4> |
|
|
|
|
|
|
|
</Col> |
|
|
|
|
|
|
|
<Col style={{ paddingTop: '5px' }}> |
|
|
|
|
|
|
|
<IconContext.Provider value={{ color: 'green', size: '30px' }}> |
|
|
|
|
|
|
|
<FaSave onClick={() => saveForm()} style={{ cursor: 'pointer' }}/> |
|
|
|
|
|
|
|
</IconContext.Provider> |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
</Row> |
|
|
|
</Row> |
|
|
|
</Card.Subtitle> |
|
|
|
</Card.Subtitle> |
|
|
@ -395,16 +422,45 @@ export default function CatTabuladores (props: IProps) { |
|
|
|
<Card style={{}}> |
|
|
|
<Card style={{}}> |
|
|
|
<Card.Body> |
|
|
|
<Card.Body> |
|
|
|
<Card.Subtitle className='mb-2 text-muted'> |
|
|
|
<Card.Subtitle className='mb-2 text-muted'> |
|
|
|
|
|
|
|
<Row> |
|
|
|
|
|
|
|
<Col xs={3} style={{ paddingTop: '5px' }}>Corresponsal:</Col> |
|
|
|
|
|
|
|
<Col xs={9}> |
|
|
|
|
|
|
|
<Form.Control |
|
|
|
|
|
|
|
disabled={Tabulador===0} |
|
|
|
|
|
|
|
as='select' |
|
|
|
|
|
|
|
onChange={(e) => { |
|
|
|
|
|
|
|
setCorresponsal(parseInt(e.target.value)) |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
className='form-select form-select-sm' |
|
|
|
|
|
|
|
style={{ fontSize: '18px' }} |
|
|
|
|
|
|
|
value={Corresponsal} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<option value='0'>-SELECCIONE-</option> |
|
|
|
|
|
|
|
{Corresponsales |
|
|
|
|
|
|
|
? Corresponsales.map((c) => { |
|
|
|
|
|
|
|
return ( |
|
|
|
|
|
|
|
<option value={c.id} key={c.id}> |
|
|
|
|
|
|
|
{c.nombre} | {c.aduana} | {c.patente} |
|
|
|
|
|
|
|
</option> |
|
|
|
|
|
|
|
) |
|
|
|
|
|
|
|
}) |
|
|
|
|
|
|
|
: null} |
|
|
|
|
|
|
|
</Form.Control> |
|
|
|
|
|
|
|
</Col> |
|
|
|
|
|
|
|
</Row> |
|
|
|
|
|
|
|
<hr /> |
|
|
|
<Row> |
|
|
|
<Row> |
|
|
|
<Col xs={2} style={{ paddingTop: '8px' }}> |
|
|
|
<Col xs={2} style={{ paddingTop: '8px' }}> |
|
|
|
Conceptos |
|
|
|
Conceptos |
|
|
|
</Col> |
|
|
|
</Col> |
|
|
|
<Col xs={9}> |
|
|
|
<Col xs={9}> |
|
|
|
<Form.Control |
|
|
|
<Form.Control |
|
|
|
|
|
|
|
disabled={Tabulador===0} |
|
|
|
as='select' |
|
|
|
as='select' |
|
|
|
onChange={(e) => setConcepto(parseInt(e.target.value))} |
|
|
|
onChange={(e) => setConcepto(parseInt(e.target.value))} |
|
|
|
className='form-select form-select-sm' |
|
|
|
className='form-select form-select-sm' |
|
|
|
style={{ fontSize: '17px' }} |
|
|
|
style={{ fontSize: '17px' }} |
|
|
|
|
|
|
|
value={Concepto} |
|
|
|
> |
|
|
|
> |
|
|
|
<option value='0'>- Seleccione -</option> |
|
|
|
<option value='0'>- Seleccione -</option> |
|
|
|
{CatConceptos |
|
|
|
{CatConceptos |
|
|
|