审批历史-通用组件

src/components/hzwlComponents/ApprovalHistory.vue

@@ -0,0 +1,92 @@
+<template>
+  <!--流程-审批历史-->
+  <div class="flow-list">
+    <el-table
+        height="100%"
+        ref="selection"
+        :data="data"
+        tooltip-effect="dark"
+        style="width: 100%"
+        border
+        row-key="id"
+        :no-data-text="listNoDataText"
+        :header-cell-style="{background: '#f8f8f9', color: '#515a6e'}"
+    >
+      <el-table-column
+          type="selection"
+          width="55"
+          align="center">
+      </el-table-column>
+      <el-table-column
+          prop="name"
+          label="任务步骤"
+          align="center"
+      >
+      </el-table-column>
+      <el-table-column
+          prop="assignee"
+          label="任务受理人"
+          align="center"
+      >
+      </el-table-column>
+      <el-table-column
+          prop="createTime"
+          label="创建时间"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.createTime ? $moment(scope.row.createTime).format('YYYY-MM-DD') : '' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          prop="endTime"
+          label="完成时间"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.endTime ? $moment(scope.row.endTime).format('YYYY-MM-DD') : '' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          prop="comment"
+          label="流程信息"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{scope.row.commentText}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+          prop="completeFlag"
+          label="状态"
+          align="center">
+        <template slot-scope="scope">
+          <span>{{ scope.row.endTime ? '已完成' : scope.row.receiveStatus ? '已接收' : '未完成' }}</span>
+        </template>
+      </el-table-column>
+    </el-table>
+    <loading :loading="loading">流程列表加载中</loading>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "ApprovalHistory",
+  props: {
+    data: {
+      type: Array,
+      required: true
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    }
+  },
+  computed: {
+    listNoDataText () {
+      return this.processType === 1 ? '暂无待办流程' : '暂无已办流程'
+    },
+  },
+}
+</script>
+
+<style scoped>
+
+</style>