signal_web

#backstage ##常用的后台管理模板

基于 https://panjiachen.github.io/vue-element-admin-site/zh/guide/ 的版本， 只保留常用功能和修改部分UI效果

##安装：

###克隆项目

git clone https://git.beswell.com/duanchangpeng/backstage.git

###进入项目目录

cd backstage

###安装依赖

npm install

###建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm 下载速度慢的问题

npm install --registry=https://registry.npm.taobao.org

###本地开发 启动项目

npm run dev

##1.目录结构

├── build                      # 构建相关
├── mock                       # 项目mock 模拟数据
├── src                        # 源代码
│   ├── api                    # 所有请求
│   ├── assets                 # 主题 字体等静态资源
│   ├── components             # 全局公用组件
│   ├── directive              # 全局指令
│   ├── filters                # 全局 filter
│   ├── icons                  # 项目所有 svg icons
│   ├── lang                   # 国际化 language
│   ├── layout                 # 全局 layout  todo
│   ├── router                 # 路由
│   ├── store                  # 全局 store管理  todo
│   ├── utils                  # 全局公用方法
│   ├── vendor                 # 公用vendor todo
│   ├── views                  # views 所有页面
│   ├── App.vue                # 入口页面
│   ├── main.js                # 入口文件 加载组件 初始化等
├── .env.xxx                   # 环境变量配置
├── .eslintrc.js               # eslint 配置项
├── .babelrc                   # babel-loader 配置
├── .travis.yml                # 自动化CI配置
├── vue.config.js              # vue-cli 配置
├── postcss.config.js          # postcss 配置
└── 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.使用方法

a.增加新页面

在views里新建一个vue文件，将文件名和路径加入router/index.js中，注意文件层级，非系统级别页面应加入main下的同级别里。  

b.新增接口

在api/getApiRes.js里添加方法，在使用页面，首先引入这个文件    
import { 新写的方法名 } from '../api/getApiRes.js'    
然后再methods里使用 新的方法名(param).then(res => {...})的形式调用  

========== 1.项目打包

执行build命令  
将D:\wwwroot\signal_build\build\static 下的文件push  

2.项目查看线上效果

访问  http://sd.tickdig.com:85/login  
测试账号 admin pwd 123456  

============ design func

1.一个专门模块负责从后台请求数据 main.vue 2.各个子组件只负责渲染，切换还是由main负责