概述
RecordListView 是前台查看对象记录列表的核心组件。它展示类似 Salesforce 的数据表格，支持切换不同的列表视图（List View）、新建/编辑/删除记录、批量选择操作，以及列表视图本身的新建和编辑。
🖼️
RecordListView 页面截图 — 待插入
../../images/product/one_platform/record-list-view-overview.png
页面结构
RecordListView 页面结构
PageHeader
[Icon] ObjectName[List Views ▼][New][Delete]↻
{N} items | 控件: [⚙] [📊] [✏] [↻] [📈] [🔽]
DataTable
| ☐ | Name | Field1 | Field2 | Field3 |
|---|
| ☐ | Record1 | value1 | value2 | value3 |
| ☐ | Record2 | value1 | value2 | value3 |
行操作: [Upsert]
核心功能
1. 列表视图切换
通过 PageHeader 中的下拉切换不同的 List View，每个 List View 定义了显示的列、过滤条件和排序规则。
2. 记录操作
- New：新建记录（打开 RecordForm Modal）
- Delete：批量删除选中记录
- Refresh：刷新数据
- Upsert：更新或插入记录（行操作）
3. 列表视图管理
- New Listview：打开 ListViewForm 创建新视图
- Edit Listview：编辑当前选中的视图
4. 动态列生成
DataTable 的列根据记录数据动态生成，Name 列可点击跳转到记录详情，动态列从记录中提取非保留字段并自动格式化标签。
5. 导航
- SPA 模式：
{ type: 'record', objectName, recordId } - 路由模式：
/one/o/{objectName}/{recordId}
组件树
RecordListViewWrapper
ObjectListView (Class Component)
PageHeader
Icon (根据 objectName 动态选择)
Dropdown (List Views 切换)
Actions: [New] [Delete] [Refresh]
Controls: [⚙] [📊] [✏] [↻] [📈] [🔽]
DataTable
DataTableColumn (固定: Name + 动态列)
DataTableRowActions (Upsert)
ToastContainer (通知)
ListViewForm (Modal)
RecordFormModal (Modal)
RecordForm (ref)
技术要点
- 组件类型：Class Component + Functional Wrapper
- 记录处理：自动将 null/undefined 的 Name 替换为记录 ID
- 动态列：自动格式化驼峰字段名为可读标签
- SPA 兼容：SPA 切换 Tab 时重新加载数据
- Redux 集成：加载对象默认布局和字段列表
- 组件库：
@salesforce/design-system-react 的 PageHeader, DataTable
截图
🖼️
RecordListView 完整页面 — 待插入
../../images/product/one_platform/record-list-view-full.png
🖼️
List Views 下拉切换 — 待插入
../../images/product/one_platform/record-list-view-dropdown.png
🖼️
新建记录 RecordForm Modal — 待插入
../../images/product/one_platform/record-list-view-new.png
🖼️
批量选择删除 — 待插入
../../images/product/one_platform/record-list-view-delete.png
🖼️
控件菜单展开 — 待插入
../../images/product/one_platform/record-list-view-controls.png