You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
120 lines
3.8 KiB
120 lines
3.8 KiB
--- |
|
description: |
|
globs: |
|
alwaysApply: false |
|
--- |
|
# 智慧生态小程序项目指南 |
|
|
|
## 项目概述 |
|
这是一个基于 uni-app 开发的跨平台应用，支持微信小程序和移动端 APP。项目采用 Vue 2.x 技术栈，后端使用 RuoYi 框架。 |
|
|
|
## 技术栈 |
|
- **前端框架**: uni-app (Vue 2.x) |
|
- **状态管理**: Vuex |
|
- **后端框架**: RuoYi |
|
- **加密库**: crypto-js |
|
- **支持平台**: 微信小程序、Android/iOS APP、H5 |
|
|
|
## 项目结构 |
|
|
|
### 核心文件 |
|
- [main.js](mdc:main.js) - 应用入口文件 |
|
- [App.vue](mdc:App.vue) - 根组件 |
|
- [manifest.json](mdc:manifest.json) - 应用配置文件 |
|
- [pages.json](mdc:pages.json) - 页面路由配置 |
|
- [config.js](mdc:config.js) - 全局配置（API 地址等） |
|
|
|
### 目录结构 |
|
``` |
|
├── api/ # API 接口模块 |
|
│ ├── system/ # 系统管理接口 |
|
│ ├── task/ # 任务管理接口 |
|
│ ├── enterprise/ # 企业管理接口 |
|
│ ├── inspections/ # 检查管理接口 |
|
│ └── login.js # 登录接口 |
|
├── components/ # 公共组件 |
|
├── pages/ # 主包页面 |
|
│ ├── index.vue # 首页 |
|
│ ├── login.vue # 登录页 |
|
│ ├── task.vue # 任务页 |
|
│ ├── owner.vue # 业主页 |
|
│ └── enterprise.vue # 企业页 |
|
├── sub/ # 分包目录（优化小程序体积） |
|
│ ├── task/ # 任务模块分包 |
|
│ ├── owner/ # 业主模块分包 |
|
│ ├── enterprise/ # 企业模块分包 |
|
│ └── inspection/ # 检查模块分包 |
|
├── store/ # Vuex 状态管理 |
|
│ ├── index.js # Store 入口 |
|
│ ├── getters.js # 全局 getters |
|
│ └── modules/ # 状态模块 |
|
├── utils/ # 工具函数 |
|
│ ├── request.js # 请求封装 |
|
│ ├── auth.js # 认证相关 |
|
│ ├── permission.js # 权限控制 |
|
│ └── storage.js # 本地存储 |
|
└── static/ # 静态资源 |
|
``` |
|
|
|
## 开发规范 |
|
|
|
### API 调用规范 |
|
1. 所有 API 请求都应通过 `utils/request.js` 封装的方法 |
|
2. API 模块按功能领域组织在 `api/` 目录下 |
|
3. 使用统一的错误处理机制 |
|
|
|
### 路由权限控制 |
|
- 使用 [permission.js](mdc:permission.js) 进行路由拦截 |
|
- 白名单页面定义在 `whiteList` 数组中 |
|
- 未登录用户自动跳转到登录页 |
|
|
|
### 状态管理规范 |
|
1. 全局状态使用 Vuex 管理 |
|
2. 模块化组织 store，每个业务模块独立管理 |
|
3. 通过 getters 暴露需要的状态 |
|
|
|
### 组件开发规范 |
|
1. 公共组件放在 `components/` 目录 |
|
2. 页面组件放在 `pages/` 或 `sub/` 目录 |
|
3. 组件命名使用 PascalCase |
|
4. 组件文件名与组件名保持一致 |
|
|
|
### 样式规范 |
|
- 使用 [uni.scss](mdc:uni.scss) 定义的全局样式变量 |
|
- 支持 scss 预处理器 |
|
- 遵循 uni-app 的样式编写规范 |
|
|
|
## 配置说明 |
|
|
|
### 环境配置 |
|
在 [config.js](mdc:config.js) 中配置： |
|
- `baseUrl`: API 服务器地址 |
|
- `baseApi`: API 基础路径 |
|
- `appInfo`: 应用基本信息 |
|
|
|
### 小程序配置 |
|
在 [manifest.json](mdc:manifest.json) 中的 `mp-weixin` 节点配置： |
|
- `appid`: 小程序 AppID |
|
- `permission`: 权限申请说明 |
|
- `requiredPrivateInfos`: 隐私接口声明 |
|
|
|
## 常用功能模块 |
|
|
|
### 登录认证 |
|
- 登录接口: `api/login.js` |
|
- Token 管理: `utils/auth.js` |
|
- 权限验证: `utils/permission.js` |
|
|
|
### 文件上传 |
|
- 上传工具: `utils/upload.js` |
|
- 支持图片、文件上传到服务器 |
|
|
|
### 数据字典 |
|
- 字典工具: `utils/dict.js` |
|
- 统一管理下拉选项等枚举数据 |
|
|
|
## 注意事项 |
|
1. 开发时注意区分平台差异，使用条件编译 |
|
2. 小程序有包大小限制，合理使用分包 |
|
3. 遵循 uni-app 的生命周期和 API 使用规范 |
|
4. 注意处理网络请求的异常情况
|
|
|