1c6d491eaf
- MarkerPhotoPanel：基于 RNGH PinchGesture + Reanimated 实现捏合缩放（1x~5x）；放大后可双指拖动，放大模式下禁用左右切图手势 - _layout：根布局包裹 GestureHandlerRootView，解决 Modal 内手势失效问题 - 蓝图：新增 pdf-report 模块（concept），photo-capture 补充缩放任务卡（done） Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
3.3 KiB
3.3 KiB
| id | name | area | status |
|---|---|---|---|
| pdf-report | PDF 报告导出 | rn-app | concept |
概述
在查看模式下，将当前楼层的侧边栏物品清单 + 地图标记点信息导出为 PDF 报告。 报告完整呈现所有数据（不依赖屏幕截图），支持 20-30+ 标记点场景。
需求背景
- 不动产摸底完成后，需要输出一份可存档/分享的书面报告
- 报告内容 = 左侧标记点清单（物品名、数量、确认状态）+ 右侧带编号图钉的楼层平面图
- 需支持多个楼层（每层生成一页或分组）
技术调研结论
选定方案：客户端 HTML → PDF（expo-print）
| 维度 | 说明 |
|---|---|
| 方案 | 构建 HTML 字符串 → expo-print 本地 WebView 渲染 → 导出 PDF |
| 离线 | ✅ 完全离线，无需服务端 |
| 地图渲染 | imageUri（已有 base64 JPEG）作 <img> 底图，标记点用 position:absolute 圆圈叠加 |
| SVG 矢量层 | ⚠️ floorMaps.generated.ts SVG 体积极大（百万字符），不内嵌，用 JPEG 底图代替 |
| 标记点定位 | marker.x / marker.y 为归一化坐标（0-1），乘以图片宽高即可精确定位 |
| 物品清单 | 数据库直接查，不依赖屏幕状态，支持任意数量 |
| 分页 | HTML page-break-inside: avoid 自动处理 |
排除的方案
- 截图方案：ScrollView 只截可见区，30 个标记点数据不完整 ❌
- SVG 直接嵌入：文件体积导致 WebView 崩溃风险 ❌
- 服务端生成：需要后端，与离线架构冲突 ❌
报告结构设想（横版 A4）
┌─────────────────────────────────────────────────────────┐
│ 项目名称 1F 楼层报告 导出日期 │
├──────────────┬──────────────────────────────────────────┤
│ 标记点清单 │ │
│ │ 楼层平面图（JPEG 底图） │
│ ① 红 电梯 │ + 彩色圆圈标记点（含编号） │
│ ☑ 电梯×1 │ │
│ ② 紫 办公区 │ │
│ ☑ 电脑×2 │ │
│ ☑ 打印机×1│ │
│ ③ ... │ │
└──────────────┴──────────────────────────────────────────┘
（标记点多时自动换页，地图区域保持在首页）
依赖
expo-print（需新增安装，Expo 官方，无需 rebuild）expo-sharing（已安装，用于分享 PDF 文件）expo-media-library（已安装，可选保存到本地）
待确认
- 报告是否需要封面页（项目名称、地址、日期等信息从哪里来）
- 是否需要导出所有楼层 or 仅当前楼层
- PDF 分享方式：微信/邮件分享 or 保存到本地文件