update

src/components/HelloWorld.vue

@@ -1,58 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br>
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
-      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
-      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
-      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
-      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
-      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
-      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
-      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
-      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
-      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
-    </ul>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'HelloWorld',
-  props: {
-    msg: String
-  }
-}
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped>
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>

src/components/Page.vue

@@ -0,0 +1,44 @@
+<style lang="scss">
+ @import '../style/style.scss';
+    .el-pagination{
+        li,button{
+            border: 1px solid #CACACA !important;
+            background-color: #fff !important;
+        }
+        .active{
+            border:none !important;
+            background: $mainColor !important;
+        }
+    }
+</style>
+<template>
+    <el-pagination
+    @current-change="getData"
+    background :page-size='10'
+    layout="total,prev, pager, next"
+    :total="total">
+    </el-pagination>
+</template>
+<script>
+export default {
+    data(){
+        return{
+            page:1
+        }
+    },
+    props: {
+        total:'',
+    },
+    methods:{
+        getData(type){
+            // if(type == 1){
+            //     this.data.pageNumber=this.data.pageNumber-1
+            // }else if(type == 2){
+            //     this.data.pageNumber=this.data.pageNumber+1
+            // }
+             this.page=type
+            this.$emit('pageChange')
+        }
+    }
+}
+</script>

src/router.js

@@ -33,19 +33,63 @@ export default new Router({
         { path: '/subject', component: () => import('./views/project/Index.vue'), name: '培训科目' },
       ]
     },
-    // {
-    //   path: '/',
-    //   name: '文章发布',
-    //   icon:'fa fa-book',
-    //   component: () => import('./views/Home.vue'),
-    //   show:1,
-    //   isLeaf:0,
-    //   children:[
-    //     { path: '/column', component: () => import('./views/article/Column.vue'), name: '栏目管理',show:1},
-    //     { path: '/column/add', component: () => import('./views/article/AddColumn.vue'), name: '新增栏目' ,show:0},
-    //     { path: '/article', component: () => import('./views/article/Article.vue'), name: '文章管理',show:1},
-    //     { path: '/article/add', component: () => import('./views/article/AddArticle.vue'), name: '发布文章' ,show:0},
-    //   ]
-    // },
+    {
+      path: '/',
+      name: '报名信息',
+      icon:'el-icon-menu',
+      component: () => import('./views/Home.vue'),
+      show:1,
+      isLeaf:0,
+      children:[
+        { path: '/new', component: () => import('./views/apply/New.vue'), name: '新办' },
+      ]
+    },
+    {
+      path: '/',
+      name: '培训计划',
+      icon:'el-icon-menu',
+      component: () => import('./views/Home.vue'),
+      show:1,
+      isLeaf:0,
+      children:[
+        { path: '/classes', component: () => import('./views/classes/Index.vue'), name: '班级管理' },
+        { path: '/classes/add', component: () => import('./views/classes/Add.vue'), name: '新增班级' },
+      ]
+    },
+    {
+      path: '/',
+      name: '在线培训',
+      icon:'el-icon-menu',
+      component: () => import('./views/Home.vue'),
+      show:1,
+      isLeaf:0,
+      children:[
+        { path: '/paper', component: () => import('./views/paper/Index.vue'), name: '试卷管理' },
+        { path: '/video', component: () => import('./views/video/Index.vue'), name: '视频管理' },
+        { path: '/video/add', component: () => import('./views/video/Add.vue'), name: '新增视频' },
+      ]
+    },
+    {
+      path: '/',
+      name: '用户管理',
+      icon:'el-icon-menu',
+      component: () => import('./views/Home.vue'),
+      show:1,
+      isLeaf:0,
+      children:[
+        { path: '/user', component: () => import('./views/user/Index.vue'), name: '用户管理' },
+      ]
+    },
+    {
+      path: '/',
+      name: '系统管理',
+      icon:'el-icon-menu',
+      component: () => import('./views/Home.vue'),
+      show:1,
+      isLeaf:0,
+      children:[
+        { path: '/system/add', component: () => import('./views/user/Add.vue'), name: '新增用户' },
+      ]
+    },
   ]
 })

