增强组件总览
这里不再把增强层理解成“每一个局部区块都值得公开成一个组件”。收口后的心智是:对外主推少数真正有稳定契约的核心公开件,其余能力通过场景页、页面容器和内部片段来理解。
如果你是在收后台项目里的页面级样式,先看 后台迁移指南,再回到这里挑选增强层入口。
核心表单与筛选
- SearchForm 搜索表单:统一筛选栏布局、查询动作和折叠字段。
- ProForm 增强表单:统一表单网格、标题和动作区。
- OverlayForm 覆盖层表单:统一覆盖层编辑内核。
- DialogForm 弹窗表单:固定弹窗容器的 facade,适合明确的弹窗编辑链路。
- DrawerForm 抽屉表单:固定抽屉容器的 facade,适合保留页面上下文的侧滑编辑链路。
- FilterPanel 筛选面板:统一高级筛选容器。
- RequestForm 请求表单:统一加载、提交和表单骨架。
- LoginForm 登录表单:统一认证场景里的登录主链路和第三方登录入口展示。
- StepsForm 分步表单:统一多阶段录入流程。
核心列表与数据
- ProTable 增强表格:统一工具栏、搜索区、表格本体和分页联动。
- ColumnSettingPanel 列设置面板:统一列显隐配置入口。
- SavedViewTabs 视图页签:统一后台常见的视图切换和保存入口。
- TableFilterDrawer 表格筛选抽屉:统一高级筛选抽屉。
- ImportResultTable 导入结果表格:统一导入反馈摘要和结果明细。
- ListPage 列表页面容器:统一列表页骨架。
- CrudPage 增删改查页面:统一列表、编辑和查看闭环。
核心详情与历史
- AuditTimeline 审计时间线:统一历史记录与审批说明。
- DetailPanel 详情面板:统一覆盖层中的详情查看,不再把抽屉详情和弹窗详情拆成两套主心智。
- DetailPage 详情页面容器:统一完整详情页骨架。
流程与任务
- ApprovalFlowPanel 审批流面板:统一审批进度和节点展示。
- ImportWizard 导入向导:统一导入流程步骤。
- ExportTaskPanel 导出任务面板:统一导出任务状态展示。
页面布局
- PageHeader 页面头部:统一页面标题、描述、元信息和动作区。
- PageContainer 页面容器:统一头部、主体内容、footer 和 loading 壳层。
- StatCard 指标卡片:统一后台首页和运营面板里的数字指标展示。
- AsyncStateContainer 异步状态容器:统一加载、空态、错误和恢复动作承载。
- SplitLayoutPage 分栏布局页:统一主从布局与侧栏布局,不再把两种双栏工作区拆成并列主心智。
当前不再主推为独立公开件
- 诸如列表头、批量操作条、筛选预设、详情分区、附件区、操作日志区这类能力,后续更适合作为页面容器内部块、slot 片段或场景用法出现。
- 当前仓库里仍保留这些页面和实现,但这个总览页不再把它们作为增强层的第一入口。
推荐阅读顺序
- 先看 SearchForm 搜索表单、ProTable 增强表格 和 ListPage 列表页面容器,理解后台列表页主干。
- 再看 OverlayForm 覆盖层表单、DialogForm 弹窗表单、DrawerForm 抽屉表单、LoginForm 登录表单、StepsForm 分步表单、CrudPage 增删改查页面,补齐编辑链路。
- 接着看 DetailPanel 详情面板、DetailPage 详情页面容器、AuditTimeline 审计时间线,补齐查看和历史记录。
- 再看 PageHeader 页面头部、PageContainer 页面容器、StatCard 指标卡片,补齐页面展示壳层。
- 最后看 ApprovalFlowPanel 审批流面板、ImportWizard 导入向导、ExportTaskPanel 导出任务面板,理解更重的业务流场景。
- 然后进入 增强组件示例总览,按场景和闭环查看整套接法。