feature/reporte_cuentas_cerradas_Alen_20240220
parent
9f2f900921
commit
344dc15e6b
@ -0,0 +1,210 @@ |
|||||||
|
import { useEffect, useState } from "react"; |
||||||
|
import { Button, Card, Col, Form, Row } from "react-bootstrap"; |
||||||
|
import ReportesAlenService from "../../../Services/Reportes/ReportesAlen.Service"; |
||||||
|
import { MsgInformativo } from "../../Utils/Toast/msgInformativo"; |
||||||
|
import ClientesServices from "../../../Services/Catalogos/Clientes.Services"; |
||||||
|
import IClientes from "../../../Interfaces/Catalogos/IClientes"; |
||||||
|
import { useSelector } from "react-redux"; |
||||||
|
import { RootState } from "../../../store/store"; |
||||||
|
import ICatCorresponsales from "../../../Interfaces/Catalogos/ICatCorresponsales"; |
||||||
|
import CorresponsalesServices from "../../../Services/Catalogos/Corresponsales.Services"; |
||||||
|
import ReporteCuentasCerradasService from "../../../Services/Reportes/ReporteCuentasCerradas.Service"; |
||||||
|
export const CuentasCerradas: React.FC<{}> = () => { |
||||||
|
const [Inicio, setInicio] = useState(currentDate(-7)) |
||||||
|
const [Fin, setFin] = useState(currentDate(0)) |
||||||
|
const [show, setShowMsg] = useState(false) |
||||||
|
const [header, setHeader] = useState('') |
||||||
|
const [msg, setMsg] = useState('') |
||||||
|
const [msgColor, setMsgColor] = useState('primary') |
||||||
|
const [TipoOperacion, setTipoOperacion] = useState(0) |
||||||
|
const [IDCliente, setIDCliente] = useState(0) |
||||||
|
const [Clientes, setClientes] = useState<Array<IClientes>>() |
||||||
|
const [IDCorresponsal, setIDCorresponsal] = useState(0) |
||||||
|
const [Corresponsales, setCorresponsales] = useState<Array<ICatCorresponsales>>() |
||||||
|
|
||||||
|
function currentDate(days: number): string { |
||||||
|
var today = new Date() |
||||||
|
today.setDate(today.getDate() + days) |
||||||
|
var dd = String(today.getDate()).padStart(2, '0') |
||||||
|
var mm = String(today.getMonth() + 1).padStart(2, '0') |
||||||
|
var yyyy = today.getFullYear() |
||||||
|
return yyyy + '-' + mm + '-' + dd |
||||||
|
} |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
ClientesServices.getAllClientes(0) |
||||||
|
.then((response) => { |
||||||
|
//clientes = response.data;
|
||||||
|
setClientes(response.data) |
||||||
|
}) |
||||||
|
.catch((e: Error) => { |
||||||
|
setHeader('Error') |
||||||
|
setMsg('Ocurrio un error: ' + e) |
||||||
|
setShowMsg(true) |
||||||
|
return |
||||||
|
}) |
||||||
|
CorresponsalesServices.getAll() |
||||||
|
.then((response) => { |
||||||
|
setCorresponsales(response.data) |
||||||
|
}) |
||||||
|
.catch((e: Error) => { |
||||||
|
setHeader('Error') |
||||||
|
setMsg('Ocurrio un error: ' + e) |
||||||
|
setShowMsg(true) |
||||||
|
return |
||||||
|
}) |
||||||
|
}, []) |
||||||
|
|
||||||
|
const GetExcel = () => { |
||||||
|
if(IDCliente === 0 && IDCorresponsal === 0){ |
||||||
|
setHeader('Error') |
||||||
|
setMsg('Debe seleccionar un cliente o un corresponsal') |
||||||
|
setShowMsg(true) |
||||||
|
return |
||||||
|
} |
||||||
|
ReporteCuentasCerradasService.DownloadExcel(Inicio, Fin, TipoOperacion, IDCliente, IDCorresponsal) |
||||||
|
.then(resp => { |
||||||
|
const url = window.URL.createObjectURL(new Blob([resp.data])); |
||||||
|
const link = document.createElement('a'); |
||||||
|
link.href = url; |
||||||
|
link.setAttribute('download', `Cuentas Cerradas ${Inicio} - ${Fin}.xlsx`); |
||||||
|
document.body.appendChild(link); |
||||||
|
link.click(); |
||||||
|
}).catch(e => { |
||||||
|
setHeader('Error') |
||||||
|
setMsg('Ocurrio un error al generar el reporte. Por favor, intentelo de nuevo.') |
||||||
|
setShowMsg(true) |
||||||
|
return |
||||||
|
}) |
||||||
|
} |
||||||
|
return( |
||||||
|
<> |
||||||
|
<Row style={{height:'90vh'}} className="align-items-center justify-content-center"> |
||||||
|
<Col xs={6}> |
||||||
|
<Card style={{width:'100%'}}> |
||||||
|
<Card.Header><h4>Reporte de Cuentas Cerradas</h4></Card.Header> |
||||||
|
<Card.Body> |
||||||
|
<Row> |
||||||
|
<Col xs={3}> |
||||||
|
<Form.Label style={{width:'100%'}}> |
||||||
|
Inicio
|
||||||
|
<Form.Control |
||||||
|
defaultValue={Inicio} |
||||||
|
type='date' |
||||||
|
name='Inicio' |
||||||
|
placeholder='Inicio' |
||||||
|
title='Inicio' |
||||||
|
alt='Inicio' |
||||||
|
data-date-format='YYYY-mm-dd' |
||||||
|
onChange={(e) => setInicio(e.target.value)} |
||||||
|
size='sm' |
||||||
|
/> |
||||||
|
</Form.Label> |
||||||
|
</Col> |
||||||
|
<Col xs={3}> |
||||||
|
<Form.Label style={{width:'100%'}}> |
||||||
|
Fin |
||||||
|
<Form.Control |
||||||
|
defaultValue={Fin} |
||||||
|
type='date' |
||||||
|
name='Fin' |
||||||
|
placeholder='Fin' |
||||||
|
title='Fin' |
||||||
|
alt='Fin' |
||||||
|
onChange={(e) => setFin(e.target.value)} |
||||||
|
size='sm' |
||||||
|
/> |
||||||
|
</Form.Label> |
||||||
|
</Col> |
||||||
|
<Col xs={3}> |
||||||
|
<Form.Label style={{width:'100%'}}> |
||||||
|
Tipo de Operación |
||||||
|
<Form.Control |
||||||
|
as="select" |
||||||
|
onChange={(e) => |
||||||
|
setTipoOperacion(parseInt(e.target.value)) |
||||||
|
} |
||||||
|
value={TipoOperacion} |
||||||
|
className="form-select form-select-sm" |
||||||
|
> |
||||||
|
<option value="0">--Seleccione--</option> |
||||||
|
<option value="1">Importacion</option> |
||||||
|
<option value="2">Exportacion</option> |
||||||
|
</Form.Control> |
||||||
|
</Form.Label> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
<Row> |
||||||
|
<Col xs={6}> |
||||||
|
<Form.Label> |
||||||
|
Cliente |
||||||
|
<Form.Control |
||||||
|
as="select" |
||||||
|
id="CmbCliente" |
||||||
|
onChange={(e) => { |
||||||
|
setIDCliente(parseInt(e.target.value)) |
||||||
|
}} |
||||||
|
value={IDCliente} |
||||||
|
className="form-select form-select-sm" |
||||||
|
> |
||||||
|
<option value="0">-SELECCIONE-</option> |
||||||
|
{Clientes |
||||||
|
? Clientes.map((c) => { |
||||||
|
return ( |
||||||
|
<option key={c.sClave} value={c.sClave}> |
||||||
|
{c.sRazonSocial} |
||||||
|
</option> |
||||||
|
) |
||||||
|
}) |
||||||
|
: null} |
||||||
|
</Form.Control> |
||||||
|
</Form.Label> |
||||||
|
</Col> |
||||||
|
<Col xs={6}> |
||||||
|
<Form.Label> |
||||||
|
Corresponsal |
||||||
|
<Form.Control |
||||||
|
as="select" |
||||||
|
id="CmbIDCorresponsal" |
||||||
|
onChange={(e) => { |
||||||
|
setIDCorresponsal(parseInt(e.target.value)) |
||||||
|
}} |
||||||
|
className="form-select form-select-sm" |
||||||
|
value={IDCorresponsal} |
||||||
|
> |
||||||
|
<option value="0">-SELECCIONE-</option> |
||||||
|
{Corresponsales |
||||||
|
? Corresponsales.map((item, index) => { |
||||||
|
return ( |
||||||
|
<option key={item.id} value={item.id}> |
||||||
|
{item.nombre} | {item.patente} | {item.aduana} |
||||||
|
</option> |
||||||
|
) |
||||||
|
}) |
||||||
|
: ''} |
||||||
|
</Form.Control> |
||||||
|
</Form.Label> |
||||||
|
</Col> |
||||||
|
</Row> |
||||||
|
</Card.Body> |
||||||
|
<Card.Footer style={{textAlign:'end'}}> |
||||||
|
<Button variant="primary" title="Quitar archivo cargado" style={{marginRight:'10px'}} onClick={GetExcel}> |
||||||
|
Generar Excel |
||||||
|
</Button> |
||||||
|
</Card.Footer> |
||||||
|
</Card> |
||||||
|
</Col> |
||||||
|
|
||||||
|
</Row> |
||||||
|
<MsgInformativo |
||||||
|
show={show} |
||||||
|
msg={msg} |
||||||
|
header={header} |
||||||
|
msgColor={msgColor} |
||||||
|
closeToast={() => { |
||||||
|
setShowMsg(false) |
||||||
|
}} |
||||||
|
/> |
||||||
|
</> |
||||||
|
) |
||||||
|
} |
@ -0,0 +1,21 @@ |
|||||||
|
export interface DTOReporteCuentasCerradas{ |
||||||
|
Trafico: string, |
||||||
|
TipoOperacion: string, |
||||||
|
Cliente: string, |
||||||
|
Proveedor: string, |
||||||
|
Corresponsal: string, |
||||||
|
Aduana: string, |
||||||
|
Patente: string, |
||||||
|
Pedimento: string, |
||||||
|
FechaPago: string, |
||||||
|
Facturas: string, |
||||||
|
Descripcion: string, |
||||||
|
FechaAlta: string, |
||||||
|
Clave: string, |
||||||
|
ValorMn: string, |
||||||
|
ValorDls: string, |
||||||
|
TipoCambio: string, |
||||||
|
ValorComercial: string, |
||||||
|
Fracciones: string, |
||||||
|
Caja: string |
||||||
|
} |
@ -0,0 +1,8 @@ |
|||||||
|
import http from "../common/http-common"; |
||||||
|
class ReporteGC50Service{ |
||||||
|
DownloadExcel(Inicio: string, Fin: string, TipoOperacion: number, NoCliente: number, IdCorresponsal: number){ |
||||||
|
return http.get(`ReporteCuentasCerradas/GetExcel?Inicio=${Inicio}&Fin=${Fin}&TipoOperacion=${TipoOperacion}&NoCliente=${NoCliente}&IdCorresponsal=${IdCorresponsal}`, {responseType: 'blob'}); |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
export default new ReporteGC50Service(); |
Loading…
Reference in new issue