shenyifei f77acab4cb feat(purchase): 优化采购订单创建流程和界面交互

- 新增系统瓜农信息自动填充和冲突检测功能
- 改进瓜农信息模块的验证逻辑和用户体验
- 优化车辆信息提取逻辑，自动填充经销商信息
- 更新市场价展示方式，从表格改为卡片形式
- 增强提交审核前的完整性检查，包括拼车状态和合同上传状态
- 完善页面间导航和数据传递逻辑
- 添加设计规范文档，统一项目UI标准
- 优化采购订单草稿保存逻辑和步骤切换体验
- 改进采购订单列表页面的交互和状态判断

2025-11-10 14:59:35 +08:00

5.4 KiB

Raw Blame History

trigger
manual

ERPTurbo_Client 项目概述文档

项目简介

ERPTurbo_Client 是一个基于 Taro 框架开发的企业级ERP客户端应用，主要用于采购管理和发货管理等业务流程。该项目采用多端统一开发模式，可以同时支持微信小程序等多个平台。

技术栈

框架: Taro v4.x (React-like)
语言: TypeScript
状态管理: Zustand
构建工具: Webpack
包管理: pnpm
UI框架: nutui 3.0.18
CSS预处理器: Sass
代码规范: ESLint + Prettier

项目结构

packages/app-client/
├── config/                 # 构建配置文件
├── src/                    # 源码目录
│   ├── components/         # 公共组件
│   ├── pages/              # 页面组件
│   ├── services/           # 接口服务
│   ├── store/              # 状态管理
│   ├── utils/              # 工具函数
│   ├── constant/           # 常量定义
│   ├── types/              # 类型定义
│   └── app.config.ts       # 应用配置
├── __tests__/              # 测试文件
└── package.json            # 项目依赖配置

核心目录详解

src/pages 页面目录

包含应用的所有页面，按业务模块划分：

main/: 主页模块（工作台、菜单、消息、个人中心）
public/: 公共页面（登录、相机、OCR识别等）
purchase/: 采购相关页面（创建、审核、审批等）
delivery/: 发货相关页面（发货单列表、详情等）

src/components 组件目录

包含各种可复用组件：

biz/: 通用业务组件
purchase/: 采购专用组件
dealer/: 经销商相关组件
supplier/: 供应商相关组件
icon/: 图标组件

src/services 接口服务

封装了所有后端API调用：

auth/: 认证授权相关接口
business/: 业务相关接口

src/store 状态管理

使用 zustand 进行状态管理：

user-store.ts: 用户相关信息存储
global-store.ts: 全局状态存储

src/utils 工具函数

包含各种通用工具函数：

format.ts: 格式化工具（日期、金额等）
calculateSupplierWeights.ts: 供应商权重计算
calcutePurchaseOrder.ts: 采购单相关计算逻辑

核心业务流程

采购流程

采购员创建采购单
- 填写供应商信息
- 录入商品明细
- 设置价格和重量
审核员进行报价审核
- 查看采购单详情
- 审核价格合理性
审批员进行最终审批
- 查看审核结果
- 决定是否批准采购

发货流程

创建发货单
填写发货明细
确认发货信息
完成发货操作

编码规范

金额计算规范

由于JavaScript浮点数精度问题，项目中所有的金额计算都应遵循以下规范：

使用 lodash-es 的 multiply/divide 等方法进行数学运算
所有金额保留两位小数，使用 toFixed(2) 方法格式化

组件开发规范

组件分类
- biz/: 通用业务组件（如状态标签、导航栏等跨模块复用的业务组件）
- purchase/: 采购模块专用组件（仅限采购相关业务使用）
- dealer/: 经销商相关组件（经销商选择器、账户选择器等）
- supplier/: 供应商相关组件（供应商选择器等）
- icon/: 图标组件（统一管理项目中使用的图标）
组件设计原则
- 组件应该是无状态或受控的（尽可能使用受控组件）
- 组件应该具有清晰的输入（props）和输出（回调函数）
- 组件应该具有良好的封装性，避免暴露内部实现细节
- 组件应该具有良好的可复用性，避免与具体业务逻辑强耦合
- 组件应该具有良好的扩展性，方便后续功能增强
组件实现规范
- 使用 TypeScript 编写组件，明确定义 props 和 state 类型
- 使用函数组件和 Hooks，避免使用 class 组件
- 组件文件名使用大驼峰命名法（PascalCase），如 OrderList.tsx
- 组件导出应包含默认导出和必要的类型导出
- 组件内部状态管理应使用 useState、useReducer 等 React Hooks
- 组件应提供清晰的文档注释，说明组件用途、props 说明等
组件接口规范
- 组件 props 应该有明确的类型定义
- 组件事件回调函数应该以 on 开头，如 onChange、onSubmit
- 组件应该支持 ref 转发（如果需要）
- 组件应该支持 className 和 style 属性用于样式定制
组件样式规范
- 使用 Tailwind CSS 进行样式开发
- 避免使用内联样式
- 组件样式应该具有良好的隔离性，避免样式污染
- 组件应该支持主题定制

目录命名规范

类型定义：src/types/[模块名]/
接口定义：src/api/[模块名]/
公共组件：src/components/[模块名]/
工具方法：src/utils/[模块名]/

开发环境搭建

安装 Node.js (建议版本 14+)
安装 pnpm: npm install -g pnpm
安装依赖: pnpm install
启动开发服务器: pnpm run dev:weapp

构建部署

微信小程序: pnpm run build:weapp
H5: pnpm run build:h5
其他平台: 查看 package.json 中的 scripts 配置

测试

运行测试: pnpm run test

代码质量保证

代码格式化: pnpm run format
代码检查: pnpm run lint
Git钩子自动检查: 使用 husky 和 lint-staged

5.4 KiB Raw Blame History Unescape Escape