/* ZY console — 系统审计（其余）：Worker 集群 / 数据接入 / 大模型用量 / 运营命令台。 */
const DSAX = window.ZYDesignSystem_d746df;

function KitWorkers() {
  const { Card, SectionHead, Pill, Icon } = DSAX;
  const K = window.KIT, S = window.KitStrip, Kp = window.KitKpi;
  const BEAT = { good: "good", accent: "accent", danger: "danger" };
  const active = K.workers.filter(w => w.beat !== "danger").length;
  const tpl = "1.1fr 0.9fr 1.6fr 1.2fr 0.7fr 0.7fr";
  return (
    <div className="view viewfade">
      <S icon="Cpu" title="Worker 集群 · 手脚" mode="架构师 / 系统管理员" judge="OpenClaw（大脑·任务调度）+ Hermes（记忆·复盘）+ Worker（手脚·执行节点）" src="openclaw + worker nodes" toneLabel="只读" />
      <Card style={{ display: "flex", alignItems: "center", gap: 15, background: "linear-gradient(120deg,#1F1B18,#2C2622)", color: "#fff", border: "none" }} pad>
        <span style={{ width: 46, height: 46, borderRadius: 13, flexShrink: 0, display: "grid", placeItems: "center", background: "rgba(255,255,255,.12)" }}><Icon name="BrainCircuit" size={22} /></span>
        <div style={{ flex: 1, minWidth: 0 }}>
          <div style={{ fontSize: 16, fontWeight: 700, display: "flex", alignItems: "center", gap: 11, flexWrap: "wrap" }}>OpenClaw + Hermes
            <span style={{ display: "inline-flex", alignItems: "center", gap: 6, fontSize: 11.5, fontWeight: 600, background: "rgba(120,220,160,.18)", color: "#8FE6B0", borderRadius: 999, padding: "3px 10px" }}><span style={{ width: 6, height: 6, borderRadius: "50%", background: "#5FD08A" }} />在线</span>
          </div>
          <div style={{ fontSize: 12.5, color: "rgba(255,255,255,.66)", marginTop: 5 }}>读优先 + 人在环 · 多数运行产出只读快照与复核包 · 写入走受控动作四闸门</div>
        </div>
      </Card>
      <div className="kpigrid">
        <Kp label="执行节点" value={K.workers.length} hint="Worker 集群" icon="Cpu" />
        <Kp label="运行中" value={active} hint="心跳正常" valTone="good" feat />
        <Kp label="空闲 / 离线" value={K.workers.length - active} hint="无任务或失联" pill="关注" pillTone="warn" />
        <Kp label="业务写入" value="0" hint="只在受控动作内发生" pill="no-write" pillTone="good" valTone="good" />
      </div>
      <Card>
        <SectionHead title="节点明细" icon="Cpu" sub="主机 / 任务 / 归属 COO / 心跳 / CPU" />
        <div className="dtscroll"><div className="dt" style={{ minWidth: 760 }}>
          <div className="dt__head" style={{ gridTemplateColumns: tpl }}><span>节点</span><span>主机</span><span>任务</span><span>归属 COO</span><span>心跳</span><span>CPU</span></div>
          {K.workers.map(w => (
            <div className="dt__row" style={{ gridTemplateColumns: tpl }} key={w.id}>
              <span className="dt__name"><b>{w.name}</b><span className="dt__sub num">{w.id}</span></span>
              <span className="dt__sub2 num">{w.host}</span>
              <span className="dt__item">{w.task}</span>
              <span className="dt__sub2">{w.coo}</span>
              <span><Pill tone={BEAT[w.beat]} soft>{w.beat === "danger" ? "离线" : w.beat === "accent" ? "忙" : "正常"}</Pill></span>
              <span className="num">{w.cpu}%</span>
            </div>
          ))}
        </div></div>
      </Card>
    </div>
  );
}

