fix: drag and drop evidence upload in safari and backend file list validation

expenses/forms.py

@@ -12,6 +12,12 @@ import os
 
 class MultipleFileInput(forms.FileInput):
     allow_multiple_selected = True
+    
+    def value_from_datadict(self, data, files, name):
+        if hasattr(files, 'getlist'):
+            return files.getlist(name)
+        else:
+            return files.get(name)
 
 class MultipleFileField(forms.FileField):
     def __init__(self, *args, **kwargs):

templates/expenses/expense_form.html

@@ -136,8 +136,8 @@
                     <span style="font-size: 0.7rem; color: var(--efintel-gray); display: block; margin-top: 0.25rem;">Formatos aceptados: PDF, PNG, JPG, JPEG (Múltiple)</span>
                 </div>
 
-                <!-- Hidden native input -->
+                <!-- Hidden native input (Visually hidden for Safari compatibility) -->
-                <div style="display: none;">
+                <div style="width: 0; height: 0; overflow: hidden; opacity: 0; position: absolute; z-index: -1;">
                     {{ form.receipt }}
                 </div>
                 
@@ -674,11 +674,29 @@
 
         // Handle standard file selection
         fileInput.addEventListener('change', () => {
+            let hasError = false;
             for (let i = 0; i < fileInput.files.length; i++) {
-                dt.items.add(fileInput.files[i]);
+                const f = fileInput.files[i];
+                const ext = f.name.split('.').pop().toLowerCase();
+                if (['pdf', 'png', 'jpg', 'jpeg'].includes(ext)) {
+                    dt.items.add(f);
+                } else {
+                    hasError = true;
+                    Swal.fire({
+                        icon: 'error',
+                        title: 'Archivo no permitido',
+                        text: `El archivo "${f.name}" no es una evidencia válida (PDF, PNG, JPG, JPEG).`,
+                        confirmButtonColor: 'var(--efintel-blue)'
+                    });
+                }
             }
             fileInput.files = dt.files;
             renderNewFiles();
+            
+            // Si hubo error, resetear el input nativo temporalmente para evitar que se envíe el archivo inválido
+            if (hasError && dt.files.length === 0) {
+                fileInput.value = '';
+            }
         });
 
         function renderNewFiles() {