fix: sidebar icons sync with stage state — go() updates icons on every nav

This commit is contained in:
wasrusgen 2026-05-29 17:14:25 +03:00
parent 50cfd92f9b
commit d079000740

View File

@ -538,7 +538,7 @@ body{font-family:'Inter',sans-serif;background:var(--body-bg);color:var(--text);
<div class="si-con" id="con3"></div> <div class="si-con" id="con3"></div>
<div class="si active" id="si3" onclick="go(3)" data-overdue="2 дн"> <div class="si active" id="si3" onclick="go(3)" data-overdue="2 дн">
<div class="si-num" id="sn3">🔒</div> <div class="si-num" id="sn3">3</div>
<div class="si-body"> <div class="si-body">
<div class="si-lbl">Этап 3</div> <div class="si-lbl">Этап 3</div>
<div class="si-name">Документы</div> <div class="si-name">Документы</div>
@ -1574,23 +1574,39 @@ body{font-family:'Inter',sans-serif;background:var(--body-bg);color:var(--text);
const hints={0:'Обзор проекта — все этапы',1:'Этап 1/5 — знакомство завершено',2:'Этап 2/5 — опрос участников',3:'Этап 3/5 — сбор документов',4:'Этап 4/5 — анализ данных',5:'Этап 5/5 — план готов'}; const hints={0:'Обзор проекта — все этапы',1:'Этап 1/5 — знакомство завершено',2:'Этап 2/5 — опрос участников',3:'Этап 3/5 — сбор документов',4:'Этап 4/5 — анализ данных',5:'Этап 5/5 — план готов'};
const pcts={0:60,1:20,2:40,3:60,4:80,5:100}; const pcts={0:60,1:20,2:40,3:60,4:80,5:100};
// Stage state map: icon + class for each stage
const stageState={
0:{icon:'⊞', cls:'home'},
1:{icon:'✓', cls:'done'},
2:{icon:'2', cls:'active'},
3:{icon:'3', cls:'active'},
4:{icon:'🔒', cls:'locked'},
5:{icon:'🔒', cls:'locked'}
};
function go(n){ function go(n){
for(let i=0;i<=5;i++){ for(let i=0;i<=5;i++){
const sv=document.getElementById('sv'+i); const sv=document.getElementById('sv'+i);
if(sv) sv.style.display='none'; if(sv) sv.style.display='none';
const si=document.getElementById('si'+i); const si=document.getElementById('si'+i);
if(si) si.classList.remove('active'); if(si){
si.classList.remove('active','done','locked','home');
const s=stageState[i];
if(s) si.classList.add(s.cls);
}
const sn=document.getElementById('sn'+i);
if(sn && stageState[i]) sn.textContent=stageState[i].icon;
const db=document.getElementById('db'+i); const db=document.getElementById('db'+i);
if(db){ if(db){
db.classList.toggle('on',i===n); db.classList.toggle('on',i===n);
// HOME button keeps white regardless
if(i===0) db.classList.add('db-home'); if(i===0) db.classList.add('db-home');
} }
} }
const sv=document.getElementById('sv'+n); const sv=document.getElementById('sv'+n);
if(sv) sv.style.display='flex'; if(sv) sv.style.display='flex';
// Active stage overrides its base class
const si=document.getElementById('si'+n); const si=document.getElementById('si'+n);
if(si) si.classList.add('active'); if(si){ si.classList.remove('done','locked','home'); si.classList.add('active'); }
document.getElementById('pb-pct').textContent=pcts[n]+'%'; document.getElementById('pb-pct').textContent=pcts[n]+'%';
document.getElementById('pb-fill').style.width=pcts[n]+'%'; document.getElementById('pb-fill').style.width=pcts[n]+'%';
document.getElementById('pb-hint').textContent=hints[n]; document.getElementById('pb-hint').textContent=hints[n];