Se agrega reporte de Segregacion para Amazon

src/Components/Clientes/Amazon/Reportes/Segregacion/RptSegregacion.tsx

@@ -0,0 +1,199 @@
+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 IRptSegregacionProps {}
+
+export default function RptSegregacion(props: IRptSegregacionProps) {
+  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<DTO2096RptFacturasPagadas[]>([])
+  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<number[]>([])
+  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 downloadReport = () => {
+    DSAmazon.GETReporteSegregados(Inicio, Fin)
+      .then((response: any) => {
+        if (response.status === 200) {
+          const url = window.URL.createObjectURL(new Blob([response.data]))
+          const link = document.createElement('a')
+          link.href = url
+          link.setAttribute('download', 'Segregrados.xls')
+          document.body.appendChild(link)
+          link.click()
+        }
+      })
+      .catch((e: Error) => {
+        setHeader('Error')
+        setMsg('Ocurrio un error')
+        setShowMsg(true)
+        return
+      })
+  }
+
+  return (
+    <div>
+      <Card>
+        <Card.Body>
+          <Row>
+            <Col xs={5}>
+              <Card.Title>
+                <IconContext.Provider value={{ color: '#F6C34F', size: '8%' }}>
+                  <FaAmazon />
+                </IconContext.Provider>
+                Segregacion
+              </Card.Title>
+            </Col>
+            <Col></Col>
+            <Col style={{ textAlign: 'right' }}>Desde</Col>
+            <Col xs={1}>
+              <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"
+              />
+            </Col>
+            <Col style={{ textAlign: 'right' }}>Hasta</Col>
+            <Col xs={1}>
+              <Form.Control
+                defaultValue={Fin}
+                type="date"
+                name="Fin"
+                placeholder="Fin"
+                title="Fin"
+                alt="Fin"
+                onChange={(e) => setFin(e.target.value)}
+                size="sm"
+              />
+            </Col>
+            <Col
+              style={{ textAlign: 'right' }}
+              onClick={() => {
+                downloadReport()
+              }}
+            >
+              <Button variant="primary">Descargar</Button>
+            </Col>
+          </Row>
+        </Card.Body>
+      </Card>
+    </div>
+  )
+}

src/Components/Clientes/Amazon/Services/Amazon.Services.ts

@@ -171,6 +171,16 @@ class AmazonDataService {
        return error
      })
   }
+  GETReporteSegregados(Inicio: string, Fin: string) {
+    return http.get<ArrayBuffer>(`/AmazonInvoice/GETAmazonReporteSegregados?Inicio=${Inicio}&Fin=${Fin}`, {responseType: 'arraybuffer'})
+    .then(function (response) {
+       return response
+     })
+     .catch(function (error) {
+       console.log(error)
+       return error
+     })
+  }
   CreateACKFile(referencia: string) {
     return http.get<Boolean>(`/AmazonInvoice/createACKFile?Referencia=`+referencia)
   }

src/index.tsx

@@ -59,6 +59,7 @@ import RptPedimentosCruces03 from './Components/Reportes/Direccion/RptPedimentos
 import RptPedimentosCruces04 from './Components/Reportes/Direccion/RptPedimentosCruces04'
 import RptPedimentosCruces05 from './Components/Reportes/Direccion/RptPedimentosCruces05'
 import RptPedimentosCruces06 from './Components/Reportes/Direccion/RptPedimentosCruces06'
+import RptSegregacion from './Components/Clientes/Amazon/Reportes/Segregacion/RptSegregacion'
 
 require(`./css/${process.env.REACT_APP_ENVIRONMENT}-home.css`)
 
@@ -184,6 +185,10 @@ ReactDOM.render(
               path="/RptAmazonFacturasPagadas"
               element={<RptAmazonFacturasPagadas />}
             />
+            <Route
+              path="/RptSegregacion"
+              element={<RptSegregacion />}
+            />
             <Route
               path="/RptCasaCuervoCOVEs"
               element={<RptCasaCuervoCOVEs />}