sqxp/miniprogram

叁强鲜配小程序端

项目简介

叁强鲜配小程序端是基于 uni-app + Vue3 + TypeScript 的跨平台小程序，支持微信小程序、H5 等多端运行。

技术栈

• 框架：uni-app + Vue3 + TypeScript
• UI 组件：Vant Weapp
• 状态管理：Pinia
• 样式：SCSS

角色说明

客户（Client）

• 主题色：品牌绿 #07c160（三端统一）
• 主要功能：商品浏览、购物车、订单管理、支付、发票、结算退款等

供应商（Supplier）

• 主题色：品牌绿 #07c160（三端统一）
• 主要功能：询价管理、报价管理、价格清单、配送任务（取货确认）等

配送员（Deliverer）

• 主题色：品牌绿 #07c160（三端统一）
• 主要功能：配送任务管理、抢单、凭证上传、数据统计等

目录结构

miniprogram/
├── src/
│   ├── api/              # API 接口
│   ├── components/        # 公共组件
│   ├── config/           # 配置文件
│   ├── pages/            # 页面
│   │   ├── client/       # 客户页面
│   │   ├── supplier/     # 供应商页面
│   │   ├── deliverer/     # 配送员页面
│   │   └── login/         # 登录页面
│   ├── stores/           # Pinia 状态管理
│   ├── styles/           # 全局样式
│   ├── types/            # TypeScript 类型定义
│   ├── utils/            # 工具函数
│   ├── App.vue           # 应用入口
│   ├── main.ts          # 主入口文件
│   └── pages.json       # 页面路由配置
├── static/               # 静态资源
├── index.html            # H5 入口
├── manifest.json         # 应用配置
├── package.json          # 依赖配置
├── tsconfig.json         # TypeScript 配置
└── vite.config.ts       # Vite 配置

安装依赖

npm install

开发运行

# 微信小程序
npm run dev:mp-weixin

# H5
npm run dev:h5

构建

# 微信小程序
npm run build:mp-weixin

# H5
npm run build:h5

登录说明

账号密码登录

• 使用后端分配的账号密码登录
• 支持客户、供应商、配送员三种角色

微信一键登录

• 通过微信授权获取手机号
• 自动创建或绑定用户账号

角色路由说明

登录后根据用户角色自动跳转到对应首页：

• client → /pages/client/home/home
• supplier → /pages/supplier/home/home
• deliverer → /pages/deliverer/home/home

API 配置

修改 src/config/api.ts 中的 BASE_URL 为实际的接口地址：

• 开发环境：http://localhost:8000
• 生产环境：https://api.sanqiang.com

注意事项

1. 确保后端服务已启动
2. 微信小程序需要在微信公众平台配置合法域名
3. 部分功能需要用户授权（如位置信息）