|
@@ -1,26 +1,42 @@
|
|
|
-#backstage
|
|
|
|
|
|
|
+#PcBackStage
|
|
|
|
|
+
|
|
|
|
|
+ /$$$$$$$ /$$$$$$$ /$$ /$$$$$$ /$$
|
|
|
|
|
+| $$__ $$ | $$__ $$ | $$ /$$__ $$ | $$
|
|
|
|
|
+| $$ \ $$ /$$$$$$$| $$ \ $$ /$$$$$$ /$$$$$$$| $$ /$$| $$ \__//$$$$$$ /$$$$$$ /$$$$$$ /$$$$$$
|
|
|
|
|
+| $$$$$$$//$$_____/| $$$$$$$ |____ $$ /$$_____/| $$ /$$/| $$$$$$|_ $$_/ |____ $$ /$$__ $$ /$$__ $$
|
|
|
|
|
+| $$____/| $$ | $$__ $$ /$$$$$$$| $$ | $$$$$$/ \____ $$ | $$ /$$$$$$$| $$ \ $$| $$$$$$$$
|
|
|
|
|
+| $$ | $$ | $$ \ $$ /$$__ $$| $$ | $$_ $$ /$$ \ $$ | $$ /$$ /$$__ $$| $$ | $$| $$_____/
|
|
|
|
|
+| $$ | $$$$$$$| $$$$$$$/| $$$$$$$| $$$$$$$| $$ \ $$| $$$$$$/ | $$$$/| $$$$$$$| $$$$$$$| $$$$$$$
|
|
|
|
|
+|__/ \_______/|_______/ \_______/ \_______/|__/ \__/ \______/ \___/ \_______/ \____ $$ \_______/
|
|
|
|
|
+ /$$ \ $$
|
|
|
|
|
+ | $$$$$$/
|
|
|
|
|
+ \______/
|
|
|
|
|
+
|
|
|
##常用的后台管理模板
|
|
##常用的后台管理模板
|
|
|
|
|
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
基于 https://panjiachen.github.io/vue-element-admin-site/zh/guide/ 的版本, 只保留常用功能和修改部分UI效果
|
|
基于 https://panjiachen.github.io/vue-element-admin-site/zh/guide/ 的版本, 只保留常用功能和修改部分UI效果
|
|
|
|
|
|
|
|
##安装:
|
|
##安装:
|
|
|
|
|
|
|
|
###克隆项目
|
|
###克隆项目
|
|
|
|
|
|
|
|
-git clone https://git.beswell.com/duanchangpeng/backstage.git
|
|
|
|
|
|
|
+git clone git@git.beswell.com:duanchangpeng/PcBackStage.git
|
|
|
|
|
|
|
|
###进入项目目录
|
|
###进入项目目录
|
|
|
|
|
|
|
|
-cd backstage
|
|
|
|
|
|
|
+cd PcBackStage
|
|
|
|
|
|
|
|
-###安装依赖
|
|
|
|
|
|
|
|
|
|
-npm install
|
|
|
|
|
-
|
|
|
|
|
-###建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题
|
|
|
|
|
|
|
+##安装淘宝源,已安装可忽略
|
|
|
|
|
|
|
|
npm install --registry=https://registry.npm.taobao.org
|
|
npm install --registry=https://registry.npm.taobao.org
|
|
|
|
|
|
|
|
|
|
+###安装依赖
|
|
|
|
|
+
|
|
|
|
|
+cnpm i
|
|
|
|
|
+
|
|
|
###本地开发 启动项目
|
|
###本地开发 启动项目
|
|
|
|
|
|
|
|
npm run dev
|
|
npm run dev
|
|
@@ -34,7 +50,6 @@ npm run dev
|
|
|
│ ├── assets # 主题 字体等静态资源
|
|
│ ├── assets # 主题 字体等静态资源
|
|
|
│ ├── components # 全局公用组件
|
|
│ ├── components # 全局公用组件
|
|
|
│ ├── directive # 全局指令
|
|
│ ├── directive # 全局指令
|
|
|
- │ ├── filters # 全局 filter
|
|
|
|
|
│ ├── icons # 项目所有 svg icons
|
|
│ ├── icons # 项目所有 svg icons
|
|
|
│ ├── lang # 国际化 language
|
|
│ ├── lang # 国际化 language
|
|
|
│ ├── layout # 全局 layout todo
|
|
│ ├── layout # 全局 layout todo
|
|
@@ -53,21 +68,6 @@ npm run dev
|
|
|
├── postcss.config.js # postcss 配置
|
|
├── postcss.config.js # postcss 配置
|
|
|
└── package.json # package.json
|
|
└── package.json # package.json
|
|
|
|
|
|
|
|
-##2. todolist
|
|
|
|
|
-
|
|
|
|
|
- 1.右上角下拉菜单基本功能 √
|
|
|
|
|
- 2.左侧菜单列表 √
|
|
|
|
|
- 3.封装axios的使用 √
|
|
|
|
|
- 4.路由守卫 √
|
|
|
|
|
- 5.table翻页 √
|
|
|
|
|
- <s> 6.tab标签页 </s>
|
|
|
|
|
- 7.图表页面 √
|
|
|
|
|
- 8.弹窗提醒,弹窗交互 dialog,popconfirm
|
|
|
|
|
- 9.excel todo
|
|
|
|
|
- 10.navbar 小图标模式 √
|
|
|
|
|
- 11.radar 动画 √
|
|
|
|
|
- 12.地图组件 √
|
|
|
|
|
-
|
|
|
|
|
##4.使用方法
|
|
##4.使用方法
|
|
|
|
|
|
|
|
a.增加新页面
|
|
a.增加新页面
|
|
@@ -78,6 +78,18 @@ b.新增接口
|
|
|
import { 新写的方法名 } from '../api/getApiRes.js'
|
|
import { 新写的方法名 } from '../api/getApiRes.js'
|
|
|
然后再methods里使用 新的方法名(param).then(res => {...})的形式调用
|
|
然后再methods里使用 新的方法名(param).then(res => {...})的形式调用
|
|
|
|
|
|
|
|
|
|
+c.反向代理
|
|
|
|
|
+ 修改 vue.config.js 中 target: 'http://192.168.0.162:19080/', 的地址,重启npm run serve后生效
|
|
|
|
|
+
|
|
|
|
|
+d.打包
|
|
|
|
|
+ 配置打包地址,修改 vue.config.js 中 outputDir: 'D:/wwwroot/test/new_back/static_pc', 指向的地址,
|
|
|
|
|
+ 在执行build命令后生效。
|
|
|
|
|
+
|
|
|
|
|
+e.运行
|
|
|
|
|
+ 使用nginx等程序驱动http服务,指向打包后的index.html文件所在地址即可。
|
|
|
|
|
+ (如打开后出现loading情况,均为后端数据源配置错误,搭建相应服务后即可,其他问题如没有配置本地host等)
|
|
|
|
|
+
|
|
|
|
|
+ === todo ===
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|