fix -- 修改流程详情信息改为标签页显示
This commit is contained in:
hewenqiang
@@ -1,73 +1,84 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-card class="box-card" >
|
<el-tabs tab-position="top">
|
||||||
<div slot="header" class="clearfix">
|
<el-tab-pane label="基础信息">
|
||||||
<span class="el-icon-document">基础信息</span>
|
<el-card class="box-card">
|
||||||
<el-button style="float: right;" type="primary" @click="goBack">返回</el-button>
|
<!--流程处理表单模块-->
|
||||||
</div>
|
<el-col :span="16" :offset="6" v-if="variableOpen">
|
||||||
|
<div>
|
||||||
|
<parser :key="new Date().getTime()" :form-conf="variablesData"/>
|
||||||
|
</div>
|
||||||
|
<div style="margin-left:10%;margin-bottom: 20px;font-size: 14px;" v-if="finished === 'true'">
|
||||||
|
<el-button icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">审批</el-button>
|
||||||
|
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">委派</el-button>-->
|
||||||
|
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleAssign">转办</el-button>-->
|
||||||
|
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">签收</el-button>-->
|
||||||
|
<el-button icon="el-icon-refresh-left" type="warning" size="mini" @click="handleReturn">退回</el-button>
|
||||||
|
<el-button icon="el-icon-circle-close" type="danger" size="mini" @click="handleReject">驳回</el-button>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
|
||||||
<!--流程处理表单模块-->
|
<!--初始化流程加载表单信息-->
|
||||||
<el-col :span="16" :offset="6" v-if="variableOpen">
|
<el-col :span="16" :offset="4" v-if="formConfOpen">
|
||||||
<div>
|
<div class="form-conf">
|
||||||
<parser :key="new Date().getTime()" :form-conf="variablesData" />
|
<parser :key="new Date().getTime()" :form-conf="formConf" @submit="submitForm" ref="parser" @getData="getData"/>
|
||||||
</div>
|
</div>
|
||||||
<div style="margin-left:10%;margin-bottom: 20px;font-size: 14px;" v-if="finished === 'true'">
|
</el-col>
|
||||||
<el-button icon="el-icon-edit-outline" type="success" size="mini" @click="handleComplete">审批</el-button>
|
</el-card>
|
||||||
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">委派</el-button>-->
|
</el-tab-pane>
|
||||||
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleAssign">转办</el-button>-->
|
<el-tab-pane label="流转记录">
|
||||||
<!-- <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate">签收</el-button>-->
|
<el-card class="box-card">
|
||||||
<el-button icon="el-icon-refresh-left" type="warning" size="mini" @click="handleReturn">退回</el-button>
|
<el-col :span="16" :offset="4">
|
||||||
<el-button icon="el-icon-circle-close" type="danger" size="mini" @click="handleReject">驳回</el-button>
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
|
|
||||||
<!--初始化流程加载表单信息-->
|
|
||||||
<el-col :span="16" :offset="4" v-if="formConfOpen">
|
|
||||||
<div class="test-form">
|
|
||||||
<parser :key="new Date().getTime()" :form-conf="formConf" @submit="submitForm" ref="parser" @getData="getData" />
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
</el-card>
|
|
||||||
|
|
||||||
<!--流程流转记录-->
|
|
||||||
<el-card class="box-card" v-if="flowRecordList">
|
|
||||||
<div slot="header" class="clearfix">
|
|
||||||
<span class="el-icon-notebook-1">审批记录</span>
|
|
||||||
</div>
|
|
||||||
<el-col :span="16" :offset="4" >
|
|
||||||
<div class="block">
|
<div class="block">
|
||||||
<el-timeline>
|
<el-timeline>
|
||||||
<el-timeline-item
|
<el-timeline-item v-for="(item,index ) in flowRecordList" :key="index" :icon="setIcon(item.finishTime)" :color="setColor(item.finishTime)">
|
||||||
v-for="(item,index ) in flowRecordList"
|
<p style="font-weight: 700">{{ item.taskName }}</p>
|
||||||
:key="index"
|
|
||||||
:icon="setIcon(item.finishTime)"
|
|
||||||
:color="setColor(item.finishTime)"
|
|
||||||
>
|
|
||||||
<p style="font-weight: 700">{{item.taskName}}</p>
|
|
||||||
<el-card :body-style="{ padding: '10px' }">
|
<el-card :body-style="{ padding: '10px' }">
|
||||||
<label v-if="item.assigneeName" style="font-weight: normal;margin-right: 30px;">实际办理： {{item.assigneeName}} <el-tag type="info" size="mini">{{item.deptName}}</el-tag></label>
|
<label v-if="item.assigneeName" style="font-weight: normal;margin-right: 30px;">实际办理：
|
||||||
<label v-if="item.candidate" style="font-weight: normal;margin-right: 30px;">候选办理： {{item.candidate}}</label>
|
{{ item.assigneeName }}
|
||||||
<label style="font-weight: normal">接收时间： </label><label style="color:#8a909c;font-weight: normal">{{item.createTime}}</label>
|
<el-tag type="info" size="mini">{{ item.deptName }}</el-tag>
|
||||||
<label v-if="item.finishTime" style="margin-left: 30px;font-weight: normal">办结时间： </label><label style="color:#8a909c;font-weight: normal">{{item.finishTime}}</label>
|
</label>
|
||||||
<label v-if="item.duration" style="margin-left: 30px;font-weight: normal">耗时： </label><label style="color:#8a909c;font-weight: normal">{{item.duration}}</label>
|
<label v-if="item.candidate" style="font-weight: normal;margin-right: 30px;">
|
||||||
|
候选办理： {{ item.candidate }}
|
||||||
<p v-if="item.comment">
|
</label>
|
||||||
<el-tag type="success" v-if="item.comment.type === '1'"> {{item.comment.comment}}</el-tag>
|
<label style="font-weight: normal">
|
||||||
<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>
|
</label>
|
||||||
|
<label style="color:#8a909c;font-weight: normal">
|
||||||
|
{{ item.createTime }}
|
||||||
|
</label>
|
||||||
|
<label v-if="item.finishTime" style="margin-left: 30px;font-weight: normal">
|
||||||
|
办结时间：
|
||||||
|
</label>
|
||||||
|
<label style="color:#8a909c;font-weight: normal">
|
||||||
|
{{ item.finishTime }}
|
||||||
|
</label>
|
||||||
|
<label v-if="item.duration" style="margin-left: 30px;font-weight: normal">
|
||||||
|
耗时：
|
||||||
|
</label>
|
||||||
|
<label style="color:#8a909c;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>
|
||||||
</p>
|
</p>
|
||||||
</el-card>
|
</el-card>
|
||||||
</el-timeline-item>
|
</el-timeline-item>
|
||||||
</el-timeline>
|
</el-timeline>
|
||||||
</div>
|
</div>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-card>
|
</el-card>
|
||||||
<el-card class="box-card">
|
</el-tab-pane>
|
||||||
<div slot="header" class="clearfix">
|
<el-tab-pane label="流程跟踪">
|
||||||
<span class="el-icon-picture-outline">流程图</span>
|
<el-card class="box-card">
|
||||||
</div>
|
<process-viewer :key="`designer-${loadIndex}`" :style="'height:' + height" :xml="xmlData"
|
||||||
<process-viewer :key="`designer-${loadIndex}`" :style="{height: '400px'}" :xml="xmlData" :finishedInfo="finishedInfo" :allCommentList="null"></process-viewer>
|
:finishedInfo="finishedInfo" :allCommentList="null"
|
||||||
</el-card>
|
/>
|
||||||
|
</el-card>
|
||||||
|
</el-tab-pane>
|
||||||
|
</el-tabs>
|
||||||
|
|
||||||
<!--审批正常流程-->
|
<!--审批正常流程-->
|
||||||
<el-dialog :title="completeTitle" :visible.sync="completeOpen" width="60%" append-to-body>
|
<el-dialog :title="completeTitle" :visible.sync="completeOpen" width="60%" append-to-body>
|
||||||
@@ -186,6 +197,7 @@ export default {
|
|||||||
props: {},
|
props: {},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
height: document.documentElement.clientHeight - 205 + 'px;',
|
||||||
// 模型xml数据
|
// 模型xml数据
|
||||||
loadIndex: 0,
|
loadIndex: 0,
|
||||||
xmlData: undefined,
|
xmlData: undefined,
|
||||||
@@ -565,7 +577,7 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.test-form {
|
.form-conf {
|
||||||
margin: 15px auto;
|
margin: 15px auto;
|
||||||
width: 800px;
|
width: 800px;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
|
|||||||
Reference in New Issue
Block a user