介绍
SnailJob
前端基于 SoybeanAdmin
框架上构建的,二次开发请详细阅读 SoybeanAdmin 文档
。
快速上手
详细内容请参考 SoybeanAdmin 快速上手
目录说明
snail-job-admin
├── .vscode //vscode插件和设置
│ ├── extensions.json //vscode推荐的插件
│ ├── launch.json //debug配置文件(debug Vue 和 TS)
│ └── settings.json //vscode配置(在该项目中生效,可以复制到用户配置文件中)
├── build //vite构建相关配置和插件
│ ├── config //构建打包配置
│ │ └── proxy.ts //网络请求代理
│ └── plugins //构建插件
│ ├── index.ts //插件汇总
│ ├── router.ts //elegant-router插件
│ ├── unocss.ts //unocss插件
│ └── unplugin.ts //自动导入UI组件、自动解析iconify图标、自动解析本地svg作为图标
├── packages //子项目
│ ├── axios //网络请求封装
│ ├── color //颜色调色板
│ ├── cron-input //cron 表达式组件
│ ├── hooks //组合式函数hooks
│ ├── materials //组件物料
│ ├── ofetch //网络请求封装
│ ├── scripts //脚本
│ ├── uno-preset //uno-preset配置
│ └── utils //工具函数
├── public //公共目录(文件夹里面的资源打包后会在根目录下)
│ └── ......
│ └── iconify //iconify 离线文件夹
│ └── favicon.svg //网站标签图标
├── src
│ ├── assets //静态资源
│ │ ├── imgs //图片
│ │ └── svg-icon //本地svg图标
│ ├── components //全局组件
│ │ ├── advanced //高级组件
│ │ ├── common //公共组件
│ │ └── custom //自定义组件
│ │ └── workflow //工作流组件
│ ├── constants //常量
│ │ ├── app.ts //app常量
│ │ ├── business.ts //业务常量
│ │ ├── common.ts //通用常量
│ │ └── reg.ts //正则常量
│ ├── enums //枚举
│ ├── hooks //组合式的函数hooks
│ │ ├── business //业务hooks
│ │ │ ├── auth //用户权限
│ │ └── common //通用hooks
│ │ ├── echarts //echarts
│ │ ├── form //表单
│ │ ├── icon //图标
│ │ ├── router //路由
│ │ └── table //表格
│ ├── layouts //布局组件
│ │ ├── base-layout //基本布局(包含全局头部、多页签、侧边栏、底部等公共部分)
│ │ ├── blank-layout //空白布局组件(单个页面)
│ │ ├── context //布局组件的上下文状态
│ │ ├── hooks //布局组件的hooks
│ │ └── modules //布局组件模块
│ │ ├── global-breadcrumb //全局面包屑
│ │ ├── global-content //全局主体内容
│ │ ├── global-footer //全局底部
│ │ ├── global-header //全局头部
│ │ ├── global-logo //全局Logo
│ │ ├── global-menu //全局菜单
│ │ ├── global-search //全局搜索
│ │ ├── global-sider //全局侧边栏
│ │ ├── global-tab //全局标签页
│ │ ├── namespace-select //全局命名空间下拉选择
│ │ └── theme-drawer //主题抽屉
│ ├── locales //国际化配置
│ │ ├── langs //语言文件
│ │ ├── dayjs.ts //dayjs的国际化配置
│ │ ├── locale.ts //语言文件汇总
│ │ └── naive.ts //NaiveUI的国际化配置
│ ├── plugins //插件
│ │ ├── app.ts //应用程序更新提示
│ │ ├── assets.ts //各种依赖的静态资源导入(css、scss等)
│ │ ├── dayjs.ts //dayjs插件
│ │ ├── iconify.ts //iconify插件
│ │ ├── loading.ts //全局初始化时的加载插件
│ │ └── nprogress.ts //顶部加载条nprogress插件
│ ├── router //vue路由
│ │ ├── elegant //elegant-router插件生成的路由声明、导入和转换等文件
│ │ ├── guard //路由守卫
│ │ ├── routes //路由声明入口
│ │ │ ├── builtin //系统内置路由 根路由和未找到路由
│ │ │ └── index //前端静态路由创建的入口
│ │ └── index.ts //路由插件入口
│ ├── service //网络请求
│ │ ├── api //接口api
│ │ └── request //封装的请求函数
│ ├── store //pinia状态管理
│ │ ├── modules //状态管理划分的模块
│ │ │ ├── app //app状态(页面重载、菜单折叠、项目配置的抽屉)
│ │ │ ├── auth //auth状态(用户信息、用户权益)
│ │ │ ├── route //route状态(动态路由、菜单、路由缓存)
│ │ │ ├── search //搜索条件缓存
│ │ │ ├── tab //tab状态(多页签、缓存页面的滚动位置)
│ │ │ └── theme //theme状态(项目主题配置)
│ │ │ └── workflow //工作量辅助
│ │ └── plugins //状态管理插件
│ ├── styles //全局样式
│ │ ├── css //css
│ │ └── scss //scss
│ ├── theme //主题配置
│ │ ├── settings.ts //主题默认配置及覆盖配置
│ │ └── vars.ts //主题token对应的css变量
│ ├── typings //TS类型声明文件(*.d.ts)
│ │ ├── api.d.ts //请求接口返回的数据的类型声明
│ │ ├── app.d.ts //应用相关的类型声明
│ │ ├── common.d.ts //通用类型声明
│ │ ├── components.d.ts //自动导入的组件的类型声明
│ │ ├── elegant-router.d.ts//插件elegant-router生成的路由声明
│ │ ├── env.d.ts //vue路由描述和请求环境相关的类型声明
│ │ ├── global.d.ts //全局通用类型
│ │ ├── naive-ui.d.ts //NaiveUI类型
│ │ ├── router.d.ts //Vue的路由描述的类型声明
│ │ ├── storage.d.ts //本地缓存的数据类型
│ │ └── union-key.d.ts //联合类型
│ ├── utils //全局工具函数(纯函数,不含状态)
│ │ ├── common //通用工具函数
│ │ ├── download //下载工具函数
│ │ ├── icon //图标相关工具函数
│ │ ├── service //请求服务配置相关的工具函数
│ │ └── storage //存储相关工具函数
│ ├── views //页面
│ │ ├── _builtin //系统内置页面:登录、异常页等
│ │ ├── about //关于
│ │ ├── group //组管理
│ │ ├── home //首页
│ │ ├── job //定时任务
│ │ ├── namespace //命名空间
│ │ ├── notify //告警通知
│ │ ├── pods //在线机器
│ │ ├── retry //重试任务
│ │ ├── user //用户管理
│ │ ├── workflow //工作量
│ ├── App.vue //Vue文件入口
│ └── main.ts //项目入口TS文件
├── .editorconfig //统一编辑器配置
├── .env //环境文件
├── .env.prod //生产环境的环境文件
├── .env.test //测试环境的环境文件
├── .gitattributes //git属性配置
├── .gitignore //忽略git提交的配置文件
├── .npmrc //npm配置
├── CHANGELOG.md //项目更新日志
├── eslint.config.js //eslint flat配置文件
├── index.html //html文件
├── package.json //npm依赖描述文件
├── pnpm-lock.yaml //npm包管理器pnpm依赖锁定文件
├── README.md //项目介绍文档
├── README.zh-CN.md //项目介绍文档(中文)
├── tsconfig.json //TS配置
├── uno.config.ts //原子css框架unocss配置
└── vite.config.ts //vite配置
环境变量
# 版本号
VITE_APP_VERSION
# 默认 token
VITE_APP_DEFAULT_TOKEN
# 图标服务地址
VITE_ICONIFY_URL
# 是否开启系统更新提示
VITE_UPDATE_NOTIFY
# 是否开启登录验证码
VITE_LOGIN_CODE
# 开发环境时是否需要代理
VITE_HTTP_PROXY
# 接口代理地址
VITE_SERVICE_BASE_URL
主题配置
详细内容请参考 SoybeanAdmin 主题配置
系统图标
详细内容请参考 SoybeanAdmin 图标教程