function KitAccounts() {
  const { Card, SectionHead, Pill } = DSAX;
  const K = window.KIT, S = window.KitStrip, Kp = window.KitKpi;
  const TONE = { "已接入": "good", "延迟": "warn", "待接入": "neutral" };
  const ok = K.accounts.filter(a => a.status === "已接入").length;
  const tpl = "1.3fr 0.7fr 1.3fr 0.8fr 0.9fr";
  return (
    <div className="view viewfade">
      <S icon="Plug" title="数据接入 · 账号" mode="架构师 / 系统管理员" judge="店铺 / 广告 / 私域 / ERP 接入状态与同步 · 账号绑定" src="account bindings" toneLabel="只读" />
      <div className="kpigrid">
        <Kp label="接入账号" value={K.accounts.length} hint="店铺 / 广告 / 私域 / ERP" icon="Plug" />
        <Kp label="已接入" value={ok} hint="正常同步" valTone="good" feat />
        <Kp label="延迟" value={K.accounts.filter(a => a.status === "延迟").length} hint="超阈值" pill="关注" pillTone="warn" />
        <Kp label="写入" value="0" hint="接入层只读" pill="no-write" pillTone="good" valTone="good" />
      </div>
      <Card>
        <SectionHead title="账号接入明细" icon="Plug" />
        <div className="dtscroll"><div className="dt" style={{ minWidth: 640 }}>
          <div className="dt__head" style={{ gridTemplateColumns: tpl }}><span>账号</span><span>类型</span><span>系统</span><span>状态</span><span>同步</span></div>
          {K.accounts.map((a, i) => (
            <div className="dt__row" style={{ gridTemplateColumns: tpl }} key={i}>
              <span className="dt__item" style={{ fontWeight: 600 }}>{a.name}</span>
              <span className="dt__sub2">{a.type}</span>
              <span className="dt__sub2">{a.system}</span>
              <span><Pill tone={TONE[a.status]} soft>{a.status}</Pill></span>
              <span className={"dt__sub2" + (a.status === "延迟" ? " ovstat--warn" : "")}>{a.sync}</span>
            </div>
          ))}
        </div></div>
      </Card>
    </div>
  );
}

function KitLlm() {
  const { Card, SectionHead } = DSAX;
  const K = window.KIT, S = window.KitStrip, Kp = window.KitKpi;
  const cost = K.llmByCoo.reduce((s, r) => s + r.cost, 0);
  const tokens = K.llmByCoo.reduce((s, r) => s + r.tokens, 0);
  const tpl = "1.4fr 0.9fr 1fr 0.8fr";
  return (
    <div className="view viewfade">
      <S icon="BrainCircuit" title="大模型 · Token 用量" mode="架构师 / 系统管理员" judge="各 COO 的 LLM 接入与费用 · 按 COO 归集 Token 与成本" src="llm usage" toneLabel="只读" />
      <div className="kpigrid">
        <Kp label="本月费用" value={"$" + cost} hint="全部 COO 合计" icon="BrainCircuit" feat />
        <Kp label="本月 Token" value={(tokens / 1e6).toFixed(1) + "M"} hint="输入 + 输出" />
        <Kp label="接入 COO" value={K.llmByCoo.length} hint="按角色归集" />
        <Kp label="主模型" value="Claude" hint="统一接入" />
      </div>
      <Card>
        <SectionHead title="按 COO 用量" icon="BrainCircuit" />
        <div className="dtscroll"><div className="dt" style={{ minWidth: 520 }}>
          <div className="dt__head" style={{ gridTemplateColumns: tpl }}><span>COO</span><span>模型</span><span>Token</span><span>费用</span></div>
          {K.llmByCoo.map((r, i) => (
            <div className="dt__row" style={{ gridTemplateColumns: tpl }} key={i}>
              <span className="dt__item" style={{ fontWeight: 600 }}>{r.coo}</span>
              <span className="dt__sub2">{r.model}</span>
              <span className="num">{(r.tokens / 1e6).toFixed(2)}M</span>
              <span className="num">${r.cost}</span>
            </div>
          ))}
        </div></div>
      </Card>
    </div>
  );
}

