签易签 · 线上合同签署平台

纯前端电子合同签署应用，支持多参与方签署、模板管理、签署记录与 PDF 归档，内置管理员控制台。

数据存储：部署到 Cloudflare Pages 后数据持久化于 Cloudflare R2 对象存储（经 Pages Functions 访问）；本地开发/预览时自动回退到浏览器 IndexedDB，并会在首次连接 R2 时自动迁移本地数据。

技术栈

• Vue 3 + Vite（前端 SPA）
• Cloudflare Pages Functions（R2 CRUD API，functions/）
• Cloudflare R2（对象存储，绑定名 CONTRACTS）
• jsPDF + html2canvas（PDF 导出）、jszip（批量归档）、IndexedDB（本地回退）

本地开发

npm install
npm run dev

本地预览无 /api 服务，应用自动使用 IndexedDB 存储，功能不受影响。

构建与本地预览生产包

npm run build
npm run preview

部署到 Cloudflare（数据存 R2）

1. 创建 R2 桶

登录 Cloudflare Dashboard → R2 Object Storage → Create bucket，桶名填写 blog（与 wrangler.toml 一致）。

2. 创建 Pages 项目并部署

方式 A：Dashboard

1. Workers & Pages → Create → Pages → 连接 Git 仓库（或 Direct Upload 上传 dist/）
2. 构建命令 npm run build，输出目录 dist
3. 项目设置 → Functions → R2 bucket bindings → 添加绑定：
   • 变量名（binding）：CONTRACTS
   • R2 桶：blog
4. 保存后重新部署

方式 B：Wrangler CLI

npm install -g wrangler
wrangler login
wrangler pages deploy dist --project-name e-contract-signer

然后按方式 A 的第 3 步在 Dashboard 完成 R2 绑定，或使用已含绑定的 wrangler.toml 进行构建部署。

3. 验证

部署后打开站点，侧边栏底部应显示「数据存储：Cloudflare R2 云端」。若显示本地模式，说明 R2 绑定未生效，请检查 Functions 绑定名称是否为 CONTRACTS。

管理员后台

• 入口：前台侧边栏「管理后台」或访问 /admin
• 默认密码：admin123（src/utils/auth.js 中可修改）
• 功能：合同统计、状态筛选、单份 PDF 下载、已签署合同批量 ZIP 打包、合同汇总 CSV 导出

外链签署

• 合同详情页点击「生成签署外链」复制链接（格式 /s/{合同id}）
• 对方打开链接即可直接签署，无需注册登录，支持 PC 手写/打字/图片签名与手机端手写签名
• 部署到 Cloudflare（R2 存储）后，任意设备的浏览器打开外链均可签署并即时生效；本地预览模式下外链需在同一浏览器打开

R2 存储结构

每个资源以独立 JSON 对象存储，键格式：

• contracts/{id}.json —— 合同（含参与方、签名、动态时间线）
• templates/{id}.json —— 合同模板

API 由 functions/api/[[route]].js 提供：

方法	路径	说明
GET	/api/health	探活与空桶检测
GET	/api/contracts	全部合同
GET	/api/contracts/:id	单个合同
PUT	/api/contracts/:id	写入合同
DELETE	/api/contracts/:id	删除合同
GET/PUT/DELETE	/api/templates[...]	模板同构操作

项目结构

functions/api/[[route]].js   Cloudflare Pages Functions（R2 API）
public/_redirects            SPA 路由回退
src/utils/storage.js         统一数据访问层（R2 + IndexedDB 回退 + 迁移）
src/utils/db.js              对外数据接口（兼容旧调用方）
src/views/                   页面视图（含 AdminConsoleView / AdminLoginView）
wrangler.toml                Pages 构建与 R2 绑定配置