@@ -82,6 +82,10 @@ function DataDetail({ indicator, onBack }) {
|
||||
const rows = (i.points || [])
|
||||
// 图表 X 轴统一用 period 字段
|
||||
const chartRows = rows.map((r) => ({ ...r, period: periodOf(r) }))
|
||||
// 表格按时间反序: 最新在前
|
||||
const tableRows = [...rows].reverse()
|
||||
const [showAll, setShowAll] = useState(false)
|
||||
const visibleRows = showAll ? tableRows : tableRows.slice(0, 10)
|
||||
const lp = lastPoint({ rows })
|
||||
const { trend } = calcTrend(rows)
|
||||
const title = i.title || i.name
|
||||
@@ -106,17 +110,22 @@ function DataDetail({ indicator, onBack }) {
|
||||
</LineChart>
|
||||
</ResponsiveContainer>
|
||||
</div>
|
||||
<div style={{ maxHeight: 240, overflow: 'auto' }}>
|
||||
<div className={'data-table-wrap' + (showAll ? ' scroll' : '')}>
|
||||
<table className="data-table">
|
||||
<thead>
|
||||
<tr><th>月份</th><th style={{ textAlign: 'right' }}>数值</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{rows.map((r) => (
|
||||
{visibleRows.map((r) => (
|
||||
<tr key={periodOf(r)}><td>{periodOf(r)}</td><td style={{ textAlign: 'right' }}>{r.value}</td></tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
{tableRows.length > 10 && !showAll && (
|
||||
<div className="table-more" onClick={() => setShowAll(true)}>
|
||||
展开全部(共 {tableRows.length} 行)
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user