se edito el componente RpTSegregacion para incrustar una tabla con los datos ademas de descargar.

UpdateSagregacion
Luis Rendon 11 months ago
parent 1e886a44d8
commit 40425cfee2
  1. 10
      src/Components/Clientes/Amazon/DTO/DTOAmazonSegragacion.ts
  2. 112
      src/Components/Clientes/Amazon/Reportes/Segregacion/RptSegregacion.tsx
  3. 16
      src/Components/Clientes/Amazon/Services/Amazon.Services.ts

@ -0,0 +1,10 @@
export default interface DTOAmazonSegragacion {
vrid: string,
asin: string,
quantity: number,
descripcion: string,
motivo: string,
fSegregacion: string,
valorMercancia: string,
}

@ -25,6 +25,7 @@ import { AiFillFileExcel } from 'react-icons/ai'
import { IconContext } from 'react-icons' import { IconContext } from 'react-icons'
import { BsChevronDown, BsChevronRight, BsFilePdfFill } from 'react-icons/bs' import { BsChevronDown, BsChevronRight, BsFilePdfFill } from 'react-icons/bs'
import { FaAmazon } from 'react-icons/fa' import { FaAmazon } from 'react-icons/fa'
import { BsSearch, BsFileEarmarkExcel } from 'react-icons/bs'
import loadingImg from '../../../../../images/ajaxloader.gif' import loadingImg from '../../../../../images/ajaxloader.gif'
import { MFileManager } from '../../../../Utils/MFileManager/MFileManager' import { MFileManager } from '../../../../Utils/MFileManager/MFileManager'
import DTO2096RptPayedOperations from '../../DTO/DTO2096RptPayedOperations' import DTO2096RptPayedOperations from '../../DTO/DTO2096RptPayedOperations'
@ -33,6 +34,7 @@ import IFileManager from '../../../../../Interfaces/Utils/IFileManager'
import DTO2096RptFacturasPagadas from '../../DTO/DTO2096RptFacturasPagadas' import DTO2096RptFacturasPagadas from '../../DTO/DTO2096RptFacturasPagadas'
import DataTable from 'react-data-table-component' import DataTable from 'react-data-table-component'
import * as XLSX from 'xlsx' import * as XLSX from 'xlsx'
import DTOAmazonSegragacion from '../../DTO/DTOAmazonSegragacion'
export interface IRptSegregacionProps {} export interface IRptSegregacionProps {}
@ -45,7 +47,7 @@ export default function RptSegregacion(props: IRptSegregacionProps) {
const [Referencia, setReferencia] = useState('') const [Referencia, setReferencia] = useState('')
const [Inicio, setInicio] = useState(currentDate()) const [Inicio, setInicio] = useState(currentDate())
const [Fin, setFin] = useState(currentDate()) const [Fin, setFin] = useState(currentDate())
const [Data, setData] = useState<DTO2096RptFacturasPagadas[]>([]) const [Data, setData] = useState<DTOAmazonSegragacion[]>([])
const [show, setShowMsg] = useState(false) const [show, setShowMsg] = useState(false)
const [ShowModal, setShowModal] = useState(false) const [ShowModal, setShowModal] = useState(false)
const [WaitingDialog, setWaitingDialog] = useState(false) const [WaitingDialog, setWaitingDialog] = useState(false)
@ -56,61 +58,50 @@ export default function RptSegregacion(props: IRptSegregacionProps) {
const [IDFactura, setIDFactura] = useState(0) const [IDFactura, setIDFactura] = useState(0)
const [Invoices, setInvoices] = useState<number[]>([]) const [Invoices, setInvoices] = useState<number[]>([])
const msgColor = 'primary' const msgColor = 'primary'
const columnsConcepts = [ const columnsConcepts = [
{ {
name: 'Factura', name: 'VRID',
width: '350px', width: '150px',
selector: (row: DTO2096RptFacturasPagadas) => row.factura, selector: (row: DTOAmazonSegragacion) => row.vrid,
sortable: true sortable: true
}, },
{ {
name: 'Pedimento', name: 'ASIN',
width: '120px', width: '150px',
selector: (row: DTO2096RptFacturasPagadas) => row.pedimento, selector: (row: DTOAmazonSegragacion) => row.asin,
sortable: true sortable: true
}, },
{ {
name: 'Fecha pago', name: 'Quantyty',
width: '120px', width: '100px',
selector: (row: DTO2096RptFacturasPagadas) => selector: (row: DTOAmazonSegragacion) => row.quantity,
row.fechaPago.substring(0, 10),
sortable: true sortable: true
}, },
{ {
name: 'Clave', name: 'Descripcion',
width: '80px', width: '250px',
selector: (row: DTO2096RptFacturasPagadas) => row.clave, selector: (row: DTOAmazonSegragacion) => row.descripcion,
sortable: true sortable: true
}, },
{ {
name: 'Tipo Op', name: 'Motivo',
width: '120px', width: '2100px',
selector: (row: DTO2096RptFacturasPagadas) => row.tipoOp,
sortable: true selector: (row: DTOAmazonSegragacion) => row.motivo,
},
{
name: 'Valor Dolares',
width: '130px',
selector: (row: DTO2096RptFacturasPagadas) => row.valorDolares,
sortable: true sortable: true
}, },
{ {
name: 'Valor Aduana', name: 'FSegregacion',
width: '130px', width: '160px',
selector: (row: DTO2096RptFacturasPagadas) => row.valorAduana, selector: (row: DTOAmazonSegragacion) => row.fSegregacion,
sortable: true sortable: true
}, },
{ {
name: 'Razon Social', name: 'ValorMercancia',
width: '350px', width: '160px',
selector: (row: DTO2096RptFacturasPagadas) => row.razonSocial, selector: (row: DTOAmazonSegragacion) => row.valorMercancia,
sortable: true sortable: true
},
{
name: 'Aduana',
width: '550px',
selector: (row: DTO2096RptFacturasPagadas) => row.aduana,
sortable: false
} }
] ]
@ -142,6 +133,16 @@ export default function RptSegregacion(props: IRptSegregacionProps) {
}) })
} }
const loadReport = () => {
DSAmazon.GETReportesSegregadoss(Inicio, Fin)
.then((response) => {
setData(response.data)
})
.catch((e: Error) => {
alert('Ocurrio un error' + e.message.toString())
})
}
return ( return (
<div> <div>
<Card> <Card>
@ -189,8 +190,47 @@ export default function RptSegregacion(props: IRptSegregacionProps) {
downloadReport() downloadReport()
}} }}
> >
<Button variant="primary">Descargar</Button> <Button variant="primary">
<BsFileEarmarkExcel />
Descargar
</Button>
</Col> </Col>
<Col
style={{ textAlign: 'center' }}
onClick={() => {
loadReport()
}}
>
<Button variant="primary">
{' '}
<BsSearch />
Buscar
</Button>
</Col>
<Card>
<Card.Body>
<div
className="ag-theme-alpine"
style={{ height: 500, width: '100%' }}
>
<DataTable
noHeader
defaultSortFieldId={''}
defaultSortAsc={true}
striped={true}
dense={true}
paginationPerPage={10}
pagination
highlightOnHover
columns={columnsConcepts}
data={Data}
pointerOnHover
/>
</div>
</Card.Body>
</Card>
</Row> </Row>
</Card.Body> </Card.Body>
</Card> </Card>

