diff --git a/src/api/hardware.js b/src/api/hardware.js
new file mode 100644
index 0000000..f72e249
--- /dev/null
+++ b/src/api/hardware.js
@@ -0,0 +1,11 @@
+import request from '@/utils/request'
+
+export function getHardware(params) {
+  return request({
+    url: '/api/admin/other/hardware-list',
+    method: 'get',
+    params:params
+  })
+}
+
+
diff --git a/src/views/hardware/hardware.vue b/src/views/hardware/hardware.vue
new file mode 100644
index 0000000..635569a
--- /dev/null
+++ b/src/views/hardware/hardware.vue
@@ -0,0 +1,102 @@
+<template>
+  <div>
+
+    <div ref="lxHeader">
+      <lx-header icon="md-apps" text="打卡记录" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
+        <slot>
+        </slot>
+      </lx-header>
+    </div>
+
+    <xy-table :list="list" :total="total" @pageSizeChange="e => select.page_size = e" @pageIndexChange="pageChange"
+      :table-item="table">
+      <template v-slot:btns>
+        <div></div>
+      </template>
+    </xy-table>
+  </div>
+</template>
+
+<script>
+  import {
+    getHardware
+  } from "@/api/hardware.js"
+
+  export default {
+    data() {
+      return {
+        select: {
+          page_size: 40,
+          page: 1,
+        },
+
+        total: 0,
+        list: [],
+        table: [{
+            label: '序号',
+            type: 'index',
+            fixed: 'left',
+            width: 80
+          },
+          {
+            label: "打卡时间",
+            prop: 'created_at',
+            align: 'center'
+          },
+          {
+            label: "姓名",
+            prop: 'name',
+            align: 'center'
+          },
+          {
+            label: "身份证",
+            prop: 'idcard',
+            align: 'center',
+            width:240
+          },
+          {
+            label: "打卡记录",
+            prop: 'sanp_pic',
+            align: 'center',
+            customFn:(row)=>{
+              if(row.sanp_pic){
+                return (<el-image style={{'height':'90px'}} src={row.sanp_pic}></el-image>)
+              }
+            }
+          }
+        ]
+      }
+    },
+    methods: {
+      async getHardwareList() {
+        const res = await getHardware({
+          page_size: this.select.page_size,
+          page: this.select.page,
+        })
+        this.list = res.data
+        this.total = res.total
+      },
+
+      pageChange(e) {
+        this.select.page = e
+        this.getHardwareList()
+      }
+    },
+    mounted() {
+      this.getHardwareList()
+    }
+
+  }
+</script>
+
+<style scoped>
+  .street{
+    margin-right:10px
+  }
+  /deep/ .street .el-input__inner{
+    height:32px;
+  }
+  /deep/ .street .el-select__caret{
+    line-height: 32px;
+  }
+</style>
diff --git a/src/views/viewrecords/index.vue b/src/views/viewrecords/index.vue
index 77aeba8..690da7c 100644
--- a/src/views/viewrecords/index.vue
+++ b/src/views/viewrecords/index.vue
@@ -68,7 +68,7 @@
     data() {
       return {
         select: {
-          pageSize: 10,
+          pageSize: 40,
           pageIndex: 1,
           keyword: ""
         },