Filtro de choferes pertenecientes a transportista en solicitudes de importación

views/solicitud_importacion/editar.php

@@ -165,7 +165,7 @@
           </div>
         </div>
 
-        <!-- Transporte y Foto -->
+        <!-- Transportista, Ghofer y Foto -->
         <div class="row">
           <div class="col-md-4 mb-3">
             <label for="transportista_id" class="form-label">Transportista</label>
@@ -173,7 +173,7 @@
               <option value="">-- Selecciona --</option>
               <?php foreach($transportistas as $t): ?>
                 <option value="<?= htmlspecialchars($t['id_transportista']) ?>" <?= $factura['transportista_id']==$t['id_transportista']?'selected':'' ?>>
-                  <?= htmlspecialchars($t['nombre']) ?>
+                  <?= htmlspecialchars($t['clave_identificador'] . ' - ' . $t['nombre']) ?>
                 </option>
               <?php endforeach; ?>
             </select>
@@ -183,7 +183,9 @@
             <select id="chofer_id" name="chofer_id" class="form-select searchable" required>
               <option value="">-- Selecciona Chofer --</option>
               <?php foreach($choferes as $c): ?>
-                <option value="<?= htmlspecialchars($c['id_chofer']) ?>" <?= $factura['chofer_id']==$c['id_chofer']?'selected':'' ?>>
+                <option value="<?= htmlspecialchars($c['id_chofer']) ?>" 
+                        data-transportista="<?= htmlspecialchars($c['transportista_id']) ?>" 
+                        <?= $factura['chofer_id'] == $c['id_chofer']?'selected':'' ?>>
                   <?= htmlspecialchars($c['nombre']) ?>
                 </option>
               <?php endforeach; ?>
@@ -295,12 +297,95 @@
   <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0/dist/js/select2.min.js"></script>
 
   <script>