@ -25,6 +25,7 @@ import DTO2096TraficoConsultaAmazonDetail from '../DTO/DTO2096TraficoConsultaAma
import DTO2096TraficoConsultaAmazonHeader from '../DTO/DTO2096TraficoConsultaAmazonHeader' import DTO2096TraficoConsultaAmazonHeader from '../DTO/DTO2096TraficoConsultaAmazonHeader'
import DTO2096DataTraficoConsulta from '../DTO/DTO2096DataTraficoConsulta' import DTO2096DataTraficoConsulta from '../DTO/DTO2096DataTraficoConsulta'
import I2096CatGrupoRegulatorio from '../Interfaces/I2096CatGrupoRegulatorio' import I2096CatGrupoRegulatorio from '../Interfaces/I2096CatGrupoRegulatorio'
import DTOAmazonSegragacion from '../DTO/DTOAmazonSegragacion'
class AmazonDataService { class AmazonDataService {
AmazonPendingClasificationInvoiceGET() { AmazonPendingClasificationInvoiceGET() {
@ -197,6 +198,21 @@ class AmazonDataService {
return error return error
}) })
} }
GETReportesSegregadoss(Inicio: string, Fin: string){
return http.get<DTOAmazonSegragacion[]>(`/AmazonInvoice/GETAmazonReportesSegregadoss?Inicio=${Inicio}&Fin=${Fin}`)
}
TraficoConsultasAmazonGenerateExcel(id: number) { TraficoConsultasAmazonGenerateExcel(id: number) {
return http.get<ArrayBuffer>(`/AmazonInvoice/TraficoConsultaAmazonGenerateExcel?id=${id}`, {responseType: 'arraybuffer'}) return http.get<ArrayBuffer>(`/AmazonInvoice/TraficoConsultaAmazonGenerateExcel?id=${id}`, {responseType: 'arraybuffer'})
.then(function (response) { .then(function (response) {

Loading…
Cancel
Save