通用方法

本小节，分享前端项目的常用方法和工具类。

1. 工具类

项目的工具类位于 src/utils 目录。 | 文件 | 作用 | | index.ts | 通用工具（路由解析、页面跳转、环境配置等） | | date.ts | 日期格式化、相对时间 | | tree.ts | 树形结构构建、查找 | | constants.ts | 枚举常量导出 | | debounce.ts | 防抖函数 | | download.ts | 文件下载 | | encrypt.ts | 加解密 | | validator.ts | 表单验证 | | url.ts | URL 处理 | | systemInfo.ts | 系统信息获取 | | toLoginPage.ts | 跳转登录页 |

2. Hooks

项目的 Hooks 位于 src/hooks 目录。 | 文件 | 作用 | | useRequest.ts | 异步请求封装 | | useScroll.ts | 分页滚动加载 | | useDict.ts | 字典数据 | | useAccess.ts | 权限控制 | | useUpload.ts | 文件上传 |

3. 枚举类

项目在 src/utils/constants 目录定义了枚举类。

3.1 字典枚举

字典枚举定义在 dict-enum.ts 中，对应后端字典管理的字典类型 KEY。

import { DICT_TYPE } from '@/utils/constants'

// 使用字典类型
DICT_TYPE.COMMON_STATUS // 'common_status'
DICT_TYPE.SYSTEM_USER_SEX // 'system_user_sex'
DICT_TYPE.BPM_TASK_STATUS // 'bpm_task_status'

3.2 业务枚举

业务枚举用于前端业务逻辑判断，避免"魔法值"。 | 文件 | 模块 | | biz-system-enum.ts | 系统模块（状态、菜单类型、角色类型等） | | biz-infra-enum.ts | 基础设施模块 | | biz-bpm-enum.ts | 工作流模块 |

import { CommonStatusEnum, SystemMenuTypeEnum } from '@/utils/constants'

// 通用状态
if (status === CommonStatusEnum.ENABLE) { /* 开启 */ }
if (status === CommonStatusEnum.DISABLE) { /* 禁用 */ }

// 菜单类型判断
if (menuType === SystemMenuTypeEnum.DIR) { /* 目录 */ }
if (menuType === SystemMenuTypeEnum.MENU) { /* 菜单 */ }
if (menuType === SystemMenuTypeEnum.BUTTON) { /* 按钮 */ }

4. 缓存配置

项目使用 Pinia 进行状态管理，配合 pinia-plugin-persistedstate 插件实现数据持久化。

Store 文件位于 src/store 目录下：

store/
├── index.ts                  # Store 入口，统一导出
├── user.ts                   # 用户信息（用户、角色、权限）
├── token.ts                  # Token 管理（登录、登出、刷新令牌）
├── dict.ts                   # 字典数据缓存
└── theme.ts                  # 主题配置

官方文档

详细的 Store 使用方式，请参考：《unibest 官方文档 —— 状态管理篇》 文档。

持久化数据存储在：

• H5：localStorage
• 小程序：uni.setStorageSync
• App：uni.setStorageSync