diff --git a/src/api/caseMonitor.js b/src/api/caseMonitor.js
index 7532f64..82a71a3 100644
--- a/src/api/caseMonitor.js
+++ b/src/api/caseMonitor.js
@@ -56,3 +56,10 @@
   })
 }
 
+// 督办记录
+export function monitorRecords(caseId) {
+  return request({
+    url: '/supervise/detail/' + caseId,
+    method: 'get'
+  })
+}

diff --git a/src/api/caseMonitor.js b/src/api/caseMonitor.js
index 7532f64..82a71a3 100644
--- a/src/api/caseMonitor.js
+++ b/src/api/caseMonitor.js
@@ -56,3 +56,10 @@
   })
 }
 
+// 督办记录
+export function monitorRecords(caseId) {
+  return request({
+    url: '/supervise/detail/' + caseId,
+    method: 'get'
+  })
+}
diff --git a/src/api/caseSupervise.js b/src/api/caseSupervise.js
index 576ee46..a5aac3a 100644
--- a/src/api/caseSupervise.js
+++ b/src/api/caseSupervise.js
@@ -65,3 +65,11 @@
     params
   })
 }
+
+// 督办记录
+export function superviseRecords(caseId) {
+  return request({
+    url: '/urge/detail/' + caseId,
+    method: 'get'
+  })
+}

diff --git a/src/api/caseMonitor.js b/src/api/caseMonitor.js
index 7532f64..82a71a3 100644
--- a/src/api/caseMonitor.js
+++ b/src/api/caseMonitor.js
@@ -56,3 +56,10 @@
   })
 }
 
+// 督办记录
+export function monitorRecords(caseId) {
+  return request({
+    url: '/supervise/detail/' + caseId,
+    method: 'get'
+  })
+}
diff --git a/src/api/caseSupervise.js b/src/api/caseSupervise.js
index 576ee46..a5aac3a 100644
--- a/src/api/caseSupervise.js
+++ b/src/api/caseSupervise.js
@@ -65,3 +65,11 @@
     params
   })
 }
+
+// 督办记录
+export function superviseRecords(caseId) {
+  return request({
+    url: '/urge/detail/' + caseId,
+    method: 'get'
+  })
+}
diff --git a/src/views/caseManage/caseCommon/caseRecord.vue b/src/views/caseManage/caseCommon/caseRecord.vue
index dab8e30..8ed5b0a 100644
--- a/src/views/caseManage/caseCommon/caseRecord.vue
+++ b/src/views/caseManage/caseCommon/caseRecord.vue
@@ -18,7 +18,24 @@
         </el-table-column>
       </el-table>
     </div>
