简约漂亮快速后台Vue3+ElementPlus+Pinia+Echarts,API-Mock双接口

TodoAdmin-Vue版:是一个集成管理后台端模板解决方案,项目采用TS(TypeScript)脚本语言,基于Vue 3.2+/Vue-cli 5.0+/Vue-router 4.0+、Axios0.2.7、Element-plus 2.2+、Pinia 2.0+、ECharts 5.3.2以及Mockjs等搭建,项目是以Composition api风格编写,采用远程API接口和本地Mock双接口模式加载数据。
Demo体验&仓库地址
- Todoadmin-pro Pro专业版演示地址(vue3.2+ 支持 PC、平板、手机)
- Todoadmin-base 基本版演示地址(vue3.2+ 支持 PC、平板、手机)
- Github 地址
- Gitee 码云地址用户名:guest密码:123456
项目生态插件【依赖】列表
标题名称 版本 描述vue 3.2+ 构建用户界面的渐进式框架vue-router 4.0+ 单页应用程序路由vue-cli 5+ 项目脚手架axios 0.2.7 基于promise的网络请求库element-plus 2.2+ 基于Vue3的组件库element-plus-icons 2.2+ 基于Vue3的组件图标库vue-quill 1.0.0.beta.8 可视化在线文本编辑器quill-image-resize 3.0+ 文本编辑器图片重置尺寸vue-cropper 1.0+ 基于Vue3的图片裁剪pinia 2.0+ 状态管理vue-i18n-next 9.1+ 多国语言文字切换js-md5 0.7.3 MD5加密nprogress 0.2.0 进度条加载echarts 5.3.2 多功能图表
项目安装(依赖安装)
npm install or yarn install运行开发环境
npm run serve or yarn serve生产环境打包
npm run build or yarn build修复文件
npm run lint克隆项目 访问Github仓库
# 克隆项目
git clone -b https://github.com/todoadmin/vue-admin-chart.git
# 安装依赖
npm i
# 本地开发 启动项目
npm run serve克隆项目 访问Gitee仓库
# 克隆项目
git clone -b https://gitee.com/todoadmin/vue-admin-chart.git
# 安装依赖
npm i
# 本地开发 启动项目
npm run serve后台效果图预览
以下是截取效果图展示:




前后端功能简介
前端
- CDN 分布式引入JS/样式/图片/Json/地图数据
- 独家采用API远程实时数据接口和Mock本地数据双接口,可自由切换API或Mock
- 120+高质量组件页面
- 管理后台采用实时接口数据传输
- 实时生成可视化数据大屏动态图表
- 实时数据采用Websocket交互
- 采用Composition API模式
- 采用JWT 认证
- 实时监控系统&服务器资源使用
- 所有开源版本均可免费商用
- 跨平台 PC、手机端、平板等多端兼容
- 动态路由菜单认证和精确到用户的权限路由渲染
- 支持MarkDown(md)文件加载成Vue组件页面
- 支持mock本地模拟数据和远程模拟数据
- 支持按钮功能级别的权限控制
- 支持会员用户和管理员用户的角色、权限等分配
- 支持多种主题切换以及自定义添加主题样式
- 支持多国语言文字切换
- 支持Pinia的状态管理模式
- 支持自定义Vue指令
- 支持对接第三方物流平台
- 支持绑定第三方账号功能
- 支持日志追溯(用户操作和管理员操作)
后端
- 接口语言版本:Go (1.7+)
- 接口语言版本:PHP (8.0.2 +)/Swoole (4.8+)
- 接口语言版本:SpringBoot (2.2+)
- 可支持多种开源关系数据库切换:MySQL、MariaDB、PostgreSQL、openGauss、TiDB
- 可支持多种内存数据库切换:Redis、Memcached
- 可支持关系型数据库的集群
- 可支持内存型数据库的集群
- 可支持静态文件(图片、视频、文档等)云存储和CDN分发
转载自:https://segmentfault.com/a/1190000042012902
