v1.0.178: Фаза 4 — renderStepper(state). Степпер через state.ui.steps вместо прямой манипуляции DOM. stepDone/stepActive/resetStepper мутируют state → renderStepper.

This commit is contained in:
2026-06-25 09:25:15 +04:00
parent c9d55b3d80
commit 7e76224203
+52 -17
View File
@@ -36,31 +36,66 @@ var fileTable = document.getElementById('fileTable');
*/
function render(state) {
renderFiles(state);
renderStepper(state);
}
// syncDB, statusToHTML, renderFiles, toggleClassifyDetail, uploadFile, refreshSupps
// → вынесены в files.js (Фаза 1)
// ── Pipeline stepper ─────────────────────────────────────────
function stepDone(id) {
var el = document.getElementById(id);
if (el) { el.innerHTML = el.innerHTML.replace('○','✓'); el.style.color = 'var(--green)'; }
}
function stepActive(id) {
var el = document.getElementById(id);
if (el) { el.innerHTML = el.innerHTML.replace('○','⏳').replace('✓','⏳'); el.style.color = 'var(--brand-primary)'; }
}
function resetStepper(fromId) {
var steps = ['stepUpload','stepClassify','stepGroups','stepCompare'];
var reset = false;
steps.forEach(function(id) {
if (id === fromId) reset = true;
if (reset) {
var el = document.getElementById(id);
if (el) { el.innerHTML = el.innerHTML.replace('✓','○').replace('⏳','○'); el.style.color = 'var(--muted)'; }
// ── Pipeline stepper (Фаза 4: state-driven) ──────────────────
/**
* renderStepper(state) — Рендер степпера из state.ui.steps (Фаза 4).
*
* Читает state.ui.steps.{upload,classify,groups,compare}, обновляет DOM.
* Значения: '○' (не начат) | '⏳' (в процессе) | '✓' (завершён).
*/
function renderStepper(state) {
var steps = state.ui.steps;
var map = { upload: 'stepUpload', classify: 'stepClassify', groups: 'stepGroups', compare: 'stepCompare' };
var colors = { '○': 'var(--muted)', '⏳': 'var(--brand-primary)', '✓': 'var(--green)' };
Object.keys(map).forEach(function(key) {
var el = document.getElementById(map[key]);
if (el) {
el.textContent = steps[key] + ' ' + {upload:'Загрузка',classify:'Классификация',groups:'Группировка',compare:'Сравнение'}[key];
el.style.color = colors[steps[key]] || 'var(--muted)';
}
});
}
/**
* stepDone(id) — Отметить шаг как завершённый (Фаза 4).
* Мутирует state.ui.steps, вызывает renderStepper.
*/
function stepDone(id) {
var key = { stepUpload: 'upload', stepClassify: 'classify', stepGroups: 'groups', stepCompare: 'compare' }[id];
if (key) { state.ui.steps[key] = '✓'; renderStepper(state); }
}
/**
* stepActive(id) — Отметить шаг как активный (Фаза 4).
* Мутирует state.ui.steps, вызывает renderStepper.
*/
function stepActive(id) {
var key = { stepUpload: 'upload', stepClassify: 'classify', stepGroups: 'groups', stepCompare: 'compare' }[id];
if (key) { state.ui.steps[key] = '⏳'; renderStepper(state); }
}
/**
* resetStepper(fromId) — Сбросить шаги начиная с fromId (Фаза 4).
* Все шаги после (и включая) fromId получают '○'.
* Мутирует state.ui.steps, вызывает renderStepper.
*/
function resetStepper(fromId) {
var order = ['stepUpload','stepClassify','stepGroups','stepCompare'];
var keys = ['upload','classify','groups','compare'];
var reset = false;
order.forEach(function(id, i) {
if (id === fromId) reset = true;
if (reset) { state.ui.steps[keys[i]] = '○'; }
});
renderStepper(state);
}
// Утилиты (formatSize, formatDate, moveUp, moveDown, escHtml, fmtDate) —
// вынесены в app_utils.js для облегчения анализа и отладки.
// statusToHTML, renderFiles → files.js (Фаза 1)