-    <!-- TODO 督办记录 -->
+    <!-- 督办记录 -->
+    <div class="record">
+      <el-row class="table-title">
+        <el-col :span="6"><div class="title-header"><i class="el-icon-tickets"/>事件督办记录</div></el-col>
+      </el-row>
+      <el-table v-loading="superviseLoading" :data="superviseList" border size="small" max-height="250">
+        <el-table-column
+          v-for="column in superviseColumns"
+          :key="column.value"
+          :label="column.text"
+          :width="column.width"
+          :align="column.align?column.align:'center'">
+          <template slot-scope="scope">
+            <span>{{ scope.row[column.value] }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
     <!-- 催办记录 -->
     <div class="record">
       <el-row class="table-title">
@@ -55,7 +72,24 @@
         </el-table-column>
       </el-table>
     </div>
-    <!-- TODO 监察记录 -->
+    <!-- 监察记录 -->
+    <div class="record">
+      <el-row class="table-title">
+        <el-col :span="6"><div class="title-header"><i class="el-icon-tickets"/>事件监察记录</div></el-col>
+      </el-row>
+      <el-table v-loading="monitorLoading" :data="monitorList" border size="small" max-height="250">
+        <el-table-column
+          v-for="column in monitorColumns"
+          :key="column.value"
+          :label="column.text"
+          :width="column.width"
+          :align="column.align?column.align:'center'">
+          <template slot-scope="scope">
+            <span>{{ scope.row[column.value] }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
     <!-- 上报请示记录 -->
     <div class="record">
       <el-row class="table-title">
@@ -82,6 +116,8 @@
 import { delayRecords } from '@/api/caseDelay'
 import { urgeRecords } from '@/api/caseUrge'
 import { reportRecords } from '@/api/caseReport'
+import { superviseRecords } from '@/api/caseSupervise'
+import { monitorRecords } from '@/api/caseMonitor'
 
 export default {
   name: 'CaseRecord',
@@ -227,7 +263,135 @@
           align: 'center'
         }
       ],
-      reportRecordLoading: false
+      reportRecordLoading: false,
+      superviseList: [],
+      superviseColumns: [
+        {
+          text: '申请人',
+          value: 'applyPersonName',
+          align: 'center'
+        },
+        {
+          text: '处理状态',
+          value: 'caseStatus',
+          align: 'center'
+        },
+        {
+          text: '督办内容',
+          value: 'urgeContent',
+          align: 'center'
+        },
+        {
+          text: '申请时间',
+          value: 'applyTime',
+          align: 'center'
+        },
+        {
+          text: '督办类型',
+          value: 'urgeType',
+          align: 'center'
+        },
+        {
+          text: '审核状态',
+          value: 'checkStatus',
+          align: 'center'
+        },
+        {
+          text: '审核人',
+          value: 'checkPersonName',
+          align: 'center'
+        },
+        {
+          text: '审核时间',
+          value: 'checkTime',
+          align: 'center'
+        },
+        {
+          text: '审核驳回原因',
+          value: 'checkRejectReason',
+          align: 'center'
+        },
+        {
+          text: '督办状态',
+          value: 'urgeStatus',
+          align: 'center'
+        },
+        {
+          text: '督办人',
+          value: 'urgePersonName',
+          align: 'center'
+        },
+        {
+          text: '督办时间',
+          value: 'urgeTime',
+          align: 'center'
+        },
+        {
+          text: '督办结果',
+          value: 'urgeResult',
+          align: 'center'
+        }
+      ],
+      superviseLoading: false,
+      monitorList: [],
+      monitorColumns: [
+        {
+          text: '申请人',
+          value: 'applyPersonName',
+          align: 'center'
+        },
+        {
+          text: '处理状态',
+          value: 'caseStatus',
+          align: 'center'
+        },
+        {
+          text: '监察内容',
+          value: 'superviseContent',
+          align: 'center'
+        },
+        {
+          text: '申请时间',
+          value: 'applyTime',
+          align: 'center'
+        },
+        {
+          text: '审核状态',
+          value: 'checkStatus',
+          align: 'center'
+        },
+        {
+          text: '审核人',
+          value: 'checkPersonName',
+          align: 'center'
+        },
+        {
+          text: '审核时间',
+          value: 'checkTime',
+          align: 'center'
+        },
+        {
+          text: '审核驳回原因',
+          value: 'checkRejectReason',
+          align: 'center'
+        },
+        {
+          text: '监察状态',
+          value: 'superviseStatus',
+          align: 'center'
+        },
+        {
+          text: '监察人',
+          value: 'supervisePersonName',
+          align: 'center'
+        },
+        {
+          text: '监察结果',
+          value: 'superviseResult',
+          align: 'center'
+        }
+      ],
+      monitorLoading: false
     }
   },
   mounted() {
@@ -264,6 +428,20 @@
         this.reportRecordList = res.data
         this.reportRecordLoading = false
       })
+    },
+    fetchSuperviseRecords() {
+      this.superviseLoading = true
+      superviseRecords(this.id).then(res => {
+        this.superviseList = res.data
+        this.superviseLoading = false
+      })
+    },
+    fetchMonitorecords() {
+      this.monitorLoading = true
+      monitorRecords(this.id).then(res => {
+        this.monitorList = res.data
+        this.monitorLoading = false
+      })
     }
   }
 }