Awesome Open Source
Awesome Open Source

vue element-plus typescript

vue3-element-plus-admin主要目的在于学习 vue3 + ts,功能在完善中,基于的 RBAC 权限控制,后续会 持续迭代更新

后端是基于 javaspringboot,目前完整版后端代码 暂未开源。后期完善之后可能 会开源完整后端代码。目前开源了基础版的后端代码
若该项目有帮助到你可以翻到底部 添加作者微信/QQ,如果使用中遇到什么问题可以在交流群中说明你遇到的问题,大佬们都会积极的给你解决。

若Github项目下载代码过慢或失败,可以翻到底部,关注公众号获取基础版 base-refactoring 分支的前后端代码

简介

vue3-element-plus-admin 是一个管理后台基础功能框架,基于 vue3element-plustypescript 实现。内置了 i18n 国际化,动态路由,权限验证。

注: 由于国内项目使用国际化功能的比较少,所以主分支没有添加国际化功能,如有需要可以参考 composition-api 分支。

默认 master 分支默认使用 composition-api ,若需要 class 风格 + Typescript 请使用class-style分支,若需要 composition-api + Typescript + I18n 请使用composition-api分支,若只需要 基础版本 请使用base-refactoring分支,但它们不会和 master 保持同步更新

分支

  • master 轻量版本:持续维护分支
  • base-refactoring 精简版本:基于 RBAC 的权限功能-仅包含 菜单管理角色管理用户管理 三个模块
  • composition-api 内置__Type ScriptI18n__
  • class-style 使用 class 风格开发,内置__Type ScriptI18n__
  • 说明: 其他分支是作者开发时使用的分支, 由于 element-plus 版本迭代的原因,项目中间重构过,布局也同步改为 flex 布局。 所以 composition-apiclass-style 版本比较旧一点,建议这两个分支作为参考学习。 masterbase-refactoring 这两个分支是比较新的,可以放心使用。

功能模块

  • [X] 角色管理
  • [X] 账户管理
  • [X] 发送邮件/邮件记录
  • [X] 登录日志
  • [X] 操作日志
  • [X] 定时任务日志
  • [X] 异常日志
  • [X] 菜单管理
  • [X] 数据字典
  • [X] 配置管理
  • [X] 定时任务
  • [X] 文件管理 - 现在默认使用的是七牛云,可直接配置存储位置
    • [X] 本地存储
    • [X] 七牛云存储
  • [X] 消息推送
  • [X] 区域管理
  • [X] 备份管理
  • [X] 代码生成器
  • [X] 接口文档
  • [X] SQL监控

项目结构

vue3-src
├─api 接口模块
│
├─assets 静态资源模块
│  ├─icon svg图标
│  ├─images 图片
│  └─sass 样式
│ 
├─components 通用组件
│  ├─global 全局组件
│  │  ├─icon element-plus 内置图标组件重新封装
│  │  ├─page 分页组件
│  │  ├─svg 本地svg图片使用组件
│  │  └─index 统一全局注册
│  ├─editor 富文本组件
│  └─look-around 随便看看按钮组件
│ 
├─directive 全局自定义指令
│ 
├─mixins 代码复用 (vue2混入)
│  └─page 分页
│ 
├─router 动态路由
│ 
├─store vuex
│  ├─modules
│  │  ├─dictionary 数据字典模块
│  │  ├─menu 菜单模块
│  │  ├─setting 设置模块
│  │  ├─tab 标签页模块
│  │  └─user 用户登录信息模块
│  └─index 动态加载模块
│ 
├─utils 工具模块
│  ├─constant 常量
│  ├─dictionary 字典
│  ├─index 工具
│  ├─regular 正则
│  ├─request axios二次封装
│  └─storage 本地缓存工具
│
├─views 视图模块
│  ├─global 通用页面
│  │  ├─401 401页面
│  │  ├─404 404页面
│  │  ├─500 500页面
│  │  └─login 登录页面
│  ├─layout
│  │  ├─components
│  │  │  ├─edit-info 修改信息
│  │  │  ├─headbar 顶部导航
│  │  │  ├─sidebar 侧边栏
│  │  │  └─tabsbar 标签页
│  │  └─index 布局入口页面
│  └─modules 页面模块

开发

# 克隆项目
git clone https://github.com/gmingchen/vue3-element-plus-admin.git

# 进入项目目录
cd vue3-element-plus-admin

# 安装依赖
npm install

# 启动服务
npm run dev   # 开发环境
npm run prod  # 正式环境
npm run test  # 测试环境

# 发布
npm run build:dev   # 开发环境
npm run build:prod  # 正式环境
npm run build:test  # 测试环境

广告

领红包

联系方式

公众号 QQ交流群 微信交流群 微信 QQ
公众号:loafer-man QQ交流群:124371554 微信交流群:124371554 微信:Gy1240235512 QQ:1240235512

其它开源项目

java-admin-base

是一个管理后台基础功能框架 base-refactoring 分支的后端代码,基于 javaspringboot

vue3-element-plus-im

是一个即时聊天系统,基于 vue3element-plus 实现。内置了好友私聊功能。


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
Typescript (252,937
Vue (81,286
Spring Boot (12,142
Vuejs (9,842
Sass (6,053
Axios (3,434
Vuex (3,123
Vue Router (2,176
I18n (1,784
Admin (1,490
Vue3 (1,236
Vue Cli (1,143
Composition Api (160
Related Projects