# item-finder

**Repository Path**: weiwei_unique/item-finder

## Basic Information

- **Project Name**: item-finder
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-05-16
- **Last Updated**: 2026-05-16

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 📦 物品位置管理器 - PWA 网页版

iPhone / iPad / Android / 电脑 都能用的网页版，功能和桌面版完全一致。

---

## 🚀 使用方法

### 方法一：直接在浏览器打开（最快）

1. 用电脑或手机浏览器打开 `index.html`
2. 直接用！所有数据保存在浏览器本地

### 方法二：iPhone 添加到主屏幕（体验像原生 App）

1. **Safari 打开网页**
2. 点击底部 **分享按钮**（⬆️）
3. 选择 **"添加到主屏幕"**
4. 桌面会出现 App 图标，点击打开即可

### 方法三：Android 添加到主屏幕

1. **Chrome 打开网页**
2. 点击菜单（⋮）→ **"添加到主屏幕"**
3. 桌面会出现 App 图标

---

## ✅ 功能清单

| 功能 | 说明 |
|------|------|
| 🔍 搜索 | 实时搜索物品名称、位置、描述 |
| ➕ 新增 | 添加新物品（名称、位置、分类、描述、照片） |
| ⭐ 置顶 | 常用物品置顶显示 |
| 👁 最近查看 | 自动记录最近找过的东西 |
| 📊 统计 | 物品总数、分类分布、查找次数排行 |
| 🏷 分类 | 证件、电子设备、衣物、药品、书籍、季节性物品 |
| 📷 照片 | 拍照或上传照片，点击可放大查看 |
| 📤 借出 | 记录借给谁、预计归还时间 |
| ⏰ 提醒 | 过期提醒、电池更换、维护提醒 |
| 🗑 删除 | 删除物品（连带借出和提醒记录） |

---

## 📱 界面预览

```
┌─────────────────────────────┐
│ 📦 物品位置管理器            │
├─────────────────────────────┤
│ 🔍 搜索...         [➕新增] │
├─────────────────────────────┤
│ [📂全部▼]                   │
├─────────────────────────────┤
│ [📋全部][⭐置顶][👁最近]...  │
├─────────────────────────────┤
│ ┌─────┐  ⭐护照             │
│ │ 📷  │  📍 书房抽屉        │
│ └─────┘  🏷 证件            │
│          🔍 12次 ⚠️经常找不到│
│ [置顶][查看][编辑][借出][删除]│
├─────────────────────────────┤
│ ┌─────┐  耳机               │
│ │ 📷  │  📍 床头柜          │
│ └─────┘  🏷 电子设备        │
│          🔍 3次              │
│ [置顶][查看][编辑][借出][删除]│
└─────────────────────────────┘
```

---

## 💾 数据存储

- 所有数据保存在浏览器 **IndexedDB** 中
- **完全离线可用**，无需网络
- 清除浏览器数据会导致数据丢失（后续可添加导出备份功能）

---

## 🔧 部署到服务器（可选）

如果想在手机/电脑间同步，可以部署到任何静态服务器：

### 方案 1：GitHub Pages（免费）
1. 把 `pwa_item_finder` 文件夹推送到 GitHub
2. 开启 GitHub Pages
3. 获得一个网址，手机电脑都能访问

### 方案 2：Netlify / Vercel（免费）
1. 把文件夹拖拽到 Netlify 网站
2. 自动生成在线网址

### 方案 3：本地局域网共享
```bash
# 在同一文件夹运行
python -m http.server 8080
# 手机浏览器访问电脑的 IP:8080
```

---

## 📁 文件说明

```
pwa_item_finder/
├── index.html      # 主页面
├── style.css       # 样式（移动端优先）
├── app.js          # 应用逻辑 + IndexedDB
├── manifest.json   # PWA 配置
├── sw.js           # 服务工作者（离线缓存）
├── icon-192.png    # App 图标（需自行准备）
├── icon-512.png    # App 图标（需自行准备）
└── README.md       # 本说明文件
```

---

## ⚠️ 注意事项

1. **照片存储**：照片以 base64 存储在内存中，刷新页面后会消失（因为没有后端服务器）。建议将 `photoCache` 改为存入 IndexedDB 来持久化。
2. **图标**：`icon-192.png` 和 `icon-512.png` 需要自行准备，可用任意图片重命名。
3. **兼容性**：需要现代浏览器（Chrome 90+、Safari 14+、Firefox 90+）

---

## 🛠️ 后续可扩展

- [ ] 照片持久化存储到 IndexedDB
- [ ] 数据导出/导入（JSON 备份）
- [ ] iCloud/OneDrive 同步
- [ ] 语音搜索
- [ ] 二维码扫描记录位置

---

**现在就可以在 iPhone 上用了！** 打开 Safari → 打开 `index.html` → 添加到主屏幕。