-  // ✅ 1. INICIALIZACIÓN PRINCIPAL
-  document.addEventListener('DOMContentLoaded', function() {
-    // Primero cargar proveedores, después inicializar otros selects
-    cargarProveedores().then(() => {
-      // Inicializar Choices.js en todos los selects searchable DESPUÉS de cargar proveedores
-      document.querySelectorAll('.searchable').forEach(el => {
+    // ✅ 1. INICIALIZACIÓN PRINCIPAL
+    document.addEventListener('DOMContentLoaded', function() {
+      // Primero cargar proveedores, después inicializar otros selects
+      cargarProveedores().then(() => {
+        // Inicializar Choices.js en todos los selects searchable DESPUÉS de cargar proveedores
+        document.querySelectorAll('.searchable').forEach(el => {
+          new Choices(el, { 
+            searchEnabled: true, 
+            itemSelectText: '', 
+            shouldSort: false 
+          });
+        });
+      });
+    });
+
+    // ✅ 2. FUNCIÓN PARA CARGAR PROVEEDORES (CON PROMESA)
+    function cargarProveedores() {
+      const proveedorEl = document.getElementById('proveedor_id');
+      // Obtenemos la cadena con la ID del proveedor guardado
+      const proveedorActual = '<?= htmlspecialchars($proveedor_clave_actual ?? '') ?>';
+      
+      return fetch('/IMPORTADORES/solicitud_importacion/ajax_proveedores')
+        .then(res => { 
+          if (!res.ok) throw new Error(`HTTP ${res.status}`); 
+          return res.json(); 
+        })
+        .then(json => {
+          // Limpiar el select
+          proveedorEl.innerHTML = '<option value="">-- Selecciona Proveedor --</option>';
+          
+          // Agregar todas las opciones
+          if (json.results && json.results.length > 0) {
+            json.results.forEach(item => {
+              const opt = document.createElement('option');
+              opt.value = item.id; 
+              opt.textContent = item.text;
+              
+              // Comparar forzando a cadena para que coincida con proveedorActual
+              if (String(item.id) === proveedorActual && proveedorActual !== '') {
+                opt.selected = true;
+              }
+              
+              proveedorEl.appendChild(opt);
+            });
+          }
+          
+          console.log('✅ Proveedores cargados. Proveedor actual:', proveedorActual);
+        })
+        .catch(err => {
+          console.error('❌ Error cargando proveedores:', err);
+          proveedorEl.innerHTML = '<option value="">Error cargando proveedores</option>';
+        });
+    }
+
+    // ✅ 3. AGREGAR PARTIDAS
+    document.getElementById('add-partida').addEventListener('click', () => {
+      const tbody = document.querySelector('#tabla-partidas tbody');
+      const idx = tbody.querySelectorAll('tr').length;
+      const row = document.createElement('tr');
+      
+      row.innerHTML = `
+        <td><input name="partidas[${idx}][descripcion]" class="form-control"></td>
+        <td><input name="partidas[${idx}][cantidad_comercial]" type="number" step="0.0001" class="form-control"></td>
+        <td><input name="partidas[${idx}][cantidad_tarifa]" type="number" step="0.0001" class="form-control"></td>
+        <td>
+          <select name="partidas[${idx}][unidad_comercial_id]" class="form-select searchable">
+            <option value="">-- Unidad --</option>
+            <?php foreach($unidades_medida as $um): ?>
+            <option value="<?= htmlspecialchars($um['id']) ?>"><?= htmlspecialchars($um['descripcion']) ?></option>
+            <?php endforeach; ?>
+          </select>
+        </td>
+        <td><input name="partidas[${idx}][valor_factura]" type="number" step="0.01" class="form-control valor-partida"></td>
+        <td><input name="partidas[${idx}][peso_bruto]" type="number" step="0.0001" class="form-control"></td>
+        <td>
+          <select name="partidas[${idx}][tasa_preferencial]" class="form-select searchable">
+            <option value="">-- Selecciona --</option>
+            <option>General</option><option>TLC</option><option>PROSEC</option><option>ALADI</option><option>COMERCIALIZADORA</option>
+          </select>
+        </td>
+        <td class="hide"><input name="partidas[${idx}][precio_unitario]" type="number" class="form-control"></td>
+        <td class="hide"><input name="partidas[${idx}][oma_factura]" class="form-control"></td>
+        <td><button type="button" class="btn btn-danger btn-sm remove-row">✖️</button></td>
+      `;
+      
+      tbody.appendChild(row);
+      
+      // Inicializar Choices.js en los nuevos selects
+      row.querySelectorAll('.searchable').forEach(el => {
         new Choices(el, { 
           searchEnabled: true, 
           itemSelectText: '', 
@@ -308,135 +393,250 @@
         });
       });
     });
-  });
 
-  // ✅ 2. FUNCIÓN PARA CARGAR PROVEEDORES (CON PROMESA)
-  function cargarProveedores() {
-    const proveedorEl = document.getElementById('proveedor_id');
-    // Obtenemos la cadena con la ID del proveedor guardado
-    const proveedorActual = '<?= htmlspecialchars($proveedor_clave_actual ?? '') ?>';
-    
-    return fetch('/IMPORTADORES/solicitud_importacion/ajax_proveedores')
-      .then(res => { 
-        if (!res.ok) throw new Error(`HTTP ${res.status}`); 
-        return res.json(); 
-      })
-      .then(json => {
-        // Limpiar el select
-        proveedorEl.innerHTML = '<option value="">-- Selecciona Proveedor --</option>';
-        
-        // Agregar todas las opciones
-        if (json.results && json.results.length > 0) {
-          json.results.forEach(item => {
-            const opt = document.createElement('option');
-            opt.value = item.id; 
-            opt.textContent = item.text;
-            
-            // Comparar forzando a cadena para que coincida con proveedorActual
-            if (String(item.id) === proveedorActual && proveedorActual !== '') {
-              opt.selected = true;
-            }
-            
-            proveedorEl.appendChild(opt);
-          });
-        }
-        
-        console.log('✅ Proveedores cargados. Proveedor actual:', proveedorActual);
-      })
-      .catch(err => {
-        console.error('❌ Error cargando proveedores:', err);
-        proveedorEl.innerHTML = '<option value="">Error cargando proveedores</option>';
-      });
-  }
-
-  // ✅ 3. AGREGAR PARTIDAS
-  document.getElementById('add-partida').addEventListener('click', () => {
-    const tbody = document.querySelector('#tabla-partidas tbody');
-    const idx = tbody.querySelectorAll('tr').length;
-    const row = document.createElement('tr');
-    
-    row.innerHTML = `
-      <td><input name="partidas[${idx}][descripcion]" class="form-control"></td>
-      <td><input name="partidas[${idx}][cantidad_comercial]" type="number" step="0.0001" class="form-control"></td>
-      <td><input name="partidas[${idx}][cantidad_tarifa]" type="number" step="0.0001" class="form-control"></td>
-      <td>
-        <select name="partidas[${idx}][unidad_comercial_id]" class="form-select searchable">
-          <option value="">-- Unidad --</option>
-          <?php foreach($unidades_medida as $um): ?>
-          <option value="<?= htmlspecialchars($um['id']) ?>"><?= htmlspecialchars($um['descripcion']) ?></option>
-          <?php endforeach; ?>
-        </select>
-      </td>
-      <td><input name="partidas[${idx}][valor_factura]" type="number" step="0.01" class="form-control valor-partida"></td>
-      <td><input name="partidas[${idx}][peso_bruto]" type="number" step="0.0001" class="form-control"></td>
-      <td>
-        <select name="partidas[${idx}][tasa_preferencial]" class="form-select searchable">
-          <option value="">-- Selecciona --</option>
-          <option>General</option><option>TLC</option><option>PROSEC</option><option>ALADI</option><option>COMERCIALIZADORA</option>
-        </select>
-      </td>
-      <td class="hide"><input name="partidas[${idx}][precio_unitario]" type="number" class="form-control"></td>
-      <td class="hide"><input name="partidas[${idx}][oma_factura]" class="form-control"></td>
-      <td><button type="button" class="btn btn-danger btn-sm remove-row">✖️</button></td>
-    `;
-    
-    tbody.appendChild(row);
-    
-    // Inicializar Choices.js en los nuevos selects
-    row.querySelectorAll('.searchable').forEach(el => {
-      new Choices(el, { 
-        searchEnabled: true, 
-        itemSelectText: '', 
-        shouldSort: false 
-      });
-    });
-  });
-
-  // ✅ 4. REMOVER PARTIDAS
-  document.querySelector('#tabla-partidas tbody').addEventListener('click', e => {
-    if (e.target.matches('.remove-row')) {
-      // Destruir instancia de Choices.js antes de remover la fila
-      const row = e.target.closest('tr');
-      row.querySelectorAll('.searchable').forEach(el => {
-        if (el.choicesInstance) {
-          el.choicesInstance.destroy();
-        }
-      });
-      row.remove();
-    }
-  });
-
-  // ✅ 5. CONTROLAR OVERFLOW DE LA TABLA
-  document.addEventListener('click', function(e) {
-    const tableContainer = document.querySelector('.table-responsive');
-    if (!tableContainer) return;
-
-    if (e.target.closest('.choices__inner')) {
-      tableContainer.style.overflow = 'visible';
-    } else {
-      tableContainer.style.overflow = 'auto';
-    }
-  });
-
-  // ✅ 6. VALIDACIÓN DEL FORMULARIO
-  $(document).ready(function() {
-    $('#solicitudForm').submit(function(e){
-      const total = parseFloat($('#valor_factura').val()) || 0;
-      let sum = 0;
-      $('.valor-partida').each(function(){ 
-        sum += parseFloat($(this).val()) || 0; 
-      });
-      
-      if(Math.abs(sum - total) > 0.001){
-        e.preventDefault();
-        Swal.fire({
-          icon: 'error',
-          title: 'Error de validación',
-          text: `La suma de partidas (${sum.toFixed(2)}) no coincide con Valor Factura (${total.toFixed(2)}).`
+    // ✅ 4. REMOVER PARTIDAS
+    document.querySelector('#tabla-partidas tbody').addEventListener('click', e => {
+      if (e.target.matches('.remove-row')) {
+        // Destruir instancia de Choices.js antes de remover la fila
+        const row = e.target.closest('tr');
+        row.querySelectorAll('.searchable').forEach(el => {
+          if (el.choicesInstance) {
+            el.choicesInstance.destroy();
+          }
         });
+        row.remove();
       }
     });
-  });
+
+    // ✅ 5. CONTROLAR OVERFLOW DE LA TABLA
+    document.addEventListener('click', function(e) {
+      const tableContainer = document.querySelector('.table-responsive');
+      if (!tableContainer) return;
+
+      if (e.target.closest('.choices__inner')) {
+        tableContainer.style.overflow = 'visible';
+      } else {
+        tableContainer.style.overflow = 'auto';
+      }
+    });
+
+    // ✅ 6. VALIDACIÓN DEL FORMULARIO
+    $(document).ready(function() {
+      $('#solicitudForm').submit(function(e){
+        const total = parseFloat($('#valor_factura').val()) || 0;
+        let sum = 0;
+        $('.valor-partida').each(function(){ 
+          sum += parseFloat($(this).val()) || 0; 
+        });
+        
+        if(Math.abs(sum - total) > 0.001){
+          e.preventDefault();
+          Swal.fire({
+            icon:  'error',
+            title: 'Error de validación',
+            text:  `La suma de partidas (${sum.toFixed(2)}) no coincide con Valor Factura (${total.toFixed(2)}).`
+          });
+        }
+      });
+    });
+
+    document.addEventListener('DOMContentLoaded', function() {
+      const transportistaSelect = document.getElementById('transportista_id');
+      const choferSelect        = document.getElementById('chofer_id');
+    
+      // Guardar todas las opciones de choferes originales (para fallback)
+      const allChoferes = Array.from(choferSelect.querySelectorAll('option')).slice(1); // Excluir la primera opción vacía
+    
+      // Obtener valores actuales (para modo edición)
+      const transportistaActual = transportistaSelect.value;
+      const choferActual        = choferSelect.value;
+    
+      // Crear un mapa de choferes por transportista desde las opciones cargadas
+      const choferesPorTransportista = {};
+      allChoferes.forEach(option => {
+        const transportistaId = option.getAttribute('data-transportista');
+        if (transportistaId) {
+          if (!choferesPorTransportista[transportistaId]) {
+            choferesPorTransportista[transportistaId] = [];
+          }
+          choferesPorTransportista[transportistaId].push({
+            id_chofer: option.value,
+            nombre: option.textContent.trim()
+          });
+        }
+      });
+    
+      // Debug: mostrar el cache inicial
+      console.log('Cache de choferes por transportista:', choferesPorTransportista);
+    
+      // Inicializar Choices.js si está disponible
+      let choferChoices = null;
+      if (typeof Choices !== 'undefined') {
+        choferChoices = new Choices(choferSelect, {
+            searchEnabled:          true,
+            placeholderValue:       '-- Selecciona Transportista primero --',
+            noResultsText:          'No se encontraron resultados',
+            itemSelectText:         '',
+            searchPlaceholderValue: 'Buscar chofer...'
+        });
+      }
+
+      // Función para filtrar choferes por transportista
+      function filtrarChoferes(transportistaId) {
+        // Limpiar opciones excepto la primera
+        if (choferChoices) {
+          choferChoices.clearStore();
+        } else {
+          choferSelect.innerHTML = '<option value="">-- Selecciona Chofer --</option>';
+        }
+        
+        if (transportistaId) {
+          // Intentar usar datos locales primero (más rápido)
+          if (choferesPorTransportista[transportistaId] && choferesPorTransportista[transportistaId].length > 0) {
+            console.log('Usando datos locales para transportista:', transportistaId);
+            cargarChoferes(choferesPorTransportista[transportistaId]);
+          } else {
+            // Si no hay datos locales, hacer petición AJAX
+            console.log('Haciendo petición AJAX para transportista:', transportistaId);
+            mostrarCargando();
+                
+            fetch(`/IMPORTADORES/solicitud_importacion/obtenerChoferesPorTransportista?transportista_id=${transportistaId}`)
+            .then(response => {
+              console.log('Response status:', response.status);
+                        
+              if (!response.ok) {
+                return response.json().then(data => {
+                  throw new Error(data.error || `Error ${response.status}`);
+                });
+              }
+              return response.json();
+            })
+            .then(choferes => {
+              console.log('Choferes recibidos:', choferes);
+              // Guardar en cache local para futuras consultas
+              choferesPorTransportista[transportistaId] = choferes;
+              cargarChoferes(choferes);
+            })
+            .catch(error => {
+              console.error('Error al cargar choferes:', error);
+              mostrarError();
+            });
+          }
+        } else {
+          // Si no hay transportista seleccionado, mostrar mensaje
+          mostrarSeleccionarTransportista();
+        }
+      }
+
+      // Función para mostrar estado de carga
+      function mostrarCargando() {
+        if (choferChoices) {
+          choferChoices.clearStore();
+          choferChoices.setChoices([{
+            value:    '',
+            label:    '-- Cargando choferes... --',
+            disabled: true
+          }], 'value', 'label', true);
+        } else {
+          choferSelect.innerHTML = '<option value="">-- Cargando choferes... --</option>';
+        }
+      }
+
+      // Función para mostrar mensaje de seleccionar transportista
+      function mostrarSeleccionarTransportista() {
+        if (choferChoices) {
+          choferChoices.clearStore();
+          choferChoices.setChoices([{
+            value:    '',
+            label:    '-- Selecciona Transportista primero --',
+            disabled: true
+          }], 'value', 'label', true);
+        } else {
+            choferSelect.innerHTML = '<option value="">-- Selecciona Transportista primero --</option>';
+        }
+      }
+
+      // Función para mostrar error
+      function mostrarError() {
+        const errorMessage = '-- Error al cargar choferes --';
+          if (choferChoices) {
+            choferChoices.clearStore();
+            choferChoices.setChoices([{
+              value:    '',
+              label:    errorMessage,
+              disabled: true
+            }], 'value', 'label', true);
+          } else {
+            choferSelect.innerHTML = `<option value="">${errorMessage}</option>`;
+          }
+        }
+
+        // Función para cargar choferes en el select
+        function cargarChoferes(choferes) {
+          const opciones = [{
+            value: '',
+            label: '-- Selecciona Chofer --',
+            disabled: false
+          }];
+        
+          choferes.forEach(chofer => {
+            opciones.push({
+              value: chofer.id_chofer,
+              label: chofer.nombre,
+              disabled: false
+            });
+          });
+
+          if (choferChoices) {
+            choferChoices.clearStore();
+            choferChoices.setChoices(opciones, 'value', 'label', true);
+            
+            // Restaurar selección actual si es válida
+            if (choferActual && choferes.some(c => c.id_chofer == choferActual)) {
+              choferChoices.setChoiceByValue(choferActual);
+            }
+          } else {
+            choferSelect.innerHTML = '';
+            opciones.forEach(opcion => {
+            const option       = document.createElement('option');
+            option.value       = opcion.value;
+            option.textContent = opcion.label;
+            if (opcion.disabled) option.disabled = true;
+            choferSelect.appendChild(option);
+          });
+            
+          // Restaurar selección actual si es válida
+          if (choferActual && choferes.some(c => c.id_chofer == choferActual)) {
+            choferSelect.value = choferActual;
+          }
+        }
+      }
+
+      // Inicializar el filtro al cargar la página (para modo edición)
+      if (transportistaActual) {
+        filtrarChoferes(transportistaActual);
+      } else {
+        mostrarSeleccionarTransportista();
+      }
+
+      // Event listener para cambio de transportista
+      transportistaSelect.addEventListener('change', function() {
+        const transportistaId = this.value;
+        filtrarChoferes(transportistaId);
+      });
+
+      // Event listener para validar que se seleccione un chofer válido
+      choferSelect.addEventListener('change', function() {
+        const choferSeleccionado = this.value;
+        if (choferSeleccionado && !transportistaSelect.value) {
+          alert('Por favor, selecciona un transportista primero.');
+          this.value = '';
+          if (choferChoices) {
+            choferChoices.setChoiceByValue('');
+          }
+        }
+      });
+    });
   </script>
 
 </body>