Skip to content

基于vue-cli/vite + vue3.0 + ant-design-vue2.0 + typescript hooks 的基础后台管理系统模板 RBAC的权限系统, JSON Schema动态表单,动态表格,漂亮锁屏界面

License

Notifications You must be signed in to change notification settings

diandian123/vue3-antd-admin

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

79 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

vue3-antd-admin

基于 vue-cli / vite2.x + vue3.x + antd-design-vue2.x + typescript4.x 的后台管理系统模板

vscode 配置

安装项目根目录.vscode 推荐的插件,再安装 Volar,并禁用 Vetur,重启 vscode 即可。

使用了 Vue3.0 全家桶、ant-design-vue2.0 和 typescript4.0,实践 vue3.0 的新特性以及玩法,不得不说 vue3.0 的 Composition API 相比于 vue2.0 的 Options API 灵活很多,让我们可以灵活地组合组件逻辑,我们可以很轻松的使用 hooks 的形式去代替以前 mixins 等的写法。更多 hooks 可以参考vueuse

功能、组件的封装

  • 动态表格(扩展了伸缩列功能,以及使用 JSON schema 配置生成表格) // TODO 后续有待加强及完善
  • 动态表单(满足基本的需求) // TODO 后续有待加强及完善
  • 自定义弹窗(支持 8 个方向拖拽改变大小以及拖拽移动位置)// TODO: 继承 antd 原组件所有 props
  • 图片视频预览(目前只是简单显示)
  • 分割组件(目前只做了左右)
  • 图标组件封装(本地 svg 封装、阿里图标的在线和离线封装)
  • 其他...

页面功能

系统看板

  • 首页
  • 疫情地图
  • 系统日志
  • 前端性能监控

系统管理

  • 账号管理
  • 角色管理
  • 资源管理
  • 字典管理

克隆项目

git clone --single-branch https://github.com/buqiyuan/vite-vue3-lowcode.git
or
git clone --depth=1 https://github.com/buqiyuan/vite-vue3-lowcode.git

Project setup

yarn install
#
yarn --frozen-lockfile

Compiles and hot-reloads for development

yarn serve

Compiles and minifies for production

yarn build

Lints and fixes files

yarn lint

感谢 JetBrains 免费的开源授权

About

基于vue-cli/vite + vue3.0 + ant-design-vue2.0 + typescript hooks 的基础后台管理系统模板 RBAC的权限系统, JSON Schema动态表单,动态表格,漂亮锁屏界面

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 48.1%
  • Vue 41.7%
  • JavaScript 7.4%
  • SCSS 1.5%
  • Less 0.7%
  • HTML 0.4%
  • Shell 0.2%