BPOS-TMP-REPO/.claude/skills/html-one-pager/SKILL.md at 6636abfc39557d5a274e639c482ad07305df0f25

Archived

This repository has been archived on 2026-09-13. You can view files and clone it. You cannot open issues or pull requests or push a commit.

Files

T

ChaiHaoandClaude Opus 5 ade0fa5a94 A2-A7 全部补齐到验收线;顺手把几处「门拦住却不给路」的坑填了

活动:A2 选型 / A3 寻源 / A4 定价 / A6 议价 / A7 归档五件各补成真活动包 ——
契约宽进(input.required 空,归一在活动内)、台账必填声明(含行级 requiredWhen)、
入场哨兵与 L1/L2 判据一律读基座数、两份件(在办可编辑 + 办结静态快照)、
三案例常备、包内自测。e2e 各三案例 released、行动被拒 0、发口正确、提交闸每单真拦。

基座(共享面,改一处影响所有活动,故每处都带回归):
· 重发判断走在站上场之前 —— 人答完那步常已收掉,readyToWork 先抛「不能再往它上面挂活」,
  于是「重发已答过的卡 = 无事发生」这条唯一活路在最需要时够不着,A1 基线当场熔断;
· 决策卡补幂等兜底(与执行工单同一把尺):头两次无事发生,第三次起才算被拒;
· 输出没成形先就地重问一次,原话进工作日志、不再摆上卡面;
· 工具调用读数 tool_<名>_calls —— 「机检只读基座数」这条纪律第一次覆盖到工具;
· 执行卡 steps/standard 补进出参 schema(从前能到卡面全靠厂商 JSON 模式宽松);
· 件的就地更新改逐节点 morph,保存先把新值镜像进只读那份 —— 不闪、不等回声。

A1(基线,全程守住):措辞三档对齐(必填/建议/选填)、禁止拿历史价当客户目标价、
卡骨架从步骤剧本搬进说明书(压成一拍连做时剧本没摊开,会发出没有指导书的裸卡)。

契约两处**新增可选字段**(非破坏):FieldDeclaration.requiredWhen、工单 finalHtml;
api-report 同批更新。docs/adr 与 docs/archive 的 13 份文件在工作树里不见了,
本次予以恢复而非提交删除。

门禁:typecheck / lint / depcruise / test(1366)全绿。

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

2026-08-03 12:28:31 +08:00

4.7 KiB

Raw Blame History

name, description

name	description
html-one-pager	为 JCAI 活动设计并产出可直接在浏览器打开的 standalone HTML one-pager 目标件(活动执行页/验收页/汇报页)。照仓里 PRD 方法论做「带脚本演示页」:JCAI 家族版式(PRD_CSS 三层壳)、写死示例数据、可带演示脚本让编辑态活起来;零外链,尾部带平移指引,可按《HTML报告生成规范》平移进活动包。只要用户提到:给某个活动(A1-A7 或新活动)做执行页、验收页、工单页、one-pager、目标件、报告设计稿、HTML 样稿,或要求「把活动报告做得精美/有设计感/突出结构」——即使没说 one-pager 三个字,也要用本技能。

name

description

html-one-pager

为 JCAI 活动设计并产出可直接在浏览器打开的 standalone HTML one-pager 目标件(活动执行页/验收页/汇报页)。照仓里 PRD 方法论做「带脚本演示页」:JCAI 家族版式(PRD_CSS 三层壳)、写死示例数据、可带演示脚本让编辑态活起来;零外链,尾部带平移指引,可按《HTML报告生成规范》平移进活动包。只要用户提到:给某个活动(A1-A7 或新活动)做执行页、验收页、工单页、one-pager、目标件、报告设计稿、HTML 样稿,或要求「把活动报告做得精美/有设计感/突出结构」——即使没说 one-pager 三个字,也要用本技能。

定位:设计答案,不是提前交付的模版