function KitCmd({ onAct }) {
  const { Card, SectionHead, Pill, Button, Icon } = DSAX;
  const K = window.KIT, S = window.KitStrip;
  const RISK = { "查询": "good", "生成": "accent", "写入": "warn", "高危": "danger" };
  // 已提交老板审批的命令(key = it.cmd)——纯前端态,模拟「已提交老板审批 · 待拍板」，
  // 不在本页留下任何可自我核准的执行入口。
  const [submitted, setSubmitted] = React.useState({});

  // risk=生成 的命令(如 /monthly_report)只产出「需人工确认后发送」的草稿，业务数据本身不变，
  // 因此仍可直接执行——与 risk=写入/高危(有 handoff 字段) 的自我核准执行区分开。
  const run = (it) => {
    if (it.risk === "查询" || it.handoff) return;
    onAct({
      title: it.name, subject: it.cmd, phrase: "确认执行", danger: false,
      submitLabel: "确认执行", source: "command registry",
      preflight: "只生成执行材料，不写业务系统。",
      preview: [{ k: "指令", v: it.cmd }, { k: "风险级别", v: it.risk }],
      wont: ["不会自动发送客户消息", "写入留痕"],
      forbidden: [],
      rollbackNote: "时限内可撤销",
    });
  };

  // risk=写入/高危(handoff="boss_approval_queue")：不构造任何 KitControlledAction 自助执行 payload，
  // 只在本地标记「已提交老板审批」，并转入运营执行台(K.todos)的老板拍板队列——本页永远没有直接执行按钮。
  const submitForApproval = (it) => {
    setSubmitted(s => ({ ...s, [it.cmd]: true }));
  };

  return (
    <div className="view viewfade">
      <S icon="TerminalSquare" title="运营命令台" mode="架构师 / 系统管理员" judge="旧群指令页面化 · 每条命令标注后果与风险级别 · 写入 / 高危不可自助执行，只能提交老板审批" src="command registry" toneLabel="只读" />
      <div style={{ display: "flex", flexDirection: "column", gap: 16 }}>
        {K.cmdGroups.map((g, gi) => (
          <Card key={gi}>
            <SectionHead title={g.group} icon={g.group.includes("高危") ? "ShieldAlert" : g.group.includes("写入") ? "FilePen" : "Search"} />
            <div style={{ display: "flex", flexDirection: "column", gap: 10 }}>
              {g.items.map((it, i) => {
                const isHandoff = !!it.handoff;
                const isSubmitted = submitted[it.cmd];
                return (
                  <div key={i} style={{ display: "flex", alignItems: "center", justifyContent: "space-between", gap: 12, padding: "12px 13px", border: "1px solid " + (it.risk === "高危" ? "var(--negative)" : "var(--border)"), borderRadius: 12 }}>
                    <div style={{ minWidth: 0 }}>
                      <div style={{ fontSize: 13.5, fontWeight: 600, display: "flex", alignItems: "center", gap: 8 }}>{it.name}<span className="num" style={{ fontSize: 11.5, color: "var(--fg-3)" }}>{it.cmd}</span></div>
                      <div style={{ fontSize: 12, color: "var(--fg-3)", marginTop: 3 }}>{it.desc}</div>
                      {isHandoff && (
                        <div style={{ fontSize: 11.5, color: "var(--fg-3)", marginTop: 4, display: "flex", alignItems: "center", gap: 5 }}>
                          <Icon name="ArrowRightCircle" size={12} />
                          {isSubmitted ? "已提交老板审批 · 待拍板 · 见运营执行台" : "本命令不可自助执行 · 需提交老板审批（携带审批引用 + 老板写入口令）后由运营执行台拍板"}
                        </div>
                      )}
                    </div>
                    <div style={{ display: "flex", alignItems: "center", gap: 10, flexShrink: 0 }}>
                      <Pill tone={RISK[it.risk]} soft>{it.risk}</Pill>
                      {it.risk === "查询" ? (
                        <Button variant="ghost" size="sm" icon="Play">执行</Button>
                      ) : isHandoff ? (
                        isSubmitted
                          ? <Pill tone={it.risk === "高危" ? "danger" : "warn"} soft>已提交老板审批 · 待拍板</Pill>
                          : <Button variant={it.risk === "高危" ? "danger" : "solid"} size="sm" icon="Send" onClick={() => submitForApproval(it)}>提交老板审批</Button>
                      ) : (
                        <Button variant="solid" size="sm" onClick={() => run(it)}>执行</Button>
                      )}
                    </div>
                  </div>
                );
              })}
            </div>
          </Card>
        ))}
      </div>
    </div>
  );
}

Object.assign(window, { KitWorkers, KitAccounts, KitLlm, KitCmd });