待办任务

src/dashoo.cn/frontend_web/src/pages/index.vue

@@ -1,106 +1,53 @@
 <template>
-  <div style="width: 100%; overflow-y: auto">
-    <div style="width: 1100px; margin-left: 40px; padding: 10px">
-      <el-row :gutter="40">
-        <el-col :span="8">
-          <el-card>
-            <img style="height: 130px" src="../assets/img/zhunrushenqing.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">准入申请</span>
-              <div class="bottom clearfix">
-                <el-button type="text" class="button"> | 物资类</el-button>
-                <el-button type="text" class="button"> | 技术服务类</el-button>
-                <el-button type="text" class="button">基建类</el-button>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-        <el-col :span="8">
-          <el-card>
-            <img style="height: 130px" src="../assets/img/zengxiangshenqing.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">增项申请</span>
-            </div>
-            <div class="bottom clearfix">
-              <el-button type="text" class="button"> | 物资类</el-button>
-              <el-button type="text" class="button"> | 技术服务类</el-button>
-              <el-button type="text" class="button">基建类</el-button>
-            </div>
-          </el-card>
-        </el-col>
-        <el-col :span="8">
-          <el-card>
-            <img style="height: 130px" src="../assets/img/nianshen.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">年审</span>
-            </div>
-            <div class="bottom clearfix">
-              <el-button type="text" class="button">年审列表</el-button>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row :gutter="40" style="margin-top: 20px">
-        <el-col :span="8">
-          <el-card>
-            <img style="height: 130px" src="../assets/img/zizhibiangeng.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">资质变更</span>
-              <div class="bottom clearfix">
-                <el-button type="text" class="button">资质变更</el-button>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-        <el-col :span="8">
-          <el-card>
-            <img style="height: 130px" src="../assets/img/xinxibiangeng.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">信息变更</span>
-              <div class="bottom clearfix">
-                <el-button type="text" class="button">信息变更</el-button>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-        <el-col :span="8">
-          <el-card>
-            <img style="height: 130px" src="../assets/img/zaixianjiaofei.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">在线缴费</span>
-              <div class="bottom clearfix">
-                <el-button type="text" class="button">缴费</el-button>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-      <el-row :gutter="40" style="margin-top: 20px">
-        <el-col :span="8">
-          <el-card style="margin-bottom: 20px">
-            <img style="height: 130px" src="../assets/img/zaixianchaxun.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">业务查询</span>
-              <div class="bottom clearfix">
-                <span>报表及图表的查询功能</span>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-        <el-col :span="8">
-          <el-card style="margin-bottom: 20px">
-            <img style="height: 130px" src="../assets/img/zizhi.jpg" class="image">
-            <div style="padding: 14px;">
-              <span style="font-weight: bold">资质管理</span>
-              <div class="bottom clearfix">
-                <span>资质管理的统一管理功能</span>
-              </div>
-            </div>
-          </el-card>
-        </el-col>
-      </el-row>
-    </div>
+  <div style="overflow-y: auto">
+    <el-card class="box-card">
+      <div slot="header">
+        <span>
+          <i class="icon icon-table2"></i> 待办任务
+        </span>
+      </div>
+      <el-table
+        :data="tableData"
+        size="mini"
+        border
+        :stripe="true"
+        style="width: 100%">
 
+        <el-table-column
+          type="index"
+          label="序号">
+        </el-table-column>
+
+        <el-table-column
+          prop="name"
+          label="流程名称">
+        </el-table-column>
+
+        <el-table-column
+          prop="address"
+          label="任务名称">
+        </el-table-column>
+
+        <el-table-column
+          prop="date"
+          label="创建日期"
+          width="180">
+        </el-table-column>
+
+        <el-table-column
+          prop="address"
+          label="执行人">
+        </el-table-column>
+
+        <el-table-column label="操作" width="130" align="center" fixed="right">
+          <template slot-scope="scope">
+            <el-button type="text" title="办理"  icon="el-icon-edit" size="mini">办理</el-button>
+            <el-button type="text" title="编辑"  icon="el-icon-s-promotion" size="mini">跟踪</el-button>
+          </template>
+        </el-table-column>
+
+      </el-table>
+    </el-card>
   </div>
 </template>
 
