zlwuandCursor
a4b13fa2bc
Track the weighbridge mobile-h5 codebase (excluding node_modules, dist, and local .env) so subsequent adaptation tasks can evolve it in-repo. Co-authored-by: Cursor <cursoragent@cursor.com>
3.3 KiB
3.3 KiB
移动端开发说明
已完成功能
1. 登录页面 (/login)
- ✅ 用户名/密码登录
- ✅ 使用背景图片
sx1.jpg - ✅ Logo 显示
logo-sx.png - ✅ 登录成功后跳转到仪表盘
2. 仪表盘 (/dashboard)
- ✅ 今日入库/出库统计（车辆数）
- ✅ 功能菜单导航（卡片式）
- ✅ 用户信息显示（头像 + 用户名）
- ✅ 退出登录功能
- ✅ 管理员可见用户管理入口
3. 计划管理 (/plans)
- ✅ 计划列表（卡片式展示）
- ✅ 搜索功能（往来单位/计划号）
- ✅ 新增计划
- ✅ 编辑计划
- ✅ 查看关联数据（出入库单、地磅单）
- ✅ 生成出入库单（跳转到出入库页面）
- ✅ 删除计划
- ✅ 执行状态显示（待入库/入库中/已入库等）
4. 出入库管理 (/inventory)
- ✅ 出入库记录列表（卡片式展示）
- ✅ 搜索功能（往来单位/产品）
- ✅ 新增记录
- ✅ 编辑记录
- ✅ 查看关联数据（计划、地磅单）
- ✅ 生成地磅单（跳转到地磅单页面）
- ✅ 删除记录
- ✅ 支持从计划管理跳转并自动填充数据
5. 地磅单管理 (/weighing)
- ✅ 地磅单列表（卡片式展示）
- ✅ 搜索功能（车牌号/货物名称）
- ✅ 新增地磅单
- ✅ 编辑地磅单
- ✅ 毛重/皮重/净重计算（自动）
- ✅ 毛重/皮重时间自动填充
- ✅ 作废功能
- ✅ 删除功能
- ✅ 查看关联数据（计划、出入库单）
- ✅ 支持从出入库管理跳转并自动填充数据
6. 基础资料 (/master-data)
- ✅ 标签页切换（往来单位/货物）
- ✅ 往来单位管理
- 列表展示
- 新增/编辑/删除
- 搜索功能
- ✅ 货物管理
- 列表展示
- 新增/编辑/删除
- 搜索功能
7. 用户管理 (/user)
- ✅ 用户列表（卡片式展示）
- ✅ 新增用户
- ✅ 编辑用户（修改密码、角色）
- ✅ 删除用户（admin 用户不可删除）
- ✅ 角色显示（管理员/操作员）
技术实现
组件使用
- 列表:
van-list+ 自定义卡片组件 - 表单:
van-form+van-field - 选择器:
van-picker（公司、货物） - 日期选择: 原生
input[type="date"] - 弹窗:
van-popup（底部弹出，高度 90%） - 按钮:
van-button - 标签:
van-tag - 搜索:
van-search - 反馈:
Toast、Dialog、Notify - 加载:
van-loading - 空状态:
van-empty
数据流
- API 调用与 Web 端完全一致
- Store 状态管理与 Web 端共享
- 路由跳转支持参数传递
- 表单验证与 Web 端一致
移动端优化
- 卡片式布局，信息层次清晰
- 底部弹窗表单，符合移动端操作习惯
- 触摸友好的按钮尺寸
- 下拉加载更多数据
- 原生日期选择器，体验更好
功能对比
| 功能 | Web 端 | 移动端 | 状态 |
|---|---|---|---|
| 登录 | ✅ | ✅ | 一致 |
| 仪表盘 | ✅ | ✅ | 一致 |
| 计划管理 | ✅ | ✅ | 一致 |
| 出入库管理 | ✅ | ✅ | 一致 |
| 地磅单管理 | ✅ | ✅ | 一致 |
| 基础资料 | ✅ | ✅ | 一致 |
| 用户管理 | ✅ | ✅ | 一致 |
下一步
项目已完整实现所有功能，可以：
- 运行
npm install安装依赖 - 运行
npm run dev启动开发服务器 - 测试各项功能
- 根据实际使用情况优化 UI/UX