|
|
@ -1,40 +1,34 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
<!--流程流转记录--> |
|
|
|
<el-card > |
|
|
|
<el-col :span="24" > |
|
|
|
<div > |
|
|
|
<div style="width:50%;float:left; border:1px solid #000;"> |
|
|
|
<el-card> |
|
|
|
<el-col :span="24"> |
|
|
|
<div> |
|
|
|
<div style="width:50%;float:left;"> |
|
|
|
<span class="el-icon-picture-outline">流程图</span> |
|
|
|
<flow :xmlData="xmlData" :taskData="taskData"></flow> |
|
|
|
</div> |
|
|
|
<div style="width:50%;;float:left; border:1px solid #000;" > |
|
|
|
<div style="width:50%;;float:left;"> |
|
|
|
<el-timeline> |
|
|
|
<el-timeline-item |
|
|
|
v-for="(item,index ) in flowRecordList" |
|
|
|
:key="index" |
|
|
|
:icon="setIcon(item.finishTime)" |
|
|
|
:color="setColor(item.finishTime)" |
|
|
|
> |
|
|
|
<p style="font-weight: 700">{{item.taskName}}</p> |
|
|
|
<el-timeline-item v-for="(item,index ) in flowRecordList" :key="index" :icon="setIcon(item.finishTime)" :color="setColor(item.finishTime)"> |
|
|
|
<p style="font-weight: 700">{{ item.taskName }}</p> |
|
|
|
<el-card :body-style="{ padding: '10px' }"> |
|
|
|
<label v-if="item.taskUserInfos" style="font-weight: normal;margin-right: 30px;">实际办理: |
|
|
|
<span v-for="(items,indexs ) in item.taskUserInfos" :key="indexs">{{items.assigneeName}},</span> |
|
|
|
<!-- <el-tag type="info" size="mini">{{item.deptName}}</el-tag>--> |
|
|
|
<span v-for="(items, index ) in item.taskUserInfos" :key="index">{{ items.assigneeName }},</span> |
|
|
|
<!-- <el-tag type="info" size="mini">{{item.deptName}}</el-tag>--> |
|
|
|
</label> |
|
|
|
<label v-if="item.candidate" |
|
|
|
style="font-weight: normal;margin-right: 30px;">候选办理:{{item.candidate}}</label><br> |
|
|
|
<label style="font-weight: normal">接收时间: </label><label style="color:#8a909c;font-weight: normal">{{item.createTime}}</label><br> |
|
|
|
<label v-if="item.finishTime" style="font-weight: normal">办结时间: </label> |
|
|
|
<label style="color:#8a909c;font-weight: normal">{{item.finishTime}}</label><br> |
|
|
|
<label v-if="item.candidate" style="font-weight: normal;margin-right: 30px;">候选办理:{{ item.candidate }}</label><br> |
|
|
|
<label style="font-weight: normal">接收时间: </label><label style="color:#8a909c;font-weight: normal">{{ item.createTime }}</label><br> |
|
|
|
<label v-if="item.finishTime" style="font-weight: normal">办理时间: </label> |
|
|
|
<label style="color:#8a909c;font-weight: normal">{{ item.finishTime }}</label><br> |
|
|
|
<label v-if="item.duration" style="font-weight: normal">耗时:</label> |
|
|
|
<label style="color:#8a909c;font-weight: normal">{{item.duration}}</label> |
|
|
|
<label style="color:red;font-weight: normal">{{ item.duration }}</label> |
|
|
|
<p v-if="item.comment"> |
|
|
|
<el-tag type="success" v-if="item.comment.type === '1'"> {{item.comment.comment}}</el-tag> |
|
|
|
<el-tag type="warning" v-if="item.comment.type === '2'"> {{item.comment.comment}}</el-tag> |
|
|
|
<el-tag type="danger" v-if="item.comment.type === '3'"> {{item.comment.comment}}</el-tag> |
|
|
|
<el-tag type="danger" v-if="item.comment.type === '7'"> {{item.comment.comment}}</el-tag> |
|
|
|
<el-tag type="danger" v-if="item.comment.type === '6'"> {{item.comment.comment}}</el-tag> |
|
|
|
<el-tag type="success" v-if="item.comment.type === '1'"> {{ item.comment.comment }}</el-tag> |
|
|
|
<el-tag type="warning" v-if="item.comment.type === '2'"> {{ item.comment.comment }}</el-tag> |
|
|
|
<el-tag type="danger" v-if="item.comment.type === '3'"> {{ item.comment.comment }}</el-tag> |
|
|
|
<el-tag type="danger" v-if="item.comment.type === '7'"> {{ item.comment.comment }}</el-tag> |
|
|
|
<el-tag type="danger" v-if="item.comment.type === '6'"> {{ item.comment.comment }}</el-tag> |
|
|
|
</p> |
|
|
|
</el-card> |
|
|
|
</el-timeline-item> |
|
|
@ -46,9 +40,10 @@ |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
import flow from "@C/flow/flow"; |
|
|
|
import flow from '@C/flow/flow' |
|
|
|
|
|
|
|
export default { |
|
|
|
name: "flowRecords", |
|
|
|
name: 'flowRecords', |
|
|
|
components: { |
|
|
|
flow |
|
|
|
}, |
|
|
@ -67,25 +62,31 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
data() { |
|
|
|
return {}; |
|
|
|
return {} |
|
|
|
}, |
|
|
|
created() { |
|
|
|
}, |
|
|
|
methods:{ |
|
|
|
methods: { |
|
|
|
setIcon(val) { |
|
|
|
if (val) { |
|
|
|
return "el-icon-check"; |
|
|
|
return 'el-icon-check' |
|
|
|
} else { |
|
|
|
return "el-icon-time"; |
|
|
|
return 'el-icon-time' |
|
|
|
} |
|
|
|
}, |
|
|
|
setColor(val) { |
|
|
|
if (val) { |
|
|
|
return "#2bc418"; |
|
|
|
return '#2bc418' |
|
|
|
} else { |
|
|
|
return "#b3bdbb"; |
|
|
|
return '#b3bdbb' |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
} |
|
|
|
</script> |
|
|
|
<style scoped> |
|
|
|
.el-tag { |
|
|
|
white-space: normal; |
|
|
|
height: auto; |
|
|
|
} |
|
|
|
</style> |
|
|
|