From 68907a58f86709ecf041a706b34fd9e21c1aefbf Mon Sep 17 00:00:00 2001
From: Felix Morales <fmorales@gemcousa.com>
Date: Thu, 8 Feb 2024 12:17:05 -0600
Subject: [PATCH] Se cambia la forma en la que se determina el ancho del modal
 que muestra otros componentes durante la captura de un trafico

---
 .../ControlledInput/ControlledInput.tsx       |  2 +-
 .../ProveedorFactura/ProveedorFactura.tsx     |  2 +-
 .../Corresponsales/TraficoCorresponsales.tsx  | 44 ++++++++-----------
 src/css/generic01.css                         |  5 +++
 4 files changed, 26 insertions(+), 27 deletions(-)

diff --git a/src/Components/Catalogos/CatCorresponsales/ControlledInput/ControlledInput.tsx b/src/Components/Catalogos/CatCorresponsales/ControlledInput/ControlledInput.tsx
index 5f8264e..4d2ddc3 100644
--- a/src/Components/Catalogos/CatCorresponsales/ControlledInput/ControlledInput.tsx
+++ b/src/Components/Catalogos/CatCorresponsales/ControlledInput/ControlledInput.tsx
@@ -98,7 +98,7 @@ export const ControlledInput: FC<IProps> = (props) => {
         onChange={onChangeEmail}
         disabled={false}
         onKeyDown={(e) => handleKeyDown(e, 2)}
-        style={{ width: '650px', textAlign: 'left' }}
+        style={{ width: '450px', textAlign: 'left' }}
       />
       <MsgInformativo
         show={show}
diff --git a/src/Components/Corresponsales/ProveedorFactura/ProveedorFactura.tsx b/src/Components/Corresponsales/ProveedorFactura/ProveedorFactura.tsx
index d8d1f09..6815de4 100644
--- a/src/Components/Corresponsales/ProveedorFactura/ProveedorFactura.tsx
+++ b/src/Components/Corresponsales/ProveedorFactura/ProveedorFactura.tsx
@@ -356,7 +356,7 @@ export const ProveedorFactura: FC<IProps> = (props) => {
                     fontSize: '18px',
                     backgroundColor: '#F5FFED',
                     border: '2px solid #25D05B',
-                    width: '100px',
+                    width: '100%',
                     textAlign: 'right',
                     borderRadius: '10px',
                   }}
diff --git a/src/Components/Corresponsales/TraficoCorresponsales.tsx b/src/Components/Corresponsales/TraficoCorresponsales.tsx
index 0ba13f1..15486ba 100644
--- a/src/Components/Corresponsales/TraficoCorresponsales.tsx
+++ b/src/Components/Corresponsales/TraficoCorresponsales.tsx
@@ -193,7 +193,8 @@ export default function TraficoCorresponsales (props:IProps) {
     (state:RootState) => state.CPedimentosConsolidados.PedimentosConsolidados
   )
 
-  const [ModalSize, setModalSize] = useState('sm')
+  const [ModalClassName, setModalClassName] = useState('')
+  const [ModalCentered, setModalCentered] = useState(false)
   const [showModal, setShowModal] = useState(false)
   const [LoadComponent, setLoadComponent] = useState(0)
   const [IDTrafico, setIDTrafico] = useState(props.IDTrafico)
@@ -1126,10 +1127,10 @@ export default function TraficoCorresponsales (props:IProps) {
     }
   }, [FechaDesaduanamiento, FAlmacenajeInicioGastos, CostoDiario])
 
-  function showModalBox(i: number) {
+  function showModalBox(i: number, className: string, modalCentered: boolean) {
     setLoadComponent(i)
-    if (i === 1) setModalSize('lg')
-    else setModalSize('sm')
+    setModalClassName(className)
+    setModalCentered(modalCentered)
     setShowModal(true)
   }
 
@@ -1463,10 +1464,6 @@ export default function TraficoCorresponsales (props:IProps) {
     })
   }
 
