Data Table
数据表格
The backbone of admin UIs: one field per column, sortable headers, row actions, pagination at the bottom.
WebDesktopData & WorkContent areaComponent
大白话说明
数据表格为「大量同构数据的查找与处理」而生：表头支持排序与筛选，行支持勾选批量操作，长文本截断、状态用徽章、金额右对齐。密度可调是标配，因为运营和财务看同一张表的耐心完全不同。
什么时候用
记录数超过 20 条、字段超过 4 列、需要对比与批量操作时——它没有对手。
什么时候不用
移动端别硬塞表格：转成卡片列表；字段只有两三个时列表更轻。
细节与变体
- 行内操作超过 2 个必须收进「更多」，否则每行都是一排按钮墙
- 空表格也要保留表头并给空状态说明，别只剩一片白
- 固定第一列或表头吸顶，长表滚动时不迷路
Matching prompt (fill in & copy)
Reference implementations (open source)
- Ant Design ↗ MIT · 免费（MIT）
The de-facto standard for admin interfaces in China — tables, forms, lists.
- Carbon Design System ↗ Apache-2.0 · 免费（Apache-2.0）
IBM's design system — a benchmark for token systems and data-dense interfaces.
- MUI ↗ MIT · 免费（MIT，核心）
The most established Material component library for React.