# 宝宝日记 App
 
一个用于记录宝宝日常喂养、生长数据的静态 Web 应用，可直接部署到 Cloudflare Pages，支持添加到手机主屏幕。
 
## 功能特性
 
- **记录功能**: 奶量、辅食、便便、维生素 D
- **历史查询**: 按日期查看记录、日统计（总奶量 / 辅食顿数 / 维 D）
- **生长监测**: 体重 / 身长 / 头围 / BMI 曲线，基于 WS/T 423-2022 男童标准
- **AI 智能评估**: 自动分析最新生长数据（可关闭）
- **图片上传**: 便便照片记录
- **数据导出**: 近 30 天饮食数据一键复制，方便发给 AI 做饮食建议
- **维 D 提醒**: 昨天漏打卡时首页温馨提示
- **深浅色主题**: 跟随系统或手动切换
- **PWA**: 可「添加到主屏幕」，离线打开壳层页面
 
## 项目结构
 
```
baby/
├── index.html                 # 主页面
├── manifest.webmanifest       # PWA 清单
├── sw.js                      # 壳层 Service Worker（仅缓存静态资源）
├── icons/
│   ├── icon.svg               # 应用图标
│   └── apple-touch-icon.svg   # iOS 主屏幕图标
├── src/
│   ├── js/
│   │   ├── config.js          # 环境配置（远程 + 本地兜底）
│   │   ├── utils.js           # 工具函数 / 生长标准数据
│   │   ├── db.js              # Supabase 数据访问层
│   │   ├── charts.js          # ECharts 图表管理
│   │   ├── toast.js           # Toast 通知
│   │   └── app.js             # Alpine.js 主应用
│   └── styles/
│       └── main.css           # 主题样式（Warm Minimal + 暗色）
├── .env.example               # 环境变量模板
└── README.md
```
 
## 本地开发
 
1. 用本地静态服务器打开项目根目录（推荐，避免 `file://` 限制剪贴板等 API）:
 
```bash
# Python
python -m http.server 8080
 
# 或 Node
npx serve .
```
 
2. 浏览器访问 `http://localhost:8080`
 
> Service Worker 需要 HTTP(S) 源；`file://` 下不会注册。
 
## 添加到主屏幕
 
- **iOS Safari**: 分享 → 添加到主屏幕
- **Android Chrome**: 菜单 → 安装应用 / 添加到主屏幕
- 独立窗口打开时使用 `standalone` 显示模式，主题色随浅/深色模式切换
 
## Cloudflare Pages 部署
 
### 方式一: 直接上传
 
1. 登录 [Cloudflare Dashboard](https://dash.cloudflare.com/)
2. **Workers & Pages** → **Create** → **Pages** → **Upload assets**
3. 上传项目文件夹（或 zip）
4. 部署完成即可访问
 
### 方式二: Git 连接
 
1. 推送到 GitHub / GitLab
2. Cloudflare Pages 连接仓库
3. 构建设置:
   - Build command: 留空
   - Build output directory: `/`
   - Root directory: `/`
 
## 配置说明
 
应用启动时会先请求远程配置，失败则使用 `src/js/config.js` 中的本地默认值。
 
可覆盖的配置项:
 
| 键 | 说明 |
|----|------|
| `SUPABASE_URL` | Supabase 项目 URL |
| `SUPABASE_KEY` | Supabase anon key |
| `IMGBED_API` | 图片上传 API |
| `GROW_API_URL` | 生长数据 JSON API |
| `AI_API_URL` | AI 评估 API（设为 `''` 可禁用） |
| `BIRTH_DATE` | 宝宝生日，格式 `YYYY/MM/DD` |
 
修改默认值: 编辑 `src/js/config.js` 中的 `window.env`。
 
### Supabase 数据表
 
```sql
CREATE TABLE baby_records (
    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
    recorded_at TIMESTAMPTZ NOT NULL,
    type TEXT NOT NULL,          -- 'milk' | 'food' | 'poo' | 'meds'
    sub_type TEXT,
    amount INTEGER,
    is_new_food BOOLEAN DEFAULT FALSE,
    tags TEXT,
    notes TEXT,
    image_url TEXT,
    created_at TIMESTAMPTZ DEFAULT NOW()
);
 
CREATE INDEX idx_recorded_at ON baby_records(recorded_at);
CREATE INDEX idx_type ON baby_records(type);
CREATE INDEX idx_type_recorded ON baby_records(type, recorded_at);
```
 
建议开启 RLS，并按你的使用场景配置策略（家庭私用可暂时允许 anon 读写）。
 
### 生长数据 API
 
`GROW_API_URL` 需返回:
 
```json
{
  "data": [
    {
      "checkDate": "2025-04-09",
      "weight": 5.2,
      "height": 58.5,
      "headCircumference": 39.2
    }
  ]
}
```
 
### AI 评估 API
 
`POST` JSON body: `{ "query": "..." }`，响应为纯文本评估结果。  
将 `AI_API_URL` 设为空字符串可完全关闭该功能。
 
## 外部依赖
 
| 库 / 服务 | 用途 | 来源 |
|-----------|------|------|
| Tailwind CSS | 工具类样式 | CDN |
| Alpine.js | 响应式交互 | CDN |
| ECharts | 生长曲线 | CDN（首次打开生长/报告时加载） |
| Supabase | 后端数据库 | supabase.com |
| 图床 API | 图片存储 | 自建 / Cloudflare |
 
## 时区说明
 
应用统一按 **Asia/Shanghai (UTC+8)** 处理日期与时间显示；写入数据库时转为标准 UTC ISO 字符串。
 
## 许可
 
MIT