# Sail OA · 产品介绍与使用演示

适用：第一次了解产品的旅游公司负责人、司导团队管理者与合作方。建议演示时长约 4 分钟。产品定位与功能方向来自本次需求。[我提供]

## 打开与转发

1. 解压整个 ZIP，保持文件结构。
2. 双击 `index.html`，使用 Chrome、Edge 或 Safari 打开。全部截图、讲解和 GSAP 动效资源均已放在包内，无外部字体、网络图片或远程接口依赖。
3. 先读项目介绍，再点击“开始看演示”。用“播放全程”连续播放；也可通过章节、步骤按钮或上一/下一步手动讲解。
4. 每步默认 12 秒，共 19 步，约 3 分 48 秒；另留约 30 秒介绍。可改为每步 8 或 18 秒。
5. 在演示区域，左右方向键切步，空格播放/暂停。焦点在按钮或输入控件上时，按控件自身键盘行为处理。
6. “查看完整原图”会暂停播放。Esc 关闭原图。减少动态选项会保留完整内容与重点标记，关闭步骤转场。
7. 全屏依赖浏览器支持；不支持时可用浏览器菜单全屏。手机浏览自动改为上下布局。离开页面会自动暂停。

## 项目介绍与讲解稿

开场：“Sail OA 是面向旅游地接与司导团队的轻量协作工作台，以多日团、私人定制为主，也兼容一日包车和接送机。我们沿着一个南岛蜜月8日示例，看看管理如何安排、员工如何接收，以及费用怎样回到团内。”[我提供]

### 管理排团 · 6 步

“管理先在大日历里看团期，也可以切到看板逐团处理。新建时选天数和模板，再按天自由改文字。接着安排负责员工与公司自有车辆，核对行程、交接摘要和待补事项，把安排交给员工。”[我提供]

截图依次展示日历、看板、手机快速建团、按天编辑、配好员工与自有车辆02、已配车交接摘要。[知识库]

### 员工执行 · 4 步

“员工收到团后先明确确认接收，再查看当天的安排。D2 是基督城到 Tekapo；除了行程正文，也能看天气备注、车辆状态与交接资料。多日团可从日期列表定位某一天。”[知识库]

状态说明：此章使用“车辆待安排”分支；上一章为“已配车”分支。两者是现有设计里的不同候选时点，不是实际发生的撤车过程。[知识库]

### 项目费用 · 6 步

“费用跟着团单走。员工为 NZD 18.00 的停车费填写日期、用途和凭证；管理在同一团内核对。如果材料不清楚，就回到原记录补充；核对后记录线下处理结果，员工在原费用里查看。”[知识库]

补充凭证画面是另一笔 NZD 28.00 加油费的独立分支，随后回到 NZD 18.00 停车费主线。没有独立审批中心；正式核对和付款规则仍待确认。结果是线下处理记录，不是线上支付证明。[我提供][知识库]

### Apple 持续订阅 · 3 步

“安排也可以通过持续订阅带到 Apple 日历。先选本人全部安排或单团范围，再进入 Apple 日历完成添加。打开外部日历不等于订阅成功。后续更新时间由日历客户端刷新；订阅来源可以管理，但不能把停止来源说成已删除外部缓存。”[我提供]

结尾：“管理看全局，员工看每天；人、车、行程与费用，都围绕同一个团单组织。这里展示的是产品设计用法，真实业务连接将在正式应用中验证。”[我提供]

## 使用边界与素材状态

- 页面里的步骤、播放、暂停、章节切换、放大与高亮是真实可用的讲解控件；截图内的业务按钮是静态设计画面。
- 不会实际发单、接收业务、上传文件、支付或建立日历订阅。
- 所有行程、人物、金额、日期与文件名为演示数据。[我提供]
- 截图来源：现有 Figma Design `hExppPvF4EUUhrJFmj9ouO` 的 2026-11-01 间距与图标修正导出。该批 UI 的本轮视觉审查已关闭，主审初轮打开26张代表屏，最终复抓并打开3张修订屏；不冒称主审对71屏逐屏独立检查。截图已从关闭后的最新目录重新复制。前一轮业务核心静态稿已通过；该结论不等于正式应用已实现。[知识库]
- 已确认的技术方向是 TanStack、Hono、Cloudflare；确切 Cloudflare 服务架构仍为提案，本演示不据此宣称后端已完成。[我提供]

## 文件说明

- `index.html`：可直接打开的完整演示。
- `style.css`：页面样式与适配。
- `app.js`：讲解控件与动效逻辑。
- `content.js`：全部章节、步骤文案、截图路径与高亮范围，修改讲解只需编辑此文件。
- `assets/`：真实界面截图与本地 GSAP 动效库。
- `截图映射.json`：逐张截图来源、SHA-256 与当前审查状态。
- `验证记录.md`：浏览器验证范围与限制。

## 替换为审查通过的截图

本包已依据 04_关闭检查.md 刷新到本轮关闭版本。后续替换时，先核对主 session 的最新审查和关闭记录，再替换精确通过的截图。可保持 assets 原文件名，或者更新 content.js 的 image 路径。截图比例或布局变化时同步更新 focus 百分比并重新检查局部高亮。更新截图映射中的来源、SHA-256、状态。不要只把“待主审”文案删除，必须有对应审查证据。

## 依赖

GSAP 3.13.0 已随包提供，来源为 jsDelivr 的官方 npm 分发文件；库头部包含版权与许可链接。详见 `assets/GSAP说明.txt`。本包运行不需要联网。