diff --git a/src/Components/Clientes/Amazon/DTO/DTO2096RptFacturasPagadas.ts b/src/Components/Clientes/Amazon/DTO/DTO2096RptFacturasPagadas.ts new file mode 100644 index 0000000..5262d56 --- /dev/null +++ b/src/Components/Clientes/Amazon/DTO/DTO2096RptFacturasPagadas.ts @@ -0,0 +1,11 @@ +export default interface DTO2096RptFacturasPagadas { + factura: string, + pedimento: string, + fechaPago: string, + clave: string, + tipoOp: string, + valorDolares: string, + valorAduana: string, + razonSocial: string, + aduana: string +} \ No newline at end of file diff --git a/src/Components/Clientes/Amazon/Reportes/FacturasPagadas/RptAmazonFacturasPagadas.tsx b/src/Components/Clientes/Amazon/Reportes/FacturasPagadas/RptAmazonFacturasPagadas.tsx new file mode 100644 index 0000000..590f919 --- /dev/null +++ b/src/Components/Clientes/Amazon/Reportes/FacturasPagadas/RptAmazonFacturasPagadas.tsx @@ -0,0 +1,358 @@ +import * as React from 'react' +import { useEffect, useState } from 'react' +import { RootState } from '../../../../../store/store' +import I2096Headers from '../../Interfaces/I2096Header' +import DSAmazon from '../../Services/Amazon.Services' +// Redux +import { useDispatch, useSelector } from 'react-redux' +import { + initializeInvoice, + populateInvoices, + updateInvoice +} from '../../../../../store/features/Clientes/2096/AmazonInvoices' +import { + Alert, + Button, + Card, + Col, + Form, + Modal, + Row, + Table +} from 'react-bootstrap' +import { MsgInformativo } from '../../../../Utils/Toast/msgInformativo' +import { AiFillFileExcel } from 'react-icons/ai' +import { IconContext } from 'react-icons' +import { BsChevronDown, BsChevronRight, BsFilePdfFill } from 'react-icons/bs' +import { FaAmazon } from 'react-icons/fa' +import loadingImg from '../../../../../images/ajaxloader.gif' +import { MFileManager } from '../../../../Utils/MFileManager/MFileManager' +import DTO2096RptPayedOperations from '../../DTO/DTO2096RptPayedOperations' +import { GoGear } from 'react-icons/go' +import IFileManager from '../../../../../Interfaces/Utils/IFileManager' +import DTO2096RptFacturasPagadas from '../../DTO/DTO2096RptFacturasPagadas' +import DataTable from 'react-data-table-component' +import * as XLSX from 'xlsx' + +export interface IRptAmazonFacturasPagadasProps {} + +export default function RptAmazonFacturasPagadas( + props: IRptAmazonFacturasPagadasProps +) { + const dispatch = useDispatch() + const mInvoices = useSelector( + (state: RootState) => state.AmazonInvoices.Invoice + ) + const [header, setHeader] = useState('') + const [Referencia, setReferencia] = useState('') + const [Inicio, setInicio] = useState(currentDate()) + const [Fin, setFin] = useState(currentDate()) + const [Data, setData] = useState([]) + const [show, setShowMsg] = useState(false) + const [ShowModal, setShowModal] = useState(false) + const [WaitingDialog, setWaitingDialog] = useState(false) + const [WaitingMessage, setWaitingMessage] = useState('') + const [msg, setMsg] = useState('') + const [ShowModalAnswerFile, setShowModalAnswerFile] = useState(false) + const [IDProcess, setIDProcess] = useState(25) + const [IDFactura, setIDFactura] = useState(0) + const [Invoices, setInvoices] = useState([]) + const msgColor = 'primary' + const columnsConcepts = [ + { + name: 'Factura', + width: '350px', + selector: (row: DTO2096RptFacturasPagadas) => row.factura, + sortable: true + }, + { + name: 'Pedimento', + width: '120px', + selector: (row: DTO2096RptFacturasPagadas) => row.pedimento, + sortable: true + }, + { + name: 'Fecha pago', + width: '120px', + selector: (row: DTO2096RptFacturasPagadas) => row.fechaPago.substring(0,10), + sortable: true + }, + { + name: 'Clave', + width: '80px', + selector: (row: DTO2096RptFacturasPagadas) => row.clave, + sortable: true + }, + { + name: 'Tipo Op', + width: '120px', + selector: (row: DTO2096RptFacturasPagadas) => row.tipoOp, + sortable: true + }, + { + name: 'Valor Dolares', + width: '130px', + selector: (row: DTO2096RptFacturasPagadas) => row.valorDolares, + sortable: true + }, + { + name: 'Valor Aduana', + width: '130px', + selector: (row: DTO2096RptFacturasPagadas) => row.valorAduana, + sortable: true + }, + { + name: 'Razon Social', + width: '350px', + selector: (row: DTO2096RptFacturasPagadas) => row.razonSocial, + sortable: true + }, + { + name: 'Aduana', + width: '550px', + selector: (row: DTO2096RptFacturasPagadas) => row.aduana, + sortable: false + } + ] + + function currentDate(): string { + var today = new Date() + var dd = String(today.getDate()).padStart(2, '0') + var mm = String(today.getMonth() + 1).padStart(2, '0') //January is 0! + var yyyy = today.getFullYear() + return yyyy + '-' + mm + '-' + dd + } + + const loadReport = () => { + DSAmazon.AmazonFacturasPagadasGET(Inicio, Fin) + .then((response) => { + setData(response.data) + }) + .catch((e: Error) => { + alert('Ocurrio un error' + e.message.toString()) + }) + } + + const downloadExcel = () => { + exportExcel(Data, 'Reporte de facturas pagadas de Amazon') + } + + function exportExcel(jsonData: DTO2096RptFacturasPagadas[], fileName: string): void { + let Heading = [ + [ + 'Factura', + 'Pedimento', + 'Fecha Pago', + 'Clave', + 'Tipo Op', + 'Valor Dolares', + 'Valor Aduana', + 'Razon Social', + 'Aduana' + ] + ] + const dataOnly = jsonData.map( + ({ + factura, + pedimento, + fechaPago, + clave, + tipoOp, + valorDolares, + valorAduana, + razonSocial, + aduana + }) => { + return { + factura, + pedimento, + fechaPago, + clave, + tipoOp, + valorDolares, + valorAduana, + razonSocial, + aduana + } + } + ) + const Report = dataOnly.map( + ({ + factura, + pedimento, + fechaPago, + clave, + tipoOp, + valorDolares, + valorAduana, + razonSocial, + aduana + }) => { + return { + factura, + pedimento, + fechaPago, + clave, + tipoOp, + valorDolares, + valorAduana, + razonSocial, + aduana + } + } + ) + const wb = XLSX.utils.book_new() + const ws: XLSX.WorkSheet = XLSX.utils.json_to_sheet([]) + XLSX.utils.sheet_add_aoa(ws, Heading) + XLSX.utils.sheet_add_json(ws, Report, { origin: 'A2', skipHeader: true }) + XLSX.utils.book_append_sheet(wb, ws, 'Sheet1') + XLSX.writeFile(wb, fileName + '.xlsx') + var range = XLSX.utils.decode_range(ws['!ref?']) + for (var C = range.s.c + 1; C <= range.e.c + 1; ++C) { + var address = XLSX.utils.encode_col(C) + '1' // <-- first row, column number C + if (!ws[address]) continue + ws[address].v = ws[address].v.toUpperCase() + } + } + + + useEffect(() => { + loadReport() + }, []) + + return ( +
+ + + + + + + + + Facturas Pagadas + + + + Desde + + setInicio(e.target.value)} + size="sm" + /> + + Hasta + + setFin(e.target.value)} + size="sm" + /> + + { + loadReport() + }} + > + + + + + + + + +
+ +
+
+
+ { + setWaitingDialog(false) + }} + backdrop="static" + keyboard={false} + size="sm" + dialogClassName={'modal-50w'} + centered + > + + + + + proccessing + Generando {WaitingMessage}... + + + + + { + setShowModalAnswerFile(false) + }} + size={'sm'} + dialogClassName={'modal-50w'} + > + +
+ + + + + + + +
+
+
+ + { + setShowMsg(false) + }} + /> +
+ ) +} diff --git a/src/Components/Clientes/Amazon/Services/Amazon.Services.ts b/src/Components/Clientes/Amazon/Services/Amazon.Services.ts index bbfd89f..5c8b3a1 100644 --- a/src/Components/Clientes/Amazon/Services/Amazon.Services.ts +++ b/src/Components/Clientes/Amazon/Services/Amazon.Services.ts @@ -20,6 +20,7 @@ import DTO2096RptPayedOperations from '../DTO/DTO2096RptPayedOperations' import DTO2096NoParteVerificacion from '../DTO/DTO2096NoParteVerificacion' import DTO2096InvoiceStatus from '../DTO/DTO2096InvoiceStatus' import IFileManager from '../../../../Interfaces/Utils/IFileManager' +import DTO2096RptFacturasPagadas from '../DTO/DTO2096RptFacturasPagadas' class AmazonDataService { AmazonPendingClasificationInvoiceGET() { @@ -77,6 +78,9 @@ class AmazonDataService { AmazonPayedOperationsGET(Inicio: string, Fin: string) { return http.get(`/AmazonInvoice/AmazonPayedOperationsGET?Inicio=${Inicio}&Fin=${Fin}`) } + AmazonFacturasPagadasGET(Inicio: string, Fin: string) { + return http.get(`/AmazonInvoice/AmazonFacturasPagadasGET?Inicio=${Inicio}&Fin=${Fin}`) + } AmazonInvoiceStatusGET(Invoice: string) { return http.get(`/AmazonInvoice/AmazonInvoiceStatusGET?Invoice=${Invoice}`) } diff --git a/src/index.tsx b/src/index.tsx index 3d8630e..a914553 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -50,6 +50,7 @@ import RptCasaCuervoCOVEs from './Components/Clientes/CasaCuervo/Reportes/RptCas import RptAmazonInvoiceStatus from './Components/Clientes/Amazon/Reportes/Estatus/RtpAmazonInvoiceStatus' import ForgotPassword from './Components/Login/ForgotPassword' import PIN from './Components/Login/PIN' +import RptAmazonFacturasPagadas from './Components/Clientes/Amazon/Reportes/FacturasPagadas/RptAmazonFacturasPagadas' require(`./css/${process.env.REACT_APP_ENVIRONMENT}-home.css`) @@ -167,6 +168,10 @@ ReactDOM.render( path="/RptAmazonPayedOperations" element={} /> + } + /> }