/* 智能学情分析：完全由当前子女数据驱动 */
function Analysis() {
  const { activeChild:c } = useStore();
  const { go } = useNav();
  const [range,setRange] = React.useState('6m');
  const subs = c.subjectList;
  const hasExams = c.exams.length > 0;
  const subjAvg = Selectors.subjectAvg(c);
  const stab = Selectors.stability(c);
  const classAvg = Selectors.classAvgBySubject(c);
  const gradeAvg = Selectors.gradeAvgBySubject(c);

  const ranked = subs.slice().sort((a,b)=>subjAvg[b]-subjAvg[a]);
  const strong = ranked[0] || null, weak = ranked[ranked.length-1] || null, mid = ranked[ranked.length-2] || null;
  const avgAll = Selectors.avgRate(c);

  const trendColors = { '语文':'#e0697f','数学':'#4ea3dd','英语':'#56c79f','物理':'#9b8cf0','化学':'#f5a35e','科学':'#5cc7d6' };
  const trendLines = subs.map(s=>({ name:s, color:trendColors[s]||'#888', data:Selectors.monthlyTrend(c,s), area:s===strong }));

  const stabRank = subs.slice().sort((a,b)=>stab[b]-stab[a]);
  const stabLabel = v=> v>=90?['很稳定','var(--green-600)']: v>=80?['较稳定','var(--blue-600)']: v>=70?['有波动','var(--orange-500)']:['波动大','var(--coral)'];

  if (!hasExams || subs.length === 0) {
    return <Card style={{background:'var(--blue-50)',borderColor:'var(--blue-100)'}}>
      <div className="card-head"><h3 style={{color:'var(--blue-600)'}}>暂无学情分析</h3></div>
      <div style={{fontSize:13.5,color:'var(--ink-2)',lineHeight:1.7,marginBottom:16}}>当前账号还没有录入考试成绩。录入成绩后，系统会基于你的真实数据生成趋势、强弱学科、稳定性和学习建议。</div>
      <Button size="lg" icon={<Ico d={Icons.edit} size={18}/>} onClick={()=>go('entry')}>去录入成绩</Button>
    </Card>;
  }

  const SUGG = {
    weak: { tone:'coral', tag:'优先突破', tagcls:'bg-coral-soft', li:['基础题专项巩固，每日打卡 2 题','整理近 3 次错题，定位高频失分知识点','建立公式 / 知识手册，强化步骤规范'] },
    mid: { tone:'orange', tag:'稳步提升', tagcls:'bg-orange-soft', li:['专项训练薄弱模块，减少粗心失分','常态化刷题，保持手感','考前回顾答题规范与时间分配'] },
    strong: { tone:'green', tag:'拔高拓展', tagcls:'bg-green-soft', li:['尝试压轴题与拓展专题，冲刺满分','限时训练保持速度与稳定','整理一题多解，提升思维灵活度'] },
  };

  const suggestList = [];
  if (weak) suggestList.push({sub:weak,...SUGG.weak,label:'薄弱'});
  if (mid) suggestList.push({sub:mid,...SUGG.mid,label:'待提升'});
  if (strong) suggestList.push({sub:strong,...SUGG.strong,label:'优势'});

  const donutData = ranked.map(s=>({ name:`${s} ${subjAvg[s]>=90?'优势':subjAvg[s]>=82?'良好':subjAvg[s]>=75?'待提升':'薄弱'}`, value:Math.round(subjAvg[s]), color:trendColors[s] || '#888' }));

  return <>
    <Card style={{display:'flex',alignItems:'center',gap:16,marginBottom:18}}>
      <div className="section-title" style={{margin:0}}><span className="bar"></span>分析时间范围</div>
      <div className="time-seg">{[['3m','近3月'],['6m','近6月'],['12m','近12月'],['term','本学期'],['all','全学段']].map(([k,t])=><span key={k} className={range===k?'on':''} onClick={()=>setRange(k)}>{t}</span>)}</div>
      <div style={{marginLeft:'auto',display:'flex',gap:10,alignItems:'center'}}>
        <Tag tone="green" dot>报告已更新至 5月</Tag>
      </div>
    </Card>

    <div className="summary-box" style={{marginBottom:18}}>
      {strong && <div className="sb" style={{background:'var(--green-50)'}}><div className="t" style={{color:'var(--green-600)'}}>✓ 核心优势</div><div className="c">{strong}{ranked[1]?`、${ranked[1]}`:''} 表现突出，平均得分率 {subjAvg[strong]?.toFixed(0) || 0}%，发挥稳定，可适当增加拔高训练。</div></div>}
      {weak && <div className="sb" style={{background:'var(--coral-50)'}}><div className="t" style={{color:'var(--coral)'}}>! 重点短板</div><div className="c">{weak} 平均得分率 {subjAvg[weak]?.toFixed(0) || 0}%{stab[weak] && stab[weak]<70?'，且波动幅度最大':''}，为主要失分点，建议专项突破。</div></div>}
      <div className="sb" style={{background:'var(--blue-50)'}}><div className="t" style={{color:'var(--blue-600)'}}>↗ 阶段结论</div><div className="c">综合平均得分率 {avgAll.toFixed(1)}%，整体{avgAll>=85?'稳步上升':'平稳'}；建议{strong?'保持优势、':'继续录入成绩，'}集中突破{weak?` ${weak}`:'薄弱环节'}。</div></div>
    </div>

    <div className="row-a">
      <Card>
        <div className="card-head"><h3>成绩时序趋势</h3><span className="sub">得分率 %</span><div className="spacer"></div>
          <div style={{display:'flex',gap:6,flexWrap:'wrap'}}>{subs.map(s=><Tag key={s} tone="gray"><span className="dt" style={{background:trendColors[s]}}></span>{s}</Tag>)}</div>
        </div>
        <EChart option={ChartOpt.trend(MONTH_LABEL, trendLines, 55, 100)} height={300}/>
      </Card>
      <Card>
        <div className="card-head"><h3>学科强弱分布</h3><div className="spacer"></div></div>
        <EChart option={ChartOpt.donut(donutData)} height={300}/>
      </Card>
    </div>

    <div className="row-b">
      <Card>
        <div className="card-head"><h3>考试稳定性</h3><div className="spacer"></div></div>
        <div className="stab-list">{stabRank.map(s=>{ const [t,col]=stabLabel(stab[s]); return (
          <div className="stab" key={s}><div className="nm"><SubjDot name={s}/>{s}</div>
            <div className="progress" style={{flex:1}}><i style={{width:stab[s]+'%',background:trendColors[s]}}></i></div>
            <div className="meta" style={{color:col}}>{t}</div></div>
        );})}</div>
        <hr className="hr"/>
        <div style={{fontSize:12,color:'var(--ink-3)',lineHeight:1.6}}>稳定性 = 各科历次成绩波动幅度的反向评分，越高代表发挥越稳定。</div>
      </Card>
      <Card>
        <div className="card-head"><h3>个人 vs 班级 vs 年级</h3><span className="sub">平均得分率 %</span><div className="spacer"></div></div>
        <EChart option={ChartOpt.barGroup(subs, [
          { name:'本人', data:subs.map(s=>Math.round(subjAvg[s])) },
          { name:'班级', data:subs.map(s=>classAvg[s]||Math.round(subjAvg[s]-8)) },
          { name:'年级', data:subs.map(s=>gradeAvg[s]||Math.round(subjAvg[s]-10)) },
        ], 55, 100)} height={280}/>
      </Card>
    </div>

    <div className="section-title"><span className="bar" style={{background:'var(--orange-400)'}}></span>个性化学习建议 <span className="muted" style={{fontWeight:500,marginLeft:6}}>系统根据 {c.name} 的数据自动生成</span></div>
    <div className="suggest-grid">
      {suggestList.map((sg,i)=>(
        <div className="suggest" key={i}>
          <div className="sh"><span className="subj-dot" style={{background:trendColors[sg.sub],width:11,height:11}}></span><b style={{fontSize:15}}>{sg.sub} · {sg.label}</b><span className={'tagx '+sg.tagcls} style={{marginLeft:'auto'}}>{sg.tag}</span></div>
          <ul>{sg.li.map((l,j)=><li key={j}>{l}</li>)}</ul>
        </div>
      ))}
    </div>
  </>;
}
Object.assign(window, { Analysis });
