/* ZY console — 运营执行台（员工 / COO）：业务待办账。 */
const DSOPS = window.ZYDesignSystem_d746df;

function KitTodo({ onNav }) {
  const { Card, SectionHead, Pill, Icon } = DSOPS;
  const K = window.KIT, S = window.KitStrip, Kp = window.KitKpi;
  const PRI = { "高": "danger", "中": "warn", "低": "neutral" };
  const ST = { "待处理": "warn", "处理中": "accent", "已完成": "good" };
  const pending = K.todos.filter(t => t.status === "待处理").length;
  const high = K.todos.filter(t => t.pri === "高" && t.status !== "已完成").length;
  const inprog = K.todos.filter(t => t.status === "处理中").length;
  const go = (t) => { if (t.status !== "已完成" && t.target && onNav) onNav(t.target); };
  const tpl = "0.6fr 0.8fr 2fr 0.5fr 0.9fr 0.7fr 1.5fr";
  return (
    <div className="view viewfade">
      <S icon="ListChecks" title="业务待办账" mode="执行闭环" judge="跨领域每日第一站 · 今天必须处理什么、处理标准、处理完在哪反馈、哪些被 COO 监管" src="跨域待办聚合" toneLabel="" />
      <div className="kpigrid">
        <Kp label="待处理" value={pending} hint="今天必须处理" pill="待办" pillTone="warn" feat valTone={pending ? "ovstat--warn" : ""} />
        <Kp label="高优先级" value={high} hint="优先闭环" pill="优先" pillTone="danger" valTone={high ? "ovstat--danger" : ""} />
        <Kp label="处理中" value={inprog} hint="已受理待闭环" icon="Loader" iconColor="var(--accent)" />
        <Kp label="COO 监管" value="全部" hint="每项有唯一负责人" icon="Network" />
      </div>
      <Card>
        <SectionHead title="今日待办" icon="ListChecks" sub="点任意一行 → 直达对应负责区处理；每项标注处理标准（关闭规则）与监管 COO" />
        <div className="dtscroll"><div className="dt" style={{ minWidth: 920 }}>
          <div className="dt__head" style={{ gridTemplateColumns: tpl }}><span>编号</span><span>领域</span><span>事项 · 关闭规则</span><span>优先</span><span>负责人</span><span>状态</span><span>处理入口</span></div>
          {K.todos.map(t => {
            const done = t.status === "已完成";
            return (
              <div className={"dt__row" + (done ? "" : " dt__row--click")} style={{ gridTemplateColumns: tpl }} key={t.id}
                onClick={() => go(t)} role={done ? undefined : "button"} tabIndex={done ? undefined : 0}
                onKeyDown={done ? undefined : (e => { if (e.key === "Enter" || e.key === " ") { e.preventDefault(); go(t); } })}>
                <span className="dt__id num">{t.id}</span>
                <span className="dt__sub2">{t.domain}</span>
                <span className="dt__name">
                  <b>{t.title}</b>
                  <span className="dt__sub2" style={{ whiteSpace: "normal" }}>关闭：{t.close}</span>
                </span>
                <span><Pill tone={PRI[t.pri]} soft>{t.pri}</Pill></span>
                <span className="dt__sub2">{t.owner}</span>
                <span><Pill tone={ST[t.status]} soft>{t.status}</Pill></span>
                <span>
                  {done
                    ? <span className="dt__sub2" style={{ display: "inline-flex", alignItems: "center", gap: 5 }}><Icon name="CircleCheck" size={13} />已闭环</span>
                    : <span className="dt__goentry"><span className="dt__goentry__to">{t.entry}</span><span className="dt__goentry__btn">去处理<Icon name="ArrowRight" size={13} /></span></span>}
                </span>
              </div>
            );
          })}
        </div></div>
      </Card>
    </div>
  );
}

Object.assign(window, { KitTodo });