产出 = 一份 standalone .html,照仓里 PRD 目标件的方法论做成带脚本演示页: 浏览器直接打开、示例数据写死、演示脚本让编辑态与重算活起来(仓里两份 A1 原型 ~/coding/JCAI_PRD/docs/活动执行页/ 就是这么做的)。设计定稿后由活动开发者按 docs/HTML报告生成规范.md §7 平移进活动包 —— 剥脚本、换绑定,不归本技能管。

实测教训(2026-08-03 一轮评测得来的):模型 + 仓库本身就能出用户认可的好件, 版面与信息设计不需要本技能立规矩 —— 立多了反而把件做小(列缩到现有台账、数字照存储口径摆、按钮是死的)。本技能只补三样:省力(装壳脚本)、 可平移(平移指引)、底线(自检)。其余放开发挥。

四步

1. 看范本定基调

打开整件读版面节奏(抄节奏不抄字):

文件件基调:A1 activities/quote-intake/src/views/report.ts(执行/验收/归档三张)
slide 基调:A2 activities/quote-alternative/src/views/report.ts(一页一屏、深空 hero)
原型出处:~/coding/JCAI_PRD/docs/活动执行页/(带脚本演示页的原始形态)
组件名录:references/block-catalog.md(点菜用,以仓内源为准)
业务素材:docs/MVP示例工作流.html(示例数据要像真的)

可选:跑 ui-ux-pro-max 拿设计方向(references/uipm-recipes.md,注意五不取: 字体外链/JS 库/换色/图标库/CDN —— 查询结果只进脑子不落盘)。

2. 装壳

python3 <本技能目录>/scripts/assemble.py --out draft.html \
  --activity <目标活动id> --title <件名> --kicker "统一报价 · <活动> · <身份>"

PRD_CSS 约 30KB,手搬必静默截断,所以走脚本抽。目标活动自带 views/prd-style.ts 时优先抽它自己的,缺了落回 A1。

3. 设计上行,尽情画

业务需要什么就摆什么:来源标签、档位列、命中留痕、数轴、走廊图 —— 不受现有台账声明限制。现有台账没有的列,不缩版面,记进平移指引的「建模欠账」清单 (目标件本该驱动建模:A1 就是先画件、后立表的)。
数字按人读形态摆:9.2% 不是 0.092,让价 −0.17 元不是裸差值;台账口径与呈现口径不一致的,也记欠账。判定表带「本单命中留痕」(哪条规则命中了哪几颗料)。
演示脚本可以有:集中在 <script> 标签里(不写内联 on*=,平移一剥就净); 初始画面不靠脚本也完整(脚本只做演示交互:开编辑、改数重算、切状态)。
能映射现有台账的格子,顺手预埋真钩子(data-slot/data-col/data-edit, 语义见规范 §4/§6)—— 省平移的事,但不为它牺牲版面。
家族底线:令牌不换色(--brand #3370ff 等)、三层壳一层不少、图标一律精灵 SVG (缺的照 lucide 线稿新增 symbol)、无外链、报告上不摆英文内部名、无 emoji。

4. 自检交付

python3 <本技能目录>/scripts/check.py draft.html

13 条底线全绿(它不判设计,版面好不好交给人眼);浏览器打开截图走查一遍。交付单文件,尾部必带「平移指引」注释段(骨架自带固定格式):取哪段、剥什么 (脚本/示例值)、建模欠账清单、钩子键名对着目标活动 manifest.ts 核一遍。

陷阱速查

症状	根因 → 出路
整张样式一条不生效	三层壳少了一层 → `.proto-root>.app-shell>.jc-stage>article.jc-report` 一层不能省
版面「像又不像」家族	PRD_CSS 手搬截断(样式半死极难定位)→ 用 assemble.py;或没读范本自创版面 → 整件抄节奏
平移后行为丢了一半	演示行为写成了内联 on*=,散在标记里剥不净 → 全部集中进 script 标签
平移时不知道哪些列是编的	设计上行摆了台账没有的列却没记账 → 平移指引里「建模欠账」逐列点名

4.7 KiB Raw Blame History

html-one-pager —— 活动执行/验收页的目标件