-  const showHistorialRectificaciones = () => {
-    setLoadComponent(14);
-    setShowModal(true);
-  }
   return (
     <div style={{height:'100%', overflowY:'scroll'}}>
       <Card className="labelSize13px" style={{borderStyle:'none', height:'100%'}}>
@@ -1501,7 +1498,7 @@ export default function TraficoCorresponsales (props:IProps) {
                         <Col sm={3} md={2} lg={4}>
                           <Form.Label
                             onClick={() => {
-                              showModalBox(11)
+                              showModalBox(11, 'modal-50w', false)
                             }}
                             style={{ cursor: 'pointer', display: 'flex'}}
                           >
@@ -1645,7 +1642,7 @@ export default function TraficoCorresponsales (props:IProps) {
                         <Col sm={6} md={6} lg={8}>
                           <Form.Label style={{ width:'100%' }}>
                             <IconContext.Provider value={{ color: 'blue', size: '15px' }}>
-                              <span onClick={() => {showModalBox(10)}}
+                              <span onClick={() => {showModalBox(10, 'modal-50w', false)}}
                               style={{ cursor: 'pointer' }}>
                                 <FcTimeline />&nbsp;Precuenta
                               </span>
@@ -1740,7 +1737,7 @@ export default function TraficoCorresponsales (props:IProps) {
                           <Form.Label
                             onClick={() => {
                               return Depto === 'Corresponsalias'
-                                ? showModalBox(1)
+                                ? showModalBox(1,  'modal-90w', false)
                                 : ''
                             }}
                             style={{ cursor: 'pointer' }}
@@ -1969,7 +1966,7 @@ export default function TraficoCorresponsales (props:IProps) {
                             <Row className='justify-content-between' style={{alignItems:'center'}}>
                                 <Col sm={5} md={5} lg={5}>
                                   <Button variant="success" 
-                                    onClick={()=>{setLoadComponent(13);setShowModal(true);}}
+                                    onClick={()=>{showModalBox(13, 'modal-70w', false)}}
                                     style={{width:'100%', padding:'6px'}}
                                   >
                                     {LblPedimentos}
@@ -2145,7 +2142,7 @@ export default function TraficoCorresponsales (props:IProps) {
                             <legend className='w-auto' style={{float:'none', fontSize:'1rem'}}>Última Rectificación</legend>
                           <Row className='justify-content-between' style={{alignItems:'center', paddingTop:'15px'}}>
                             <Col sm={5} md={4} lg={4}>
-                              <Button variant="success" style={{width:'100%', padding:'6px'}} onClick={() => {showHistorialRectificaciones()}}>{LblRectificaciones}</Button>
+                              <Button variant="success" style={{width:'100%', padding:'6px'}} onClick={() => {showModalBox(14, 'modal-70w', false)}}>{LblRectificaciones}</Button>
                             </Col>                              
                             <Col sm={1} md={1} lg={2}>
                                 <Form.Label>Aduana</Form.Label>
@@ -2423,7 +2420,7 @@ export default function TraficoCorresponsales (props:IProps) {
                                   value={{ color: 'green', size: '15px' }}
                                 >
                                   <BiDownload onClick={() => {GetFacturasExcel()}} style={{ cursor: 'pointer' }}/>&nbsp;
-                                  <span onClick={() => {showModalBox(2)}} style={{ cursor: 'pointer' }}><HiCurrencyDollar />&nbsp;{LblFacturas}</span>
+                                  <span onClick={() => {showModalBox(2, 'modal-85w', false)}} style={{ cursor: 'pointer' }}><HiCurrencyDollar />&nbsp;{LblFacturas}</span>
                                 </IconContext.Provider>
                                 
                               </Form.Label>
@@ -2577,7 +2574,7 @@ export default function TraficoCorresponsales (props:IProps) {
                             <Col sm={2}>
                             <Form.Label
                                 onClick={() => {
-                                  showModalBox(9)
+                                  showModalBox(9, 'modal-85w', false)
                                 }}
                                 style={{ cursor: 'pointer' }}
                               >
@@ -2660,7 +2657,7 @@ export default function TraficoCorresponsales (props:IProps) {
                               <Form.Label
                                 id="LinkFacturasTerceros"
                                 onClick={() => {
-                                  showModalBox(4)
+                                  showModalBox(4, 'modal-50w', false)
                                 }}
                                 style={{ cursor: 'pointer' }}
                               >
@@ -3022,7 +3019,7 @@ export default function TraficoCorresponsales (props:IProps) {
                     <Col xs={2}>
                       <Form.Label
                         onClick={() => {
-                          showModalBox(2)
+                          showModalBox(2, 'modal-85w', false)
                         }}
                         style={{ cursor: 'pointer', width:'100%'}}
                       >
@@ -4183,13 +4180,10 @@ export default function TraficoCorresponsales (props:IProps) {
       <Modal
         show={showModal}
         onHide={handleClose}
-        size={LoadComponent === 1 || LoadComponent === 7 ? 'lg' : 'sm'}
-        dialogClassName={
-          LoadComponent === 1 || LoadComponent === 2 || LoadComponent === 9
-            ? 'modal-90w'
-            : LoadComponent === 13 || LoadComponent === 14 ? 'modal-70w' : 'modal-50w'
-        }
-        style={{backdropFilter: 'brightness(0.5)'}}
+        dialogClassName={ModalClassName}
+        centered={ModalCentered}
+        //backdropClassName='brightness(0.5)'
+        style={{backdropFilter:'brightness(0.5)'}}
       >
         <Modal.Body>
           {LoadComponent === 1 ? (
@@ -4222,7 +4216,7 @@ export default function TraficoCorresponsales (props:IProps) {
             </div>
           ) : null}
           {LoadComponent === 9 ? (
-            <div style={{ height: '350px'}}>
+            <div style={{ height: '400px'}}>
               <Anticipos
                 IDTrafico={IDTrafico}
                 FolioTrafico={FolioTrafico}
diff --git a/src/css/generic01.css b/src/css/generic01.css
index 608aa2c..f051d3f 100644
--- a/src/css/generic01.css
+++ b/src/css/generic01.css
@@ -18,6 +18,11 @@
        width: 70%;
        max-width: none !important;
    }
+
+   .modal-85w {
+        width: 85%;
+        max-width: none !important;
+    }
    
    .modal-90w {
     width: 90%;