Finished adding exception code to amazon project

src/Components/Clientes/Amazon/Reportes/ConsultaTrafico/RptConsultaTrafico.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useState } from 'react'
 import {
   Alert,
+  Badge,
   Button,
   Card,
   Col,
@@ -32,10 +33,14 @@ import { SiMicrosoftexcel } from 'react-icons/si'
 import I2096CatGrupoRegulatorio from '../../Interfaces/I2096CatGrupoRegulatorio'
 
 import { populateCatConcetosConsultas } from '../../../../../store/features/Clientes/2096/AmazonCatConceptosConsulta'
+import { get } from 'cypress/types/jquery'
 
 export interface IRptConsultaTraficoProps {}
 
 export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
+  const mConceptosConsulta = useSelector(
+    (state: RootState) => state.AmazonCatConceptosConsulta.CatConcetosConsulta
+  )
   const dispatch = useDispatch()
   const mInvoices = useSelector(
     (state: RootState) => state.AmazonTraficoConsulta.Consulta
@@ -45,6 +50,7 @@ export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
   const [show, setShowMsg] = useState(false)
   const [ShowModal, setShowModal] = useState(false)
   const [ShowModalUnlink, setShowModalUnlink] = useState(false)
+  const [ShowModalArchivos, setShowModalArchivos] = useState(false)
   const [WaitingDialog, setWaitingDialog] = useState(false)
   const [WaitingMessage, setWaitingMessage] = useState('')
   const [msg, setMsg] = useState('')
@@ -53,6 +59,11 @@ export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
   const [CatGrupoRegulario, setCatGrupoRegulatorio] = useState<
     I2096CatGrupoRegulatorio[]
   >([])
+  const [InvoiceConceptosConsulta, setInvoiceConceptosConsulta] = useState<
+    number[]
+  >([])
+  const [IDInvoice, setIDInvoice] = useState(0)
+  const [InvoiceNumber, setInvoiceNumber] = useState('')
   const msgColor = 'primary'
 
   const loadReport = () => {
@@ -87,14 +98,25 @@ export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
       })
   }
 
-  const downloadExcel = (id: number, Invoice: string) => {
-    DSAmazon.TraficoConsultasAmazonGenerateExcel(id)
+  const downloadExcel = (
+    idinvoice: number,
+    Invoice: string,
+    idconceptoconsulta: number
+  ) => {
+    DSAmazon.TraficoConsultasAmazonGenerateExcel(idinvoice, idconceptoconsulta)
       .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', 'Broker File ' + Invoice + '.xls')
+          link.setAttribute(
+            'download',
+            'Broker File ' +
+              Invoice +
+              '_' +
+              getConcept(idconceptoconsulta) +
+              '.xls'
+          )
           document.body.appendChild(link)
           link.click()
         }
@@ -162,6 +184,21 @@ export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
     return Cadena.slice(Cadena.indexOf(char1) + 1, Cadena.lastIndexOf(char2))
   }
 
