From 4dc7cf73a8c3fb9f16729962d873b5cc6bc1b737 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=A7=9C=E7=8E=89=E7=90=A6?= <7507756+jiang_yuqi@user.noreply.gitee.com> Date: Tue, 27 Feb 2024 03:25:36 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../task/todo/detail/approveDrawer.vue | 895 +++++++++++------- .../src/views/flowable/task/todo/index.vue | 10 +- 2 files changed, 546 insertions(+), 359 deletions(-) diff --git a/yanzhu-ui/src/views/flowable/task/todo/detail/approveDrawer.vue b/yanzhu-ui/src/views/flowable/task/todo/detail/approveDrawer.vue index 11ebacc..7436570 100644 --- a/yanzhu-ui/src/views/flowable/task/todo/detail/approveDrawer.vue +++ b/yanzhu-ui/src/views/flowable/task/todo/detail/approveDrawer.vue @@ -6,124 +6,264 @@ ref="drawer" direction="rtl" @close="closeCallBack" - size="80%" + size="70%" >
-
-
-
- - -

{{ getSort(index) }}{{item.taskName}}{{item.commentResult}}

- - - - - {{item.assigneeName}} - {{item.deptName}} - - - - {{item.candidate}} - - - - {{getDeleteReason(item.deleteReason)}} - - - - {{item.startTime}} - - - - {{item.endTime}} - - - - {{getDurationDate(item.duration)}} - - - - {{item.message}} - - - -
-
-
-
- - - {{ initData.projectName }} - - - {{ options.startDeptName }} - - - {{ options.startUserName }} - - - {{ title }} - - -
- {{file.substring(file.lastIndexOf('/')+1)}} -
-
- - {{initData.remark}} - - - - - - - +
+
+ + - - - -
- 任务转办 - 审批通过 - 退回任务 - 驳回上级 +

+ {{ getSort(index) }}{{ item.taskName }}{{ item.commentResult }} +

+ + + + + {{ item.assigneeName }} + {{ item.deptName }} + + + + {{ item.candidate }} + + + + {{ getDeleteReason(item.deleteReason) }} + + + + {{ item.startTime }} + + + + {{ item.endTime }} + + + + {{ getDurationDate(item.duration) }} + + + + {{ item.message }} + + + + + +
+
+ + + {{ initData.parProjName }} + + + {{ initData.projName }} + + + {{ title }} + + + + + + {{ initData.applyReason }} + + +
+ {{ file.substring(file.lastIndexOf("/") + 1) }} +
+
+ + {{ options.createTime }} + + + {{ parseTime(initData.useTime, "{y}-{m}-{d} {h}:{i}") }} + + 申请明细信息 + + + + + + + + + + + + 申请办理信息 + + + + + + + + + +
+ 任务委派 + 任务转办 + 审批通过 + 退回任务 + 驳回上级 +
+
+
+

+ “任务委派” + 操作后,由指定人跟进处理,处理完成后继续由您进行审批。 +

+

+ “任务转办” + 操作后,任务由指定人进行处理。 +

+

+ “审批通过” + 操作后,代表您对当前任务满意,任务进入下一阶段。 +

+

+ “退回任务” + 操作后,代表您对当前任务不满意,任务进入您选择的阶段或退回给申请人重新申请。 +

+

+ “驳回上级” + 操作后,代表您对当前任务不满意,任务退回到上一阶段继续处理。 +

+
+ +
- -
-

“审批通过” 操作后,代表您对当前任务满意,任务进入下一阶段。

-

“退回任务” 操作后,代表您对当前任务不满意,任务进入您选择的阶段,或者直接退回给申请人重新申请。

-

“驳回上级” 操作后,代表您对当前任务不满意,任务退回到上一阶段继续处理。

