feat(perm-ui): P0 usability improvements (search, default-dot, confirm-critical, wording)

- registry.js: добавлен флаг requireConfirmOff для 7 критичных прав (questions.manage, classes.manage, library.upload, courses.manage, sessions.reset, theory.access, simulations.access); byRole() теперь возвращает это поле
- admin.html: subtitle в модале прав — «учителя» → «пользователя»; tooltip на кнопке «Сбросить всё по умолчанию»; поле поиска над сеткой прав; CSS .perm-modified-dot (amber, 8px)
- admin.js: badge «Инд.» → «Индивидуально» (font-size 11px); renderPermissions() рисует .perm-modified-dot когда значение отличается от registry default; togglePermission() показывает LS.confirm перед выключением критичных прав; window.filterPermissions() скрывает карточки и role-блоки по поисковому запросу

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Maxim Dolgolyov
2026-05-17 14:43:49 +03:00
parent 19c16bdfe8
commit 7eea33a135
3 changed files with 57 additions and 5 deletions
+34 -2
View File
@@ -2144,7 +2144,7 @@
const hasOverride = p.userVal !== undefined;
const checked = p.effective;
const badge = hasOverride
? `<span style="font-size:10px;padding:2px 7px;border-radius:var(--r-pill);background:rgba(155,93,229,0.12);color:var(--violet);font-weight:700">Инд.</span>`
? `<span style="font-size:11px;padding:2px 5px;border-radius:var(--r-pill);background:rgba(155,93,229,0.12);color:var(--violet);font-weight:700">Индивидуально</span>`
: `<span style="font-size:10px;padding:2px 7px;border-radius:var(--r-pill);background:rgba(136,152,170,0.12);color:var(--text-3);font-weight:700">По роли</span>`;
const resetBtn = hasOverride
? `<button style="background:none;border:none;cursor:pointer;color:var(--text-3);padding:3px 6px;border-radius:6px;font-size:11px;font-weight:700;transition:color .2s"
@@ -2230,10 +2230,14 @@
const defs = definitions.filter(d => d.role === role);
container.innerHTML = defs.map(def => {
const enabled = permissions[role]?.[def.key] ?? def.default;
const isModified = (enabled ? 1 : 0) !== def.default;
const modDot = isModified
? `<span class="perm-modified-dot" title="Отличается от значения по умолчанию"></span>`
: '';
return `
<div class="perm-card${enabled ? ' enabled' : ''}" id="perm-card-${role}-${def.key.replace('.','_')}">
<div class="perm-info">
<div class="perm-label">${esc(def.label)}</div>
<div class="perm-label">${esc(def.label)}${modDot}</div>
<div class="perm-desc">${esc(def.desc)}</div>
</div>
<label class="perm-toggle" title="${enabled ? 'Выключить' : 'Включить'}">
@@ -2248,6 +2252,17 @@
}
async function togglePermission(role, key, enabled, checkbox) {
if (!enabled) {
const def = (_permData.definitions || []).find(d => d.role === role && d.key === key);
if (def && def.requireConfirmOff) {
const roleLabel = role === 'teacher' ? 'Учитель' : 'Ученик';
const ok = await LS.confirm(
`Выключение «${def.label}» затронет всех пользователей роли «${roleLabel}». Они потеряют доступ. Продолжить?`,
{ title: 'Подтвердите выключение права', confirmText: 'Выключить' }
);
if (!ok) { checkbox.checked = true; return; }
}
}
checkbox.disabled = true;
try {
await LS.setPermission(role, key, enabled);
@@ -2267,6 +2282,23 @@
}
}
window.filterPermissions = function filterPermissions(query) {
const q = query.trim().toLowerCase();
['teacher', 'student'].forEach(role => {
const block = document.querySelector(`#perm-${role}`)?.closest('.perm-role-block');
const cards = document.querySelectorAll(`#perm-${role} .perm-card`);
let visibleCount = 0;
cards.forEach(card => {
const label = (card.querySelector('.perm-label')?.textContent || '').toLowerCase();
const desc = (card.querySelector('.perm-desc')?.textContent || '').toLowerCase();
const show = !q || label.includes(q) || desc.includes(q);
card.style.display = show ? '' : 'none';
if (show) visibleCount++;
});
if (block) block.style.display = visibleCount === 0 ? 'none' : '';
});
};
/* ════════════════════════════════════════════════
МАГАЗИН (Shop)
════════════════════════════════════════════════ */