Skip to content

项目结构

移动端工程目录(youlai-app/src)核心结构:

text
src/
├── api/                  # 接口封装
│   ├── auth.ts           #   登录、验证码、刷新、登出
│   ├── user.ts           #   用户信息、个人中心、密码修改
│   ├── role.ts           #   角色管理
│   ├── dept.ts           #   部门管理
│   ├── menu.ts           #   菜单管理
│   ├── dict.ts           #   字典管理
│   ├── notice.ts         #   通知公告
│   ├── log.ts            #   操作日志、访问统计
│   ├── file.ts           #   文件上传
│   └── config.ts         #   系统配置
├── components/           # 组件
│   ├── custom-navbar/    #   自定义导航栏
│   ├── custom-tree/      #   树形选择组件
│   ├── cu-date-query/    #   日期查询组件
│   └── qiun-data-charts/ #   图表组件
├── composables/          # 组合式函数
│   ├── useNavbar.ts      #   导航栏高度计算
│   ├── useCountdown.ts   #   倒计时
│   ├── useNavigation.ts  #   导航跳转
│   ├── useRequest.ts     #   请求封装
│   ├── useLoading.ts     #   加载状态管理
│   ├── useTabbar.ts      #   TabBar 配置
│   ├── useTheme.ts       #   主题切换
│   └── useSse.ts         #   实时通信(SSE)
├── config/               # 应用配置
│   ├── index.ts          #   配置入口
│   └── menu.ts           #   工作台菜单配置
├── constants/            # 常量(token key、权限标识等)
├── enums/                # 枚举(API 业务码等)
├── layouts/              # 布局
│   ├── default.vue       #   默认布局
│   └── tabbar.vue        #   TabBar 布局
├── pages/                # 页面
│   ├── index/            #   首页
│   ├── login/            #   登录页
│   ├── work/             #   工作台(用户/角色/部门/菜单等管理页面)
│   ├── mine/             #   我的(个人资料/账号安全/设置等页面)
│   └── webview/          #   内嵌网页
├── router/               # 路由守卫
├── store/                # Pinia 状态管理
│   ├── index.ts          #   统一导出
│   └── modules/
│       ├── user.ts       #   用户状态
│       └── theme.ts      #   主题状态
├── styles/               # 全局样式
├── types/                # TypeScript 类型
├── utils/                # 工具函数
│   ├── request.ts        #   请求封装与 token 注入
│   ├── auth.ts           #   登录态判断、回跳
│   ├── permission.ts     #   权限判断
│   ├── storage.ts        #   存储封装
│   └── index.ts          #   通用工具(debounce 等)
├── main.ts               # 入口
└── App.vue               # 根组件

常用代码入口

文件职责
utils/request.ts请求封装、token 注入、401 拦截
utils/auth.ts登录态判断、登录页跳转
utils/permission.ts权限/角色判断
composables/useNavbar.ts导航栏高度计算
config/menu.ts工作台菜单配置
constants/index.ts常量定义

TabBar 配置

TabBar 在 pages.config.ts 中配置,默认三个页签:

  • pages/index/index — 首页
  • pages/work/index — 工作台
  • pages/mine/index — 我的

基于 MIT 许可发布 · 由 ❤️ 和 ☕ 驱动 · 支持作者