https://mp.weixin.qq.com/s/mNWc2tJWZlxJkKQh-kNpVg
该方案作为一套多功能的后台框架模板，适用于绝大部分的后台管理系统（Web Management System）开发。基于 Vue3，使用 vue-cli3脚手架，引用 Element Plus 组件库，方便开发快速简洁好看的组件。分离颜色样式，支持手动切换主题色，而且很方便使用自定义主题色
先放两张截图
登录界面
主界面
看完是不是有点小心动，好，接着往下，你马上就能拥有它！
2.如何下载项目
下载项目
如果你是window用户，直接打开你的cmd，打开终端；如果你是mac用户，直接打开你的iTerm,输入这段命令：
git clone https://github.com/ink-song/system-manage-template.git当你的终端出现如下的图，说明你成功的把这个模板项目下载下载好了
安装yarn与node(MAC端)
接下来需要使用到一个前端的资源管理器（yarn）,如果你已有yarn，可忽略此段内容
brew install yarn如果你没有brew，可以执行此命令下载
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"安装好brew，使用brew -v检查一下是否安装成功，出现以下截图说明安装成功
还有什么疑问的话，也可以访问网址：https://brew.sh/ 去查询Homebrew相关知识。Homebrew下载好了默认会把node也安装好，如果node安装有问题的可执行此命令
brew install node或者访问网址： https://nodejs.org/zh-cn/，点击macOS 版本下载
执行此命令检查node版本
node -v 看到以下截图node就安装成功了
安装yarn与node(win端)
如果你是window用户，可以访问此网站安装yarn：
https://cloud.tencent.com/developer/article/1730346
如何安装node可访问此网站：
https://segmentfault.com/a/1190000023871608
安装好以后可同上 使用命令依次检查node，yarn是否安装成功。（注意：node和yarn在window系统中可能需要配环境变量，可参考: https://www.jianshu.com/p/2d9fa3659645）
现在万事俱备，就可以开始整活了
进入 system-manage-template 目录下
cd system-manage-template/进入到此路径下，然后执行 yarn命令,这时候项目就会开始下载相关的项目依赖
yarn看到上述截图就说明项目依赖安装成功了！最后一步就是让项目运行起来，还是在当前目录下，执行此命令
yarn serve
看到上述截图说明项目运行起来了，这时候访问Local或者Network提供的地址即可访问项目，如下图
3.项目目录及使用方法
项目目录
数据交互
首先在api文件下创建对应模块的js，然后创建相应的函数
其中url就是后端提供的api接口，用于访问服务器数据。method是请求数据方式，一般有get，post，delete，put等。params是请求携带的参数，例如请求列表数据，一般携带limit（当前页的限制），page（访问的页数）
然后是asset文件夹，是存放一些css，img文件，css中包括三个文件，分别是color-dark.css（项目主题替样式），icon.css（项目图标样式）, main.css（主要的一些全局样式）
紧接是components文件夹。这里面主要存放一些公共的组件，例如说侧边导航栏，头部的导航，table组件的封装等
plugins文件夹主要用了element-plus 插件
router文件夹是写路由的文件
上图路由对应下图
如果你想自己添加路由，可以按照上面的规则写在对应的位置，并在views文件下创建对应的vue文件。其中几个参数交代一下，path就是路由跳转的路径，如下图
name就是路由名称，meta就是路由的一些配置信息，例如title，然后就是compontent,你需要导入的路由，可通过import的方式导入，最后就是children参数，当你的页面有二级菜单（对应上述截图表单相关模块），可通过该参数配置，children内部参数配置和一级页面一致（相关知识可前往：https://router.vuejs.org/zh/）
store文件夹主要是存放vuex状态的函数，里面一般包括state，mutations, getters，actions（相关知识可前往：https://vuex.vuejs.org/zh/）
utils文件夹主要存放工具类，例如国际化的i18n，可以通过在里面添加对应的属性实现国际化；还有request.js，这个就是上面api文件夹中请求函数封装的由来。这个工具类函数主要用于请求数据时做一些响应和请求拦截处理，还有一些axios的相关参数配置
views文件夹是一个很重要的存在，你所写的所有业务相关的代码都是存放在这，例如BaseTable.vue文件就是比较基础的业务开发，里面包括template，script，style三块，分别是写dom结构，写js和写css的地方。这块需要有一定的前端基础和对vue框架有一定的了解，没有基础的同学建议先过一遍文档：https://cn.vuejs.org/v2/guide/， 写起来就会顺手很多
main.js是项目的入口文件，主要是加载一些资源，例如router，store等
package.json也是一个比较重要的文件，主要涵盖了项目的一些基础信息，例如项目执行的脚本，所需要的依赖，还有一些eslint（代码规范），当你想要下载一个依赖时，可通过yarn 依赖包名 即可下载好， 下载好的包名就会出现在package.json中。这需要说明下，devDependencies 是开发所需要的依赖，dependencies 是项目运行时所需要的依赖
看到这，你已经成功的拥有了这个项目了，快动手试试吧！