usite-sas-bic/whatsapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: apply conditional field visibility in editable form (ver_formulario_enviado)

Browse Source 
Add data-campo-id attributes to all editable field wrappers and separators,
then run iniciarCondiciones-equivalent JS on page load so conditional sections
(e.g. Tipo de dolor when Dolores is checked) appear/disappear without needing
to close and reopen the modal.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Lizandro Guarnizo
2026-07-09 14:55:17 -05:00
co-authored by Claude Sonnet 4.6
parent b29061c010
commit ac492b4e2c
1 changed files with 58 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ver_formulario_enviado.php
+58 -7
View File
@@ -650,7 +650,7 @@ function esc2(mixed $v): string {
$_saltarSeccion = false;
}
if ($_saltarSeccion) continue; ?>
<div class="esquema-sep<?= $compact ? ' campo-full' : '' ?>"><?= esc2($campo['label'] ?? '') ?></div>
<div class="esquema-sep<?= $compact ? ' campo-full' : '' ?>" data-campo-id="<?= esc2($campo['id'] ?? '') ?>"><?= esc2($campo['label'] ?? '') ?></div>
<?php continue; endif;
if ($_saltarSeccion) continue;
@@ -826,14 +826,14 @@ function esc2(mixed $v): string {
}
if ($lval !== ''):
?>
<div class="campo-linked">
<div class="campo-linked" data-campo-id="<?= esc2($cid) ?>">
<div class="campo-linked-label"><?= $label ?></div>
<div class="campo-linked-valor"><?= esc2($lval) ?></div>
</div>
<?php endif; continue; endif; // linked
if ($tipo === 'textarea'):
?>
<div class="campo-edit<?= $compact ? ' campo-full' : '' ?>">
<div class="campo-edit<?= $compact ? ' campo-full' : '' ?>" data-campo-id="<?= esc2($cid) ?>">
<label><?= $label ?></label>
<textarea class="form-control form-control-sm" name="<?= esc2($cid) ?>"
rows="3"<?= $req ?>><?= esc2($prefill) ?></textarea>
@@ -842,7 +842,7 @@ function esc2(mixed $v): string {
if ($tipo === 'radio'):
$opts = $campo['opciones'] ?? $campo['options'] ?? [];
?>
<div class="campo-edit<?= ($compact && count($opts) > 3) ? ' campo-full' : '' ?>">
<div class="campo-edit<?= ($compact && count($opts) > 3) ? ' campo-full' : '' ?>" data-campo-id="<?= esc2($cid) ?>">
<label><?= $label ?></label>
<?php foreach ($opts as $opt): ?>
<div class="form-check">
@@ -859,7 +859,7 @@ function esc2(mixed $v): string {
$checkedArr = is_array($prefill) ? $prefill
: (is_string($prefill) && $prefill !== '' ? (json_decode($prefill, true) ?: [$prefill]) : []);
?>
<div class="campo-edit<?= $compact ? ' campo-full' : '' ?>">
<div class="campo-edit<?= $compact ? ' campo-full' : '' ?>" data-campo-id="<?= esc2($cid) ?>">
<label><?= $label ?></label>
<div class="d-flex flex-wrap gap-2">
<?php foreach ($opts as $opt): ?>
@@ -876,7 +876,7 @@ function esc2(mixed $v): string {
if ($tipo === 'select'):
$opts = $campo['opciones'] ?? $campo['options'] ?? [];
?>
<div class="campo-edit">
<div class="campo-edit" data-campo-id="<?= esc2($cid) ?>">
<label><?= $label ?></label>
<select class="form-select form-select-sm" name="<?= esc2($cid) ?>"<?= $req ?>>
<option value="">— Seleccione —</option>
@@ -906,7 +906,7 @@ function esc2(mixed $v): string {
default => 'text'
};
?>
<div class="campo-edit">
<div class="campo-edit" data-campo-id="<?= esc2($cid) ?>">
<label><?= $label ?></label>
<input type="<?= $inputType ?>" class="form-control form-control-sm"
name="<?= esc2($cid) ?>" value="<?= esc2($prefill) ?>"<?= $req ?>
@@ -1627,6 +1627,57 @@ const topaz = (() => {
})();
<?php if ($modoTurnero && $modoEditar): ?>
// ── Condiciones de visibilidad (secciones condicionales) ──────
(function() {
var esquema = <?= json_encode($esquema, JSON_UNESCAPED_UNICODE) ?>;
var secciones = [], secActual = null;
esquema.forEach(function(c) {
if (c.tipo === 'separador') {
secActual = { sepId: c.id, condicion: c.condicion || null, elemIds: [] };
secciones.push(secActual);
} else if (secActual) {
secActual.elemIds.push(c.id);
}
});
var condicionales = secciones.filter(function(s) { return s.condicion; });
if (!condicionales.length) return;
function evaluar() {
condicionales.forEach(function(sec) {
var cond = sec.condicion;
var valoresCond = cond.valores ? cond.valores : (cond.valor ? [cond.valor] : []);
var ctrl = document.querySelector('[data-campo-id="' + cond.campo_id + '"]');
if (!ctrl) return;
var activo = false;
var checks = ctrl.querySelectorAll('input[type="checkbox"]');
if (checks.length) {
checks.forEach(function(cb) { if (valoresCond.includes(cb.value) && cb.checked) activo = true; });
} else {
var radio = ctrl.querySelector('input[type="radio"]:checked');
var sel = ctrl.querySelector('select');
var v = radio ? radio.value : (sel ? sel.value : '');
activo = valoresCond.includes(v);
}
var ids = [sec.sepId].concat(sec.elemIds);
ids.forEach(function(id) {
var el = document.querySelector('[data-campo-id="' + id + '"]');
if (!el) return;
el.style.transition = 'opacity .2s, max-height .3s';
el.style.maxHeight = activo ? '2000px' : '0';
el.style.opacity = activo ? '1' : '0';
el.style.overflow = activo ? '' : 'hidden';
el.style.pointerEvents = activo ? '' : 'none';
});
});
}
var ctrlIds = [...new Set(condicionales.map(function(s) { return s.condicion.campo_id; }))];
ctrlIds.forEach(function(cid) {
var el = document.querySelector('[data-campo-id="' + cid + '"]');
if (el) el.addEventListener('change', evaluar);
});
evaluar();
})();
// ── Auto-save borrador (campo a campo, sin firma) ─────────────
(function() {
var _t;