<template> <div class='app-wf-approval'> <div class="app-wf-approval-header"> <span class="approval-header-left">{{data.startTime}}</span> <span>{{data.startUserName}}{{$t('components.appWFApproval.commit')}}</span> </div> <div class="app-wf-approval-content" v-if="data.usertasks && data.usertasks.length >0"> <template v-for="(usertask,index) in data.usertasks" > <template v-if="usertask.identitylinks.length >0"> <div class="approval-content-item" :key="index"> <div class="approval-content-item-left"> {{usertask.userTaskName}} </div> <div class="approval-content-item-right"> <div class="approval-content-item-wait" v-if="usertask.identitylinks.length >0"> {{$t('components.appWFApproval.wait')}}<span v-for="(identitylink,inx) in usertask.identitylinks" :key="inx">{{identitylink.displayname}}<span v-if="inx >0">、</span></span>{{$t('components.appWFApproval.handle')}} </div> <div class="approval-content-item-info" v-if="usertask.comments.length >0"> <div v-for="(comment,commentInx) in usertask.comments" :key="commentInx"> <div class="approval-content-item-info-item approval-content-item-info-top"> {{`【${comment.type}】${comment.fullMessage}`}} </div> <div class="approval-content-item-info-item approval-content-item-info-bottom"> <span class="info-bottom-name">{{comment.authorName}}</span> <span>{{comment.time}}</span> </div> </div> </div> <div class="approval-content-item-memo" v-if="usertask.userTaskId === viewparams.userTaskId"> <el-input type="textarea" v-model="initmemo" :rows="2" @blur="handleBlur" :placeholder="$t('components.appWFApproval.placeholder')"></el-input> </div> </div> </div> </template> </template> </div> <div class="app-wf-approval-bottom"> <span v-if="data.endTime">{{data.endTime}}{{$t('components.appWFApproval.end')}}</span> </div> </div> </template> <script lang = 'ts'> import { Vue, Component,Prop,Model } from 'vue-property-decorator'; @Component({ }) export default class AppWFApproval extends Vue { /** * 双向绑定值 * * @memberof AppWFApproval */ @Model ('change') value!: string; /** * 数据 * * @memberof AppWFApproval */ public data:any = {}; /** * 初始化memo * * @memberof AppWFApproval */ public initmemo:string = ""; /** * 传入数据服务 * * @memberof AppWFApproval */ @Prop() public service:any; /** * 上下文 * * @memberof AppWFApproval */ @Prop() public context:any; /** * 视图参数 * * @memberof AppWFApproval */ @Prop() public viewparams:any; /** * 初始化数据 * * @memberof AppWFApproval */ public created(){ if(this.service){ this.service.GetWFHistory(this.context).then((res:any) =>{ if(res && (res.status === 200)){ this.data = res.data; } }) } } /** * 抛出wfprocmemo * * @memberof AppWFApproval */ public handleBlur($event:any){ this.$emit('change',$event.target.value); } } </script> <style lang="scss"> @import './app-wf-approval.scss'; </style>