diff --git a/src/api/workflow/processInstance/index.ts b/src/api/workflow/processInstance/index.ts
index 815b647..ef77277 100644
--- a/src/api/workflow/processInstance/index.ts
+++ b/src/api/workflow/processInstance/index.ts
@@ -1,4 +1,3 @@
-
 import request from '@/utils/request';
 const baseUrl = import.meta.env.VITE_APP_BASE_API;
 import { getToken } from '@/utils/auth';
@@ -6,8 +5,18 @@ import { getToken } from '@/utils/auth';
 /**
  * 通过流程实例id获取历史流程图
  */
-export const getHistoryProcessImage = (processInstanceId: string) =>{
-  return baseUrl+`/workflow/processInstance/getHistoryProcessImage/${processInstanceId}`+'?Authorization=Bearer '+getToken()
-}
-
+export const getHistoryProcessImage = (processInstanceId: string) => {
+  return baseUrl + `/workflow/processInstance/getHistoryProcessImage/${processInstanceId}` + '?Authorization=Bearer ' + getToken();
+};
 
+/**
+ * 获取审批记录
+ * @param processInstanceId 流程实例id
+ * @returns
+ */
+export const getHistoryRecord = (processInstanceId: string) => {
+  return request({
+    url: `/workflow/processInstance/getHistoryRecord/${processInstanceId}`,
+    method: 'get'
+  });
+};
diff --git a/src/components/Process/approvalRecord.vue b/src/components/Process/approvalRecord.vue
index af9b806..2d89ad6 100644
--- a/src/components/Process/approvalRecord.vue
+++ b/src/components/Process/approvalRecord.vue
@@ -1,24 +1,52 @@
 <template>
-  <el-dialog v-model="visible" title="审批记录" width="60%" append-to-body :close-on-click-modal="false">
-    <div>
-        <el-image :src="src" style="font-size: 20px; margin: 50px;">
-        </el-image>
+  <el-dialog v-model="visible" title="审批记录" :width="width" append-to-body :close-on-click-modal="false">
+    <div v-loading="loading">
+      <div>
+        <el-image :src="src" style="font-size: 20px; margin: 50px;"> </el-image>
+      </div>
+      <div>
+        <el-table :data="historyList" style="width: 100%" max-height="570" v-loading="loading">
+          <el-table-column label="流程审批历史记录" align="center">
+            <el-table-column type="index" label="序号" align="center" width="50"></el-table-column>
+            <el-table-column prop="name" label="任务名称" align="center"></el-table-column>
+            <el-table-column prop="nickName" label="办理人" align="center"></el-table-column>
+            <el-table-column prop="status" label="状态" align="center"></el-table-column>
+            <el-table-column prop="comment" label="审批意见" align="center"></el-table-column>
+            <el-table-column prop="startTime" label="开始时间" align="center"></el-table-column>
+            <el-table-column prop="endTime" label="结束时间" align="center"></el-table-column>
+            <el-table-column prop="runDuration" label="运行时长" align="center"></el-table-column>
+          </el-table-column>
+        </el-table>
+      </div>
     </div>
   </el-dialog>
 </template>
-<script >
-import { getHistoryProcessImage } from '@/api/workflow/processInstance';
+<script>
+import { getHistoryProcessImage,getHistoryRecord } from '@/api/workflow/processInstance';
 export default {
+  props: {
+    width: {
+        type:String,
+        default:"70%"
+    }
+  },
   data() {
     return {
+      loading:false,
       src:"",
-      visible:false
+      visible:false,
+      historyList:[]
     };
   },
   methods: {
     init(processInstanceId) {
       this.visible = true
+      this.loading = true
       this.src = getHistoryProcessImage(processInstanceId)
+      getHistoryRecord(processInstanceId).then(response => {
+          this.historyList = response.data
+          this.loading = false
+      })
     }
   }
 };