Интерактив сургалт · 100 дасгал
Claude-ийг Agentic AI болгон ашиглах нь
Олон үйлдэлт даалгавар, судалгаа, төсөл боловсруулалт, өдөр тутмын бизнесийн ажилд Claude-ийг «5 ажилтантай виртуал баг» шиг ашиглаж сур. Дасгал бүрийг бөглөж, багаа бүрэн чадавхжуул.
Нийт ахиц0 / 100
🥉 Дадлагажигч · 25
🥈 Оператор · 50
🥇 Зохион байгуулагч · 75
🏆 Агентын мастер · 100
Таны 5 агентын баг
Хичээлийн модулиуд
Дасгалын хариу таны төхөөрөмжид хадгалагдана. Бодит ажил дээрээ Claude-д туршиж үзэхийг мартуузай!
${ag.nm}
${ag.rl}
${have}/${max} · ${pct}%
`;
teamEl.appendChild(d);
});
}
/* ---- Totals ---- */
function countDone(){ let n=0; for(const k in DONE) if(DONE[k]) n++; return n; }
function refreshTotals(){
const n=countDone(), pct=Math.round(n/TOTAL*100);
document.getElementById('totalPct').textContent=n+' / '+TOTAL;
document.getElementById('totalFill').style.width=pct+'%';
[['b25',25],['b50',50],['b75',75],['b100',100]].forEach(([id,th])=>{
document.getElementById(id).classList.toggle('on', n>=th);
});
COURSE.forEach(m=>{
const el=document.getElementById('prog-'+m.id); if(!el) return;
const dn=m.exercises.filter(ex=>DONE[ex._id]).length;
el.textContent=dn+'/'+m.exercises.length;
});
}
/* ---- Exercise renderers ---- */
function renderMC(ex){
const wrap=document.createElement('div'); wrap.className='ex'+(DONE[ex._id]?' done':'');
wrap.innerHTML=`№${ex._gid}${ex.tag}${agentTags(ex)}
${ex.q}
`;
const opts=document.createElement('div'); opts.className='opts';
let answered=DONE[ex._id]||false;
ex.opts.forEach((o,i)=>{
const b=document.createElement('button'); b.className='opt'; b.textContent=o; b.type='button';
if(answered){ b.disabled=true; if(i===ex.a) b.classList.add('reveal'); }
b.onclick=()=>{
if(answered) return; answered=true;
const all=opts.querySelectorAll('.opt'); all.forEach(x=>x.disabled=true);
if(i===ex.a){ b.classList.add('sel-correct'); wrap.classList.add('correct'); }
else{ b.classList.add('sel-wrong'); all[ex.a].classList.add('reveal'); wrap.classList.add('wrong'); }
const v=document.createElement('div'); v.className='verdict '+(i===ex.a?'ok':'no');
v.textContent=i===ex.a?'✓ Зөв!':'✗ Дахин бод. Зөв хариуг доороос үзээрэй.';
wrap.appendChild(v);
const ex2=document.createElement('div'); ex2.className='expl'; ex2.innerHTML='Тайлбар: '+ex.e; wrap.appendChild(ex2);
complete(ex._id); wrap.classList.remove('done');
};
opts.appendChild(b);
});
wrap.appendChild(opts);
if(answered){ const ex2=document.createElement('div'); ex2.className='expl'; ex2.innerHTML='Тайлбар: '+ex.e; wrap.appendChild(ex2); }
return wrap;
}
function renderOrder(ex){
const wrap=document.createElement('div'); wrap.className='ex'+(DONE[ex._id]?' done':'');
wrap.innerHTML=`№${ex._gid}дараалал · ${ex.tag}${agentTags(ex)}
${ex.q}
`;
const seqLbl=document.createElement('div'); seqLbl.className='lbl'; seqLbl.textContent='Таны дараалал';
const seq=document.createElement('div'); seq.className='seq';
const poolLbl=document.createElement('div'); poolLbl.className='lbl'; poolLbl.textContent='Доорхоос дарж нэмнэ';
const pool=document.createElement('div'); pool.className='pool';
const shuffled=ex.steps.map((s,i)=>({s,i})).sort(()=>Math.random()-0.5);
let chosen=[];
function paint(){
seq.innerHTML=''; chosen.forEach((c,idx)=>{
const b=document.createElement('button'); b.className='step'; b.type='button'; b.dataset.n=idx+1; b.textContent=c.s;
b.onclick=()=>{ if(seq.querySelector('.checked'))return; chosen.splice(idx,1); paint(); };
seq.appendChild(b);
});
pool.innerHTML=''; shuffled.forEach(o=>{
if(chosen.find(c=>c.i===o.i)) return;
const b=document.createElement('button'); b.className='step'; b.type='button'; b.textContent=o.s;
b.onclick=()=>{ chosen.push(o); paint(); };
pool.appendChild(b);
});
}
paint();
const btns=document.createElement('div'); btns.className='btns';
const check=document.createElement('button'); check.className='btn primary'; check.type='button'; check.textContent='Шалгах';
const reset=document.createElement('button'); reset.className='btn ghost'; reset.type='button'; reset.textContent='Цэвэрлэх';
reset.onclick=()=>{ chosen=[]; paint(); const old=wrap.querySelector('.verdict'); if(old)old.remove(); const oe=wrap.querySelector('.expl'); if(oe)oe.remove(); wrap.className='ex'; };
check.onclick=()=>{
if(chosen.length!==ex.steps.length){ flashMsg(wrap,'Бүх алхмыг эрэмбэлнэ үү.'); return; }
const ok=chosen.every((c,idx)=>c.i===idx);
const old=wrap.querySelector('.verdict'); if(old)old.remove();
const v=document.createElement('div'); v.className='verdict '+(ok?'ok':'no'); v.textContent=ok?'✓ Зөв дараалал!':'✗ Дараалал зөв биш. Дахин оролдоорой.';
wrap.appendChild(v);
if(ok){ wrap.classList.add('correct'); seq.querySelectorAll('.step').forEach(s=>{s.classList.add('checked');s.disabled=true;}); pool.querySelectorAll('.step').forEach(s=>s.disabled=true);
const e=document.createElement('div'); e.className='expl'; e.innerHTML='Тайлбар: '+ex.e; wrap.appendChild(e); complete(ex._id); wrap.classList.remove('done');
} else { wrap.classList.add('wrong'); }
};
btns.appendChild(check); btns.appendChild(reset);
wrap.appendChild(seqLbl); wrap.appendChild(seq); wrap.appendChild(poolLbl); wrap.appendChild(pool); wrap.appendChild(btns);
if(DONE[ex._id]){ const e=document.createElement('div'); e.className='expl'; e.innerHTML='Тайлбар: '+ex.e; wrap.appendChild(e); }
return wrap;
}
function renderPrompt(ex){
const wrap=document.createElement('div'); wrap.className='ex'+(DONE[ex._id]?' done':'');
wrap.innerHTML=`№${ex._gid}промпт · ${ex.tag}${agentTags(ex)}
${ex.q}
`;
const ta=document.createElement('textarea'); ta.placeholder='Энд өөрийн хувилбараа бичээрэй...';
const btns=document.createElement('div'); btns.className='btns';
const show=document.createElement('button'); show.className='btn primary'; show.type='button'; show.textContent='Жишээ хариу & шалгуур харах';
const model=document.createElement('div'); model.className='model';
let tipsHtml=(ex.tips||[]).map(t=>`${t}`).join('');
model.innerHTML=`Жишээ хувилбар
${escapeHtml(ex.model)}Сайн хариу ийм шинжтэй:
${tipsHtml}`;
show.onclick=()=>{ model.classList.add('show'); if(!DONE[ex._id]){ complete(ex._id); wrap.classList.remove('done'); wrap.classList.add('correct'); } show.textContent='✓ Дуусгасан'; };
btns.appendChild(show);
wrap.appendChild(ta); wrap.appendChild(btns); wrap.appendChild(model);
if(DONE[ex._id]){ model.classList.add('show'); show.textContent='✓ Дуусгасан'; wrap.classList.add('correct'); }
return wrap;
}
function agentTags(ex){
return (ex.agents||[]).map(id=>{ const a=AGENTS.find(x=>x.id===id); return a?`${a.em} ${a.nm}`:''; }).join('');
}
function escapeHtml(s){ return s.replace(/&/g,'&').replace(//g,'>'); }
function flashMsg(wrap,msg){ let m=wrap.querySelector('.verdict'); if(!m){m=document.createElement('div');m.className='verdict no';wrap.appendChild(m);} m.textContent=msg; }
/* ---- Build modules ---- */
const modulesEl=document.getElementById('modules');
let gid=0;
COURSE.forEach((m,mi)=>{
m.exercises.forEach(ex=>{ ex._gid=++gid; });
const mod=document.createElement('div'); mod.className='module'; if(mi===0) mod.classList.add('open');
const head=document.createElement('button'); head.className='mhead'; head.type='button'; head.setAttribute('aria-expanded', mi===0?'true':'false');
head.style.setProperty('--ac',m.color);
head.innerHTML=`${m.icon}
${m.title}${m.sub}
0/${m.exercises.length}
▶`;
const body=document.createElement('div'); body.className='mbody';
const intro=document.createElement('div'); intro.className='mintro'; intro.textContent=m.intro; body.appendChild(intro);
head.onclick=()=>{
const open=mod.classList.toggle('open');
head.setAttribute('aria-expanded', open?'true':'false');
if(open && !body.dataset.built){ buildBody(m,body); body.dataset.built='1'; }
};
if(mi===0){ buildBody(m,body); body.dataset.built='1'; }
mod.appendChild(head); mod.appendChild(body); modulesEl.appendChild(mod);
});
function buildBody(m,body){
m.exercises.forEach(ex=>{
let node;
if(ex.type==='mc') node=renderMC(ex);
else if(ex.type==='order') node=renderOrder(ex);
else node=renderPrompt(ex);
body.appendChild(node);
});
}
/* ---- Reset ---- */
document.getElementById('resetBtn').onclick=()=>{
if(confirm('Бүх ахицыг арилгах уу? Энэ үйлдлийг буцаах боломжгүй.')){
DONE={}; AGENTXP={}; save(); location.reload();
}
};
refreshTeam(); refreshTotals();