【修改】OA请假示例审批页面异常处理

yudao-module-bpm/yudao-module-bpm-biz/src/main/java/cn/iocoder/yudao/module/bpm/controller/admin/definition/BpmProcessDefinitionController.java

@@ -111,4 +111,14 @@ public class BpmProcessDefinitionController {
                 processDefinition, null, null, null, null, bpmnModel, userTaskList));
     }
 
+    @GetMapping ("/get-bpmn-xml")
+    @Operation(summary = "获得流程定义的 BPMN XML")
+    @Parameter(name = "id", description = "编号", required = true, example = "1024")
+    @PreAuthorize("@ss.hasPermission('bpm:process-definition:query')")
+    public CommonResult<String>
+    getProcessDefinitionBpmnXML(@RequestParam("id") String id) {
+        String bpmnXML = processDefinitionService.getProcessDefinitionBpmnXML(id);
+        return success(bpmnXML);
+    }
+
 }

yudao-module-bpm/yudao-module-bpm-biz/src/main/java/cn/iocoder/yudao/module/bpm/service/definition/BpmProcessDefinitionService.java

@@ -186,4 +186,11 @@ public interface BpmProcessDefinitionService {
     BpmProcessDefinitionExtDO getProcessDefinitionExt(String id);
 
 
+    /**
+     * 获得流程定义对应的 BPMN XML
+     *
+     * @param id 流程定义编号
+     * @return BPMN XML
+     */
+    String getProcessDefinitionBpmnXML(String id);
 }

yudao-module-bpm/yudao-module-bpm-biz/src/main/java/cn/iocoder/yudao/module/bpm/service/definition/BpmProcessDefinitionServiceImpl.java

@@ -260,5 +260,14 @@ public class BpmProcessDefinitionServiceImpl implements BpmProcessDefinitionServ
         return converter.convertToBpmnModel(new BytesStreamSource(bpmnBytes), true, true);
     }
 
+    @Override
+    public String getProcessDefinitionBpmnXML(String id) {
+        BpmnModel bpmnModel = repositoryService.getBpmnModel(id);
+        if (bpmnModel == null) {
+            return null;
+        }
+        BpmnXMLConverter converter = new BpmnXMLConverter();
+        return StrUtil.utf8Str(converter.convertToXML(bpmnModel));
+    }
 
 }

yudao-ui/yudao-ui-admin-vue2/.env.dev

@@ -5,8 +5,8 @@ ENV = 'development'
 VUE_APP_TITLE = 芋道管理系统
 
 # 芋道管理系统/开发环境
-VUE_APP_BASE_API = 'http://localhost:48080'
-# VUE_APP_BASE_API = 'http://192.168.100.249:48080'
+# VUE_APP_BASE_API = 'http://localhost:48080'
+ VUE_APP_BASE_API = 'http://192.168.100.249:48080'
 # VUE_APP_BASE_API = 'http://192.168.100.234:48080'
 
 

yudao-ui/yudao-ui-admin-vue2/package.json

@@ -109,4 +109,4 @@
     "> 1%",
     "last 2 versions"
   ]
-}
+}

yudao-ui/yudao-ui-admin-vue2/src/components/bpmnProcessDesigner/package/designer/ProcessViewer.vue

@@ -233,10 +233,6 @@ export default {
         return 'highlight-reject';
       } else if (result === 4) { // 已取消
         return 'highlight-cancel';
-      } else if (result === 5) { // 已退回
-        return 'highlight-back';
-      } else if (result === 6) { // 已委派
-        return 'highlight-todo';
       }
       return '';
     },
@@ -479,33 +475,7 @@ export default {
 :deep(.highlight-cancel.djs-connection > .djs-visual > path) {
   stroke: grey !important;
 }
-/**驳回 */
-.highlight-back.djs-connection > .djs-visual > path {
-  stroke: #FFBA00 !important;
-  stroke-dasharray: 4px !important;
-  fill-opacity: 0.2 !important;
-}
-
-.highlight-back.djs-shape .djs-visual > :nth-child(1) {
-  fill: #FFBA00 !important;
-  stroke: #FFBA00 !important;
-  stroke-dasharray: 4px !important;
-  fill-opacity: 0.2 !important;
-}
 
-:deep(.highlight-back.djs-connection > .djs-visual > path) {
-  stroke: #FFBA00 !important;
-  stroke-dasharray: 4px !important;
-  fill-opacity: 0.2 !important;
-  marker-end: url(#sequenceflow-end-_E7DFDF-_E7DFDF-803g1kf6zwzmcig1y2ulm5egr);
-}
-
-:deep(.highlight-back.djs-shape .djs-visual > :nth-child(1)) {
-  fill: #FFBA00 !important;
-  stroke: #FFBA00 !important;
-  stroke-dasharray: 4px !important;
-  fill-opacity: 0.2 !important;
-}
 .element-overlays {
   box-sizing: border-box;
   padding: 8px;

yudao-ui/yudao-ui-admin-vue2/src/views/bpm/processInstance/detail.vue

@@ -1,50 +1,112 @@
 <template>
   <div class="app-container">
     <!-- 审批信息 -->
-    <el-card class="box-card" v-loading="processInstanceLoading" v-for="(item, index) in runningTasks" :key="index">
+    <el-card
+      class="box-card"
+      v-loading="processInstanceLoading"
+      v-for="(item, index) in runningTasks"
+      :key="index"
+    >
       <div slot="header" class="clearfix">
         <span class="el-icon-picture-outline">审批任务【{{ item.name }}】</span>
       </div>
       <el-col :span="16" :offset="6">
-        <el-form :ref="'form' + index" :model="auditForms[index]" :rules="auditRule" label-width="100px">
-          <el-form-item label="流程名" v-if="processInstance && processInstance.name">
+        <el-form
+          :ref="'form' + index"
+          :model="auditForms[index]"
+          :rules="auditRule"
+          label-width="100px"
+        >
+          <el-form-item
+            label="流程名"
+            v-if="processInstance && processInstance.name"
+          >
             {{ processInstance.name }}
           </el-form-item>
-          <el-form-item label="流程发起人" v-if="processInstance && processInstance.startUser">
+          <el-form-item
+            label="流程发起人"
+            v-if="processInstance && processInstance.startUser"
+          >
             {{ processInstance.startUser.nickname }}
-            <el-tag type="info" size="mini">{{ processInstance.startUser.deptName }}</el-tag>
+            <el-tag type="info" size="mini">{{
+              processInstance.startUser.deptName
+            }}</el-tag>
           </el-form-item>
           <el-form-item label="审批建议" prop="reason">
-            <el-input type="textarea" v-model="auditForms[index].reason" placeholder="请输入审批建议"/>
+            <el-input
+              type="textarea"
+              v-model="auditForms[index].reason"
+              placeholder="请输入审批建议"
+            />
           </el-form-item>
         </el-form>
-        <div style="margin-left: 10%; margin-bottom: 20px; font-size: 14px;">
-          <el-button icon="el-icon-edit-outline" type="success" size="mini" @click="handleAudit(item, true)">通过
-          </el-button>
-          <el-button icon="el-icon-circle-close" type="danger" size="mini" @click="handleAudit(item, false)">不通过
-          </el-button>
-          <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleUpdateAssignee(item)">转办
-          </el-button>
-          <el-button icon="el-icon-edit-outline" type="primary" size="mini" @click="handleDelegate(item)">委派
-          </el-button>
-          <el-button icon="el-icon-refresh-left" type="warning" size="mini" @click="handleBackList(item)">退回
-          </el-button>
+        <div style="margin-left: 10%; margin-bottom: 20px; font-size: 14px">
+          <el-button
+            icon="el-icon-edit-outline"
+            type="success"
+            size="mini"
+            @click="handleAudit(item, true)"
+            >通过</el-button
+          >
+          <el-button
+            icon="el-icon-circle-close"
+            type="danger"
+            size="mini"
+            @click="handleAudit(item, false)"
+            >不通过</el-button
+          >
+          <el-button
+            icon="el-icon-edit-outline"
+            type="primary"
+            size="mini"
+            @click="handleUpdateAssignee(item)"
+            >转办</el-button
+          >
+          <el-button
+            icon="el-icon-edit-outline"
+            type="primary"
+            size="mini"
+            @click="handleDelegate(item)"
+            >委派</el-button
+          >
+          <el-button
+            icon="el-icon-refresh-left"
+            type="warning"
+            size="mini"
+            @click="handleBack(item)"
+            >退回</el-button
+          >
         </div>
       </el-col>
     </el-card>
     <!-- 申请信息 -->
     <el-card class="box-card" v-loading="processInstanceLoading">
       <div slot="header" class="clearfix">
-        <span class="el-icon-document">申请信息【{{ processInstance.name }}】</span>
+        <span class="el-icon-document"
+          >申请信息【{{ processInstance.name }}】</span
+        >
       </div>
-      <el-col v-if="this.processInstance.processDefinition && this.processInstance.processDefinition.formType === 10"
-              :span="16" :offset="6">
+      <el-col
+        v-if="
+          this.processInstance.processDefinition &&
+          this.processInstance.processDefinition.formType === 10
+        "
+        :span="16"
+        :offset="6"
+      >
         <div>
-          <parser :key="new Date().getTime()" :form-conf="detailForm"/>
+          <parser :key="new Date().getTime()" :form-conf="detailForm" />
         </div>
       </el-col>
-      <div v-if="this.processInstance.processDefinition && this.processInstance.processDefinition.formType === 20">
-        <async-biz-form-component :id="this.processInstance.businessKey"></async-biz-form-component>
+      <div
+        v-if="
+          this.processInstance.processDefinition &&
+          this.processInstance.processDefinition.formType === 20
+        "
+      >
+        <async-biz-form-component
+          :id="this.processInstance.businessKey"
+        ></async-biz-form-component>
       </div>
     </el-card>
 
@@ -56,25 +118,55 @@
       <el-col :span="16" :offset="4">
         <div class="block">
           <el-timeline>
-            <el-timeline-item v-for="(item, index) in tasks" :key="index"
-                              :icon="getTimelineItemIcon(item)" :type="getTimelineItemType(item)">
+            <el-timeline-item
+              v-for="(item, index) in tasks"
+              :key="index"
+              :icon="getTimelineItemIcon(item)"
+              :type="getTimelineItemType(item)"
+            >
               <p style="font-weight: 700">任务：{{ item.name }}</p>
               <el-card :body-style="{ padding: '10px' }">
-                <label v-if="item.assigneeUser" style="font-weight: normal; margin-right: 30px;">
+                <label
+                  v-if="item.assigneeUser"
+                  style="font-weight: normal; margin-right: 30px"
+                >
                   审批人：{{ item.assigneeUser.nickname }}
-                  <el-tag type="info" size="mini">{{ item.assigneeUser.deptName }}</el-tag>
+                  <el-tag type="info" size="mini">{{
+                    item.assigneeUser.deptName
+                  }}</el-tag>
+                </label>
+                <label style="font-weight: normal" v-if="item.createTime"
+                  >创建时间：</label
+                >
+                <label style="color: #8a909c; font-weight: normal">{{
+                  parseTime(item.createTime)
+                }}</label>
+                <label
+                  v-if="item.endTime"
+                  style="margin-left: 30px; font-weight: normal"
+                  >审批时间：</label
+                >
+                <label
+                  v-if="item.endTime"
+                  style="color: #8a909c; font-weight: normal"
+                >
+                  {{ parseTime(item.endTime) }}</label
+                >
+                <label
+                  v-if="item.durationInMillis"
+                  style="margin-left: 30px; font-weight: normal"
+                  >耗时：</label
+                >
+                <label
+                  v-if="item.durationInMillis"
+                  style="color: #8a909c; font-weight: normal"
+                >
+                  {{ getDateStar(item.durationInMillis) }}
                 </label>
-                <label style="font-weight: normal" v-if="item.createTime">创建时间：</label>
-                <label style="color:#8a909c; font-weight: normal">{{ parseTime(item.createTime) }}</label>
-                <label v-if="item.endTime" style="margin-left: 30px;font-weight: normal">审批时间：</label>
-                <label v-if="item.endTime" style="color:#8a909c;font-weight: normal"> {{
-                    parseTime(item.endTime)
-                  }}</label>
-                <label v-if="item.durationInMillis" style="margin-left: 30px;font-weight: normal">耗时：</label>
-                <label v-if="item.durationInMillis" style="color:#8a909c;font-weight: normal">
-                  {{ getDateStar(item.durationInMillis) }} </label>
                 <p v-if="item.reason">
-                  <el-tag :type="getTimelineItemType(item)">{{ item.reason }}</el-tag>
+                  <el-tag :type="getTimelineItemType(item)">{{
+                    item.reason
+                  }}</el-tag>
                 </p>
               </el-card>
             </el-timeline-item>
@@ -88,48 +180,113 @@
       <div slot="header" class="clearfix">
         <span class="el-icon-picture-outline">流程图</span>
       </div>
-      <my-process-viewer key="designer" v-model="bpmnXML" v-bind="bpmnControlForm" :activityData="activityList"
-                         :processInstanceData="processInstance" :taskData="tasks"/>
+      <my-process-viewer
+        key="designer"
+        v-model="bpmnXML"
+        v-bind="bpmnControlForm"
+        :activityData="activityList"
+        :processInstanceData="processInstance"
+        :taskData="tasks"
+      />
     </el-card>
 
     <!-- 对话框(转办审批人) -->
-    <el-dialog title="转办审批人" :visible.sync="updateAssignee.open" width="500px" append-to-body>
-      <el-form ref="updateAssigneeForm" :model="updateAssignee.form" :rules="updateAssignee.rules" label-width="110px">
+    <el-dialog
+      title="转办审批人"
+      :visible.sync="updateAssignee.open"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="updateAssigneeForm"
+        :model="updateAssignee.form"
+        :rules="updateAssignee.rules"
+        label-width="110px"
+      >
         <el-form-item label="新审批人" prop="assigneeUserId">
-          <el-select v-model="updateAssignee.form.assigneeUserId" clearable style="width: 100%">
-            <el-option v-for="item in userOptions" :key="parseInt(item.id)" :label="item.nickname"
-                       :value="parseInt(item.id)"/>
+          <el-select
+            v-model="updateAssignee.form.assigneeUserId"
+            clearable
+            style="width: 100%"
+          >
+            <el-option
+              v-for="item in userOptions"
+              :key="parseInt(item.id)"
+              :label="item.nickname"
+              :value="parseInt(item.id)"
+            />
           </el-select>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitUpdateAssigneeForm">确 定</el-button>
+        <el-button type="primary" @click="submitUpdateAssigneeForm"
+          >确 定</el-button
+        >
         <el-button @click="cancelUpdateAssigneeForm">取 消</el-button>
       </div>
     </el-dialog>
     <!-- 对话框(委派审批人) -->
-    <el-dialog title="委派审批人" :visible.sync="updateDelegate.open" width="500px" append-to-body>
-      <el-form ref="updateDelegateForm" :model="updateDelegate.form" :rules="updateDelegate.rules" label-width="110px">
+    <el-dialog
+      title="委派审批人"
+      :visible.sync="updateDelegate.open"
+      width="500px"
+      append-to-body
+    >
+      <el-form
+        ref="updateDelegateForm"
+        :model="updateDelegate.form"
+        :rules="updateDelegate.rules"
+        label-width="110px"
+      >
         <el-form-item label="新审批人" prop="assigneeUserId">
-          <el-select v-model="updateDelegate.form.delegateUserId" clearable style="width: 100%">
-            <el-option v-for="item in userOptions" :key="parseInt(item.id)" :label="item.nickname"
-                       :value="parseInt(item.id)"/>
+          <el-select
+            v-model="updateDelegate.form.delegateUserId"
+            clearable
+            style="width: 100%"
+          >
+            <el-option
+              v-for="item in userOptions"
+              :key="parseInt(item.id)"
+              :label="item.nickname"
+              :value="parseInt(item.id)"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="委派理由" prop="reason">
-          <el-input v-model="updateDelegate.form.reason" clearable placeholder="请输入委派理由"/>
+          <el-input
+            v-model="updateDelegate.form.reason"
+            clearable
+            placeholder="请输入委派理由"
+          />
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitUpdateDelegateForm">确 定</el-button>
+        <el-button type="primary" @click="submitUpdateDelegateForm"
+          >确 定</el-button
+        >
         <el-button @click="cancelUpdateDelegateForm">取 消</el-button>
       </div>
     </el-dialog>
     <!--退回流程-->
-    <el-dialog title="退回流程" :visible.sync="returnOpen" width="40%" append-to-body>
-      <el-form ref="formRef" v-loading="formLoading" :model="formData" :rules="formRules" label-width="110px">
+    <el-dialog
+      title="退回流程"
+      :visible.sync="returnOpen"
+      width="40%"
+      append-to-body
+    >
+      <el-form
+        ref="formRef"
+        v-loading="formLoading"
+        :model="formData"
+        :rules="formRules"
+        label-width="110px"
+      >
         <el-form-item label="退回节点" prop="targetDefinitionKey">
-          <el-select v-model="formData.targetDefinitionKey" clearable style="width: 100%">
+          <el-select
+            v-model="formData.targetDefinitionKey"
+            clearable
+            style="width: 100%"
+          >
             <el-option
               v-for="item in returnList"
               :key="item.definitionKey"
@@ -139,23 +296,29 @@
           </el-select>
         </el-form-item>
         <el-form-item label="回退理由" prop="reason">
-          <el-input v-model="formData.reason" clearable placeholder="请输入回退理由"/>
+          <el-input
+            v-model="formData.reason"
+            clearable
+            placeholder="请输入回退理由"
+          />
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button @click="returnOpen = false">取 消</el-button>
-        <el-button :disabled="formLoading" type="primary" @click="submitReturn">确 定</el-button>
+        <el-button :disabled="formLoading" type="primary" @click="submitReturn"
+          >确 定</el-button
+        >
       </span>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import {getProcessDefinitionBpmnXML} from "@/api/bpm/definition";
+import { getProcessDefinitionBpmnXML } from "@/api/bpm/definition";
 import store from "@/store";
-import {decodeFields} from "@/utils/formGenerator";
-import Parser from '@/components/parser/Parser'
-import {getProcessInstance} from "@/api/bpm/processInstance";
+import { decodeFields } from "@/utils/formGenerator";
+import Parser from "@/components/parser/Parser";
+import { getProcessInstance } from "@/api/bpm/processInstance";
 import {
   approveTask,
   delegateTask,
@@ -165,16 +328,16 @@ import {
   returnTask,
   updateTaskAssignee,
 } from "@/api/bpm/task";
-import {getDate} from "@/utils/dateUtils";
-import {listSimpleUsers} from "@/api/system/user";
-import {getActivityList} from "@/api/bpm/activity";
+import { getDate } from "@/utils/dateUtils";
+import { listSimpleUsers } from "@/api/system/user";
+import { getActivityList } from "@/api/bpm/activity";
 import Vue from "vue";
 
 // 流程实例的详情页，可用于审批
 export default {
   name: "ProcessInstanceDetail",
   components: {
-    Parser
+    Parser,
   },
   data() {
     return {
@@ -186,24 +349,28 @@ export default {
       formLoading: false,
       // 流程表单详情
       detailForm: {
-        fields: []
+        fields: [],
       },
       //回退列表数据
       returnList: [],
       formData: {
-        id: '',
+        id: "",
         targetDefinitionKey: undefined,
-        reason: ''
+        reason: "",
       },
       formRules: {
-        targetDefinitionKey: [{required: true, message: '必须选择回退节点', trigger: 'change'}],
-        reason: [{required: true, message: '回退理由不能为空', trigger: 'blur'}]
+        targetDefinitionKey: [
+          { required: true, message: "必须选择回退节点", trigger: "change" },
+        ],
+        reason: [
+          { required: true, message: "回退理由不能为空", trigger: "blur" },
+        ],
       },
       returnOpen: false,
       // BPMN 数据
       bpmnXML: null,
       bpmnControlForm: {
-        prefix: "flowable"
+        prefix: "flowable",
       },
       activityList: [],
 
@@ -215,7 +382,9 @@ export default {
       runningTasks: [],
       auditForms: [],
       auditRule: {
-        reason: [{required: true, message: "审批建议不能为空", trigger: "blur"}],
+        reason: [
+          { required: true, message: "审批建议不能为空", trigger: "blur" },
+        ],
       },
       // 转派审批人
       userOptions: [],
@@ -225,33 +394,39 @@ export default {
           assigneeUserId: undefined,
         },
         rules: {
-          assigneeUserId: [{required: true, message: "新审批人不能为空", trigger: "change"}],
-        }
+          assigneeUserId: [
+            { required: true, message: "新审批人不能为空", trigger: "change" },
+          ],
+        },
       },
       updateDelegate: {
         open: false,
         form: {
           delegateUserId: undefined,
-          reason: ''
+          reason: "",
         },
         rules: {
-          delegateUserId: [{required: true, message: "新审批人不能为空", trigger: "change"}],
-          reason: [{required: true, message: '委派理由不能为空', trigger: 'blur'}]
-        }
-      }
+          delegateUserId: [
+            { required: true, message: "新审批人不能为空", trigger: "change" },
+          ],
+          reason: [
+            { required: true, message: "委派理由不能为空", trigger: "blur" },
+          ],
+        },
+      },
     };
   },
   created() {
     this.id = this.$route.query.id;
     if (!this.id) {
-      this.$message.error('未传递 id 参数，无法查看流程信息');
+      this.$message.error("未传递 id 参数，无法查看流程信息");
       return;
     }
     this.getDetail();
 
     // 获得用户列表
     this.userOptions = [];
-    listSimpleUsers().then(response => {
+    listSimpleUsers().then((response) => {
       this.userOptions.push(...response.data);
     });
   },
@@ -260,9 +435,9 @@ export default {
     getDetail() {
       // 获得流程实例相关
       this.processInstanceLoading = true;
-      getProcessInstance(this.id).then(response => {
+      getProcessInstance(this.id).then((response) => {
         if (!response.data) {
-          this.$message.error('查询不到流程信息！');
+          this.$message.error("查询不到流程信息！");
           return;
         }
         // 设置流程信息
@@ -280,25 +455,29 @@ export default {
             ...JSON.parse(this.processInstance.processDefinition.formConf),
             disabled: true, // 表单禁用
             formBtns: false, // 按钮隐藏
-            fields: decodeFields(this.processInstance.processDefinition.formFields)
-          }
+            fields: decodeFields(
+              this.processInstance.processDefinition.formFields
+            ),
+          };
           // 设置表单的值
-          this.detailForm.fields.forEach(item => {
-            const val = this.processInstance.formVariables[item.__vModel__]
+          this.detailForm.fields.forEach((item) => {
+            const val = this.processInstance.formVariables[item.__vModel__];
             if (val) {
-              item.__config__.defaultValue = val
+              item.__config__.defaultValue = val;
             }
           });
         }
 
         // 加载流程图
-        getProcessDefinitionBpmnXML(this.processInstance.processDefinition.id).then(response => {
-          this.bpmnXML = response.data
+        getProcessDefinitionBpmnXML(
+          this.processInstance.processDefinition.id
+        ).then((response) => {
+          this.bpmnXML = response.data;
         });
         // 加载活动列表
         getActivityList({
-          processInstanceId: this.processInstance.id
-        }).then(response => {
+          processInstanceId: this.processInstance.id,
+        }).then((response) => {
           this.activityList = response.data;
         });
 
@@ -310,11 +489,11 @@ export default {
       this.tasksLoad = true;
       this.runningTasks = [];
       this.auditForms = [];
-      getTaskListByProcessInstanceId(this.id).then(response => {
+      getTaskListByProcessInstanceId(this.id).then((response) => {
         // 审批记录
         this.tasks = [];
         // 移除已取消的审批
-        response.data.forEach(task => {
+        response.data.forEach((task) => {
           if (task.result !== 4) {
             this.tasks.push(task);
           }
@@ -336,17 +515,13 @@ export default {
 
         // 需要审核的记录
         const userId = store.getters.userId;
-        this.tasks.forEach(task => {
-          if (task.result !== 1 && task.result !== 6) { // 只有待处理才需要
-            return;
-          }
-          if (!task.assigneeUser || task.assigneeUser.id !== userId) { // 自己不是处理人
-            return;
-          }
-          this.runningTasks.push({...task});
+        this.tasks.forEach((task) => {
+          
+    
+          this.runningTasks.push({ ...task });
           this.auditForms.push({
-            reason: ''
-          })
+            reason: "",
+          });
         });
 
         // 取消加载中
@@ -358,61 +533,61 @@ export default {
     },
     getTimelineItemIcon(item) {
       if (item.result === 1) {
-        return 'el-icon-time';
+        return "el-icon-time";
       }
       if (item.result === 2) {
-        return 'el-icon-check';
+        return "el-icon-check";
       }
       if (item.result === 3) {
-        return 'el-icon-close';
+        return "el-icon-close";
       }
       if (item.result === 4) {
-        return 'el-icon-remove-outline';
+        return "el-icon-remove-outline";
       }
       if (item.result === 5) {
-        return 'el-icon-back'
+        return "el-icon-back";
       }
-      return '';
+      return "";
     },
     getTimelineItemType(item) {
       if (item.result === 1) {
-        return 'primary';
+        return "primary";
       }
       if (item.result === 2) {
-        return 'success';
+        return "success";
       }
       if (item.result === 3) {
-        return 'danger';
+        return "danger";
       }
       if (item.result === 4) {
-        return 'info';
+        return "info";
       }
       if (item.result === 5) {
-        return 'warning';
+        return "warning";
       }
       if (item.result === 6) {
-        return 'default'
+        return "default";
       }
-      return '';
+      return "";
     },
     /** 处理审批通过和不通过的操作 */
     handleAudit(task, pass) {
       const index = this.runningTasks.indexOf(task);
-      this.$refs['form' + index][0].validate(valid => {
+      this.$refs["form" + index][0].validate((valid) => {
         if (!valid) {
           return;
         }
         const data = {
           id: task.id,
-          reason: this.auditForms[index].reason
-        }
+          reason: this.auditForms[index].reason,
+        };
         if (pass) {
-          approveTask(data).then(response => {
+          approveTask(data).then((response) => {
             this.$modal.msgSuccess("审批通过成功！");
             this.getDetail(); // 获得最新详情
           });
         } else {
-          rejectTask(data).then(response => {
+          rejectTask(data).then((response) => {
             this.$modal.msgSuccess("审批不通过成功！");
             this.getDetail(); // 获得最新详情
           });
@@ -429,11 +604,11 @@ export default {
     },
     /** 提交转办审批人 */
     submitUpdateAssigneeForm() {
-      this.$refs['updateAssigneeForm'].validate(valid => {
+      this.$refs["updateAssigneeForm"].validate((valid) => {
         if (!valid) {
           return;
         }
-        updateTaskAssignee(this.updateAssignee.form).then(response => {
+        updateTaskAssignee(this.updateAssignee.form).then((response) => {
           this.$modal.msgSuccess("转办任务成功！");
           this.updateAssignee.open = false;
           this.getDetail(); // 获得最新详情
@@ -463,11 +638,11 @@ export default {
     },
     /** 提交委派审批人 */
     submitUpdateDelegateForm() {
-      this.$refs['updateDelegateForm'].validate(valid => {
+      this.$refs["updateDelegateForm"].validate((valid) => {
         if (!valid) {
           return;
         }
-        delegateTask(this.updateDelegate.form).then(response => {
+        delegateTask(this.updateDelegate.form).then((response) => {
           this.$modal.msgSuccess("委派任务成功！");
           this.updateDelegate.open = false;
           this.getDetail(); // 获得最新详情
@@ -491,7 +666,7 @@ export default {
     /** 返回退回节点列表 */
     handleBackList(task) {
       // 可参考 http://blog.wya1.com/article/636697030/details/7296
-      getReturnList(task.id).then(response => {
+      getReturnList(task.id).then((response) => {
         this.returnList = response.data;
         if (this.returnList.length == 0) {
           this.$modal.msgError("当前没有可回退的节点！");
@@ -500,18 +675,17 @@ export default {
         this.formData.id = task.id;
         this.returnOpen = true;
       });
-
     },
     /** 提交退回任务 */
     submitReturn() {
       if (!this.formData.targetDefinitionKey) {
         this.$modal.msgError("请选择退回节点！");
       }
-      this.$refs['formRef'].validate(valid => {
+      this.$refs["formRef"].validate((valid) => {
         if (!valid) {
           return;
         }
-        returnTask(this.formData).then(res => {
+        returnTask(this.formData).then((res) => {
           if (res.data) {
             this.$modal.msgSuccess("回退成功！");
             this.returnOpen = false;
@@ -519,8 +693,8 @@ export default {
           }
         });
       });
-    }
-  }
+    },
+  },
 };
 </script>