Update web/historial-consultas.html

web/historial-consultas.html

@@ -600,14 +600,33 @@
             console.log(`Viendo detalles de consulta: ${consultationId}`);
             currentConsultationId = consultationId;
 
-            api.getConsultations(1, 100).then(function(response) {
-                const consultation = (response.consultations || []).find(c => c.consultationID === consultationId);
-                if (consultation) {
-                    renderConsultationModal(consultation, []);
-                    $('#consultationModal').modal('show');
+            // Mostrar loading en el modal mientras carga
+            $('#consultationModalBody').html(`
+                <div class="text-center py-4">
+                    <div class="spinner-border text-primary" role="status"></div>
+                    <p class="text-muted mt-2">Cargando detalles...</p>
+                </div>
+            `);
+            $('#consultationModal').modal('show');
+
+            api.getConsultation(consultationId).then(function(response) {
+                if (response && response.success) {
+                    renderConsultationModal(response.consultation, response.consultation.riskFactors || []);
                 } else {
-                    showAlert('error', 'Consulta no encontrada');
+                    $('#consultationModalBody').html(`
+                        <div class="alert alert-danger">
+                            <i class="fe fe-alert-circle mr-2"></i>
+                            ${response?.message || 'No se pudo cargar la consulta.'}
+                        </div>
+                    `);
                 }
+            }).catch(function() {
+                $('#consultationModalBody').html(`
+                    <div class="alert alert-danger">
+                        <i class="fe fe-alert-circle mr-2"></i>
+                        Error de conexión al cargar la consulta.
+                    </div>
+                `);
             });
         }
 
@@ -621,9 +640,9 @@
                 new Date(consultation.consultationDate).toLocaleString('es-ES') : 'N/A';
 
             const confidence = consultation.confidence ?
-                `${consultation.confidence.toFixed(1)}%` : 'N/A';
+                `${parseFloat(consultation.confidence).toFixed(1)}%` : 'N/A';
 
-            // Calcular edad si hay fecha de nacimiento
+            // Calcular edad
             let age = 'N/A';
             if (consultation.birthDate) {
                 try {
@@ -635,11 +654,13 @@
                         age--;
                     }
                     age += ' años';
-                } catch (e) {
-                    age = 'N/A';
-                }
+                } catch (e) { age = 'N/A'; }
             }
 
+            // Género legible
+            const genderMap = { 'M': 'Masculino', 'F': 'Femenino' };
+            const genderText = genderMap[consultation.gender] || consultation.gender || 'N/A';
+
             // Factores de riesgo
             let riskFactorsHtml = '';
             if (riskFactors && riskFactors.length > 0) {
@@ -647,9 +668,14 @@
                     `<span class="badge badge-secondary mr-1 mb-1">${rf.name}</span>`
                 ).join('');
             } else {
-                riskFactorsHtml = '<span class="text-muted">No se han registrado factores de riesgo</span>';
+                riskFactorsHtml = '<span class="text-muted small">Sin factores de riesgo registrados</span>';
             }
 
+            // Badge del doctor que registró la consulta
+            const doctorBadge = consultation.doctorName
+                ? `<span class="badge badge-info ml-1">${consultation.doctorName}</span>`
+                : '';
+
             const modalContent = `
             <div class="row">
                 <div class="col-md-6">
@@ -659,7 +685,7 @@
                     <table class="table table-sm">
                         <tr>
                             <td><strong>Nombre:</strong></td>
-                            <td>${consultation.patientName || consultation.patient_name || 'N/A'}</td>
+                            <td>${consultation.patientName || 'N/A'}</td>
                         </tr>
                         <tr>
                             <td><strong>Edad:</strong></td>
@@ -667,7 +693,7 @@
                         </tr>
                         <tr>
                             <td><strong>Género:</strong></td>
-                            <td>${consultation.gender || 'N/A'}</td>
+                            <td>${genderText}</td>
                         </tr>
                         <tr>
                             <td><strong>Tipo Diabetes:</strong></td>
@@ -693,16 +719,16 @@
                             <td>${confidence}</td>
                         </tr>
                         <tr>
-                            <td><strong>Imagen:</strong></td>
-                            <td>${consultation.imagePath || 'N/A'}</td>
+                            <td><strong>Doctor:</strong></td>
+                            <td>${doctorBadge || 'N/A'}</td>
                         </tr>
                     </table>
                 </div>
             </div>
 
-            <div class="row mt-4">
+            <div class="row mt-3">
                 <div class="col-12">
-                    <div class="alert ${resultClass} d-flex align-items-center">
+                    <div class="alert ${resultClass} d-flex align-items-center mb-0">
                         <i class="fe ${resultIcon} fe-24 mr-3"></i>
                         <div>
                             <h6 class="mb-1">${resultText}</h6>
@@ -712,15 +738,24 @@
                 </div>
             </div>
 
+            <div class="row mt-3">
+                <div class="col-12">
+                    <h6 class="mb-2">
+                        <i class="fe fe-shield mr-2"></i>Factores de Riesgo del Paciente
+                    </h6>
+                    <div>${riskFactorsHtml}</div>
+                </div>
+            </div>
+
             ${consultation.notes ? `
-                <div class="row">
+                <div class="row mt-3">
                     <div class="col-12">
                         <h6 class="mb-2">
                             <i class="fe fe-edit-2 mr-2"></i>Notas de la Consulta
                         </h6>
                         <div class="card bg-light">
-                            <div class="card-body">
-                                <p class="mb-0">${consultation.notes}</p>
+                            <div class="card-body py-2">
+                                <p class="mb-0 small">${consultation.notes}</p>
                             </div>
                         </div>
                     </div>