src/style/home.scss

@@ -71,6 +71,7 @@ $height: 50px;
 		background: #fff;
 		padding: 32px;
 		margin-top: 12px;
+		min-height: calc(100vh - 130px);
 		box-shadow:0px 4px 12px 0px rgba(0,0,0,0.12);
 	}
 	.title_top{
@@ -87,34 +88,7 @@ $height: 50px;
 			color: #FFF;
 		}
 	}
-	.filter{
-        background: #fff;
-        padding: 20px 25px 0; 
-        border:1px solid #EDEDED;
-        border-radius:2px;
-        margin-bottom: 23px;
-        form{
-            .el-input{
-                max-width: 260px;
-			}
-			.el-range-editor--small.el-input__inner{
-				height: 36px;
-			}
-            label{
-                color: #6A737B;
-            }
-            input{
-                // width: 260px;
-                height: 34px !important;
-                line-height: 34px !important;
-            }
-            .el-select{
-                width: 120px;
-                margin-right: 10px;
-            }
-           
-        }
-    }
+
     .table_div{
         background: #fff;
         border: 1px solid #EDEDED;

src/views/apply/New.vue

@@ -0,0 +1,231 @@
+<style lang="scss">
+    .apply{
+       .filter{
+            background: #fff;
+            padding: 20px 20px 10px; 
+            border:1px solid #EDEDED;
+            border-radius:2px;
+            margin-bottom: 10px;
+            margin-top: 10px;
+            .el-form-item{
+                margin-bottom: 10px;
+            }
+            .el-input,.el-select{
+                width: 150px;
+            }
+    
+       }
+       .el-divider--horizontal{
+           margin: 10px 0 20px;
+       }
+       .divider{
+        //    margin-bottom: 15px;
+           background: #fff;
+           padding: 10px;
+       }
+       thead{
+           th{
+               background: #eee;
+           }
+       }
+    }
+</style>
+<template>
+    <section class="apply">
+        <p>报名信息  >  新办</p>
+        <div class="filter">
+            <el-form label-width="80px" :inline="true">
+                <el-form-item label="培训科目">
+                    <el-radio-group v-model="form.name"  size="small">
+                        <el-radio-button label="0">特种作业人员</el-radio-button>
+                        <el-radio-button label="1">负责人、安全生产管理人员</el-radio-button>
+                        <el-radio-button label="2">其他安全生产培训</el-radio-button>
+                    </el-radio-group>
+                </el-form-item><br>
+                <el-form-item label="作业类别">
+                    <el-radio-group v-model="form.name"  size="small">
+                        <el-radio-button label="1">电工作业</el-radio-button>
+                        <el-radio-button label="2">焊接与热切割</el-radio-button>
+                    </el-radio-group>
+                </el-form-item><br>
+                <el-form-item label="准操项目">
+                    <el-radio-group v-model="form.name"  size="small">
+                        <el-radio-button label="1">高压电工</el-radio-button>
+                        <el-radio-button label="2">低压电工</el-radio-button>
+                    </el-radio-group>
+                </el-form-item>
+                <el-divider></el-divider>
+                <el-form-item label="姓名">
+                        <el-input placeholder="姓名" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="联系电话">
+                        <el-input placeholder="联系电话" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="报名时间">
+                    <el-date-picker
+                    v-model="form.name"
+                    type="date"
+                    placeholder="选择日期">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="发票类型">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="领证方式">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="邮寄"  :value="0"></el-option>
+                        <el-option  label="自取"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="考试设置">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="考试时间">
+                    <el-date-picker
+                    v-model="form.name"
+                    type="date"
+                    placeholder="选择日期">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="培训班级">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="培训时间">
+                    <el-date-picker
+                    v-model="form.name"
+                    type="date"
+                    placeholder="选择日期">
+                    </el-date-picker>
+                </el-form-item>
+                <el-form-item label="公司名称">
+                        <el-input placeholder="公司名称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item>
+                       <el-button type="primary" icon="el-icon-search">搜索</el-button>
+                </el-form-item>
+                <el-divider></el-divider>
+            </el-form>
+            <el-tabs v-model="activeName" @tab-click="">
+                <el-tab-pane name="1" label="全部"></el-tab-pane>
+                <el-tab-pane name="2" label="已支付待培训"></el-tab-pane>
+                <el-tab-pane name="3" label="审核中"></el-tab-pane>
+                <el-tab-pane name="4" label="审核未通过"></el-tab-pane>
+                <el-tab-pane name="5" label="待付款"></el-tab-pane>
+                <el-tab-pane name="6" label="待上传资料"></el-tab-pane>
+                <el-tab-pane name="7" label="已培训待考试"></el-tab-pane>
+                <el-tab-pane name="8" label="考试完成"></el-tab-pane>
+                <el-tab-pane name="9" label="已取消"></el-tab-pane>
+            </el-tabs>
+        </div>
+        <div class="divider">
+                <el-button size="small" type="success" >审核通过</el-button><el-button size="small" type="info" >审核不通过</el-button>
+                <el-button size="small" type="primary" >已付款</el-button><el-button size="small" type="danger" >已培训</el-button>
+                <el-button size="small" type="success" >考试完成</el-button><el-button size="small" type="primary" >设置培训时间</el-button>
+                <el-button size="small" type="primary" >设置考试时间</el-button>
+                <el-divider  direction="vertical"></el-divider>
+                <el-button size="small" type="warning" >导出考勤表与申报考试表</el-button>
+                <el-button size="small" type="warning" >导出学员申报资料</el-button>
+        </div>
+
+        <el-table
+                class="table"
+                :data="list"
+                border 
+                style="width: 100%">
+                <el-table-column
+                type="selection" fixed="left"
+                width="55">
+                </el-table-column>
+                <el-table-column
+                prop="name"
+                label="姓名">
+                </el-table-column>
+                <el-table-column
+                prop="province"
+                label="联系电话">
+                </el-table-column>
+                <el-table-column
+                prop="city"
+                label="状态">
+                </el-table-column>
+                <el-table-column
+                prop="address"
+                label="管理员备注">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="报名类型">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="作业类别">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="准操项目">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="培训类型">
+                </el-table-column>
+        </el-table>
+        <Page  ref="pageButton"  :total='total' @pageChange='gopage'/>
+    </section>
+</template>
+<script>
+import Page from '../../components/Page';
+// import { Base64 } from 'js-base64';
+export default {
+  name: 'login',
+  components:{
+        Page
+    },
+  data(){
+    return{
+      form:{name:1,a:''},
+      activeName:"1",
+      total:1,
+      list:[
+          {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },{
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>

src/views/classes/Add.vue

@@ -0,0 +1,68 @@
+<style lang="scss">
+    .add{
+        .el-input,button{
+            width: 300px;
+        }
+    }
+</style>
+<template>
+    <section class="add">
+        <p>培训计划  >  班级管理  >  新增班级</p>
+        <div class="content">
+            <el-form label-width="80px">
+                <el-form-item label="培训项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="作业类别">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="准操项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="班级名称">
+                        <el-input placeholder="班级名称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="计划人数">
+                        <el-input placeholder="计划人数" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="备注">
+                        <el-input placeholder="备注" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label=" ">
+                        <el-button type="primary">保存</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+    </section>
+</template>
+<script>
+
+export default {
+
+  data(){
+    return{
+      form:{name:1,a:''}
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>
+
+
+
+
+

src/views/classes/Index.vue

@@ -0,0 +1,151 @@
+<style lang="scss">
+    .apply{
+       .filter{
+            background: #fff;
+            padding: 20px 20px 10px; 
+            border:1px solid #EDEDED;
+            border-radius:2px;
+            margin-bottom: 10px;
+            margin-top: 10px;
+            .el-form-item{
+                margin-bottom: 10px;
+            }
+            .el-input,.el-select{
+                width: 150px;
+            }
+    
+       }
+       thead{
+           th{
+               background: #eee;
+           }
+       }
+    }
+</style>
+<template>
+    <section class="apply">
+        <p>培训计划  >  班级管理</p>
+        <div class="filter">
+            <el-form label-width="80px" :inline="true" size="small">
+                <el-form-item label="班级名称">
+                        <el-input placeholder="班级名称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="培训项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="作业类别">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="邮寄"  :value="0"></el-option>
+                        <el-option  label="自取"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="准操项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+             
+                <el-form-item>
+                       <el-button type="primary" icon="el-icon-search">搜索</el-button>
+                       <el-button type="primary">新增</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+
+
+        <el-table
+                class="table"
+                :data="list"
+                border 
+                style="width: 100%">
+                <el-table-column
+                type="selection" fixed="left"
+                width="55">
+                </el-table-column>
+                <el-table-column
+                prop="name"
+                label="班级名称">
+                </el-table-column>
+                <el-table-column
+                prop="province"
+                label="培训项目">
+                </el-table-column>
+                <el-table-column
+                prop="city"
+                label="计划人数">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="已报名人数">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="备注">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="创建时间">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="操作">
+                <template>
+                    <el-button size="mini" type="warning">编辑</el-button>
+                    <el-button size="mini"  type="danger">删除</el-button>
+                </template>
+                </el-table-column>
+        </el-table>
+        <Page  ref="pageButton"  :total='total' @pageChange='gopage'/>
+    </section>
+</template>
+<script>
+import Page from '../../components/Page';
+// import { Base64 } from 'js-base64';
+export default {
+  components:{
+        Page
+    },
+  data(){
+    return{
+      form:{name:1,a:''},
+      activeName:"1",
+      total:1,
+      list:[
+          {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },{
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>

src/views/paper/Index.vue

@@ -0,0 +1,152 @@
+<style lang="scss">
+    .apply{
+       .filter{
+            background: #fff;
+            padding: 20px 20px 10px; 
+            border:1px solid #EDEDED;
+            border-radius:2px;
+            margin-bottom: 10px;
+            margin-top: 10px;
+            .el-form-item{
+                margin-bottom: 10px;
+            }
+            .el-input,.el-select{
+                width: 150px;
+            }
+    
+       }
+       thead{
+           th{
+               background: #eee;
+           }
+       }
+    }
+</style>
+<template>
+    <section class="apply">
+        <p>在线培训  >  试卷管理</p>
+        <div class="filter">
+            <el-form label-width="80px" :inline="true" size="small">
+                <el-form-item label="试卷名称">
+                        <el-input placeholder="试卷名称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="培训项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="作业类别">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="邮寄"  :value="0"></el-option>
+                        <el-option  label="自取"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="准操项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+             
+                <el-form-item>
+                       <el-button type="primary" icon="el-icon-search">搜索</el-button>
+                       <el-button type="primary">新增</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+
+
+        <el-table
+                class="table"
+                :data="list"
+                border 
+                style="width: 100%">
+                <el-table-column
+                type="selection" fixed="left"
+                width="55">
+                </el-table-column>
+                <el-table-column
+                prop="name"
+                label="试卷名称">
+                </el-table-column>
+                <el-table-column
+                prop="province"
+                label="培训项目">
+                </el-table-column>
+                <el-table-column
+                prop="city"
+                label="试题">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="考试时间">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="满分">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="创建时间">
+                </el-table-column>
+                <el-table-column
+                prop="zip" width="250"
+                label="操作">
+                <template>
+                    <el-button size="mini" type="success">查看</el-button>
+                    <el-button size="mini" type="warning">编辑</el-button>
+                    <el-button size="mini"  type="danger">删除</el-button>
+                </template>
+                </el-table-column>
+        </el-table>
+        <Page  ref="pageButton"  :total='total' @pageChange='gopage'/>
+    </section>
+</template>
+<script>
+import Page from '../../components/Page';
+// import { Base64 } from 'js-base64';
+export default {
+  components:{
+        Page
+    },
+  data(){
+    return{
+      form:{name:1,a:''},
+      activeName:"1",
+      total:1,
+      list:[
+          {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },{
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>

src/views/project/Index.vue

@@ -1,38 +1,102 @@
 <style lang="scss">
-
+    .subject{
+        .content{
+            display: flex;
+            justify-content: space-between;
+            .div_left{
+                width: 32%;
+                box-shadow:0px 2px 4px 0px rgba(0,0,0,0.24);
+                border-radius:8px;
+                padding: 20px 10px 20px 0;
+                .custom-tree-node{
+                    width: 100%;
+                    .edit{
+                        float: right;
+                        i{
+                            font-weight: bolder;
+                            font-size: 14px;
+                        }
+                    }
+                }
+            }
+            .div_right{
+                width: 65%;
+                box-shadow:0px 2px 4px 0px rgba(0,0,0,0.24);
+                border-radius:8px;
+                padding: 20px 30px;
+                .form{
+                    label{
+                        font-weight: 600;
+                        font-size: 16px;
+                    }
+                    .el-input-number,.el-input,.el-textarea{
+                        width: 200px;
+                    }
+                    button{
+                        width: 290px;
+                    }
+                }
+            }
+        }
+    }
 </style>
 <template>
-    <section>
+    <section class="subject">
         <p>项目管理 >  培训科目</p>
         <div class="content">
             <div class="div_left">
                  <el-tree
-      :data="data"
-      show-checkbox
-      node-key="id"
-      default-expand-all
-      :expand-on-click-node="false">
-      <span class="custom-tree-node" slot-scope="{ node, data }">
-        <span>{{ node.label }}</span>
-        <span>
-          <el-button
-            type="text"
-            size="mini"
-            @click="() => append(data)">
-            Append
-          </el-button>
-          <el-button
-            type="text"
-            size="mini"
-            @click="() => remove(node, data)">
-            Delete
-          </el-button>
-        </span>
-      </span>
-    </el-tree>
+                    :data="data"
+                    node-key="id"
+                    default-expand-all
+                    :expand-on-click-node="false">
+                    <span class="custom-tree-node" slot-scope="{ node, data }">
+                        <span>{{ node.label }}</span>
+                        <span class="edit">
+                        <el-button
+                            type="text"
+                            size="mini"
+                            @click="() => append(data)">
+                            <i class="el-icon-plus"></i>
+                        </el-button>
+                        <el-button
+                            type="text"
+                            size="mini"
+                            @click="() => append(data)">
+                            <i class="el-icon-edit"></i>
+                        </el-button>
+                        <el-button
+                            type="text"
+                            size="mini"
+                            @click="() => remove(node, data)">
+                            <i class="el-icon-delete"></i>
+                        </el-button>
+                        </span>
+                    </span>
+                </el-tree>
             </div>
             <div class="div_right">
-
+                <el-form class="form" label-width="90px" label-position='left'>
+                    <el-form-item label="科目名称">
+                        <el-input v-model="form.name"></el-input>
+                    </el-form-item>
+                    <el-form-item label="新办价格">
+                          <el-input-number v-model="form.name" controls-position="right"  :min="0" :max="10"></el-input-number>
+                    </el-form-item>
+                    <el-form-item label="复审价格">
+                          <el-input-number v-model="form.name" controls-position="right"  ></el-input-number>
+                    </el-form-item>
+                    <el-form-item label="换证价格">
+                          <el-input-number v-model="form.name" controls-position="right"  ></el-input-number>
+                    </el-form-item>
+                    <el-form-item label="排序">
+                          <el-input-number v-model="form.name" controls-position="right"  ></el-input-number>
+                    </el-form-item>
+                    <el-form-item label="说明">
+                        <el-input :rows="4" type="textarea" v-model="form.name"></el-input>
+                    </el-form-item>
+                    <el-button type="primary">保存</el-button>
+                </el-form>
             </div>
         </div>
     </section>
@@ -59,7 +123,8 @@ export default {
                 }]
                 }]
         }
-      ]
+      ],
+      form:{name:""}
     }
   },
   methods:{

src/views/user/Add.vue

@@ -0,0 +1,60 @@
+<style lang="scss">
+    .add{
+        .el-input,button{
+            width: 300px;
+        }
+    }
+</style>
+<template>
+    <section class="add">
+        <p>系统管理  >  新增用户 </p>
+        <div class="content">
+            <el-form label-width="80px">
+                <el-form-item label="用户名">
+                        <el-input placeholder="用户名" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="密码">
+                        <el-input type="password" placeholder="密码" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="确认密码">
+                        <el-input type="password"  placeholder="确认密码" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="姓名">
+                        <el-input placeholder="用户名" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="设置权限">
+                        <el-checkbox-group v-model="test" size="small">
+                        <el-checkbox label="备选项1" border></el-checkbox>
+                        <el-checkbox label="备选项2" border></el-checkbox>
+                        </el-checkbox-group>
+                </el-form-item>
+                <el-form-item label=" ">
+                        <el-button type="primary">保存</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+    </section>
+</template>
+<script>
+
+export default {
+
+  data(){
+    return{
+        test:'',
+        form:{name:1,a:''}
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>
+
+
+
+
+

src/views/user/Index.vue

@@ -0,0 +1,125 @@
+<style lang="scss">
+    .apply{
+       .filter{
+            background: #fff;
+            padding: 20px 20px 10px; 
+            border:1px solid #EDEDED;
+            border-radius:2px;
+            margin-bottom: 10px;
+            margin-top: 10px;
+            .el-form-item{
+                margin-bottom: 10px;
+            }
+            .el-input,.el-select{
+                width: 150px;
+            }
+    
+       }
+       thead{
+           th{
+               background: #eee;
+           }
+       }
+    }
+</style>
+<template>
+    <section class="apply">
+        <p>用户管理  >  用户列表</p>
+        <div class="filter">
+            <el-form label-width="80px" :inline="true" size="small">
+                <el-form-item label="昵称">
+                        <el-input placeholder="昵称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="姓名">
+                        <el-input placeholder="姓名" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="手机号">
+                        <el-input placeholder="手机号" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="身份证">
+                        <el-input placeholder="身份证" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item>
+                       <el-button type="primary" icon="el-icon-search">搜索</el-button>
+                       <el-button type="primary">新增</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+
+
+        <el-table
+                class="table"
+                :data="list"
+                border 
+                style="width: 100%">
+                <el-table-column
+                type="selection"  
+                width="55">
+                </el-table-column>
+                <el-table-column
+                prop="name"
+                label="昵称">
+                </el-table-column>
+                <el-table-column
+                prop="province"
+                label="头像">
+                </el-table-column>
+                <el-table-column
+                prop="city"
+                label="实名认证">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="注册时间">
+                </el-table-column>
+        </el-table>
+        <Page  ref="pageButton"  :total='total' @pageChange='gopage'/>
+    </section>
+</template>
+<script>
+import Page from '../../components/Page';
+// import { Base64 } from 'js-base64';
+export default {
+  components:{
+        Page
+    },
+  data(){
+    return{
+      form:{name:1,a:''},
+      activeName:"1",
+      total:1,
+      list:[
+          {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },{
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>

src/views/video/Add.vue

@@ -0,0 +1,68 @@
+<style lang="scss">
+    .add{
+        .el-input,button{
+            width: 300px;
+        }
+    }
+</style>
+<template>
+    <section class="add">
+        <p>在线培训  >  视频管理  >  新增视频</p>
+        <div class="content">
+            <el-form label-width="80px">
+                <el-form-item label="培训项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="作业类别">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="准操项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="视频名称">
+                        <el-input placeholder="视频名称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="封面图">
+                    <input type="file">
+                </el-form-item>
+                <el-form-item label="视频文件">
+                    <input type="file">
+                </el-form-item>
+                <el-form-item label=" ">
+                        <el-button type="primary">保存</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+    </section>
+</template>
+<script>
+
+export default {
+
+  data(){
+    return{
+      form:{name:1,a:''}
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>
+
+
+
+
+

src/views/video/Index.vue

@@ -0,0 +1,151 @@
+<style lang="scss">
+    .apply{
+       .filter{
+            background: #fff;
+            padding: 20px 20px 10px; 
+            border:1px solid #EDEDED;
+            border-radius:2px;
+            margin-bottom: 10px;
+            margin-top: 10px;
+            .el-form-item{
+                margin-bottom: 10px;
+            }
+            .el-input,.el-select{
+                width: 150px;
+            }
+    
+       }
+       thead{
+           th{
+               background: #eee;
+           }
+       }
+    }
+</style>
+<template>
+    <section class="apply">
+        <p>在线培训  >  视频管理</p>
+        <div class="filter">
+            <el-form label-width="80px" :inline="true" size="small">
+                <el-form-item label="视频名称">
+                        <el-input placeholder="视频名称" v-model="form.name"></el-input>
+                </el-form-item>
+                <el-form-item label="培训项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="作业类别">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="邮寄"  :value="0"></el-option>
+                        <el-option  label="自取"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="准操项目">
+                    <el-select v-model="form.a" placeholder="请选择">
+                        <el-option  label="不需要发票"  :value="0"></el-option>
+                        <el-option  label="纸质发票"  :value="0"></el-option>
+                    </el-select>
+                </el-form-item>
+             
+                <el-form-item>
+                       <el-button type="primary" icon="el-icon-search">搜索</el-button>
+                       <el-button type="primary">新增视频</el-button>
+                </el-form-item>
+            </el-form>
+        </div>
+
+
+        <el-table
+                class="table"
+                :data="list"
+                border 
+                style="width: 100%">
+                <el-table-column
+                type="selection" fixed="left"
+                width="55">
+                </el-table-column>
+                <el-table-column
+                prop="name"
+                label="视频名称">
+                </el-table-column>
+                <el-table-column
+                prop="province"
+                label="培训项目">
+                </el-table-column>
+                <el-table-column
+                prop="city"
+                label="试题">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="考试时间">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="满分">
+                </el-table-column>
+                <el-table-column
+                prop="zip"
+                label="创建时间">
+                </el-table-column>
+                <el-table-column
+                prop="zip" width="250"
+                label="操作">
+                <template>
+                    <el-button size="mini" type="warning">编辑</el-button>
+                    <el-button size="mini"  type="danger">删除</el-button>
+                </template>
+                </el-table-column>
+        </el-table>
+        <Page  ref="pageButton"  :total='total' @pageChange='gopage'/>
+    </section>
+</template>
+<script>
+import Page from '../../components/Page';
+// import { Base64 } from 'js-base64';
+export default {
+  components:{
+        Page
+    },
+  data(){
+    return{
+      form:{name:1,a:''},
+      activeName:"1",
+      total:1,
+      list:[
+          {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },
+        {
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        },{
+          date: '2016-05-02',
+          name: '王小虎',
+          province: '上海',
+          city: '普陀区',
+          address: '上海市普陀区金沙江路 1518 弄',
+          zip: 200333
+        }
+      ]
+    }
+  },
+  methods:{
+      gopage(){}
+  },
+  created(){
+  
+  }
+}
+</script>