<template> <el-dialog v-if="visible" :visible.sync="visible" :before-close="handleClose" :append-to-body="true" title="审批流程" width="60%"> <el-steps :space="200" :active="list.length" direction="vertical" finish-status="success"> <el-step v-for="item in list" :key="item.FLOW_DETAIL_ID" :value="item.FLOW_DETAIL_ID" :title="item.SORT"> <template slot="description"> <el-card class="box-card" style="width: 900px;"> <div slot="header" class="clearfix"> <span>{{ item.STEP_NAME }}</span> </div> <div> <el-row> <el-col> 审批人:{{ item.APPROVER_NAME }} </el-col> <el-col> 审批状态:{{ item.PASS_FLAG === '1' ? '同意' : '不同意' }} </el-col> <el-col> 审批时间:{{ item.APPROVER_TIME }} </el-col> <el-col> 审批意见:{{ item.APPROVER_OPINION }} </el-col> </el-row> </div> </el-card> </template> </el-step> </el-steps> <div slot="footer" class="dialog-footer"> <el-button @click="closeWindow">取 消</el-button> <el-button :loading="loading" type="primary" @click="save">确 定</el-button> </div> </el-dialog> </template> <script> import '@riophae/vue-treeselect/dist/vue-treeselect.css' export default { props: { corpInfo: { type: String, default: '' } }, data() { return { visible: false, loading: false, list: [], form: { XGF_USER_ID: '' } } }, methods: { init(e) { this.visible = true this.loading = false this.list = e.flow }, handleClose() { this.visible = false this.$emit('finish', '') }, closeWindow() { this.handleClose() } } } </script>