shop-wx/README.md

# 智柜宝 - 微信小程序

基于 Uni-App + Vue 3 构建的智能柜管理与电商一体化的微信小程序，支持多端发布（微信小程序、H5、App）。

## 📋 项目概述

本项目是一个智能柜管理系统，结合电商功能，提供以下核心能力：
- 智能柜租赁与管理
- 电商购物功能
- 用户订单管理
- 企业认证与审批流程

## 🛠️ 技术栈

- **框架**: Uni-App + Vue 3 + TypeScript
- **构建工具**: Vite
- **状态管理**: Pinia
- **HTTP 客户端**: Alova
- **UI 组件**: wot-design-uni
- **样式引擎**: UnoCSS
- **代码规范**: ESLint

## 📦 环境要求

- Node.js >= 22
- pnpm >= 9
- 微信开发者工具 (开发微信小程序时需要)

## 🚀 快速开始

### 1. 安装依赖

```bash
pnpm install
```

### 2. 配置环境变量

在 `env/` 目录下创建相应的环境配置文件：

```bash
# .env.development - 开发环境
# .env.production - 生产环境
# .env.test - 测试环境
```

主要环境变量：
- `VITE_SERVER_BASEURL`: API 基础地址
- `VITE_WX_APPID`: 微信 AppID
- `VITE_APP_PROXY_ENABLE`: H5 代理开关
- `VITE_AUTH_MODE`: 认证模式 (single/dual token)

### 3. 开发运行

#### 微信小程序（主要平台）

```bash
pnpm dev:mp-weixin
```

然后使用微信开发者工具打开 `dist/dev/mp-weixin` 目录

#### H5 开发

```bash
pnpm dev:h5
```

访问 http://localhost:3000

#### App 开发

```bash
pnpm dev:app
```

## 🏗️ 构建部署

### 构建到不同平台

```bash
# 构建微信小程序
pnpm build:mp-weixin

# 构建 H5
pnpm build:h5

# 构建 App
pnpm build:app

# 测试环境构建
pnpm build:mp:test
```

## 📁 项目结构

```
src/
├── api/              # 业务 API 模块
│   ├── ab98/         # AB98 模块接口
│   ├── cabinet/      # 智能柜接口
│   ├── shop/         # 电商接口
│   └── users/        # 用户接口
├── components/       # 可复用组件
├── config/           # 应用配置
├── hooks/            # 自定义 Hooks
│   ├── useRequest.ts # 请求封装
│   └── useUpload.ts  # 上传封装
├── http/             # HTTP 客户端
│   ├── http.ts       # Alova 封装
│   └── interceptor.ts # 拦截器
├── layouts/          # 布局组件
├── pages/            # 页面模块
│   ├── index/        # 首页
│   ├── login/        # 登录页
│   ├── me/           # 个人中心
│   └── ...
├── pages-sub/        # 小程序分包
├── pinia/            # 状态管理
│   ├── stores/       # Pinia Store
│   ├── wx.ts         # 微信相关状态
│   └── ab98-user.ts  # 用户状态
├── router/           # 路由配置
├── static/           # 静态资源
├── style/            # 全局样式
├── tabbar/           # 原生 Tabbar
├── types/            # TypeScript 类型定义
└── utils/            # 工具函数
```

## 🏛️ 项目架构

### 分层架构

```
API 层 → HTTP 层 → 状态管理层 → 组件层 → 页面层
```

### 核心模块

- **HTTP 客户端**: 基于 Alova 封装 `uni.request`，提供拦截器、自动 token 刷新等能力
- **状态管理**: 使用 Pinia，支持持久化存储
- **路由系统**: Uni-app 内置路由 + 拦截器
- **认证系统**: 支持微信和企业微信双模式认证

## 🧪 代码质量

### 类型检查

```bash
pnpm type-check
```

### 代码检查

```bash
# 检查
pnpm lint

# 自动修复
pnpm lint:fix
```

## 📚 文档

- [代码编写规范](./doc/代码编写规范.md)
- [项目清理计划](./doc/项目清理计划.md)
- [迁移工作总结](./doc/迁移工作总结.md)
- [wot-design-uni 组件文档](./doc/wot-design-uni/docs/)

## 🔧 配置说明

### 关键配置文件

- `vite.config.ts`: Vite 配置，包含 Uni 插件、平台构建、H5 代理等
- `tsconfig.json`: TypeScript 配置，路径别名 `@/*` → `src/*`
- `uno.config.ts`: UnoCSS 配置，预设 + Carbon 图标
- `manifest.json`: 应用配置（名称、AppID、平台设置）

### H5 开发代理

在 `.env` 中设置：
```bash
VITE_APP_PROXY_ENABLE="true"
```

## 🐛 常见问题

### 构建失败

- 检查 Node.js 版本：`node -v` (需要 >= 22)
- 重新安装依赖：`pnpm install`
- 清理缓存：`rm -rf node_modules dist`

### 小程序问题

- 使用微信开发者工具打开 `dist/dev/mp-weixin` 目录
- 确保微信开发者工具已正确配置

### H5 代理问题

- 确认环境变量 `VITE_APP_PROXY_ENABLE="true"`
- 检查代理配置是否正确

### 类型错误

- 运行 `pnpm type-check` 检查类型
- 确认路径别名配置正确

## 📄 许可证

MIT License

## 🤝 贡献

请遵循 [代码编写规范](./doc/代码编写规范.md) 进行开发。

## 📞 支持

如有问题，请查看：
1. 项目文档 (./doc/ 目录)
2. wot-design-uni 组件文档
3. Uni-App 官方文档

---

**构建于 Uni-App + Vue 3** | **基于 unibest 3.13.0**