feat: chip Otro se posiciona por minuto en modal de tomas prolongadas
- Cada chip envuelto en .mp-chip-grp con CSS order = minuto - Otro arranca en order:9999 (último); al digitar el valor se mueve en tiempo real al lugar cronológico correcto - Si ya tiene valor guardado (_mpOtroHora), abre posicionado - Click handler usa .mp-chip-grp para encontrar input/unit Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
ecc9b74247
commit
3ae57a78e4
@@ -635,6 +635,7 @@ function _addExamWizardHtml(string $cid): string {
|
||||
.mp-cfg-body { padding:1.25rem; }
|
||||
.mp-cfg-foot { padding:0 1.25rem 1.25rem; }
|
||||
.mp-chips { display:flex;flex-wrap:wrap;gap:.4rem;padding:.25rem 0; }
|
||||
.mp-chip-grp { display:inline-flex;align-items:center; }
|
||||
.mp-chip { padding:.3rem .75rem;border:1.5px solid #cbd5e1;border-radius:2rem;
|
||||
background:#f8fafc;color:#475569;font-size:.82rem;cursor:pointer;transition:all .15s;line-height:1.4; }
|
||||
.mp-chip.active { background:#1e3a5f;border-color:#1e3a5f;color:#fff;font-weight:600; }
|
||||
@@ -1389,6 +1390,11 @@ function _mpShowCfgPanel(examName, groups, isModify) {
|
||||
var isActive = isSigned || inSaved || (!isModify && isMin0);
|
||||
var isOtro = /otro/i.test(s.label || '');
|
||||
var chipLbl = _mpChipLabel(s.label || ('Toma ' + (i+1)));
|
||||
// orden flex: numérico para Minuto X, valor guardado para Otro, 9999 si sin valor
|
||||
var chipOrder = isOtro
|
||||
? ((_mpOtroHora && isActive) ? parseInt(_mpOtroHora) : 9999)
|
||||
: (parseInt(chipLbl) === chipLbl >> 0 ? parseInt(chipLbl) : i * 10);
|
||||
html += '<span class="mp-chip-grp"' + (isOtro ? ' data-otro-grp="1"' : '') + ' style="order:' + chipOrder + '">';
|
||||
// checkbox oculto — sigue siendo la fuente de verdad para el guardado
|
||||
html += '<input type="checkbox" class="mp-cfg-chk d-none" id="cfg-' + s.firma + '"'
|
||||
+ ' value="' + s.firma + '" data-group="' + gk + '"'
|
||||
@@ -1405,6 +1411,7 @@ function _mpShowCfgPanel(examName, groups, isModify) {
|
||||
+ (isActive ? ' style="display:inline-block"' : '') + '>'
|
||||
+ '<span class="mp-chip-otro-unit' + (isActive ? '' : ' d-none') + '">min</span>';
|
||||
}
|
||||
html += '</span>';
|
||||
}
|
||||
html += '</div></div>';
|
||||
}
|
||||
@@ -1424,17 +1431,26 @@ document.addEventListener('click', function(e) {
|
||||
chk.checked = !chk.checked;
|
||||
chip.classList.toggle('active', chk.checked);
|
||||
if (chip.dataset.otro) {
|
||||
var inp = chip.nextElementSibling;
|
||||
var unit = inp && inp.nextElementSibling;
|
||||
if (inp && inp.classList.contains('mp-chip-otro-inp')) {
|
||||
var grp = chip.closest('.mp-chip-grp');
|
||||
var inp = grp && grp.querySelector('.mp-chip-otro-inp');
|
||||
var unit = grp && grp.querySelector('.mp-chip-otro-unit');
|
||||
if (inp) {
|
||||
inp.style.display = chk.checked ? 'inline-block' : 'none';
|
||||
if (unit && unit.classList.contains('mp-chip-otro-unit'))
|
||||
unit.classList.toggle('d-none', !chk.checked);
|
||||
if (unit) unit.classList.toggle('d-none', !chk.checked);
|
||||
if (chk.checked) setTimeout(function() { inp.focus(); }, 50);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Reposicionar chip "Otro" en tiempo real según el minuto digitado
|
||||
document.addEventListener('input', function(e) {
|
||||
if (!e.target.classList.contains('mp-chip-otro-inp')) return;
|
||||
var grp = e.target.closest('.mp-chip-grp');
|
||||
if (!grp) return;
|
||||
var v = parseInt(e.target.value);
|
||||
grp.style.order = (v >= 1) ? v : 9999;
|
||||
});
|
||||
|
||||
function _mpGetGroupsForExam(examName) {
|
||||
var result = {};
|
||||
for (var gk in _mpAllGroups) {
|
||||
|
||||
Reference in New Issue
Block a user