<div class="container-fluid">
<div class="d-flex justify-content-between align-items-center mb-3">
<h6 class="m-0 fw-bold text-success">Incapacidades del paciente</h6>
<button class="btn btn-sm btn-success" id="btnNuevaIncap" data-bs-toggle="modal" data-bs-target="#modalIncapacidad">
➕ Nueva Incapacidad
</button>
</div>
<div class="table-responsive">
<table class="table table-bordered table-sm align-middle">
<thead class="table-success">
<tr>
<th>Fecha Inicial</th>
<th>Días Transcurridos</th>
<th>Fecha Final</th>
<th>Entidad</th>
<th>Días</th>
<th>Tipo</th>
<th>Cargo</th>
</tr>
</thead>
<tbody>
<?php if ($registros && $registros->num_rows > 0): ?>
<?php while($r = $registros->fetch_assoc()): ?>
<?php
$inicio = new DateTime($r['fecha_inicio']);
$hoy = new DateTime();
$diasTrans = $inicio->diff($hoy)->days;
?>
<tr>
<td><?=$r['fecha_inicio']?></td>
<td><?=$diasTrans?></td>
<td><?=$r['fecha_fin']?></td>
<td><?=$r['eps']?></td>
<td><?=$r['dias']?></td>
<td><?=$r['tipo_incapacidad']?></td>
<td><?=$r['cargo']?></td>
</tr>
<?php endwhile; ?>
<?php else: ?>
<tr><td colspan="7" class="text-center text-muted">Sin incapacidades registradas</td></tr>
<?php endif; ?>
</tbody>
</table>
</div>
</div>
<!-- =============== MODAL INCAPACIDAD =============== -->
<div class="modal fade" id="modalIncapacidad" tabindex="-1">
<div class="modal-dialog modal-lg">
<form class="modal-content" id="formIncapacidad">
<div class="modal-header bg-success text-white">
<h5 class="modal-title">Nueva Incapacidad</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<input type="hidden" name="cedula" value="<?=$cedula?>">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label">Fecha Inicial</label>
<input type="date" name="fecha_inicial" id="fecha_inicial" class="form-control form-control-sm" required>
</div>
<div class="col-md-6">
<label class="form-label">Fecha Final</label>
<input type="date" name="fecha_final" id="fecha_final" class="form-control form-control-sm" required>
</div>
<div class="col-md-6">
<label class="form-label">Entidad</label>
<select name="entidad" class="form-select form-select-sm" required>
<option value="">Seleccione...</option>
<option value="EPS">EPS</option>
<option value="ARL">ARL</option>
<option value="MÉDICO EMPRESA">Médico Empresa</option>
</select>
</div>
<div class="col-md-6">
<label class="form-label">Médico</label>
<input type="text" name="medico" class="form-control form-control-sm" required>
</div>
<div class="col-12">
<label class="form-label">Diagnóstico</label>
<select name="codigo_diagnostico" class="form-select form-select-sm" required>
<option value="">Seleccione diagnóstico</option>
<?php while($d = $diagnosticos->fetch_assoc()): ?>
<option value="<?=$d['id']?>"><?=$d['descripcion']?></option>
<?php endwhile; ?>
</select>
</div>
<div class="col-md-6">
<label class="form-label">Días</label>
<input type="number" name="dias" id="dias" class="form-control form-control-sm" readonly>
</div>
<div class="col-12">
<label class="form-label">Observaciones</label>
<textarea name="observaciones" class="form-control form-control-sm"></textarea>
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success btn-sm">Guardar</button>
</div>
</form>
</div>
</div>
<script>
// Abrir modal
document.getElementById("btnNuevaIncap").addEventListener("click", () => {
new bootstrap.Modal(document.getElementById("modalIncapacidad")).show();
});
// Calcular días
const fInicio = document.getElementById("fecha_inicial");
const fFin = document.getElementById("fecha_final");
const dias = document.getElementById("dias");
function calcularDias(){
if(fInicio.value && fFin.value){
const ini = new Date(fInicio.value);
const fin = new Date(fFin.value);
if(fin >= ini){
const diff = Math.ceil((fin - ini) / (1000 * 60 * 60 * 24)) + 1;
dias.value = diff;
} else {
dias.value = "";
}
}
}
fInicio.addEventListener("change", calcularDias);
fFin.addEventListener("change", calcularDias);
// Guardar incapacidad
document.getElementById("formIncapacidad").addEventListener("submit", function(e){
e.preventDefault();
fetch("incapacidades/guardar", {
method: "POST",
body: new FormData(this)
})
.then(r => r.text())
.then(resp => {
alert(resp);
location.reload();
});
});
</script>