{CMP_MUNIS.filter((m) => m.lab).map((mu) => {
const on = muni && muni.name === mu.name;
const col = CMP_REGION[mu.region].color;
return (
);
})}
);
}
/* ---------- Period picker (left panel) ---------- */
function PeriodPicker({ a, b, setA, setB, active, setActive, range, setRange, metric, setMetric }) {
const cur = active === 'A' ? a : b;
const setCur = active === 'A' ? setA : setB;
const months = Array.from({ length: 12 }, (_, i) => i + 1);
return (
价格走势
年度均价 · TRREB Market Watch
{/* A / B period tabs */}
{[['A', a, CHART.green], ['B', b, CHART.steel]].map(([id, p, col]) => (
))}
{/* year grid */}
年份 · 设置对比期 {active}
{CMP_YEARS.slice().reverse().map((y) => {
const isA = a.year === y, isB = b.year === y;
const col = isA ? CHART.green : isB ? CHART.steel : null;
return (
);
})}
{/* month rows */}
{[['A', a, setA, CHART.green], ['B', b, setB, CHART.steel]].map(([id, p, setP, col]) => (
{id} · {p.year} 年 — 选月份
{months.map((m) => {
const on = p.month === m;
return (
);
})}
))}
);
}
/* ---------- Comparison table (right panel) ---------- */
function CompareTable({ a, b, muni }) {
const mm = muni ? muni.m : 1;
return (