iter(g36): 新增 result 结果页组件

This commit is contained in:
HIsheR
2026-10-26 11:47:48 +08:00
parent f1703b3e68
commit 8ac71c4efd
13 changed files with 195 additions and 9 deletions
+26 -1
View File
@@ -1,6 +1,6 @@
# @ui-arch 组件库 Agent 文档(无图形版)
> 自动生成于 2026-10-26T03:46:32.583Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
> 自动生成于 2026-10-26T03:47:28.088Z,数据源:各包 ua.manifest.json,勿手改。人类版文档站:apps/docs/index.html。
> 组件 = 普通函数,传 props 返回 DOM;状态用 signal 双向绑定:读 signal() 写 signal(v)。
## 快速上手
@@ -1142,6 +1142,30 @@ const { close } = notification({ title: '导出完成', description: 'report.csv
现场演示:apps/docs/demo.html#sec-notification
### result — 结果页 Result
参数:
- status:'success' | 'warning' | 'danger' | 'info' —— 终态语义色(图标底色);缺省 info
- title(必填):string —— 主标题
- description:string —— 补充说明;缺省不渲染
- extra:unknown —— 操作区内容(常见为主次按钮);缺省不渲染
示例:
```
result({ status: 'success', title: '提交成功', description: '工单 #2049 已受理', extra: button({ label: '查看工单', variant: 'primary', onClick: () => go() }) })
```
手把手:
1. status 决定图标底色(success 绿 / warning 黄 / danger 红 / info 蓝),整体居中排布
2. title 必填;description 用于说明原因或下一步,超过一行自动居中换行
3. extra 放操作区,常见为主按钮 + 幽灵按钮;不传则不渲染
4. 组件自带 role="status",插入页面后读屏会播报终态文案
现场演示:apps/docs/demo.html#sec-result
API 速览:
- button(props):按钮,variant = primary | ghost | danger,disabled 支持布尔或信号禁用
@@ -1189,6 +1213,7 @@ API 速览:
- tree(props):树形,递归节点 + 箭头展开/收起 + 点选节点,键盘 Enter 选中、→ 展开、← 收起,禁用节点不响应
- upload(props):文件选择,点击或拖拽入列,清单可逐个移除,onChange 回传文件数组(不内置上传请求)
- notification(props):右下角通知卡片(标题 + 描述 + 操作区),返回 { el, close } 句柄,缺省常驻需手动关闭
- result(props):结果页,status 四档语义色 + 标题 + 说明 + 操作区,用于提交完成/校验失败等终态
一行用法: