From ba61d95e7367745913a0c85d45416578d8d66e31 Mon Sep 17 00:00:00 2001 From: luohairen <3399054449@qq.com> Date: 星期二, 17 十二月 2024 17:47:11 +0800 Subject: [PATCH] 优化 --- src/views/flowable/task/myProcess/send/index.vue | 167 ++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 140 insertions(+), 27 deletions(-) diff --git a/src/views/flowable/task/myProcess/send/index.vue b/src/views/flowable/task/myProcess/send/index.vue index 46eb4be..bf6e5f4 100644 --- a/src/views/flowable/task/myProcess/send/index.vue +++ b/src/views/flowable/task/myProcess/send/index.vue @@ -2,18 +2,29 @@ <div class="app-container"> <el-card class="box-card" > <div slot="header" class="clearfix"> - <span class="el-icon-document">鍙戣捣浠诲姟</span> + <span class="el-icon-document">{{`娴佺▼澶勭悊锛歚 + processName}}</span> <el-button style="float: right;" size="mini" type="danger" @click="goBack">鍏抽棴</el-button> </div> <el-tabs tab-position="top" v-model="activeName" @tab-click="handleClick"> <!--琛ㄥ崟淇℃伅--> <el-tab-pane label="琛ㄥ崟淇℃伅" name="1"> <!--鍒濆鍖栨祦绋嬪姞杞借〃鍗曚俊鎭�--> - <el-col :span="16" :offset="4"> - <v-form-render :form-data="formRenderData" ref="vFormRef"/> - <div style="margin-left:15%;margin-bottom: 20px;font-size: 14px;"> - <el-button type="primary" @click="submitForm">鎻� 浜�</el-button> - <el-button type="primary" @click="resetForm">閲� 缃�</el-button> + <el-col :span="16" :offset="4" v-if="formDataList && formDataList.length > 0"> + <div v-for="(formDataObj, index) in formDataList" :key="index" class="form-warp" style="position: relative"> + <div v-if="!formDataObj.current" style="position: absolute; top: 2px; right: 2px"> + <el-button type="danger" @click="openRejectTask(formDataObj.beforeNodeDefId)">椹冲洖</el-button> + </div> + <div v-if="formDataObj.current" style="margin-bottom: 15px;color: #409eff">褰撳墠闃舵锛�<span style="color: red">{{formDataObj.beforeNodeName}}</span></div> + <div v-else style="margin-bottom: 15px;color: #409eff">鍓嶇疆闃舵锛�<span style="color: #d5904b">{{formDataObj.beforeNodeName}}</span></div> + <v-form-render :form-data="formDataObj.formJson" :ref="'form' + index"/> + </div> + +<!-- <v-form-render :form-data="formRenderData" ref="vFormRef"/>--> + <div style="display: flex;justify-content: center; align-items: center; margin: 20px 0"> + <el-button type="primary" @click="submitForm">纭骞舵彁浜�</el-button> + <el-button type="primary" disabled @click="submitForm">鍗忓悓鍔炵悊(鍔熻兘寮�鍙戜腑)</el-button> + <el-button type="primary" disabled @click="submitForm">杞氦浠栦汉鍔炵悊(鍔熻兘寮�鍙戜腑)</el-button> +<!-- <el-button type="primary" @click="resetForm">閲� 缃�</el-button>--> </div> </el-col> </el-tab-pane> @@ -32,16 +43,40 @@ </span> </el-dialog> </el-card> + + + <el-dialog + :title="`椹冲洖锛歚 + rejectForm.projectName" + :visible.sync="rejectShow" + width="950px" + :destroy-on-close="true" + :close-on-click-modal="false" + > + <div> + <el-input + type="textarea" + :rows="3" + placeholder="瀹℃牳寤鸿" + v-model="rejectForm.auditOpinion"> + </el-input> + </div> + <div> + <el-button type="danger" size="small" @click="rejectTask">椹冲洖</el-button> + </div> + </el-dialog> + </div> </template> <script> import {definitionStart, flowXmlAndNode} from "@/api/flowable/definition"; import BpmnViewer from '@/components/Process/viewer'; -import {flowFormData} from "@/api/flowable/process"; +import {completeSubmitFormTask} from "@/api/flowable/process"; +import { flowTaskForm } from "@/api/flowable/todo"; import {getNextFlowNodeByStart} from "@/api/flowable/todo"; import FlowUser from '@/components/flow/User' import FlowRole from '@/components/flow/Role' +import {rejectTask} from "@/api/projectProcess/projectProcess"; export default { name: "Record", @@ -53,6 +88,11 @@ props: {}, data() { return { + rejectShow: false, + goBackParams: {}, + formDataList: [], // 琛ㄥ崟鍒楄〃 + taskId: '', + processName: '', // 妯″瀷xml鏁版嵁 flowData: {}, activeName: '1', // 鍒囨崲tab鏍囩 @@ -65,6 +105,7 @@ deployId: "", // 娴佺▼瀹氫箟缂栧彿 procDefId: "", // 娴佺▼瀹炰緥缂栧彿 formRenderData: {}, + formRenderDataList: [], variables: [], // 娴佺▼鍙橀噺鏁版嵁 taskTitle: null, taskOpen: false, @@ -74,17 +115,36 @@ checkValues: null, // 閫変腑浠诲姟鎺ユ敹浜哄憳鏁版嵁 formData: {}, // 濉啓鐨勮〃鍗曟暟鎹�, multiInstanceVars: '', // 浼氱鑺傜偣 - formJson: {} // 琛ㄥ崟json + formJson: {}, // 琛ㄥ崟json + rejectForm: { + auditOpinion: '', // 瀹℃牳鎰忚 + taskId: '', + rejectedTaskDefKey: '' // 琚┏鍥炵殑浠诲姟key + } }; }, - created() { + mounted() { + this.processName = this.$route.query && this.$route.query.processName; this.deployId = this.$route.query && this.$route.query.deployId; + this.taskId = this.$route.query && this.$route.query.taskId; // 鍒濆鍖栬〃鍗� this.procDefId = this.$route.query && this.$route.query.procDefId; + this.goBackParams = this.$route.query && this.$route.query.goBackParams; // this.getNextFlowNodeByStart(this.deployId); - this.getFlowFormData(this.deployId); + this.getFlowFormData(this.taskId); }, methods: { + rejectTask() { + rejectTask(this.rejectForm).then(res => { + this.rejectShow = false + this.$message.success("椹冲洖鎴愬姛") + }) + }, + openRejectTask(rejectedTaskDefKey) { + this.rejectForm.rejectedTaskDefKey = rejectedTaskDefKey; + this.rejectForm.taskId = this.taskId; + this.rejectShow = true + }, handleClick(tab, event) { if (tab.name === '2'){ flowXmlAndNode({deployId:this.deployId}).then(res => { @@ -93,28 +153,62 @@ } }, /** 娴佺▼琛ㄥ崟鏁版嵁 */ - getFlowFormData(deployId) { - const params = {deployId: deployId} - flowFormData(params).then(res => { - // 娴佺▼杩囩▼涓笉瀛樺湪鍒濆鍖栬〃鍗� 鐩存帴璇诲彇鐨勬祦绋嬪彉閲忎腑瀛樺偍鐨勮〃鍗曞�� - this.$nextTick(() => { - // 鍥炴樉鏁版嵁 - this.$refs.vFormRef.setFormJson(res.data); - this.formJson = res.data; - }) + getFlowFormData(taskId) { + const params = {taskId: taskId} + flowTaskForm(params).then(res => { + this.formDataList = res.data + if (this.formDataList && this.formDataList.length > 0) { + this.$nextTick(() => { + this.formDataList.forEach((formDataObj, index) => { + console.log("琛ㄥ崟鏁版嵁鍒楄〃", formDataObj.formJson) + let that = this + console.log(eval("that.$refs.form" +index)[0]) + eval("that.$refs.form" +index)[0].setFormJson(formDataObj.formJsonObj.formJson); + + eval("that.$refs.form" +index)[0].setFormData(formDataObj.formJsonObj); + }) + this.formJson = this.formDataList[0].formJsonObj.formJson + }) + + } + // if (res.data.formJson) { + // // 鍥炴樉琛ㄥ崟 + // this.$refs.vFormRef.setFormJson(res.data.formJson); + // this.formJson = res.data.formJson; + // this.$nextTick(() => { + // // 鍔犺浇琛ㄥ崟濉啓鐨勬暟鎹� + // this.$refs.vFormRef.setFormData(res.data); + // // this.$nextTick(() => { + // // // 琛ㄥ崟绂佺敤 + // // this.$refs.vFormRef.disableForm(); + // // }) + // }) + // } else { + // this.$nextTick(() => { + // // 鍥炴樉鏁版嵁 + // this.$refs.vFormRef.setFormJson(res.data); + // this.formJson = res.data; + // }) + // } }).catch(res => { + console.log("鎶ラ敊浜嗭細", res) this.goBack(); }) }, /** 杩斿洖椤甸潰 */ goBack() { - // 鍏抽棴褰撳墠鏍囩椤靛苟杩斿洖涓婁釜椤甸潰 - const obj = { path: "/task/process", query: { t: Date.now()} }; - this.$tab.closeOpenPage(obj); + this.$router.push({ + path: '/projectFlow/detail', + query: { + projectId: this.goBackParams.projectId, + processDefId: this.goBackParams.processDefId + } + }) }, /** 鐢宠娴佺▼琛ㄥ崟鏁版嵁鎻愪氦 */ submitForm() { - this.$refs.vFormRef.getFormData().then(formData => { + let that = this + eval("that.$refs.form" +0)[0].getFormData().then(formData => { // 鏍规嵁褰撳墠浠诲姟鎴栬�呮祦绋嬭璁¢厤缃殑涓嬩竴姝ヨ妭鐐� todo 鏆傛椂鏈秹鍙婂埌鑰冭檻缃戝叧銆佽〃杈惧紡鍜屽鑺傜偣鎯呭喌 getNextFlowNodeByStart({deploymentId: this.deployId, variables: formData}).then(res => { const data = res.data; @@ -144,11 +238,16 @@ } // 澶嶅埗瀵硅薄鐨勫睘鎬у�肩粰鏂扮殑瀵硅薄 Object.assign(param, formData); - // 鍚姩娴佺▼骞跺皢琛ㄥ崟鏁版嵁鍔犲叆娴佺▼鍙橀噺 - definitionStart(this.procDefId, param).then(res => { + // 瀹屾垚浠诲姟 + completeSubmitFormTask(this.taskId, param).then(res => { this.$modal.msgSuccess(res.msg); this.goBack(); }) + // // 鍚姩娴佺▼骞跺皢琛ㄥ崟鏁版嵁鍔犲叆娴佺▼鍙橀噺 + // definitionStart(this.procDefId, param).then(res => { + // this.$modal.msgSuccess(res.msg); + // this.goBack(); + // }) } } } @@ -182,11 +281,16 @@ } else { this.$set(param, "approval", this.checkValues); } - // 鍚姩娴佺▼骞跺皢琛ㄥ崟鏁版嵁鍔犲叆娴佺▼鍙橀噺 - definitionStart(this.procDefId, param).then(res => { + // 瀹屾垚浠诲姟 + completeSubmitFormTask(this.taskId, param).then(res => { this.$modal.msgSuccess(res.msg); this.goBack(); }) + // // 鍚姩娴佺▼骞跺皢琛ㄥ崟鏁版嵁鍔犲叆娴佺▼鍙橀噺 + // definitionStart(this.procDefId, param).then(res => { + // this.$modal.msgSuccess(res.msg); + // this.goBack(); + // }) } }, // 鐢ㄦ埛淇℃伅閫変腑鏁版嵁 @@ -246,4 +350,13 @@ .my-label { background: #E1F3D8; } + +.form-warp { + padding: 20px; + margin-bottom: 20px; + box-shadow: + inset 0 -3em 3em rgba(0, 0, 0, 0.1), + 0 0 0 2px rgb(239, 239, 239), + 0.3em 0.3em 1em rgba(0, 0, 0, 0.3); +} </style> -- Gitblit v1.8.0