寒假完毕了，趁着寒假，本身玩了一下element和echarts去完成了一个简朴的背景治理体系。
项目比较简朴，非常合适入门，触及到了轮播图，表格，表单，echarts柱形图和折线图，以及网页的相应式等。

先来看看结果：

pc端

挪动端：

项目构造

src
  |---common                     // 公用的文件
        |---css
             |---base.scss      // 公用的css款式
        |---components          // 组件      
             |---Carousel.vue   // 轮播图组件
             |---Form.vue       // 表单组件
             |---Tables.vue     // 表格组件
             |---TheHeader.vue  // header组件
             |---TheNav.vue     // 左边导航栏组件
             |---TwoEcharts.vue // 柱形图和折线图组件
        |---images
             |---portrait.png   // 头像
        |---router
             |---index.js       // 路由
        |---views
             |---CarouseTable.vue // 轮播图和表格页面
             |---Echarts.vue      // echarts图表页面
             |---FormView.vue     // 表单页面
  |---App.vue                     // 总app进口
  |---main.js                     // app实例

手艺栈

• vue ^2.5.2、 vue-router
• scss 中文网站： scss中文
• Element (表格，表单，规划等) 官网：Element
• Echarts (柱形图和折线图) 官网： Echarst

本文代码地点：背景治理体系源码

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report