Compare commits

...

4 Commits

  1. 2
      package.json
  2. 376
      src/Components/Catalogos/CatTabulador/CatTabulador.tsx
  3. 13
      src/Components/Clientes/Traficos/TraficoCliente.tsx
  4. 25
      src/Components/Corresponsales/Tabulador/Tabulador.tsx
  5. 7
      src/Components/Corresponsales/TraficoCorresponsales.tsx
  6. 3
      src/Interfaces/Catalogos/ITabulador.ts
  7. 1
      src/Interfaces/Catalogos/ITabuladorConceptos.ts
  8. 4
      src/Services/Corresponsalias/Corresponsales.Tabuladores.Services.ts

@ -1,6 +1,6 @@
{
"name": "corresponsalfrontend",
"version": "1.9.0",
"version": "2.0.1",
"private": true,
"dependencies": {
"@reduxjs/toolkit": "^1.9.5",

@ -17,7 +17,9 @@ import 'react-data-table-component-extensions/dist/index.css'
import { BsPlusSquareFill } from 'react-icons/bs'
import IClientes from '../../../Interfaces/Catalogos/IClientes'
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 {}
@ -47,57 +49,97 @@ export default function CatTabuladores (props: IProps) {
const [show, setShowMsg] = useState(false)
const [msg, setMsg] = useState('')
const [DialogTabs, setDialogTabs] = useState(false)
const [ConceptoDialogTabs, setConceptoDialogTabs] = useState(false)
const [Corresponsal, setCorresponsal] = useState(0)
const [Corresponsales, setCorresponsales] = useState<ICatCorresponsales[]>([])
const [Tipo, setTipo] = useState(0)
const [Moneda, setMoneda] = useState(0)
const columnsConcepts = [
{
name: 'id',
selector: (row: ITabuladorConceptos) => row.id,
sortable: true,
},
{
name: 'Concepto',
width: '70%',
width: '55%',
selector: (row: ITabuladorConceptos) => row.concepto,
sortable: true,
},
{
name: 'Costo',
name: 'Costo Cliente',
width: '15%',
cell: (row: ITabuladorConceptos) => (
<ControlledInput
id={row.id}
value={row.costo}
postCost={(id, value) => {
postCost(id, value)
postCost(id, value, row.costoCorresponsal, row.idConcepto)
}}
/>
),
},
{
name: 'Costo Corresponsal',
width: '15%',
cell: (row: ITabuladorConceptos) => (
<ControlledInput
id={row.id}
value={row.costoCorresponsal}
postCost={(id, value) => {
postCost(id, row.costo, value, row.idConcepto)
}}
/>
),
},
{
name: 'Elimina',
width: '15%',
cell: (row: ITabuladorConceptos) => (
<div
style={{ textAlign: 'center', cursor: 'pointer' }}
onClick={() => {
setConcepto(row.id)
setConceptoDialogTabs(true)
}}
>
<IconContext.Provider value={{ color: 'red', size: '25px' }}>
<FaTimesCircle />
</IconContext.Provider>
</div>
),
},
]
const columnsTabs = [
{
name: 'id',
selector: (row: ITabulador) => row.id,
name: 'Nombre',
width: '70%',
cell: (row: ITabulador) => (
<div>
{row.nombre}
</div>
),
sortable: true,
},
{
name: 'Nombre',
width: '70%',
name: 'Editar',
width: '15%',
cell: (row: ITabulador) => (
<div
style={{ width: '450px', cursor: 'pointer' }}
style={{ textAlign: 'center', cursor: 'pointer' }}
onClick={() => {
setTabulador(row.id)
setNombreTabulador(row.nombre)
setCorresponsal(row.idCorresponsal!)
setTipo(row.tipo)
setMoneda(row.moneda)
}}
>
{row.nombre}
<IconContext.Provider value={{ color: 'blue', size: '25px' }}>
<FaPencilAlt />
</IconContext.Provider>
</div>
),
sortable: true,
},
{
name: 'Elimina',
width: '15%',
cell: (row: ITabulador) => (
<div
style={{ textAlign: 'center', cursor: 'pointer' }}
@ -115,14 +157,15 @@ export default function CatTabuladores (props: IProps) {
},
]
const postCost = (id: number, Cost: number) => {
const postCost = (id: number, costoCliente: number, costoCorresponsal: number, idConcepto: number) => {
const data: ITabuladorConceptos = {
id: id,
idTabulador: Tabulador,
idConcepto: Concepto,
idConcepto: idConcepto,
concepto: '',
costo: Cost,
costo: costoCliente,
activo: 1,
costoCorresponsal: costoCorresponsal
}
CTabDetDataService.Append(data)
.then((response) => {
@ -130,6 +173,7 @@ export default function CatTabuladores (props: IProps) {
setHeader('Confirmacion')
setMsg('La informacion se guardo corrctamente')
setShowMsg(true)
setConcepto(0)
})
.catch((e: Error) => {
setHeader('Error')
@ -160,6 +204,19 @@ export default function CatTabuladores (props: IProps) {
})
}
const deleteConcepto = () => {
CTabDetDataService.Delete(Concepto)
.then((resp) => {
if(resp.status === 200){
setHeader('Informativo')
setMsg(resp.data.respuesta)
setShowMsg(true)
setConceptoDialogTabs(false)
setDetalleConceptos(DetalleConceptos.filter(concepto => concepto.id != Concepto))
}
})
}
useEffect(() => {
CTabDetDataService.getAllConcepts()
.then((response) => {
@ -181,9 +238,19 @@ export default function CatTabuladores (props: IProps) {
setShowMsg(true)
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)
.then((response) => {
setDetalleConceptos(response.data)
@ -197,12 +264,12 @@ export default function CatTabuladores (props: IProps) {
console.log(Tabulador)
}, [Tabulador])
useEffect(() => {
useEffect(() => {//Consulta los tabuladores de un cliente
if (Cliente > 0) {
setNombreTabulador('')
setTabuladores([])
setDetalleConceptos([])
CTabDataService.GetByCustomer(Cliente)
CTabDataService.GetByCustomer(Cliente, null)
.then((response) => {
setTabuladores(response.data)
})
@ -228,12 +295,16 @@ export default function CatTabuladores (props: IProps) {
}
const saveForm = () => {
const data: ITabulador = {
id: Tabulador,
idCliente: Cliente,
nombre: NombreTabulador,
}
CTabDataService.Append(data)
if(NombreTabulador){
const data: ITabulador = {
id: Tabulador,
idCliente: Cliente,
nombre: NombreTabulador,
idCorresponsal:Corresponsal,
tipo: Tipo,
moneda: Moneda
}
CTabDataService.Append(data)
.then((response) => {
if (response.status === 200) {
setHeader('Informativo')
@ -260,22 +331,36 @@ export default function CatTabuladores (props: IProps) {
setShowMsg(true)
return
})
}else{
setHeader('Error')
setMsg('Favor de capturar el nombre del tabulador')
setShowMsg(true)
setCorresponsal(0)
return
}
}
const addConcept = () => {
const addConcept = (idConcepto: number) => {
if (Tabulador === 0) {
setHeader('Error')
setMsg('Por favor, primero seleccione el tabulador')
setShowMsg(true)
return
}
if (Concepto === 0) {
if (idConcepto === 0) {
setHeader('Error')
setMsg('Por favor, primero seleccione el concepto')
setShowMsg(true)
return
}
postCost(0, 0)
postCost(0, 0, 0, idConcepto)
}
const clearForm = () => {
setTabulador(0)
setNombreTabulador('')
setCorresponsal(0)
setConcepto(0)
}
return (
@ -283,7 +368,6 @@ export default function CatTabuladores (props: IProps) {
<Card>
<Card.Body>
<Card style={{ height: '100%' }}>
<Card.Header as='h4'>Tabuladores</Card.Header>
<Card.Body>
<Container fluid>
<Alert variant='primary'>
@ -314,68 +398,43 @@ export default function CatTabuladores (props: IProps) {
</Form.Control>
</h4>
</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>
</Alert>
<Row>
<Col xs={6}>
<Col xs={5}>
<Card style={{}}>
<Card.Header><h5>Tabuladores</h5></Card.Header>
<Card.Body>
<Card.Subtitle className='mb-2 text-muted'>
<Row>
<Col xs={2} style={{ paddingTop: '8px' }}>
Tabulador
<Col
xs={1}
style={{ textAlign: 'right', paddingTop: '5px', cursor: 'pointer' }}
onClick={() => {clearForm()}}
>
<IconContext.Provider value={{ color: 'orange', size: '25px' }}>
<FaEraser />
</IconContext.Provider>
</Col>
<Col xs={10}>
<Form.Control
type='text'
size='sm'
placeholder='Busqueda de tabulador...'
onChange={(e) => {
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 xs={1} style={{ paddingTop: '5px' }}>
<IconContext.Provider value={{ color: 'green', size: '30px' }}>
<FaSave onClick={() => saveForm()} style={{ cursor: 'pointer' }}/>
</IconContext.Provider>
</Col>
</Row>
</Card.Subtitle>
@ -391,20 +450,119 @@ export default function CatTabuladores (props: IProps) {
</Card.Body>
</Card>
</Col>
<Col xs={6}>
<Col xs={7}>
<Card style={{}}>
<Card.Header><h5>Datos del Tabulador: {NombreTabulador}</h5></Card.Header>
<Card.Body>
<Card.Subtitle className='mb-2 text-muted'>
<Row>
<Col xs={3} style={{ paddingTop: '5px' }}>Corresponsal</Col>
<Col xs={8}>
<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>
<Col style={{ paddingTop: '5px' }}>
<IconContext.Provider value={{ color: 'green', size: '30px' }}>
<FaSave onClick={() => saveForm()} style={{ cursor: 'pointer' }}/>
</IconContext.Provider>
</Col>
</Row>
<Row style={{ paddingTop: '5px' }}>
<Col xs={6}>
<Row>
<Col xs={3}>Tipo: </Col>
<Col xs={9}>
<Form>
<Form.Check
type='radio'
id='radio-Impo'
value={1}
label='Impo'
inline
name='grupo'
onChange={e => setTipo(parseInt(e.target.value))}
checked={Tipo === 1}
disabled={Tabulador===0}
/>
<Form.Check
type='radio'
id='radio-Expo'
value={2}
label='Expo'
inline
name='grupo'
onChange={e => setTipo(parseInt(e.target.value))}
checked={Tipo === 2}
disabled={Tabulador===0}
/>
</Form>
</Col>
</Row>
</Col>
<Col xs={6}>
<Row>
<Col xs={4}>Moneda:</Col>
<Col xs={8}>
<Form>
<Form.Check
type='radio'
id='radio-USD'
value={1}
label='USD'
inline
name='grupo'
onChange={e => setMoneda(parseInt(e.target.value))}
checked={Moneda === 1}
disabled={Tabulador===0}
/>
<Form.Check
type='radio'
id='radio-MXN'
value={2}
label='MXN'
inline
name='grupo'
onChange={e => setMoneda(parseInt(e.target.value))}
checked={Moneda === 2}
disabled={Tabulador===0}
/>
</Form>
</Col>
</Row>
</Col>
</Row>
<hr />
<Row>
<Col xs={2} style={{ paddingTop: '8px' }}>
Conceptos
</Col>
<Col xs={9}>
<Col xs={10}>
<Form.Control
disabled={Tabulador===0}
as='select'
onChange={(e) => setConcepto(parseInt(e.target.value))}
onChange={(e) => addConcept(parseInt(e.target.value))}
className='form-select form-select-sm'
style={{ fontSize: '17px' }}
value={Concepto}
>
<option value='0'>- Seleccione -</option>
{CatConceptos
@ -418,7 +576,7 @@ export default function CatTabuladores (props: IProps) {
: null}
</Form.Control>
</Col>
<Col style={{ paddingTop: '5px' }}>
{/* <Col style={{ paddingTop: '5px' }}>
<Form.Label
onClick={() => {
addConcept()
@ -429,7 +587,7 @@ export default function CatTabuladores (props: IProps) {
<BsPlusSquareFill />
</IconContext.Provider>
</Form.Label>
</Col>
</Col> */}
</Row>
</Card.Subtitle>
<DataTable
@ -487,6 +645,42 @@ export default function CatTabuladores (props: IProps) {
</Row>
</Modal.Footer>
</Modal>
<Modal
show={ConceptoDialogTabs}
onHide={() => {
setConceptoDialogTabs(false)
}}
size='sm'
>
<Modal.Body>
¿Esta seguro de eliminar este concepto?
</Modal.Body>
<Modal.Footer>
<Row>
<Col xs={6} style={{ textAlign: 'left', paddingRight: '100px' }}>
<Button
variant='danger'
onClick={deleteConcepto}
size='sm'
style={{ paddingRight: '20px', paddingLeft: '20px' }}
>
Si
</Button>
</Col>
<Col xs={6} style={{ textAlign: 'right' }}>
<Button
variant='secondary'
onClick={() => {
setConceptoDialogTabs(false)
}}
size='sm'
>
Cerrar
</Button>
</Col>
</Row>
</Modal.Footer>
</Modal>
<MsgInformativo
show={show}
msg={msg}

@ -957,18 +957,6 @@ export default function TraficoCliente(props:IProps){
}*/
useEffect(() => {
if (IDCliente > 0) {
CTabDataService.GetByCustomer(IDCliente)
.then((response) => {
setTabuladores(response.data)
})
.catch((e: Error) => {
setHeader('Error')
setMsg('Ocurrio un error: ' + e)
setShowMsg(true)
return
})
}
if (Clientes) {
let tmpArray: ItemList[] = []
Clientes.forEach((element) => {
@ -3275,6 +3263,7 @@ export default function TraficoCliente(props:IProps){
IDTrafico={IDTrafico}
IDTabulador={IDTabulador}
NombreCliente={NombreCliente}
IDCorresponsal={null}
closeTabulador={function (arg: boolean): void {
setShowModal(arg)
}}

@ -15,6 +15,7 @@ interface IProps {
IDCliente: number
IDTabulador: number
IDTrafico: number
IDCorresponsal: number | null
NombreCliente: string
closeTabulador: (arg: boolean) => void
cambiaPrecuenta: (IDPrecuenta: number) => void
@ -41,20 +42,14 @@ export const Tabulador: FC<IProps> = (props) => {
const [msg, setMsg] = useState('')
const columnsConcepts = [
{
name: 'id',
width: '10%',
selector: (row: ITabuladorConceptos) => row.id,
sortable: true,
},
{
name: 'Concepto',
width: '65%',
width: '60%',
selector: (row: ITabuladorConceptos) => row.concepto,
sortable: true,
},
{
name: 'Costo',
name: 'Costo Cte',
width: '15%',
cell: (row: ITabuladorConceptos) => {
return <ControlledInput id={row.id} value={row.costo.toFixed(2)} disabled={true} postCost={(id, value) => {}} />
@ -65,6 +60,18 @@ export const Tabulador: FC<IProps> = (props) => {
)*/
},
},
{
name: 'Costo Corresp',
width: '15%',
cell: (row: ITabuladorConceptos) => {
return <ControlledInput id={row.id} value={row.costoCorresponsal.toFixed(2)} disabled={true} postCost={(id, value) => {}} />
/*return row.activo === 1 ? (
<ControlledInput id={row.id} value={row.costo} disabled={true} postCost={(id, value) => {}} />
) : (
<ControlledInput id={row.id} value={0} disabled={true} postCost={(id, value) => {}} />
)*/
},
},
{
name: 'Activo',
width: '10%',
@ -134,7 +141,7 @@ export const Tabulador: FC<IProps> = (props) => {
// const postCost = (id: number, Cost: number) => {}
const GetAllTabs = () => {
CTabDataService.GetByCustomer(props.IDCliente)
CTabDataService.GetByCustomer(props.IDCliente, props.IDCorresponsal)
.then((response) => {
setTabuladores(response.data)
})

@ -1112,7 +1112,7 @@ export default function TraficoCorresponsales (props:IProps) {
useEffect(() => {
if (IDCliente > 0) {
CTabDataService.GetByCustomer(IDCliente)
CTabDataService.GetByCustomer(IDCliente, IDCorresponsal)
.then((response) => {
setTabuladores(response.data)
})
@ -1734,7 +1734,7 @@ export default function TraficoCorresponsales (props:IProps) {
<Col sm={6} md={6} lg={8}>
<Form.Label style={{ width:'100%' }}>
<IconContext.Provider value={{ color: 'blue', size: '15px' }}>
<span onClick={() => {showModalBox(10, 'modal-50w', false)}}
<span onClick={() => {showModalBox(10, 'modal-70w', false)}}
style={{ cursor: 'pointer' }}>
<FcTimeline />&nbsp;Precuenta
</span>
@ -4338,11 +4338,12 @@ export default function TraficoCorresponsales (props:IProps) {
</div>
) : null}
{LoadComponent === 10 ? (
<div style={{ height: '350px', overflow: 'scroll' }}>
<div style={{ height: '500px', overflow: 'scroll' }}>
<Tabulador
IDCliente={IDCliente}
IDTrafico={IDTrafico}
IDTabulador={IDTabulador}
IDCorresponsal={IDCorresponsal}
NombreCliente={NombreCliente}
closeTabulador={function (arg: boolean): void {
setShowModal(arg)

@ -2,4 +2,7 @@ export default interface ITabulador {
id: number,
idCliente: number
nombre: string
idCorresponsal?: number
tipo: number
moneda: number
}

@ -5,4 +5,5 @@ export default interface ITabuladorConceptos {
concepto: string,
costo: number,
activo: number
costoCorresponsal:number
}

@ -10,8 +10,8 @@ class Corresponsales_Tabuladores_DataService {
GetAll() {
return http.get<ITabulador[]>(`/Catalogos/Tabulador/getAll?id=0&IdCliente=0`);
}
GetByCustomer(IdCliente: number) {
return http.get<ITabulador[]>(`/Catalogos/Tabulador/getAll?IdCliente=${IdCliente}`);
GetByCustomer(IdCliente: number, IdCorresponsal: number | null) {
return http.get<ITabulador[]>(`/Catalogos/Tabulador/getAll?IdCliente=${IdCliente}&IdCorresponsal=${IdCorresponsal}`);
}
Append(data: ITabulador) {
return http.post<ITabulador>("/Catalogos/Tabulador/Append", data);

Loading…
Cancel
Save