架构规范

项目整体架构设计和技术选型说明。

技术栈

技术	版本	说明
UniApp	3.x	跨端框架，一套代码多端运行
Vue 3	3.4+	前端框架，Composition API
TypeScript	4.9+	类型系统，核心业务强类型
Vant 4	4.9+	移动端 UI 组件库
Pinia	2.x	状态管理，替代 Vuex
TailwindCSS	3.x	原子化 CSS，配合 SCSS
Vite	5.x	构建工具
Tauri	2.x	桌面端框架

适配端

平台	状态	说明
H5	主要	浏览器端，支持企微内嵌
微信小程序	主要	企微小程序环境
Tauri 桌面端	支持	Windows 桌面应用

目录结构

src/
├── api/           # 所有接口请求、响应类型、接口枚举
├── pages/         # 页面入口，区分 pc / mobile
├── components/    # 通用公共组件、业务通用组件
├── hooks/         # OA/BPM 业务专属钩子
├── composables/   # 通用技术能力钩子
├── utils/         # 纯工具函数
├── types/         # 全局 TS 类型、接口、枚举
├── constants/     # 全局常量、字典、枚举
├── stores/        # Pinia 状态管理
├── styles/        # 全局样式、设计变量
├── plugins/       # 插件（form-create 等）
├── config/        # 应用配置
└── static/        # 静态资源

核心设计原则

• 分层隔离：api / pages / components / hooks / utils 各司其职，禁止跨层调用
• 统一请求：所有接口通过 src/utils/request.ts 统一拦截、统一异常处理
• 统一状态：Token、用户信息、主题等通过 Pinia store 管理
• 常量枚举：所有字典、状态、流程类型使用 src/constants/ 中的枚举，禁止硬编码
• 路由常量：所有跳转路径使用 src/constants/route.ts 中的路由常量

状态管理模块

Store	职责
user	用户信息、登录状态、Token 管理
theme	主题模式、关怀模式、毛玻璃效果
app	应用全局状态
dict	数据字典缓存
layout	布局状态、TabBar 管理
processDefinition	流程定义数据
mail	邮件账户状态
track	埋点追踪状态