考勤记录检查完成，剩余2个问题

src/components/punch/punchList.vue

+<template>
+  <section>
+    <table class="table table-stripede table-bordered">
+      <thead>
+        <tr><th>名称</th><th>内容</th></tr>
+      </thead>
+      <tbody>
+        <tr><td>日期</td><td>{{ model.date_display }}</td></tr>
+        <tr><td>考勤人</td><td>{{ model.user &&　model.user.name }}</td></tr>
+        <tr><td>签到时间</td><td>{{ model.in_status_display }}</td></tr>
+        <tr><td>签到说明</td><td>{{ model.in_description ? model.in_description : '(未设置)' }}</td></tr>
+        <tr><td>签退时间</td><td>{{ model.out_status_display }}</td></tr>
+        <tr><td>签退说明</td><td>{{ model.out_description ? model.out_description : '(未设置)' }}</td></tr>
+        <tr><td>图片</td><td>(未设置)</td></tr>
+      </tbody>
+    </table>
+  </section>
+</template>
+<script>
+export default {
+  name: 'punchList',
+
+  props: ['model']
+}
+</script>
+<style scoped>
+table thead {
+  background: white;
+}
+table tr:nth-child(odd){
+  background: #6c757d;
+  background-color: rgba(0,0,0,.05);
+}
+</style>

src/components/punch/punchView.vue

+<template>
+  <section>
+    <el-row :gutter="10" class="header-title">
+      <el-col :span="6">
+        <h2>查看考勤</h2>
+      </el-col>
+    </el-row>
+    <div class="page-body-content">
+      <list :model="model"></list>
+    </div>
+  </section>
+</template>
+<script>
+import list from './punchList'
+import {
+  requestAPI,
+  api
+} from '@/lib/commonMixin'
+export default {
+
+  data () {
+    return {
+      model: {}
+    }
+  },
+
+  components: {
+    list
+  },
+
+  created () {
+    let id = this.$route.query.id || this.$route.params.id
+    this.getList(id)
+  },
+
+  methods: {
+    getList (id) {
+      requestAPI(api.getpunchEdit, {id}).then((res) => {
+        this.model = res.model
+      })
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+</style>

src/components/punch_list/punchItem.vue

@@ -4,7 +4,13 @@
       <el-col :span="4" :xs="24" class="obear-schedule-left" :style="{background: item.bgcolor}">
         <el-row :gutter="10">
           <el-col :span="24">
-            <i class="fa fa-fw fa-calendar-check-o" aria-hidden="true"></i>{{ item.edate }} {{ item.week }}
+            <i class="fa fa-fw fa-calendar-check-o" aria-hidden="true"></i>
+            <router-link :to="{ path: '/view/' + item.id }" v-if="id_isNumber">
+              {{ item.edate }}
+            </router-link>
+            <router-link :to="{ path: '/view?id=' + item.id }" v-if="!id_isNumber">
+              {{ item.edate }}
+            </router-link> {{ item.week }}
           </el-col>
           <el-col :span="24" style="padding-left: 3px;">
             <span>
@@ -85,6 +91,10 @@ export default {
 
     in_out_status () {
       return !!this.item.in_at && !!this.item.out_at
+    },
+
+    id_isNumber () {
+      return !isNaN(this.item.id)
     }
   },
 

src/routes/punch.js

 import PunchHome from '../components/punch_list/punchHome'
+import PunchView from '../components/punch/PunchView'
 const routes = [{
   path: '/punch',
   name: 'punchHome',
   component: PunchHome
+}, {
+  path: '/view',
+  name: 'punchView1',
+  component: PunchView
+}, {
+  path: '/view/:id',
+  name: 'punchView2',
+  component: PunchView
 }]
 export default routes