diff --git a/src/views/gatemachine/primarygatemanager/gaterecord/components/carRecordList.vue b/src/views/gatemachine/primarygatemanager/gaterecord/components/carRecordList.vue
new file mode 100644
index 0000000..b760853
--- /dev/null
+++ b/src/views/gatemachine/primarygatemanager/gaterecord/components/carRecordList.vue
@@ -0,0 +1,159 @@
+<template>
+  <div class="app-container">
+    <div class="rightCont">
+      <div>
+        <span @click="people" style="margin: 10px;">车行口门记录</span>
+        <el-table
+          v-loading="listLoading"
+          ref="multipleTable"
+          :data="varList"
+          :row-key="getRowKey"
+          border
+          tooltip-effect="dark"
+          :cell-style="getPlateColor"
+          style="width: 100%">
+          <el-table-column type="index" label="序号" width="55" align="center"/>
+          <el-table-column prop="vehicle_plate_number" label="车牌号" width="100px" align="center"/>
+          <el-table-column prop="vehicle_category_name" label="车辆类型" width="150px" align="center"/>
+          <el-table-column prop="vehicle_contact_name" label="车辆联系人" width="150ox" align="center"/>
+          <el-table-column prop="vehicle_contact_phone_number" label="联系人手机号" width="120px" align="center"/>
+          <el-table-column prop="vehicle_arrival_barrier" label="入港闸口"  align="center"/>
+          <el-table-column prop="vehicle_arrival_time" label="入港时间" align="center"/>
+          <el-table-column prop="vehicle_departure_barrier" label="离港闸口"  align="center"/>
+          <el-table-column prop="vehicle_departure_time" label="离港时间"  align="center"/>
+          <el-table-column prop="vehicle_arrival_status" label="车辆在港状态" width="100px" align="center"/>
+          <el-table-column prop="vehicle_filing_info_recording_org" label="车辆备案单位"  align="center"/>
+          <el-table-column prop="vehicle_filing_method" label="车辆备案方式" width="100px" align="center"/>
+        </el-table>
+        <div class="page-btn-group">
+          <pagination
+            :total="total"
+            :page.sync="listQuery.page"
+            :limit.sync="listQuery.limit"
+            @pagination="getList"/>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from '@/components/Pagination'
+import { requestFN } from '@/utils/request'
+import waves from '@/directive/waves' // waves directive
+
+export default {
+  components: { Pagination },
+  directives: { waves },
+  data() {
+    return {
+      listQuery: {
+        page: 1,
+        limit: 20
+      },
+      total: 0,
+      KEYWORDS: '',
+      varList: [],
+      pd: [],
+    }
+  },
+  mounted() {
+    this.getList()
+    this.getDict()
+  },
+  methods: {
+    getPlateColor(row , column , rowIndex , columnIndex){
+      if(row.column.label == '车牌号'){
+        switch(row.row.vehicle_plate_color){
+          case '蓝牌':
+            return 'background-color: blue;color: white'
+            break
+          case '黄牌':
+            return 'background-color: yellow;color: black'
+            break
+          case '新能源':
+            return 'background-color: green;color: white'
+            break
+          case '白牌':
+            return 'background-color: gray;color: black'
+            break
+          case '黑牌':
+            return 'background-color: black;color: white'
+            break
+          case '其他':
+            return 'background-color: white;color: black'
+            break
+          default:
+            return 'background-color: white;color: black'
+        }
+      }
+    },
+    getRowKey(row) {
+      return row.id_sequence
+    },
+    
+    getQuery() {
+      this.getList()
+    },
+    // 获取列表
+    getList() {
+      this.listLoading = true
+      this.varList = []
+      requestFN(
+        '/mkmjGateLog/page?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page,
+        {
+
+        }
+      ).then((data) => {
+        this.listLoading = false
+        this.varList = data.varList
+        this.total = data.page.totalResult
+        this.hasButton()
+      }).catch((e) => {
+        this.listLoading = false
+      })
+    },
+    people(){
+      this.$parent.activeName = 'peopleRecordList'
+    },
+
+    getDict() {
+      requestFN(
+        '/corpinfo/getSelectByCorpInfo',
+        {
+        }
+      ).then((data) => {
+        this.corpList = JSON.parse(data.corpInfoJson)
+      }).catch((e) => {
+      })
+      requestFN(
+        'dictionaries/getLevels',
+        {
+          DICTIONARIES_ID: '6bba977985f6427e9d0b52afe8884d1a'
+        }
+      ).then((data) => {
+        this.typeData = data.list
+      })
+        .catch((e) => {
+          this.listLoading = false
+        })
+    },
+  }
+}
+</script>
+
+<style scoped>
+.returnBtn {
+  float: right;
+}
+
+.app-container {
+  display: flex; /**/
+  align-items: baseline;
+}
+
+.rightCont {
+  width: 100%
+}
+
+</style>
diff --git a/src/views/gatemachine/primarygatemanager/gaterecord/components/peopleRecordList.vue b/src/views/gatemachine/primarygatemanager/gaterecord/components/peopleRecordList.vue
new file mode 100644
index 0000000..3fad936
--- /dev/null
+++ b/src/views/gatemachine/primarygatemanager/gaterecord/components/peopleRecordList.vue
@@ -0,0 +1,132 @@
+<template>
+  <div class="app-container">
+    <div class="rightCont">
+      <div>
+        <span @click="car" style="margin: 10px;" >人行口门记录</span>
+        <el-table
+          v-loading="listLoading"
+          ref="multipleTable"
+          :data="varList"
+          :row-key="getRowKey"
+          border
+          tooltip-effect="dark"
+          style="width: 100%">
+          <el-table-column type="index" label="序号" width="55" align="center"/>
+          <el-table-column prop="departmentName" label="公司" align="center"/>
+          <el-table-column prop="personName" label="人员" width="100px" align="center"/>
+          <el-table-column prop="sex" label="性别" width="50px"  align="center"/>
+          <el-table-column prop="inOrOut" label="类型" width="50px" align="center"/>
+          <el-table-column prop="regionName" label="区域名称" width="80px" align="center"/>
+          <el-table-column prop="channelName" label="通道名称" align="center"/>
+          <el-table-column prop="personType" label="身份类别" width="150px" align="center"/>
+          <el-table-column prop="cardNumber" label="卡号" width="100px" align="center"/>
+          <el-table-column prop="personCode" label="用户编号" width="100px" align="center"/>
+          <el-table-column prop="openType" label="验证方式" width="150px" align="center"/>
+          <el-table-column prop="reportTime" label="上报时间"  align="center"/>
+        </el-table>
+        <div class="page-btn-group">
+          <pagination
+            :total="total"
+            :page.sync="listQuery.page"
+            :limit.sync="listQuery.limit"
+            @pagination="getList"/>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Pagination from '@/components/Pagination'
+import { requestFN } from '@/utils/request'
+import waves from '@/directive/waves' // waves directive
+
+export default {
+  components: { Pagination },
+  directives: { waves },
+  data() {
+    return {
+      listQuery: {
+        page: 1,
+        limit: 20
+      },
+      total: 0,
+      KEYWORDS: '',
+      varList: [],
+      pd: [],
+    }
+  },
+  mounted() {
+    this.getList()
+    this.getDict()
+  },
+  methods: {
+    getRowKey(row) {
+      return row.id_sequence
+    },
+    
+    getQuery() {
+      this.getList()
+    },
+    // 获取列表
+    getList() {
+      this.listLoading = true
+      this.varList = []
+      requestFN(
+        '/mkmjGateLog/peoplePage?showCount=' + this.listQuery.limit + '&currentPage=' + this.listQuery.page,
+        {
+
+        }
+      ).then((data) => {
+        this.listLoading = false
+        this.varList = data.page.pd.data
+        this.total = data.page.totalResult
+        this.hasButton()
+      }).catch((e) => {
+        this.listLoading = false
+      })
+    },
+    car(){
+      this.$parent.activeName = 'carRecordList'
+    },
+
+    getDict() {
+      requestFN(
+        '/corpinfo/getSelectByCorpInfo',
+        {
+        }
+      ).then((data) => {
+        this.corpList = JSON.parse(data.corpInfoJson)
+      }).catch((e) => {
+      })
+      requestFN(
+        'dictionaries/getLevels',
+        {
+          DICTIONARIES_ID: '6bba977985f6427e9d0b52afe8884d1a'
+        }
+      ).then((data) => {
+        this.typeData = data.list
+      })
+        .catch((e) => {
+          this.listLoading = false
+        })
+    },
+  }
+}
+</script>
+
+<style scoped>
+.returnBtn {
+  float: right;
+}
+
+.app-container {
+  display: flex; /**/
+  align-items: baseline;
+}
+
+.rightCont {
+  width: 100%
+}
+
+</style>
diff --git a/src/views/gatemachine/primarygatemanager/gaterecord/index.vue b/src/views/gatemachine/primarygatemanager/gaterecord/index.vue
index fd4ed05..14cb3a1 100644
--- a/src/views/gatemachine/primarygatemanager/gaterecord/index.vue
+++ b/src/views/gatemachine/primarygatemanager/gaterecord/index.vue
@@ -1,18 +1,21 @@
 <template>
-  <div>
-    <component :is="activeName" />
+    <div>
+    <carRecordList v-show="activeName=='carRecordList'" ref="carRecordList" />
+    <peopleRecordList v-if="activeName=='peopleRecordList'" ref="peopleRecordList" />
   </div>
 </template>
 
 <script>
-import List from './components/list.vue'
+import carRecordList from './components/carRecordList.vue'
+import peopleRecordList from './components/peopleRecordList.vue'
 export default {
   components: {
-    List: List,
+    carRecordList: carRecordList,
+    peopleRecordList:peopleRecordList
   },
   data() {
     return {
-      activeName: 'List',
+      activeName: 'carRecordList',
     }
   }
 }