-
-
@@ -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: { @@ -150,7 +292,7 @@ export default { loading: false, // 标题 title: "", - jdtitle:"", + jdtitle: "", // 表单参数 form: {}, // 表单校验 @@ -164,20 +306,17 @@ export default { }, ], }, - queryParams:{ - nickName:null, - phonenumber:null, - }, bpmnViewer: null, options: {}, flowRecordList: [], - showjd:false, + showjd: false, //label样式 - labelStyle: { width: "180px" }, - initData:{}, - returnTaskList: [], // 回退列表数据 - returnTask:false, - returnTaskBtn:false + labelStyle: { width: "160px" }, + initData: {}, + returnTaskList: [], // 回退列表数据 + returnTask: false, + returnTaskBtn: false, + showAssetsVersion: false, }; }, computed: {}, @@ -190,21 +329,23 @@ export default { handlePass() { this.$refs["form"].validate((valid) => { if (valid) { - this.$confirm('是否确认审批通过当前流程申请?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' - }).then(() => { - this.loading=true; - complete(this.form).then(res => { - this.$modal.msgSuccess("任务审批成功"); - this.loading = false; - //关闭并刷新列表 - this.$refs.drawer.closeDrawer(); + this.$confirm("是否确认审批通过当前流程申请?", "提示", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning", + }) + .then(() => { + this.loading = true; + complete(this.form).then((res) => { + this.$modal.msgSuccess("任务审批成功"); + this.loading = false; + //关闭并刷新列表 + this.$refs.drawer.closeDrawer(); + }); + }) + .catch(() => { + console.log("取消操作"); }); - }).catch(() => { - console.log("取消操作"); - }); } }); }, @@ -212,82 +353,86 @@ export default { handleReject() { this.$refs["form"].validate((valid) => { if (valid) { - this.$confirm('是否确认审批驳回当前流程申请?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' - }).then(() => { - this.loading=true; - rejectTask(this.form).then(res => { - this.$modal.msgSuccess("任务驳回成功"); - this.loading = false; - //关闭并刷新列表 - this.$refs.drawer.closeDrawer(); + this.$confirm("是否确认审批驳回当前流程申请?", "提示", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning", + }) + .then(() => { + this.loading = true; + rejectTask(this.form).then((res) => { + this.$modal.msgSuccess("任务驳回成功"); + this.loading = false; + //关闭并刷新列表 + this.$refs.drawer.closeDrawer(); + }); + }) + .catch(() => { + console.log("取消操作"); }); - }).catch(() => { - console.log("取消操作"); - }); } }); }, /** 退回任务 */ - handleBack(){ - if(!this.returnTask){ - this.returnTask=true; + handleBack() { + if (!this.returnTask) { + this.returnTask = true; this.$modal.msgWarning("请选择退回节点"); return; } this.$refs["form"].validate((valid) => { if (valid) { - if(!this.form.targetKey){ + if (!this.form.targetKey) { this.$modal.msgWarning("请选择退回节点"); return; } - this.$confirm('是否确认退回当前流程申请?', '提示', { - confirmButtonText: '确定', - cancelButtonText: '取消', - type: 'warning' - }).then(() => { - this.loading=true; - returnTask(this.form).then(res => { - this.$modal.msgSuccess("任务退回成功"); - this.loading = false; - //关闭并刷新列表 - this.$refs.drawer.closeDrawer(); + this.$confirm("是否确认退回当前流程申请?", "提示", { + confirmButtonText: "确定", + cancelButtonText: "取消", + type: "warning", + }) + .then(() => { + this.loading = true; + returnTask(this.form).then((res) => { + this.$modal.msgSuccess("任务退回成功"); + this.loading = false; + //关闭并刷新列表 + this.$refs.drawer.closeDrawer(); + }); + }) + .catch(() => { + console.log("取消操作"); }); - }).catch(() => { - console.log("取消操作"); - }); } }); }, - initReturnList(){ - returnList(this.form).then(res => { + initReturnList() { + returnList(this.form).then((res) => { this.returnTaskList = res.data; //退回节点>1时,可显示退回按钮 - if(res.data.length>1){ - this.returnTaskBtn=true; + 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; - this.returnTask=false; - this.returnTaskBtn=false; + initFormDate() { + 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{ + } else { return "el-icon-check"; } } else { @@ -296,10 +441,9 @@ export default { }, setColor(row) { if (row.endTime) { - if(row.commentResult=="驳回") - { + if (row.commentResult == "驳回") { return "#f56c6c"; - }else{ + } else { return "#2bc418"; } } else { @@ -318,26 +462,33 @@ 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="进行中"; - this.showjd=true; - }else if(options.finishTime!=null && options.assigneeId==null){ - this.jdtitle="已撤销"; - }else{ - this.jdtitle="已完成"; + if (options.finishTime == null) { + this.jdtitle = "进行中"; + this.showjd = true; + } else if (options.finishTime != null && options.assigneeId == null) { + this.jdtitle = "已撤销"; + } else { + this.jdtitle = "已完成"; } this.getFlowRecordList(options.procInsId, options.deployId); - this.getFormDatasList(options.procInsId, options.deployId); - flowXmlAndNode({ procInsId:options.procInsId, deployId: options.deployId }).then((res) => { - this.initFlowImage(res.data); - }); + this.getFormDatasList(options.businessKey); + flowXmlAndNode({ procInsId: options.procInsId, deployId: options.deployId }).then( + (res) => { + this.initFlowImage(res.data); + } + ); }, async initFlowImage(data) { const self = this; @@ -349,8 +500,8 @@ export default { await self.bpmnViewer.importXML(data.xmlData); // 自适应 self.bpmnViewer.get("canvas").zoom("fit-viewport", "auto"); - if (data.nodeData !==undefined && data.nodeData.length > 0 ) { - self.fillColor(data.nodeData) + if (data.nodeData !== undefined && data.nodeData.length > 0) { + self.fillColor(data.nodeData); } } catch (err) { console.error(err.message, err.warnings); @@ -365,148 +516,178 @@ export default { // }).catch(res => { // this.$message.error("数据异常,请联系管理员..."); // }) - const that = this - const params = {procInsId: procInsId} - findCommentByProcInsId(params).then(res => { - that.flowRecordList = res.data; - }).catch(res => { - this.$message.error("数据异常,请联系管理员..."); - }) + const that = this; + const params = { procInsId: procInsId }; + findCommentByProcInsId(params) + .then((res) => { + that.flowRecordList = res.data; + }) + .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 => { - this.initData = res.data; - this.initData.files = res.data.files.split(','); - }).catch(res => { - this.$message.error("数据异常,请联系管理员..."); - }) + getFormDatasList(businessKey) { + getProjectApply(businessKey) + .then((res) => { + if (res.code == 200) { + this.initData = res.data; + } 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') - }else { - canvas.addMarker(nn.id, targetTask.completed ? 'highlight' : 'highlight-todo') - canvas.addMarker(nn.targetRef.id, targetTask.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" + ); } } - }) + }); } } // 排他网关 - 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){ + 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) - 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 + '秒'; + 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 + "秒"; } - 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 + '秒'; + 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 + "秒"; } - if(minutes>0){ - if(minutes<10) minutes = "0"+minutes; - if(seconds<10) seconds = "0"+seconds; - return minutes + '分钟' + seconds + '秒'; + if (minutes > 0) { + if (minutes < 10) minutes = "0" + minutes; + if (seconds < 10) seconds = "0" + seconds; + return minutes + "分钟" + seconds + "秒"; } - if(seconds>0){ - if(seconds<10) seconds = "0"+seconds; - return seconds + '秒'; + if (seconds > 0) { + if (seconds < 10) seconds = "0" + seconds; + return seconds + "秒"; } }, - handledownload(url){ + handledownload(url) { this.$download.resource(url); }, - getDeleteReason(val){ - val = val.replace("Change activity to ",""); + getDeleteReason(val) { + val = val.replace("Change activity to ", ""); let flowRecordList = this.flowRecordList; - for(let i=0;i diff --git a/yanzhu-ui/src/views/flowable/task/todo/index.vue b/yanzhu-ui/src/views/flowable/task/todo/index.vue index 871f359..6403256 100644 --- a/yanzhu-ui/src/views/flowable/task/todo/index.vue +++ b/yanzhu-ui/src/views/flowable/task/todo/index.vue @@ -137,7 +137,7 @@ - + @@ -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() {