# 满满周岁宴 · 请您来吃饭

> 活页公开模板 `sample-invitation` · 场景: 邀请函 · 行业: 个人家庭
> 任何人、任何 Agent 都可以读、照着改，不需要账号。示例内容均为虚构。
> 真页面: https://space.24haowan.com/s/_TIHu_teqnrx · 详情: https://space.24haowan.com/examples/sample-invitation

## 这是什么

邀请函 · 周岁宴、喜宴、聚会

## 什么时候用

请人来吃饭、来参加的东西：周岁宴、喜宴、寿宴、同学聚会、乔迁。时间地点、怎么走写清楚。邀请函的默认写回就是文末这张出席回执（数据表 rsvp：能来 / 来不了、几位大人几位小朋友）—— 发之前问一句用户要不要，点头就照这份做。按线路或场次分名额收报名选 sample-event-signup；几天的出行安排选 sample-weekend-trip。

## 用户对助手说的原话

帮我给孩子的周岁宴做一份邀请函，发成一个网页链接给亲戚朋友：页头写谁家、谁的周岁宴，一句大字标题请大家来，下面一行时间、地点、回执截止日和主人家；接着按时间排当天安排（签到、入席、抓周、开席、散席），配一张抓周物件的图；然后「怎么到」画一张北向上的路线示意图，从最近的地铁口沿路走到饭店门口，标出步行距离和分钟数、过的桥、停车场入口，目的地用一个红点，下面三步文字路线、地址带一个复制按钮、开车怎么停；再写几件小事（不收礼金、宝宝餐椅、忌口、外地亲戚住宿）；最后做一张回执表单：能来 / 来不了、大人几位、小朋友几位、称呼、备注，一个发送按钮，回复存到一张数据表里，页面读这张表显示已回复能来的几家、共几位大人几位小朋友（别写死数字）。标题用宋体，少用底色块，用细线分隔；手机上路线图单独画一套。有变动就更新同一个链接。

如果你还没有活页连接器（MCP），先读 https://space.24haowan.com/for-agents.md ，照里面的说明接入，或不登录直接发布。

## 照着做一份

1. 读入口文件 https://space.24haowan.com/examples/sample-invitation/source/index.html（它引用的其他文件见下方列表）。
2. 保留结构、版式和交互，把内容**全部**换成用户自己的；模板里的公司、人名、数字都是虚构的，一样都别留。
3. 交付一个自包含的单文件 HTML：样式写在页面里，不引外部字体 / 脚本 / CDN；手机 375 宽和电脑 1440 宽都要好看，模板有暗色就保留暗色。
4. 要发成微信里能打开、改了链接不变的网页：接入活页（https://space.24haowan.com/for-agents.md）后发布；没有账号也可以让用户在 https://space.24haowan.com/quick 上传这个文件。
5. 没有活页工具、但能发 HTTPS 请求：把做好的 HTML 以 Content-Type: text/html POST 到 https://space.24haowan.com/api/quick?client=template-sample-invitation ，返回预览链接、7 天分享与认领链接（登录后保留、链接不变）。

## 页面结构

- 当天安排
- 怎么到
- 几件小事
- 回执

## 文件（公开，纯文本）

- https://space.24haowan.com/examples/sample-invitation/source/index.html（入口）
- https://space.24haowan.com/examples/sample-invitation/source/zhuazhou.webp

## 发成活页之后还能做的

- 页内回执回写数据表（原生表单 POST ./_data/rsvp），页面统计已回复几家
- 同一链接更新不变（改时间、补照片都在这一页）
- 微信卡片（share.title / share.desc）

## 发之前要备好

- 数据表 rsvp（列 name / attend / adults / kids / note，append_open=true）：文末回执写进这里，发之前先用 set_data 建好；过了回执截止日把 append_open 关掉

## 模板说明（README）

只进画廊的样例（EPIC #9032 R2，#9044；总览见 `core/space/examples/README.md`），按 `core/space/examples/QUALITY.md` 从头做。
示例内容均为虚构（人名、酒家、宾馆、街道、地铁站名都是编的）；抓周那张图为生成图，无真人、无品牌。

## 演示哪个特色

**文末回执写回数据表 + 有变动更新同一个链接。**

- 这张回执表就是**邀请函的默认写回**（`core/space/src/for-agents.ts` 「发出去之前问一句」一节，#11308）：助手发邀请函前问一句要不要收回执，点头就照这份做。
- 记忆点：「怎么到」那张路线示意图（内联 SVG，北向上）：地铁口 → 沿路 → 过桥 → 门口，步行距离与分钟数、停车场入口、
  目的地一枚红点（全页唯一的循环动效，`prefers-reduced-motion` 时停）。电脑与手机各一套坐标，手机那套去掉了步行距离注记（下方文字里有）。
- 回执是原生表单 `<form action="./_data/rsvp" method="post">`（不跑脚本也能提交）；脚本在时页内提交，
  并读 `./_data/rsvp.json` 统计「能来的几家、大人几位、小朋友几位」。选「来不了」时人数按 0 记。
- 「复制地址」按钮只在脚本在时出现（微信里复制后直接贴进打车软件）。

## 数据表

`rsvp`（列 `name` / `attend` / `adults` / `kids` / `note`，`append_open=true`）。发之前先建表：

```
set_data proposal_id=<id> table="rsvp" revision=0 rows=[] columns=["name","attend","adults","kids","note"] append_open=true
```

读回：`list_data_rows table=rsvp`。`attend` 的值是 `能来` / `来不了`（页面按 `能来` 计数）。过了回执截止日把 `append_open` 关掉。

## 改哪里变成我的

| 位置 | 改什么 |
|---|---|
| 页头 `.top` / `h1` / `.sub` / `.facts` | 谁家、发出日期、标题、一句话、时间 / 地点 / 回执截止 / 主人家 |
| 「当天安排」 | 每行 = 时间 + 做什么（+ 一句小字）；图换成自己的（转 WebP，≤ 300 KB），`alt` 同改 |
| 「怎么到」`svg.map`（`.wide` / `.narrow`） | 街道、河、饭店方块、步行虚线（`path.walk`）、1 / 2 / 3 号标记、红点与光晕同坐标；比例尺按「路线总长像素 ÷ 实际米数」重算；`aria-label` 同改 |
| 三步路线 / 地址 / 停车 | `.steps` 三行、`.addr` 里的地址与 `data-copy`、`.park` 那句 |
| 「几件小事」 | 最要紧的一句放 `.aside`（左侧细色线），其余逐条 |
| 「回执」 | 截止日、人数选项；表单字段名要和 `rsvp` 的列一致 |
| 页脚 | 平台标志与名称（与 `core/space/src/theme.ts` 的 `MARK_SVG` / `PUBLIC_NAME` 逐字一致，测试咬着）+ 一句适用场景；发自己的邀请函时整段删掉 |
| `manifest.json` | `title` / `share.*`（微信卡片上的字）；节增减时 `sections` 与页里的 `id` / `data-track-section` 三处同改 |

## 怎么发出去

```bash
node core/space/cli/space-cli.mjs push core/space/examples/sample-invitation \
  --proposal <proposal_id> --manifest core/space/examples/sample-invitation/manifest.json --hold
# 先建 rsvp 表 → 预览确认 → publish_version → 链接发到家族群
```

时间地点有变、宴后补照片：改完再推一次到**同一个** `proposal_id`，链接不变。
验收截图：`node --import tsx examples/verify-shots.mjs sample-invitation --write-thumb`（QUALITY.md §7）。