main
姜玉琦
parent
8f66f73e52
commit
4dc7cf73a8
|
|
@ -6,52 +6,87 @@
|
|||
ref="drawer"
|
||||
direction="rtl"
|
||||
@close="closeCallBack"
|
||||
size="80%"
|
||||
size="70%"
|
||||
>
|
||||
<template slot="title">
|
||||
<div>流程详情 【{{ title }}】 - 当前进度【{{ jdtitle }}】<span v-if="showjd"> - 当前节点【{{options.taskName}}】</span></div>
|
||||
<div>
|
||||
流程详情 【{{ title }}】 - 当前进度【{{ jdtitle }}】<span v-if="showjd">
|
||||
- 当前节点【{{ options.taskName }}】</span
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
<div class="drawer">
|
||||
<div class="drawerLeft block containers">
|
||||
<div class="canvas" ref="flowCanvas"></div>
|
||||
<div class="maskLayer" />
|
||||
<el-timeline>
|
||||
<el-timeline style="padding-left: 0px !important">
|
||||
<el-timeline-item
|
||||
v-for="(item, index) in flowRecordList"
|
||||
:key="index"
|
||||
:icon="setIcon(item)"
|
||||
:color="setColor(item)"
|
||||
>
|
||||
<p style="font-weight: 700"> {{ getSort(index) }}{{item.taskName}}{{item.commentResult}}</p>
|
||||
<p style="font-weight: 700">
|
||||
{{ getSort(index) }}{{ item.taskName }}{{ item.commentResult }}
|
||||
</p>
|
||||
<el-card :body-style="{ padding: '6px' }">
|
||||
<el-descriptions class="margin-top" :column="1" size="small" border>
|
||||
<el-descriptions-item v-if="item.assigneeName" label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<el-descriptions-item
|
||||
v-if="item.assigneeName"
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"><i class="el-icon-user"></i>办理人</template>
|
||||
{{ item.assigneeName }}
|
||||
<el-tag type="info" size="mini">{{ item.deptName }}</el-tag>
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="item.candidate" label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<el-descriptions-item
|
||||
v-if="item.candidate"
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"><i class="el-icon-user"></i>候选办理</template>
|
||||
{{ item.candidate }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="item.deleteReason" label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<el-descriptions-item
|
||||
v-if="item.deleteReason"
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"><i class="el-icon-user"></i>驳回节点</template>
|
||||
{{ getDeleteReason(item.deleteReason) }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<el-descriptions-item
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"><i class="el-icon-date"></i>接收时间</template>
|
||||
{{ item.startTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="item.endTime" label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<el-descriptions-item
|
||||
v-if="item.endTime"
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"><i class="el-icon-date"></i>处理时间</template>
|
||||
{{ item.endTime }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="item.duration" label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<el-descriptions-item
|
||||
v-if="item.duration"
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"><i class="el-icon-time"></i>处理耗时</template>
|
||||
{{ getDurationDate(item.duration) }}
|
||||
</el-descriptions-item>
|
||||
<el-descriptions-item v-if="item.message" label-class-name="my-label" :labelStyle="labelStyle">
|
||||
<template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
|
||||
<el-descriptions-item
|
||||
v-if="item.message"
|
||||
label-class-name="my-label"
|
||||
:labelStyle="labelStyle"
|
||||
>
|
||||
<template slot="label"
|
||||
><i class="el-icon-tickets"></i>处理意见</template
|
||||
>
|
||||
{{ item.message }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
|
@ -61,33 +96,89 @@
|
|||
</div>
|
||||
<div class="drawerRight">
|
||||
<el-form
|
||||
ref="form" :model="form" :rules="rules" label-width="100px" v-loading="loading">
|
||||
<el-form-item label="所属项目">
|
||||
{{ initData.projectName }}
|
||||
ref="form"
|
||||
:model="form"
|
||||
:rules="rules"
|
||||
label-width="100px"
|
||||
v-loading="loading"
|
||||
>
|
||||
<el-form-item label="项目单位">
|
||||
{{ initData.parProjName }}
|
||||
</el-form-item>
|
||||
<el-form-item label="发起单位">
|
||||
{{ options.startDeptName }}
|
||||
<el-form-item label="项目名称">
|
||||
{{ initData.projName }}
|
||||
</el-form-item>
|
||||
<el-form-item label="发起人">
|
||||
{{ options.startUserName }}
|
||||
</el-form-item>
|
||||
<el-form-item label="审批事项">
|
||||
<el-form-item label="申请类型">
|
||||
{{ title }}
|
||||
</el-form-item>
|
||||
<el-form-item label="审批内容">
|
||||
<div v-for="(file,index ) in initData.files" :key="index">
|
||||
<el-form-item label="申请人">
|
||||
<label
|
||||
>{{ initData.createBy }}
|
||||
<el-tag type="info" size="mini">{{
|
||||
initData.createByDeptName
|
||||
}}</el-tag></label
|
||||
>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请原因">
|
||||
{{ initData.applyReason }}
|
||||
</el-form-item>
|
||||
<el-form-item label="申请附件" v-if="initData.applyFiles">
|
||||
<div v-for="(file, index) in initData.applyFiles.split(',')" :key="index">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-paperclip"
|
||||
@click="handledownload(file)"
|
||||
>{{file.substring(file.lastIndexOf('/')+1)}}</el-button
|
||||
>{{ file.substring(file.lastIndexOf("/") + 1) }}</el-button
|
||||
>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="申请说明">
|
||||
{{initData.remark}}
|
||||
<el-form-item label="申请时间">
|
||||
{{ options.createTime }}
|
||||
</el-form-item>
|
||||
<el-form-item label="使用时间" v-if="initData.useTime">
|
||||
{{ parseTime(initData.useTime, "{y}-{m}-{d} {h}:{i}") }}
|
||||
</el-form-item>
|
||||
<el-divider content-position="left">申请明细信息</el-divider>
|
||||
<el-table
|
||||
ref="proProjectApplyDetail"
|
||||
:data="initData.proProjectApplyDetailList"
|
||||
>
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="50"
|
||||
type="index"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
<el-table-column label="申请明细" align="left">
|
||||
<template slot-scope="scope">
|
||||
<el-breadcrumb separator=">">
|
||||
<el-breadcrumb-item>{{ scope.row.typeName }}</el-breadcrumb-item>
|
||||
<el-breadcrumb-item class="assetsName">{{
|
||||
scope.row.assetsName
|
||||
}}</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="申请规格"
|
||||
prop="assetsVersion"
|
||||
width="180"
|
||||
align="center"
|
||||
v-if="showAssetsVersion"
|
||||
></el-table-column>
|
||||
<el-table-column label="申请数量" prop="number" width="180" align="center">
|
||||
<template slot-scope="scope">
|
||||
<label>{{ scope.row.number }} {{ scope.row.assetsUnit }}</label>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="使用说明"
|
||||
prop="useReason"
|
||||
align="center"
|
||||
></el-table-column>
|
||||
</el-table>
|
||||
<el-divider content-position="left">申请办理信息</el-divider>
|
||||
<el-form-item label="审批意见" prop="comment">
|
||||
<el-input
|
||||
type="textarea"
|
||||
|
|
@ -112,17 +203,66 @@
|
|||
</el-select>
|
||||
</el-form-item>
|
||||
<div style="text-align: center">
|
||||
<el-button icon="el-icon-s-custom" v-if="false" type="primary" plain size="mini">任务转办</el-button>
|
||||
<el-button icon="el-icon-check" type="success" size="mini" @click="handlePass">审批通过</el-button>
|
||||
<el-button icon="el-icon-back" type="warning" size="mini" @click="handleBack">退回任务</el-button>
|
||||
<el-button icon="el-icon-circle-close" type="danger" size="mini" @click="handleReject">驳回上级</el-button>
|
||||
<el-button
|
||||
icon="el-icon-s-custom"
|
||||
plain
|
||||
size="mini"
|
||||
>任务委派</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="el-icon-position"
|
||||
type="primary"
|
||||
plain
|
||||
size="mini"
|
||||
>任务转办</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="el-icon-check"
|
||||
type="success"
|
||||
size="mini"
|
||||
@click="handlePass"
|
||||
>审批通过</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="el-icon-back"
|
||||
type="warning"
|
||||
size="mini"
|
||||
@click="handleBack"
|
||||
>退回任务</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="el-icon-circle-close"
|
||||
type="danger"
|
||||
size="mini"
|
||||
@click="handleReject"
|
||||
>驳回上级</el-button
|
||||
>
|
||||
</div>
|
||||
</el-form>
|
||||
<div class="page-warning">
|
||||
<p><strong style="color: #67C23A;">“审批通过”</strong> 操作后，代表您对当前任务满意，任务进入下一阶段。</p>
|
||||
<p><strong style="color: #E6A23C;">“退回任务”</strong> 操作后，代表您对当前任务不满意，任务进入您选择的阶段，或者直接退回给申请人重新申请。</p>
|
||||
<p><strong style="color: #F56C6C;">“驳回上级”</strong> 操作后，代表您对当前任务不满意，任务退回到上一阶段继续处理。</p>
|
||||
<p>
|
||||
<strong style="color: #606266">“任务委派”</strong>
|
||||
操作后，由指定人跟进处理，处理完成后继续由您进行审批。
|
||||
</p>
|
||||
<p>
|
||||
<strong style="color: #a3d3ff">“任务转办”</strong>
|
||||
操作后，任务由指定人进行处理。
|
||||
</p>
|
||||
<p>
|
||||
<strong style="color: #67c23a">“审批通过”</strong>
|
||||
操作后，代表您对当前任务满意，任务进入下一阶段。
|
||||
</p>
|
||||
<p>
|
||||
<strong style="color: #e6a23c">“退回任务”</strong>
|
||||
操作后，代表您对当前任务不满意，任务进入您选择的阶段或退回给申请人重新申请。
|
||||
</p>
|
||||
<p>
|
||||
<strong style="color: #f56c6c">“驳回上级”</strong>
|
||||
操作后，代表您对当前任务不满意，任务退回到上一阶段继续处理。
|
||||
</p>
|
||||
</div>
|
||||
<!--占位使用...-->
|
||||
<div style="width:100%;height:2px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-drawer>
|
||||
|
|
@ -134,7 +274,9 @@ import store from "@/store";
|
|||
import { flowXmlAndNode } from "@/api/flowable/definition";
|
||||
import { CustomViewer as BpmnViewer } from "@/components/customBpmn";
|
||||
import { complete, rejectTask, returnTask, returnList } from "@/api/flowable/todo";
|
||||
import {findCommentByProcInsId,findFormDatasByProcInsId} from "@/api/flowable/businessKey";
|
||||
import { findCommentByProcInsId } from "@/api/flowable/businessKey";
|
||||
import { getProjectApply } from "@/api/project/projectApply";
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props: {
|
||||
|
|
@ -164,20 +306,17 @@ export default {
|
|||
},
|
||||
],
|
||||
},
|
||||
queryParams:{
|
||||
nickName:null,
|
||||
phonenumber:null,
|
||||
},
|
||||
bpmnViewer: null,
|
||||
options: {},
|
||||
flowRecordList: [],
|
||||
showjd: false,
|
||||
//label样式
|
||||
labelStyle: { width: "180px" },
|
||||
labelStyle: { width: "160px" },
|
||||
initData: {},
|
||||
returnTaskList: [], // 回退列表数据
|
||||
returnTask: false,
|
||||
returnTaskBtn:false
|
||||
returnTaskBtn: false,
|
||||
showAssetsVersion: false,
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
|
|
@ -190,19 +329,21 @@ export default {
|
|||
handlePass() {
|
||||
this.$refs["form"].validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm('是否确认审批通过当前流程申请?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$confirm("是否确认审批通过当前流程申请?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
})
|
||||
.then(() => {
|
||||
this.loading = true;
|
||||
complete(this.form).then(res => {
|
||||
complete(this.form).then((res) => {
|
||||
this.$modal.msgSuccess("任务审批成功");
|
||||
this.loading = false;
|
||||
//关闭并刷新列表
|
||||
this.$refs.drawer.closeDrawer();
|
||||
});
|
||||
}).catch(() => {
|
||||
})
|
||||
.catch(() => {
|
||||
console.log("取消操作");
|
||||
});
|
||||
}
|
||||
|
|
@ -212,19 +353,21 @@ export default {
|
|||
handleReject() {
|
||||
this.$refs["form"].validate((valid) => {
|
||||
if (valid) {
|
||||
this.$confirm('是否确认审批驳回当前流程申请?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$confirm("是否确认审批驳回当前流程申请?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
})
|
||||
.then(() => {
|
||||
this.loading = true;
|
||||
rejectTask(this.form).then(res => {
|
||||
rejectTask(this.form).then((res) => {
|
||||
this.$modal.msgSuccess("任务驳回成功");
|
||||
this.loading = false;
|
||||
//关闭并刷新列表
|
||||
this.$refs.drawer.closeDrawer();
|
||||
});
|
||||
}).catch(() => {
|
||||
})
|
||||
.catch(() => {
|
||||
console.log("取消操作");
|
||||
});
|
||||
}
|
||||
|
|
@ -243,49 +386,51 @@ export default {
|
|||
this.$modal.msgWarning("请选择退回节点");
|
||||
return;
|
||||
}
|
||||
this.$confirm('是否确认退回当前流程申请?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$confirm("是否确认退回当前流程申请?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
})
|
||||
.then(() => {
|
||||
this.loading = true;
|
||||
returnTask(this.form).then(res => {
|
||||
returnTask(this.form).then((res) => {
|
||||
this.$modal.msgSuccess("任务退回成功");
|
||||
this.loading = false;
|
||||
//关闭并刷新列表
|
||||
this.$refs.drawer.closeDrawer();
|
||||
});
|
||||
}).catch(() => {
|
||||
})
|
||||
.catch(() => {
|
||||
console.log("取消操作");
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
initReturnList() {
|
||||
returnList(this.form).then(res => {
|
||||
returnList(this.form).then((res) => {
|
||||
this.returnTaskList = res.data;
|
||||
//退回节点>1时，可显示退回按钮
|
||||
if (res.data.length > 1) {
|
||||
this.returnTaskBtn = true;
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
initFormDate() {
|
||||
this.form.taskId = this.options.taskId;
|
||||
this.form.taskName = this.options.taskName;
|
||||
this.form.userId = store.getters.userId;
|
||||
this.form.deployId = this.options.deployId;
|
||||
this.form.procInsId = this.options.procInsId;
|
||||
this.form.instanceId = this.options.procInsId;
|
||||
this.form.executionId = this.options.procInsId;
|
||||
let formData = {
|
||||
taskId: this.options.taskId,
|
||||
procInsId: this.options.procInsId,
|
||||
instanceId: this.options.procInsId,
|
||||
deployId: this.options.deployId,
|
||||
executionId: this.options.procInsId,
|
||||
};
|
||||
this.form = formData;
|
||||
this.returnTask = false;
|
||||
this.returnTaskBtn = false;
|
||||
this.initReturnList();
|
||||
},
|
||||
setIcon(row) {
|
||||
if (row.endTime) {
|
||||
if(row.commentResult=="驳回")
|
||||
{
|
||||
if (row.commentResult == "驳回") {
|
||||
return "el-icon-close";
|
||||
} else {
|
||||
return "el-icon-check";
|
||||
|
|
@ -296,8 +441,7 @@ export default {
|
|||
},
|
||||
setColor(row) {
|
||||
if (row.endTime) {
|
||||
if(row.commentResult=="驳回")
|
||||
{
|
||||
if (row.commentResult == "驳回") {
|
||||
return "#f56c6c";
|
||||
} else {
|
||||
return "#2bc418";
|
||||
|
|
@ -318,12 +462,17 @@ export default {
|
|||
},
|
||||
show(options) {
|
||||
this.options = options;
|
||||
//物资设备类需要输入规格
|
||||
if (options.category == 1) {
|
||||
this.showAssetsVersion = true;
|
||||
} else {
|
||||
this.showAssetsVersion = false;
|
||||
}
|
||||
this.title = options.procDefName;
|
||||
this.deptName = options.startDeptName;
|
||||
this.nickName = options.startUserName;
|
||||
this.onOpen = true;
|
||||
this.showjd = false;
|
||||
this.form = {};
|
||||
this.initFormDate();
|
||||
if (options.finishTime == null) {
|
||||
this.jdtitle = "进行中";
|
||||
|
|
@ -334,10 +483,12 @@ export default {
|
|||
this.jdtitle = "已完成";
|
||||
}
|
||||
this.getFlowRecordList(options.procInsId, options.deployId);
|
||||
this.getFormDatasList(options.procInsId, options.deployId);
|
||||
flowXmlAndNode({ procInsId:options.procInsId, deployId: options.deployId }).then((res) => {
|
||||
this.getFormDatasList(options.businessKey);
|
||||
flowXmlAndNode({ procInsId: options.procInsId, deployId: options.deployId }).then(
|
||||
(res) => {
|
||||
this.initFlowImage(res.data);
|
||||
});
|
||||
}
|
||||
);
|
||||
},
|
||||
async initFlowImage(data) {
|
||||
const self = this;
|
||||
|
|
@ -350,7 +501,7 @@ export default {
|
|||
// 自适应
|
||||
self.bpmnViewer.get("canvas").zoom("fit-viewport", "auto");
|
||||
if (data.nodeData !== undefined && data.nodeData.length > 0) {
|
||||
self.fillColor(data.nodeData)
|
||||
self.fillColor(data.nodeData);
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err.message, err.warnings);
|
||||
|
|
@ -365,136 +516,166 @@ export default {
|
|||
// }).catch(res => {
|
||||
// this.$message.error("数据异常，请联系管理员...");
|
||||
// })
|
||||
const that = this
|
||||
const params = {procInsId: procInsId}
|
||||
findCommentByProcInsId(params).then(res => {
|
||||
const that = this;
|
||||
const params = { procInsId: procInsId };
|
||||
findCommentByProcInsId(params)
|
||||
.then((res) => {
|
||||
that.flowRecordList = res.data;
|
||||
}).catch(res => {
|
||||
this.$message.error("数据异常，请联系管理员...");
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error("数据异常，请联系管理员...");
|
||||
});
|
||||
},
|
||||
/** 流程表单数据 */
|
||||
getFormDatasList(procInsId, deployId) {
|
||||
// const that = this
|
||||
// const params = {procInsId: procInsId, deployId: deployId}
|
||||
// flowRecord(params).then(res => {
|
||||
// that.flowRecordList = res.data.flowList;
|
||||
// }).catch(res => {
|
||||
// this.$message.error("数据异常，请联系管理员...");
|
||||
// })
|
||||
const that = this
|
||||
const params = {procInsId: procInsId}
|
||||
findFormDatasByProcInsId(params).then(res => {
|
||||
getFormDatasList(businessKey) {
|
||||
getProjectApply(businessKey)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.initData = res.data;
|
||||
this.initData.files = res.data.files.split(',');
|
||||
}).catch(res => {
|
||||
} else {
|
||||
this.$message.error("数据异常，请联系管理员...");
|
||||
}
|
||||
})
|
||||
.catch((res) => {
|
||||
this.$message.error("数据异常，请联系管理员...");
|
||||
});
|
||||
},
|
||||
// 设置高亮颜色的
|
||||
fillColor(nodeData) {
|
||||
const canvas = this.bpmnViewer.get('canvas')
|
||||
this.bpmnViewer.getDefinitions().rootElements[0].flowElements.forEach(n => {
|
||||
const completeTask = nodeData.find(m => m.key === n.id)
|
||||
const todoTask = nodeData.find(m => !m.completed)
|
||||
const endTask = nodeData[nodeData.length - 1]
|
||||
if (n.$type === 'bpmn:UserTask') {
|
||||
const canvas = this.bpmnViewer.get("canvas");
|
||||
this.bpmnViewer.getDefinitions().rootElements[0].flowElements.forEach((n) => {
|
||||
const completeTask = nodeData.find((m) => m.key === n.id);
|
||||
const todoTask = nodeData.find((m) => !m.completed);
|
||||
const endTask = nodeData[nodeData.length - 1];
|
||||
if (n.$type === "bpmn:UserTask") {
|
||||
if (completeTask) {
|
||||
canvas.addMarker(n.id, completeTask.completed ? 'highlight' : 'highlight-todo')
|
||||
n.outgoing?.forEach(nn => {
|
||||
const targetTask = nodeData.find(m => m.key === nn.targetRef.id)
|
||||
canvas.addMarker(
|
||||
n.id,
|
||||
completeTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
n.outgoing?.forEach((nn) => {
|
||||
const targetTask = nodeData.find((m) => m.key === nn.targetRef.id);
|
||||
if (targetTask) {
|
||||
if (todoTask && completeTask.key === todoTask.key && !todoTask.completed){
|
||||
canvas.addMarker(nn.id, todoTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(nn.targetRef.id, todoTask.completed ? 'highlight' : 'highlight-todo')
|
||||
if (
|
||||
todoTask &&
|
||||
completeTask.key === todoTask.key &&
|
||||
!todoTask.completed
|
||||
) {
|
||||
canvas.addMarker(
|
||||
nn.id,
|
||||
todoTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
canvas.addMarker(
|
||||
nn.targetRef.id,
|
||||
todoTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
} else {
|
||||
canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(nn.targetRef.id, targetTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(
|
||||
nn.id,
|
||||
targetTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
canvas.addMarker(
|
||||
nn.targetRef.id,
|
||||
targetTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
// 排他网关
|
||||
else if (n.$type === 'bpmn:ExclusiveGateway') {
|
||||
else if (n.$type === "bpmn:ExclusiveGateway") {
|
||||
if (completeTask) {
|
||||
canvas.addMarker(n.id, completeTask.completed ? 'highlight' : 'highlight-todo')
|
||||
n.outgoing?.forEach(nn => {
|
||||
const targetTask = nodeData.find(m => m.key === nn.targetRef.id)
|
||||
canvas.addMarker(
|
||||
n.id,
|
||||
completeTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
n.outgoing?.forEach((nn) => {
|
||||
const targetTask = nodeData.find((m) => m.key === nn.targetRef.id);
|
||||
if (targetTask) {
|
||||
|
||||
canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(nn.targetRef.id, targetTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(
|
||||
nn.id,
|
||||
targetTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
canvas.addMarker(
|
||||
nn.targetRef.id,
|
||||
targetTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
}
|
||||
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
// 并行网关
|
||||
else if (n.$type === 'bpmn:ParallelGateway') {
|
||||
else if (n.$type === "bpmn:ParallelGateway") {
|
||||
if (completeTask) {
|
||||
canvas.addMarker(n.id, completeTask.completed ? 'highlight' : 'highlight-todo')
|
||||
n.outgoing?.forEach(nn => {
|
||||
const targetTask = nodeData.find(m => m.key === nn.targetRef.id)
|
||||
canvas.addMarker(
|
||||
n.id,
|
||||
completeTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
n.outgoing?.forEach((nn) => {
|
||||
const targetTask = nodeData.find((m) => m.key === nn.targetRef.id);
|
||||
if (targetTask) {
|
||||
canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(nn.targetRef.id, targetTask.completed ? 'highlight' : 'highlight-todo')
|
||||
canvas.addMarker(
|
||||
nn.id,
|
||||
targetTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
canvas.addMarker(
|
||||
nn.targetRef.id,
|
||||
targetTask.completed ? "highlight" : "highlight-todo"
|
||||
);
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
else if (n.$type === 'bpmn:StartEvent') {
|
||||
n.outgoing.forEach(nn => {
|
||||
const completeTask = nodeData.find(m => m.key === nn.targetRef.id)
|
||||
} else if (n.$type === "bpmn:StartEvent") {
|
||||
n.outgoing.forEach((nn) => {
|
||||
const completeTask = nodeData.find((m) => m.key === nn.targetRef.id);
|
||||
if (completeTask) {
|
||||
canvas.addMarker(nn.id, 'highlight')
|
||||
canvas.addMarker(n.id, 'highlight')
|
||||
return
|
||||
canvas.addMarker(nn.id, "highlight");
|
||||
canvas.addMarker(n.id, "highlight");
|
||||
return;
|
||||
}
|
||||
})
|
||||
}
|
||||
else if (n.$type === 'bpmn:EndEvent') {
|
||||
});
|
||||
} else if (n.$type === "bpmn:EndEvent") {
|
||||
if (endTask.key === n.id && endTask.completed) {
|
||||
canvas.addMarker(n.id, 'highlight')
|
||||
return
|
||||
canvas.addMarker(n.id, "highlight");
|
||||
return;
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
getDurationDate(val) {
|
||||
// 计算出相差天数
|
||||
let days = Math.floor(val / (24 * 3600 * 1000))
|
||||
let days = Math.floor(val / (24 * 3600 * 1000));
|
||||
// 计算出小时数
|
||||
let leave1 = val % (24 * 3600 * 1000) // 计算天数后剩余的毫秒数
|
||||
let hours = Math.floor(leave1 / (3600 * 1000))
|
||||
let leave1 = val % (24 * 3600 * 1000); // 计算天数后剩余的毫秒数
|
||||
let hours = Math.floor(leave1 / (3600 * 1000));
|
||||
// 计算相差分钟数
|
||||
let leave2 = leave1 % (3600 * 1000) // 计算小时数后剩余的毫秒数
|
||||
let minutes = Math.floor(leave2 / (60 * 1000))
|
||||
let leave2 = leave1 % (3600 * 1000); // 计算小时数后剩余的毫秒数
|
||||
let minutes = Math.floor(leave2 / (60 * 1000));
|
||||
// 计算相差秒数
|
||||
let leave3 = leave2 % (60 * 1000) // 计算分钟数后剩余的毫秒数
|
||||
let seconds = Math.round(leave3 / 1000)
|
||||
let leave3 = leave2 % (60 * 1000); // 计算分钟数后剩余的毫秒数
|
||||
let seconds = Math.round(leave3 / 1000);
|
||||
if (days > 0) {
|
||||
if (days < 10) days = "0" + days;
|
||||
if (hours < 10) hours = "0" + hours;
|
||||
if (minutes < 10) minutes = "0" + minutes;
|
||||
if (seconds < 10) seconds = "0" + seconds;
|
||||
return days + '天' + hours + '小时' + minutes + '分钟' + seconds + '秒';
|
||||
return days + "天" + hours + "小时" + minutes + "分钟" + seconds + "秒";
|
||||
}
|
||||
if (hours > 0) {
|
||||
if (hours < 10) hours = "0" + hours;
|
||||
if (minutes < 10) minutes = "0" + minutes;
|
||||
if (seconds < 10) seconds = "0" + seconds;
|
||||
return hours + '小时' + minutes + '分钟' + seconds + '秒';
|
||||
return hours + "小时" + minutes + "分钟" + seconds + "秒";
|
||||
}
|
||||
if (minutes > 0) {
|
||||
if (minutes < 10) minutes = "0" + minutes;
|
||||
if (seconds < 10) seconds = "0" + seconds;
|
||||
return minutes + '分钟' + seconds + '秒';
|
||||
return minutes + "分钟" + seconds + "秒";
|
||||
}
|
||||
if (seconds > 0) {
|
||||
if (seconds < 10) seconds = "0" + seconds;
|
||||
return seconds + '秒';
|
||||
return seconds + "秒";
|
||||
}
|
||||
},
|
||||
handledownload(url) {
|
||||
|
|
@ -522,7 +703,7 @@ export default {
|
|||
padding-right: 20px;
|
||||
padding-bottom: 20px;
|
||||
.drawerLeft {
|
||||
width: 60%;
|
||||
width: 50%;
|
||||
min-width: 280px;
|
||||
height: 100%;
|
||||
float: left;
|
||||
|
|
@ -531,7 +712,6 @@ export default {
|
|||
padding-right: 20px;
|
||||
.bjs-powered-by {
|
||||
display: none !important;
|
||||
|
||||
}
|
||||
.maskLayer {
|
||||
width: 100%;
|
||||
|
|
@ -542,7 +722,7 @@ export default {
|
|||
}
|
||||
}
|
||||
.drawerRight {
|
||||
width: 40%;
|
||||
width: 50%;
|
||||
min-width: 400px;
|
||||
height: 100%;
|
||||
float: left;
|
||||
|
|
@ -551,7 +731,7 @@ export default {
|
|||
}
|
||||
.containers {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
height: 100px;
|
||||
.canvas {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
|
|
@ -576,7 +756,7 @@ export default {
|
|||
}
|
||||
|
||||
.djs-container svg {
|
||||
min-height: 150px;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.highlight.djs-shape .djs-visual > :nth-child(1) {
|
||||
|
|
@ -618,9 +798,16 @@ export default {
|
|||
padding: 8px 16px;
|
||||
background-color: #f0f9eb;
|
||||
border-radius: 4px;
|
||||
border-left: 5px solid #67C23A;
|
||||
margin: 20px 0;
|
||||
border-left: 5px solid #67c23a;
|
||||
font-size: 13px;
|
||||
margin-top: 30px;
|
||||
margin: 20px 0;
|
||||
}
|
||||
.assetsName .el-breadcrumb__inner {
|
||||
font-weight: 800 !important;
|
||||
color: #409eff !important;
|
||||
}
|
||||
.el-divider .el-divider__text {
|
||||
color: #000000;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -137,7 +137,7 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="接收时间" align="center" prop="createTime" width="160" />
|
||||
<el-table-column label="处理耗时" align="center" prop="duration" width="150">
|
||||
<el-table-column label="办理耗时" align="center" prop="duration" width="150">
|
||||
<template slot-scope="scope">
|
||||
{{getDurationDate(scope.row.duration)}}
|
||||
</template>
|
||||
|
|
@ -250,11 +250,11 @@ export default {
|
|||
},
|
||||
// 跳转到处理页面
|
||||
handleProcess(row) {
|
||||
//if (row.taskName == "提交申请") {
|
||||
if (row.taskName == "提交申请") {
|
||||
this.$refs.editTaskDrawer.show(row);
|
||||
//} else {
|
||||
// this.$refs.approveDrawer.show(row);
|
||||
//}
|
||||
} else {
|
||||
this.$refs.approveDrawer.show(row);
|
||||
}
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
|
|
|
|||
Loading…
Reference in New Issue