freedakgmail
158 lines
6.1 KiB
Markdown
158 lines
6.1 KiB
Markdown
# 华夏谱 (HuaXiaPu) - 系统完善计划
|
||
|
||
本计划旨在将当前的“华夏谱”原型系统转化为一个功能完备、数据安全、体验优秀的家族树管理应用。
|
||
|
||
## 阶段一：数据持久化与基础可用性 (Data Persistence & Usability)
|
||
**优先级：最高 (P0)**
|
||
**目标**：解决刷新页面导致数据丢失的问题，确保用户录入的数据能够安全保存。
|
||
|
||
1. **本地存储 (Local Storage) 集成**
|
||
* **机制**：利用浏览器的 `localStorage` API。
|
||
* **实现**：
|
||
* 修改 `FamilyContext`，在应用启动时优先从 `localStorage` 读取数据。
|
||
* 在 `addMember`, `updateMember`, `deleteMember` 等所有写操作后，自动同步最新状态到 `localStorage`。
|
||
* 使用 `useEffect` 监听数据变化并防抖保存。
|
||
* **重置功能**：在设置页添加“清除本地缓存”按钮，用于恢复默认演示数据。
|
||
|
||
2. **数据备份增强**
|
||
* **优化 JSON 导出**：确保导出的 JSON 文件包含完整的时间戳、版本号和元数据。
|
||
* **智能导入**：导入时进行数据格式校验，防止坏数据崩坏页面；提供“合并”或“覆盖”选项。
|
||
|
||
## 阶段二：核心功能增强 (Core Feature Enhancement)
|
||
**优先级：高 (P1)**
|
||
**目标**：补充家谱管理中必不可少的多媒体和标准格式支持。
|
||
|
||
1. **多媒体支持 (Media Support)**
|
||
* **头像上传**：
|
||
* *方案 A (纯前端)*：实现图片裁剪并转换为 Base64 字符串存储（注意控制大小）。
|
||
* *方案 B (云存储)*：集成 AWS S3 或类似对象存储服务（需后端支持）。
|
||
* **相册功能**：允许为每个成员添加多张生活照。
|
||
|
||
2. **GEDCOM 标准支持**
|
||
* **导入**：引入 GEDCOM 解析库 (e.g., `read-gedcom`)，支持从其他软件（如 Ancestry, MyHeritage）迁移数据。
|
||
* **导出**：将内部数据结构转换为标准 `.ged` 格式，确保数据可迁移性。
|
||
|
||
3. **族谱可视化升级**
|
||
* **导出图片**：集成 `html2canvas` 或类似库，允许用户将当前的家谱树导出为高清 PNG/JPG 图片，方便打印。
|
||
* **视图切换**：增加“垂直视图”（传统吊线图）和“水平视图”的切换。
|
||
* **折叠/展开**：支持点击节点折叠子分支，优化在大数据量下的查看体验。
|
||
|
||
## 阶段三：逻辑校验与体验优化 (Logic & UX)
|
||
**优先级：中 (P2)**
|
||
**目标**：提升数据的准确性，防止逻辑错误的录入。
|
||
|
||
1. **逻辑校验规则**
|
||
* **时间校验**：出生日期 < 逝世日期；子女出生日期 > 父母出生日期 + X 年。
|
||
* **关系校验**：防止循环引用（自己不能是自己的祖先）。
|
||
* **完整性提示**：提示缺失信息的成员（如缺失配偶、缺失生卒年）。
|
||
|
||
2. **搜索与筛选增强**
|
||
* **高级搜索**：支持按字辈、籍贯、标签、生卒年份范围进行组合筛选。
|
||
* **快速定位**：搜索结果点击后，在族谱图中自动居中并高亮显示该成员。
|
||
|
||
3. **界面细节打磨**
|
||
* **移动端适配**：优化移动端的触摸拖拽和缩放体验。
|
||
* **暗色模式**：完善 Dark Mode 的配色细节。
|
||
* **多语言**：支持 简体中文 / 繁体中文 切换。
|
||
|
||
## 阶段四：后端集成与协作（远期规划）
|
||
**优先级：低 (P3)**
|
||
**目标**：支持多用户在线协作修谱。
|
||
|
||
1. **用户系统**：集成 NextAuth.js，支持邮箱/手机号登录。
|
||
2. **云端数据库**：迁移至 PostgreSQL + Prisma，实现数据的云端永久存储。
|
||
3. **权限管理**：
|
||
* *管理员*：可编辑所有信息。
|
||
* *编辑者*：仅可编辑特定分支。
|
||
* *浏览者*：仅查看，不可编辑。
|
||
4. **操作日志**：记录谁在什么时候修改了哪条记录（修谱记录）。
|
||
|
||
---
|
||
|
||
## 建议执行路径
|
||
|
||
1. **立即执行**：完成 **阶段一**，使应用具备基本的实用价值。
|
||
2. **随后**：根据用户反馈，选择性实施 **阶段二** 中的“导出图片”和“GEDCOM支持”。
|
||
|
||
|
||
## 已完成的高优先级功能 ✅
|
||
|
||
### 1. 导出族谱图为图片 ✅
|
||
- 使用 html2canvas 实现
|
||
- 支持导出为高清 PNG 格式
|
||
- 自动重置视图以获取完整族谱
|
||
- 文件名包含日期标识
|
||
|
||
### 2. GEDCOM 格式支持 ✅
|
||
- 完整的 GEDCOM 5.5.1 格式导出
|
||
- GEDCOM 文件导入功能
|
||
- 自动解析个人信息和家庭关系
|
||
- 兼容 Ancestry、MyHeritage 等主流软件
|
||
|
||
### 3. 搜索结果在族谱图中定位 ✅
|
||
- 成员列表页面添加定位按钮
|
||
- 点击后跳转到族谱图并高亮显示
|
||
- 高亮样式：黄色边框 + 脉冲动画
|
||
- 支持全局高亮状态管理
|
||
|
||
### 4. 图片裁剪和压缩 ✅
|
||
- 使用 react-image-crop 实现裁剪
|
||
- 使用 browser-image-compression 自动压缩
|
||
- 圆形裁剪框，适合头像
|
||
- 支持跳过裁剪直接保存
|
||
- 压缩至 1MB 以下，最大尺寸 1024px
|
||
|
||
### 5. 循环引用检测 ✅
|
||
- 深度优先搜索检测循环引用
|
||
- 防止将后代设置为祖先
|
||
- 自我引用检测（不能是自己的父母/配偶）
|
||
- 实时验证并显示错误提示
|
||
|
||
---
|
||
|
||
## 已完成的中优先级功能 ✅
|
||
|
||
### 6. 照片墙（多张照片）✅
|
||
- 使用 `react-image-crop` 和 `browser-image-compression`
|
||
- 支持批量上传和裁剪
|
||
- 网格布局展示，点击放大预览
|
||
- 集成到成员表单和详情页
|
||
|
||
### 7. 统计图表（饼图、柱状图）✅
|
||
- 使用 ECharts 实现
|
||
- 性别分布饼图
|
||
- 世代分布柱状图
|
||
- 年龄分布饼图
|
||
- 出生年代折线图
|
||
- 集成到首页统计标签页
|
||
|
||
### 8. 家族故事模块 ✅
|
||
- 添加/编辑/删除故事功能
|
||
- 支持标题、日期、内容字段
|
||
- 卡片式展示，按时间排序
|
||
- 集成到成员表单和详情页
|
||
|
||
### 9. 纪念日浏览器通知 ✅
|
||
- 请求通知权限管理
|
||
- 每日自动检查生日和忌日
|
||
- 浏览器原生通知
|
||
- 未来7天纪念日预告
|
||
- 集成到设置页面
|
||
|
||
### 10. PWA 支持 ✅
|
||
- manifest.json 配置
|
||
- Service Worker 离线缓存
|
||
- 可安装到主屏幕
|
||
- 自动更新检测
|
||
- 推送通知支持
|
||
|
||
---
|
||
|
||
❌ 未完成的功能
|
||
|
||
低优先级
|
||
❌ 多用户系统
|
||
❌ 云端同步
|
||
❌ 权限管理
|
||
❌ 操作日志
|
||
❌ AI 辅助功能 |