YaoXiang/frontend/CHANGELOG.md

药箱前端修改记录

版本历史

v1.0.0 (2026-06-15)

新增功能

项目配置

• 创建 Vite 项目配置 (vite.config.ts)
• 配置 TypeScript (tsconfig.json, tsconfig.node.json)
• 配置 PWA 支持 (vite-plugin-pwa)
• 配置开发服务器代理
• 添加环境变量配置 (.env.example)

TypeScript 类型定义

• 用户类型 (types/user.ts)
• 药品类型 (types/medicine.ts)
• 批次类型 (types/batch.ts)
• 分类类型 (types/category.ts)
• 通知类型 (types/notification.ts)
• API 响应类型 (types/api.ts)

API 调用层

• Axios 实例配置 (api/client.ts)
• 认证 API (api/auth.ts)
• 药品管理 API (api/medicines.ts)
• 批次管理 API (api/batches.ts)
• 分类管理 API (api/categories.ts)
• 搜索 API (api/search.ts)
• 通知 API (api/notifications.ts)
• 用户管理 API (api/users.ts)

状态管理 (Zustand)

• 认证状态 (stores/authStore.ts)
• 药品状态 (stores/medicineStore.ts)
• 分类状态 (stores/categoryStore.ts)
• 通知状态 (stores/notificationStore.ts)
• UI 状态 (stores/uiStore.ts)

自定义 Hooks

• 认证 Hook (hooks/useAuth.ts)
• 药品 Hook (hooks/useMedicine.ts)
• 摄像头 Hook (hooks/useCamera.ts)
• 通知 Hook (hooks/useNotification.ts)

公共组件

• 布局组件 (components/Layout) - 含导航栏和底部 TabBar
• 药品卡片 (components/MedicineCard) - 显示药品基本信息
• 数量选择器 (components/QuantitySelector) - 支持大屏模式
• 搜索栏 (components/SearchBar) - 支持防抖搜索
• 摄像头捕获 (components/CameraCapture) - 用于 AI 识别
• 分类树 (components/CategoryTree) - 二级分类展示

页面组件

• 首页 (pages/Home) - 库存概览、快捷操作
• 登录页 (pages/Login) - 用户认证
• 药品列表 (pages/MedicineList) - 分页加载、搜索
• 药品详情 (pages/MedicineDetail) - 信息展示、批次管理
• 添加/编辑药品 (pages/AddMedicine) - 表单、AI 识别
• 快速取药 (pages/QuickDispense) - 大屏模式、大按钮
• 搜索页 (pages/Search) - 关键词搜索
• 通知中心 (pages Notifications) - 通知列表、已读管理
• 设置页 (pages/Settings) - 个人信息、系统设置

工具函数

• 日期处理 (utils/date.ts)
• 本地存储 (utils/storage.ts)
• 表单验证 (utils/validators.ts)
• 常量定义 (utils/constants.ts)

样式文件

• 全局样式 (styles/global.css)
• CSS 变量 (styles/variables.css)
• CSS 混入 (styles/mixins.css)

项目配置

• package.json - 项目依赖配置
• .gitignore - Git 忽略文件
• README.md - 项目说明

文档

• DEVELOPMENT.md - 开发文档
• CHANGELOG.md - 修改记录

---

待开发功能

计划中

• 用户管理页面 (UserManagement)
• 审计日志页面 (AuditLog)
• 药品图片上传功能
• 说明书图片管理
• 深色模式完整实现
• 离线缓存支持
• 推送通知支持
• 国际化支持 (i18n)
• 单元测试用例
• E2E 测试用例

已知问题

• 暂无

---

更新说明

2026-06-15

初始版本发布

完成药箱前端系统的初始开发，包括：

1. 核心功能实现

   • 用户登录认证
   • 药品 CRUD 操作
   • 批次管理（取药、入库）
   • 分类管理（二级分类）
   • 搜索功能（关键词搜索）
   • 通知系统
   • AI 识别接口集成

2. UI/UX 设计

   • 移动端优先设计
   • 大屏模式支持（快速取药）
   • 底部 TabBar 导航
   • 卡片式布局
   • 流畅的交互体验

3. 架构设计

   • 组件化开发
   • 状态管理 (Zustand)
   • API 抽象层
   • 类型安全 (TypeScript)
   • 路由管理 (React Router)

4. PWA 支持

   • Service Worker 配置
   • 离线缓存
   • 可安装

---

贡献指南

如需提交修改，请遵循以下规范：

1. 代码风格遵循项目 ESLint 配置
2. 提交信息使用中文
3. 新增功能请添加相应的类型定义
4. 修改记录请更新此文档

---

联系方式

如有问题或建议，请通过以下方式联系：

• 项目地址: https://github.com/your-username/yaoxiang
• 问题反馈: https://github.com/your-username/yaoxiang/issues