@@ -112,58 +59,38 @@
   export default {
     name: 'index',
 
-    data() {
-      return {
-        currentDate: new Date()
-      }
-    },
-    created() {
-    },
     computed: mapGetters({
       authUser: 'authUser'
     }),
-    methods: {
-
-    }
-  }
-</script>
-
-<style lang="css">
-  .avatar-index {
-    width: 45px;
-    height: 45px;
-    margin-top: -15px;
-    margin-bottom: -15px;
-  }
-
-  .time {
-    font-size: 13px;
-    color: #999;
-  }
-
-  .bottom {
-    margin-top: 13px;
-    line-height: 12px;
-  }
 
-  .button {
-    padding: 0;
-    float: right;
-  }
+    created () {
+    },
 
-  .image {
-    width: 100%;
-    display: block;
-  }
+    data () {
+      return {
+        currentDate: new Date(),
+        tableData: [{
+          date: '2016-05-02',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1518 弄'
+        }, {
+          date: '2016-05-04',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1517 弄'
+        }, {
+          date: '2016-05-01',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1519 弄'
+        }, {
+          date: '2016-05-03',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路 1516 弄'
+        }],
+      }
+    },
 
-  .clearfix:before,
-  .clearfix:after {
-    display: table;
-    content: "";
-  }
+    methods: {
 
-  .clearfix:after {
-    clear: both
+    }
   }
-
-</style>
+</script>

src/dashoo.cn/frontend_web/src/pages/indexgf.vue

@@ -0,0 +1,169 @@
+<template>
+  <div style="width: 100%; overflow-y: auto">
+    <div style="width: 1100px; margin-left: 40px; padding: 10px">
+      <el-row :gutter="40">
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="../assets/img/zhunrushenqing.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">准入申请</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button"> | 物资类</el-button>
+                <el-button type="text" class="button"> | 技术服务类</el-button>
+                <el-button type="text" class="button">基建类</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="../assets/img/zengxiangshenqing.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">增项申请</span>
+            </div>
+            <div class="bottom clearfix">
+              <el-button type="text" class="button"> | 物资类</el-button>
+              <el-button type="text" class="button"> | 技术服务类</el-button>
+              <el-button type="text" class="button">基建类</el-button>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="../assets/img/nianshen.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">年审</span>
+            </div>
+            <div class="bottom clearfix">
+              <el-button type="text" class="button">年审列表</el-button>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+      <el-row :gutter="40" style="margin-top: 20px">
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="../assets/img/zizhibiangeng.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">资质变更</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button">资质变更</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="../assets/img/xinxibiangeng.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">信息变更</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button">信息变更</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card>
+            <img style="height: 130px" src="../assets/img/zaixianjiaofei.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">在线缴费</span>
+              <div class="bottom clearfix">
+                <el-button type="text" class="button">缴费</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+      <el-row :gutter="40" style="margin-top: 20px">
+        <el-col :span="8">
+          <el-card style="margin-bottom: 20px">
+            <img style="height: 130px" src="../assets/img/zaixianchaxun.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">业务查询</span>
+              <div class="bottom clearfix">
+                <span>报表及图表的查询功能</span>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+        <el-col :span="8">
+          <el-card style="margin-bottom: 20px">
+            <img style="height: 130px" src="../assets/img/zizhi.jpg" class="image">
+            <div style="padding: 14px;">
+              <span style="font-weight: bold">资质管理</span>
+              <div class="bottom clearfix">
+                <span>资质管理的统一管理功能</span>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </el-row>
+    </div>
+
+  </div>
+</template>
+
+<script>
+  import echarts from 'echarts'
+  import {
+    mapGetters
+  } from 'vuex'
+  export default {
+    name: 'index',
+
+    data() {
+      return {
+        currentDate: new Date()
+      }
+    },
+    created() {
+    },
+    computed: mapGetters({
+      authUser: 'authUser'
+    }),
+    methods: {
+
+    }
+  }
+</script>
+
+<style lang="css">
+  .avatar-index {
+    width: 45px;
+    height: 45px;
+    margin-top: -15px;
+    margin-bottom: -15px;
+  }
+
+  .time {
+    font-size: 13px;
+    color: #999;
+  }
+
+  .bottom {
+    margin-top: 13px;
+    line-height: 12px;
+  }
+
+  .button {
+    padding: 0;
+    float: right;
+  }
+
+  .image {
+    width: 100%;
+    display: block;
+  }
+
+  .clearfix:before,
+  .clearfix:after {
+    display: table;
+    content: "";
+  }
+
+  .clearfix:after {
+    clear: both
+  }
+
+</style>