PROMPT PLANETWeb UI

数据表

按行和列比较对象，保留名称、状态和读数关系。

下面的样例使用相同内容，可直接点击并用键盘操作；应用时沿用产品主题。

轻行线

公开默认

轻分隔组织数据，数值对齐便于比较。

项目用量示例
项目状态
设计工具箱与常用组件共享项目可用128
文档中心待检查42
开发预览可用86

点击请求数可比较排序方向。

样式规则与来源
  • 表头说明列含义，数值等宽且右对齐。
  • 宽表在自身区域滚动，不撑破页面；对象名称可换行。
  • 排序按钮给出当前方向，保持每行数据关联。

继承 数据表与排行 的当前规则。

表格为实测，排行为推导：表头 12px w600 #59636e，可用 #f6f8fa 底或白底加 1px 底线；行 1px 分隔，单元格 8px 16px，数值右对齐等宽。名次用中性数字，前三名只靠字重区分，不用奖牌色、渐变或光晕；头部概览卡沿 Box，主要数值 24–32px w600 #1f2328。宽表在自身容器内横向滚动，不撑破页面；保留原有列、单位和未知标记。

为跨项目复用编写的中性样例；颜色、密度与尺寸按目标主题适配。

交替底色

交替底色帮助跨列阅读较宽数据。

项目用量示例
项目状态
设计工具箱与常用组件共享项目可用128
文档中心待检查42
开发预览可用86

点击请求数可比较排序方向。

样式规则与来源
  • 交替底色保持低对比，选中或异常状态仍用文字表达。
  • 表头与数据对齐，排序后底色随行重新计算。

为跨项目复用编写的中性样例；颜色、密度与尺寸按目标主题适配。

使用所选样式

只用于本次任务，不改变项目或公开默认。

复制后发送给 agent；应用完成后由 agent 回读配置并验证产品页面。

查看完整请求

【PROMPT 开始——从下一行复制】

## 执行方式

本 Prompt 使用 web-ui-workflows。若未安装，从 https://github.com/lindong28/lindong-skills 取得完整 web-ui-workflows/；读取其 SKILL.md 后执行，不覆盖已有同名目录。

## 任务

请将目标产品的「数据表」采用变体 ruled，范围：仅本次任务。目标产品沿当前对话；缺少目标时向我确认。
组件：table
目录：https://prompts.aiplanet.live/api/webui/components/v1/index.json
定义：https://prompts.aiplanet.live/api/webui/components/v1/table.json
目录内容 SHA256：e89b7c2c1b39aa71030cf1247e23dd248e94857d5f5f8229aa0d40750c0db331
按组件选择工作流应用并验证，交代实际生效来源与结果。若范围是长期公开默认，先准备目录变更和可浏览快照，沿其发布批准流程同步；这次复制不代表配置已经改变。

【PROMPT 结束——复制到上一行】