// 已归档区（done / 取消，时间倒序分页）+ 归档详情模态
function ArchiveRow({ item, t, onOpen }) {
const { ComplexityBadge, StatusChip } = window.MaestroDesignSystem_a6a290;
const [hover, setHover] = React.useState(false);
return (
onOpen(item)} title={t.archiveTip}
onMouseEnter={() => setHover(true)} onMouseLeave={() => setHover(false)}
style={{
display: 'flex', alignItems: 'center', gap: 10, cursor: 'pointer',
padding: '7px 12px', fontSize: 12.5,
borderBottom: '1px dashed var(--line-soft)',
background: hover ? 'var(--panel)' : 'transparent',
}}>
{item.title}{item.id}
{item.subs ? {t.archiveSubs.replace('{n}', item.subs)} : null}
{item.time}
);
}
function SizeSelect({ size, setSize, t }) {
const [open, setOpen] = React.useState(false);
const [hover, setHover] = React.useState(false);
const ref = React.useRef(null);
React.useEffect(() => {
if (!open) return;
const onDoc = (e) => { if (ref.current && !ref.current.contains(e.target)) setOpen(false); };
document.addEventListener('mousedown', onDoc);
return () => document.removeEventListener('mousedown', onDoc);
}, [open]);
return (
{open ? (
{[10, 20, 50, 100].map((n) => {
const active = n === size;
return (
);
})}
) : null}
);
}
function ArchivePager({ page, pages, size, setPage, setSize, t }) {
const { Button } = window.MaestroDesignSystem_a6a290;
return (
{pages > 1 ? (
{t.pageOf.replace('{a}', page).replace('{b}', pages)}
) : null}
);
}
function ArchiveSection({ items, t, onOpen }) {
const [page, setPage] = React.useState(1);
const [size, setSize] = React.useState(20);
if (!items.length) return null;
const pages = Math.max(1, Math.ceil(items.length / size));
const cur = Math.min(page, pages);
const slice = items.slice((cur - 1) * size, cur * size);
return (
▣{t.archive} · {items.length}
{ setSize(n); setPage(1); }} t={t} />
);
}
// 归档详情模态（只读：属性 / 产出 / 执行历史 / 结果 / 审批 / 时间线）
function ArchiveModal({ item, t, onClose }) {
const { ComplexityBadge, StatusChip, Timeline } = window.MaestroDesignSystem_a6a290;
React.useEffect(() => {
const onKey = (e) => { if (e.key === 'Escape') onClose(); };
window.addEventListener('keydown', onKey);
return () => window.removeEventListener('keydown', onKey);
}, [onClose]);
if (!item) return null;
const d = item.detail || {};
const label = (text) => {text}
;
const doc = (text) => (
{text}
);
const kvGrid = { fontSize: 12, display: 'grid', gridTemplateColumns: 'auto 1fr', gap: '3px 12px', margin: 0 };
return (
{t.archiveDetail}
{item.title}
{d.attrs ?
{d.attrs.map(([k, v], i) => (
- {k}
- {v}
))}
: null}
{d.spec ?
{label('SPEC · 方案')}{doc(d.spec)} : null}
{d.ops ?
{label('OPERATIONS · 操作')}{doc(d.ops)} : null}
{d.runs && d.runs.length ?
{label(t.runsLabel + '（' + d.runs.length + '）')}
{d.runs.map((r, i) => (
- {r.kind} · {r.status}
- {r.span}{r.ref ? {r.ref} : null}
))}
: null}
{d.result ?
{label(t.resultLabel)}
- {t.branch}
- {d.result.branch}
- commits
- {d.result.commits.join(' · ')}
- diff
- {d.result.diff}
: null}
{d.approvals && d.approvals.length ?
{label(t.approvalsLabel)}
{d.approvals.map((a, i) => (
- {a.gate} · {a.action === 'accept' ? t.accepted : t.rejected}
- {t.approver} {a.actor} · {a.at}{a.reason ? ↳ {a.reason} : null}
))}
: null}
{d.timeline && d.timeline.length ?
{label(t.timelineLabel)}
: null}
);
}
Object.assign(window, { MaestroKitArchiveSection: ArchiveSection, MaestroKitArchiveModal: ArchiveModal });