+  const FilterExistingConceptosInInvoice = (id: number) => {
+    DSAmazon.FiltraInvoiceConceptosConsultaGet(id)
+      .then((response) => {
+        setInvoiceConceptosConsulta(response.data)
+      })
+      .catch((e: Error) => {
+        alert('Ocurrio un error' + e.message.toString())
+      })
+  }
+
+  const getConcept = (id: number) => {
+    let concepto = mConceptosConsulta.find((concepto) => concepto.id === id)
+    return concepto?.siglas
+  }
+
   return (
     <div>
       <Card>
@@ -251,10 +288,10 @@ export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
                             <td>{MasterData.id}</td>
                             <td
                               onClick={() => {
-                                downloadExcel(
-                                  MasterData.id,
-                                  MasterData.invoiceNumber
-                                )
+                                setIDInvoice(MasterData.id)
+                                setInvoiceNumber(MasterData.invoiceNumber)
+                                setShowModalArchivos(true)
+                                FilterExistingConceptosInInvoice(MasterData.id)
                               }}
                             >
                               <IconContext.Provider
@@ -567,6 +604,62 @@ export default function RptConsultaTrafico(props: IRptConsultaTraficoProps) {
         <Modal.Footer></Modal.Footer>
       </Modal>
 
+      <Modal
+        show={ShowModalArchivos}
+        onHide={() => {
+          setShowModal(false)
+        }}
+        size={'sm'}
+        dialogClassName={'modal-50w'}
+      >
+        <Modal.Header>
+          <Modal.Title className="primary">
+            <Alert variant="primary" style={{ textAlign: 'center' }}>
+              <h4>Descargue los siguientes archivos de consulta para Amazon</h4>
+            </Alert>
+          </Modal.Title>
+        </Modal.Header>
+        <Modal.Body>
+          <div style={{ height: '100px' }}>
+            <Row style={{ paddingTop: '0px' }}>
+              {InvoiceConceptosConsulta
+                ? InvoiceConceptosConsulta.map((id) => {
+                    return (
+                      <Col xs={2} style={{ textAlign: 'center' }}>
+                        <h5>
+                          <Badge
+                            bg="primary"
+                            style={{ cursor: 'pointer' }}
+                            onClick={() => {
+                              downloadExcel(IDInvoice, InvoiceNumber, id)
+                            }}
+                          >
+                            {getConcept(id)}
+                          </Badge>
+                        </h5>
+                      </Col>
+                    )
+                  })
+                : null}
+            </Row>
+            <Row style={{ paddingTop: '15px' }}>
+              <Col xs={10} style={{ textAlign: 'center' }}></Col>
+              <Col xs={2} style={{ textAlign: 'center' }}>
+                <Button
+                  variant="secondary"
+                  onClick={() => {
+                    setShowModalArchivos(false)
+                  }}
+                >
+                  &nbsp;&nbsp;Cerrar&nbsp;&nbsp;
+                </Button>
+              </Col>
+              <Col xs={6} style={{ textAlign: 'center' }}></Col>
+            </Row>
+          </div>
+        </Modal.Body>
+      </Modal>
+
       <MsgInformativo
         show={show}
         msg={msg}

src/Components/Clientes/Amazon/Reportes/ConsultaTrafico/RptConsultaTraficoDetalle.tsx

@@ -40,7 +40,7 @@ export default function RptConsultaTraficoDetalle(
   const mConceptosConsulta = useSelector(
     (state: RootState) => state.AmazonCatConceptosConsulta.CatConcetosConsulta
   )
-  const [IDConceptoConsulta, setIDConceptoConsulta] = useState(1)
+  const [IDConceptoConsulta, setIDConceptoConsulta] = useState(0)
   const [ShowModal, setShowModal] = useState(false)
   const [EstatusSwith, setEstatusSwitch] = useState(props.detail.swConsulta)
   const [UserChanged, setUserChanged] = useState(false)
@@ -89,8 +89,13 @@ export default function RptConsultaTraficoDetalle(
   }, [EstatusSwith, UserChanged])
 
   useEffect(() => {
-    let selected = mConceptosConsulta.filter((a)=>{if(a.id==IDConceptoConsulta){return a}});
+    let selected = mConceptosConsulta.filter((a) => {
+      if (a.id == IDConceptoConsulta) {
+        return a
+      }
+    })
     if (selected.length) setConceptoConsulta(selected[0].spanishDescription)
+    if (IDConceptoConsulta === 0) setConceptoConsulta('')
   }, [IDConceptoConsulta])
 
   return (
@@ -257,6 +262,7 @@ export default function RptConsultaTraficoDetalle(
           />
         </td>
       </tr>
+
       <Modal
         show={ShowModal}
         onHide={() => {
@@ -266,7 +272,9 @@ export default function RptConsultaTraficoDetalle(
         dialogClassName={'modal-50w'}
       >
         <Modal.Header>
-          <Modal.Title className="primary">Consulta Amazon {/* {IDGrupoRegulatorio} */}</Modal.Title>
+          <Modal.Title className="primary">
+            Consulta Amazon {/* {IDGrupoRegulatorio} */}
+          </Modal.Title>
         </Modal.Header>
         <Modal.Body>
           <div style={{ height: '320px' }}>
@@ -302,6 +310,7 @@ export default function RptConsultaTraficoDetalle(
                   }}
                   className="form-select form-select-sm"
                 >
+                  <option value="0">-SELECCIONE-</option>
                   {mConceptosConsulta
                     ? mConceptosConsulta.map((c) => {
                         return <option value={c.id}>{c.siglas}</option>
@@ -315,7 +324,7 @@ export default function RptConsultaTraficoDetalle(
                   id="ConceptoConsulta"
                   size="sm"
                   disabled={true}
-                  style={{fontSize:'11px', height:'80px'}}
+                  style={{ fontSize: '11px', height: '80px' }}
                   value={ConceptoConsulta}
                 />
               </Col>
@@ -362,6 +371,12 @@ export default function RptConsultaTraficoDetalle(
               <Col xs={6} style={{ textAlign: 'center' }}>
                 <Button
                   variant="danger"
+                  style={{
+                    visibility:
+                      IDConceptoConsulta > 0 && RegulacionConsulta.length
+                        ? 'visible'
+                        : 'hidden'
+                  }}
                   onClick={() => {
                     saveData()
                   }}
@@ -373,6 +388,7 @@ export default function RptConsultaTraficoDetalle(
           </div>
         </Modal.Body>
       </Modal>
+
       <MsgInformativo
         show={show}
         msg={msg}

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

@@ -214,8 +214,8 @@ class AmazonDataService {
 
 
 
-  TraficoConsultasAmazonGenerateExcel(id: number) {
-    return http.get<ArrayBuffer>(`/AmazonInvoice/TraficoConsultaAmazonGenerateExcel?id=${id}`, {responseType: 'arraybuffer'})
+  TraficoConsultasAmazonGenerateExcel(idinvoice: number, idconceptoconsulta: number) {
+    return http.get<ArrayBuffer>(`/AmazonInvoice/TraficoConsultaAmazonGenerateExcel?idinvoice=${idinvoice}&idconceptoconsulta=${idconceptoconsulta}`, {responseType: 'arraybuffer'})
     .then(function (response) {
        return response
      })
@@ -293,5 +293,8 @@ class AmazonDataService {
   CatConceptosConsultaAppend(data: ICat2096CatConceptosConsulta) {
     return http.post<ICat2096CatConceptosConsulta>(`/AmazonInvoice/Catalogos/CatConceptosConsultaAppend`, data)
   }
+  FiltraInvoiceConceptosConsultaGet(id: number) {
+    return http.get<number[]>(`/AmazonInvoice/Filtra/InvoiceConceptosConsultaGET?id=${id}`)
+  }
 }
 export default new AmazonDataService()