修改流程处理

oa-ui/src/views/flowable/form/scForm.vue

@@ -2,7 +2,7 @@
  * @Author: ysh
  * @Date: 2024-01-19 16:29:01
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2024-01-29 16:51:20
+ * @LastEditTime: 2024-01-30 10:43:19
 -->
 <template>
   <div>

oa-ui/src/views/flowable/form/scTable.vue

@@ -1,6 +1,6 @@
 <template>
   <div style="padding:10px">
-    <h2 style="text-align: center;">考核表</h2>
+    <h2 style="text-align: center;">生产部门考核表</h2>
     <table class="table">
       <tr>
         <td>姓名</td>
@@ -714,7 +714,7 @@
         <td>{{ tableForm.f1306 }}</td>
       </tr>
       <tr>
-        <td rowspan="6">内业-dom</td>
+        <td rowspan="6">内业-DOM</td>
         <td>1:200</td>
         <td>km²</td>
         <td>{{ tableForm.f1401 }}</td>
@@ -763,7 +763,7 @@
         <td>{{ tableForm.f1406 }}</td>
       </tr>
       <tr>
-        <td rowspan="6">内业-dem</td>
+        <td rowspan="6">内业-DEM</td>
         <td>1:200</td>
         <td>km²</td>
         <td>{{ tableForm.f1501 }}</td>
@@ -925,7 +925,8 @@ export default {
   },
   watch: {
     tableForm: function (newval, oldval) {
-      console.log(1);
+      console.log(oldval);
+      this.formatForm();
       console.log(newval);
     }
   },
@@ -962,7 +963,7 @@ export default {
             this.form['role0' + i] = this.tableForm['role0' + i]
         }
         else {
-          if (this.tableForm['role0' + i] != undefined)
+          if (this.tableForm['role' + i] != undefined)
             this.form['role' + i] = this.tableForm['role' + i]
         }
       }

oa-ui/src/views/flowable/task/myProcess/detail/index.vue

@@ -78,14 +78,12 @@ import Parser from '@/components/parser/Parser'
 import {getProcessVariables, readXml, getFlowViewer, getHighlight, flowXmlAndNode} from "@/api/flowable/definition";
 import flow from '@/views/flowable/task/myProcess/detail/flow'
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-import ScTable from "../../../form/scTable.vue";
 
 export default {
   name: "Record",
   components: {
     Parser,
-    flow,
-    ScTable
+    flow
 },
   props: {},
   data() {

oa-ui/src/views/flowable/task/myProcess/index.vue

@@ -2,20 +2,12 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
       <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.name" placeholder="请输入名称" clearable size="small"
+          @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="开始时间" prop="deployTime">
-        <el-date-picker clearable size="small"
-                        v-model="queryParams.deployTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        placeholder="选择时间">
+        <el-date-picker clearable size="small" v-model="queryParams.deployTime" type="date" value-format="yyyy-MM-dd"
+          placeholder="选择时间">
         </el-date-picker>
       </el-form-item>
       <el-form-item>
@@ -26,116 +18,88 @@
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:deployment:add']"
-        >新增流程</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
+          v-hasPermi="['system:deployment:add']">新增流程</el-button>
       </el-col>
       <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:deployment:remove']"
-        >删除</el-button>
+        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
+          v-hasPermi="['system:deployment:remove']">删除</el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="myProcessList" border @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="流程编号" align="center" prop="procInsId" :show-overflow-tooltip="true"/>
-      <el-table-column label="流程名称" align="center" prop="procDefName" :show-overflow-tooltip="true"/>
+      <el-table-column label="流程编号" align="center" prop="procInsId" :show-overflow-tooltip="true" />
+      <el-table-column label="流程名称" align="center" prop="procDefName" :show-overflow-tooltip="true" />
       <el-table-column label="流程类别" align="center" prop="category" width="100px" />
       <el-table-column label="流程版本" align="center" width="80px">
         <template slot-scope="scope">
-          <el-tag size="medium" >v{{ scope.row.procDefVersion }}</el-tag>
+          <el-tag size="medium">v{{ scope.row.procDefVersion }}</el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="提交时间" align="center" prop="createTime" width="180"/>
+      <el-table-column label="提交时间" align="center" prop="createTime" width="180" />
       <el-table-column label="流程状态" align="center" width="100">
         <template slot-scope="scope">
           <el-tag v-if="scope.row.finishTime == null" size="mini">进行中</el-tag>
           <el-tag type="success" v-if="scope.row.finishTime != null" size="mini">已完成</el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="耗时" align="center" prop="duration" width="180"/>
-      <el-table-column label="当前节点" align="center" prop="taskName"/>
+      <el-table-column label="耗时" align="center" prop="duration" width="180" />
+      <el-table-column label="当前节点" align="center" prop="taskName" />
       <el-table-column label="办理人" align="center">
         <template slot-scope="scope">
-          <label v-if="scope.row.assigneeName">{{scope.row.assigneeName}} <el-tag type="info" size="mini">{{scope.row.assigneeDeptName}}</el-tag></label>
-<!--          <label v-if="scope.row.candidate">{{scope.row.candidate}}</label>-->
+          <label v-if="scope.row.assigneeName">{{ scope.row.assigneeName }} <el-tag type="info"
+              size="mini">{{ scope.row.assigneeDeptName }}</el-tag></label>
+          <!--          <label v-if="scope.row.candidate">{{scope.row.candidate}}</label>-->
         </template>
       </el-table-column>
       <el-table-column label="操作" width="150" fixed="right" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button @click="handleFlowRecord(scope.row)" type="text" size="small">详情</el-button>
           <el-button @click="handleStop(scope.row)" type="text" size="small">取消申请</el-button>
-          <el-button @click="handleDelete(scope.row)" type="text" size="small" v-hasPermi="['system:deployment:remove']">删除</el-button>
+          <el-button @click="handleDelete(scope.row)" type="text" size="small"
+            v-hasPermi="['system:deployment:remove']">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
 
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+      @pagination="getList" />
 
     <!-- 发起流程 -->
     <el-dialog :title="title" :visible.sync="open" width="60%" append-to-body>
       <el-form :model="queryProcessParams" ref="queryProcessForm" :inline="true" v-show="showSearch" label-width="68px">
         <el-form-item label="名称" prop="name">
-          <el-input
-            v-model="queryProcessParams.name"
-            placeholder="请输入名称"
-            clearable
-            size="small"
-            @keyup.enter.native="handleQuery"
-          />
+          <el-input v-model="queryProcessParams.name" placeholder="请输入名称" clearable size="small"
+            @keyup.enter.native="handleQuery" />
         </el-form-item>
         <el-form-item>
           <el-button type="primary" icon="el-icon-search" size="mini" @click="handleProcessQuery">搜索</el-button>
           <el-button icon="el-icon-refresh" size="mini" @click="resetProcessQuery">重置</el-button>
         </el-form-item>
       </el-form>
-      <el-table v-loading="processLoading" fit :data="definitionList" border >
+      <el-table v-loading="processLoading" fit :data="definitionList" border>
         <el-table-column label="流程名称" align="center" prop="name" />
         <el-table-column label="流程版本" align="center">
           <template slot-scope="scope">
-            <el-tag size="medium" >v{{ scope.row.version }}</el-tag>
+            <el-tag size="medium">v{{ scope.row.version }}</el-tag>
           </template>
         </el-table-column>
         <el-table-column label="流程分类" align="center" prop="category" />
         <el-table-column label="操作" align="center" width="300" class-name="small-padding fixed-width">
           <template slot-scope="scope">
-            <el-button
-              size="mini"
-              type="text"
-              icon="el-icon-edit-outline"
-              @click="handleStartProcess(scope.row)"
-            >发起流程</el-button>
+            <el-button size="mini" type="text" icon="el-icon-edit-outline"
+              @click="handleStartProcess(scope.row)">发起流程</el-button>
           </template>
         </el-table-column>
       </el-table>
-      <pagination
-        v-show="processTotal>0"
-        :total="processTotal"
-        :page.sync="queryProcessParams.pageNum"
-        :limit.sync="queryProcessParams.pageSize"
-        @pagination="listDefinition"
-      />
+      <pagination v-show="processTotal > 0" :total="processTotal" :page.sync="queryProcessParams.pageNum"
+        :limit.sync="queryProcessParams.pageSize" @pagination="listDefinition" />
+    </el-dialog>
+    <el-dialog title="详情" :visible.sync="detailsOpen" width="60%" append-to-body>
+      <RowDetail :rows="clickRow"></RowDetail>
     </el-dialog>
-
   </div>
 </template>
 
@@ -148,11 +112,13 @@ import {
   exportDeployment,
   flowRecord
 } from "@/api/flowable/finished";
-import { myProcessList,stopProcess } from "@/api/flowable/process";
-import {listDefinition} from "@/api/flowable/definition";
+import { myProcessList, stopProcess } from "@/api/flowable/process";
+import { listDefinition } from "@/api/flowable/definition";
+import  RowDetail  from './send/rowDetail.vue'
 export default {
   name: "Deploy",
   components: {
+    RowDetail
   },
   data() {
     return {
@@ -169,15 +135,17 @@ export default {
       showSearch: true,
       // 总条数
       total: 0,
-      processTotal:0,
+      processTotal: 0,
       // 我发起的流程列表数据
       myProcessList: [],
       // 弹出层标题
       title: "",
       // 是否显示弹出层
       open: false,
+      // 详情弹出框
+      detailsOpen: false,
       src: "",
-      definitionList:[],
+      definitionList: [],
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -211,6 +179,8 @@ export default {
       // 表单校验
       rules: {
       },
+      // 当前点击的行数据
+      clickRow:{}
     };
   },
   created() {
@@ -270,7 +240,7 @@ export default {
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.procInsId)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */
@@ -279,7 +249,7 @@ export default {
       this.title = "发起流程";
       this.listDefinition();
     },
-    listDefinition(){
+    listDefinition() {
       listDefinition(this.queryProcessParams).then(response => {
         this.definitionList = response.data.records;
         this.processTotal = response.data.total;
@@ -287,32 +257,38 @@ export default {
       });
     },
     /**  发起流程申请 */
-    handleStartProcess(row){
-      this.$router.push({ path: '/flowable/task/myProcess/send/index',
+    handleStartProcess(row) {
+      this.$router.push({
+        path: '/flowable/task/myProcess/send/index',
         query: {
           deployId: row.deploymentId,
           procDefId: row.id
-          }
+        }
       })
     },
     /**  取消流程申请 */
-    handleStop(row){
+    handleStop(row) {
       const params = {
         instanceId: row.procInsId
       }
-      stopProcess(params).then( res => {
-       this.$modal.msgSuccess(res.msg);
+      stopProcess(params).then(res => {
+        this.$modal.msgSuccess(res.msg);
         this.getList();
       });
     },
     /** 流程流转记录 */
-    handleFlowRecord(row){
-      this.$router.push({ path: '/flowable/task/myProcess/detail/index',
-        query: {
-          procInsId: row.procInsId,
-          deployId: row.deployId,
-          taskId: row.taskId
-      }})
+    handleFlowRecord(row) {
+      // this.$router.push({
+      //   path: '/flowable/task/myProcess/detail/index',
+      //   query: {
+      //     procInsId: row.procInsId,
+      //     deployId: row.deployId,
+      //     taskId: row.taskId
+      //   }
+      // })
+      console.log(row);
+      this.clickRow = row;
+      this.detailsOpen = true;
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
@@ -330,13 +306,13 @@ export default {
         if (valid) {
           if (this.form.id != null) {
             updateDeployment(this.form).then(response => {
-             this.$modal.msgSuccess("修改成功");
+              this.$modal.msgSuccess("修改成功");
               this.open = false;
               this.getList();
             });
           } else {
             addDeployment(this.form).then(response => {
-             this.$modal.msgSuccess("新增成功");
+              this.$modal.msgSuccess("新增成功");
               this.open = false;
               this.getList();
             });
@@ -355,7 +331,7 @@ export default {
         return delDeployment(ids);
       }).then(() => {
         this.getList();
-       this.$modal.msgSuccess("删除成功");
+        this.$modal.msgSuccess("删除成功");
       })
     },
     /** 导出按钮操作 */

oa-ui/src/views/flowable/task/myProcess/send/index.vue

@@ -84,6 +84,7 @@ export default {
       checkType: '', // 选择类型
       checkValues: null, // 选中任务接收人员数据
       formData: {}, // 填写的表单数据,
+      formId: '',
       multiInstanceVars: '' // 会签节点
     };
   },
@@ -186,6 +187,7 @@ export default {
         const data = res.data;
         if (data) {
           this.formData = formData;
+          this.formId = formData.formId;
           if (data.dataType === 'dynamic') {
             if (data.type === 'assignee') { // 指定人员
               this.checkSendUser = true;
@@ -232,11 +234,11 @@ export default {
         return;
       }
       if (this.formData.formData == undefined) {
-        definitionStart(this.procDefId, { approval: this.checkValues }).then(res => {
+        definitionStart(this.procDefId, { approval: this.checkValues, formId: this.formId }).then(res => {
           this.$modal.msgSuccess(res.msg);
           this.goBack();
         })
-      }else if (this.formData) {
+      } else if (this.formData) {
         const variables = this.formData.valData;
         let formData = this.formData.formData;
         // 表单是否禁用

oa-ui/src/views/flowable/task/myProcess/send/rowDetail.vue

@@ -0,0 +1,106 @@
+<!--
+ * @Author: ysh
+ * @Date: 2024-01-30 09:56:12
+ * @LastEditors: Please set LastEditors
+ * @LastEditTime: 2024-01-30 10:20:24
+-->
+<template>
+  <div>
+    <el-col :span="16" :offset="4">
+      <div class="block">
+        <el-timeline>
+          <el-timeline-item v-for="(item, index ) in flowRecordList" :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-descriptions class="margin-top" :column="1" size="small" border>
+                <el-descriptions-item v-if="item.assigneeName" label-class-name="my-label">
+                  <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">
+                  <template slot="label"><i class="el-icon-user"></i>候选办理</template>
+                  {{ item.candidate }}
+                </el-descriptions-item>
+                <el-descriptions-item label-class-name="my-label">
+                  <template slot="label"><i class="el-icon-date"></i>接收时间</template>
+                  {{ item.createTime }}
+                </el-descriptions-item>
+                <el-descriptions-item v-if="item.finishTime" label-class-name="my-label">
+                  <template slot="label"><i class="el-icon-date"></i>处理时间</template>
+                  {{ item.finishTime }}
+                </el-descriptions-item>
+                <el-descriptions-item v-if="item.duration" label-class-name="my-label">
+                  <template slot="label"><i class="el-icon-time"></i>耗时</template>
+                  {{ item.duration }}
+                </el-descriptions-item>
+                <el-descriptions-item v-if="item.comment" label-class-name="my-label">
+                  <template slot="label"><i class="el-icon-tickets"></i>处理意见</template>
+                  {{ item.comment.comment }}
+                </el-descriptions-item>
+              </el-descriptions>
+            </el-card>
+          </el-timeline-item>
+        </el-timeline>
+      </div>
+    </el-col>
+  </div>
+</template>
+
+<script>
+import {flowRecord} from "@/api/flowable/finished";
+export default {
+  props: {
+    rows: {
+      type: Object,
+      default: {}
+    }
+  },
+  created() {
+    this.getFlowRecordList();
+  },
+  data() {
+    return {
+      flowRecordList: [], // 流程流转数据
+    }
+  },
+  methods: {
+    setColor(val) {
+      if (val) {
+        return "#2bc418";
+      } else {
+        return "#b3bdbb";
+      }
+    },
+    setIcon(val) {
+      if (val) {
+        return "el-icon-check";
+      } else {
+        return "el-icon-time";
+      }
+    },
+    /** 获取流程变量内容 */
+    processVariables() {
+      if (this.rows.taskId) {
+        // 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
+        // getProcessVariables(taskId).then(res => {
+        //   this.variablesData = res.data.variables;
+        // });
+      }
+    },
+    /** 流程流转记录 */
+    getFlowRecordList() {
+      const that = this
+      const params = { procInsId: this.rows.procInsId, deployId: this.rows.deployId }
+      flowRecord(params).then(res => {
+        that.flowRecordList = res.data.flowList;
+      }).catch(res => {
+        
+      })
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped></style>

oa-ui/src/views/flowable/task/todo/detail/index.vue

@@ -29,7 +29,12 @@
           </el-col>
         </el-tab-pane> -->
         <el-tab-pane label="表单信息" name="1">
-          
+          <ScTable :tableForm="tableForm"></ScTable>
+          <el-button v-if="!formKeyExist" icon="el-icon-edit-outline" type="success" size="mini"
+            @click="handleComplete">审批
+          </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>
         </el-tab-pane>
         <!--流程流转记录-->
         <el-tab-pane label="流转记录" name="2">
@@ -149,9 +154,11 @@ import {
   flowTaskForm,
   checkIsStartUserNode
 } from "@/api/flowable/todo";
+import { getAssess } from '@/api/oa/assess/assess'
 import flow from '@/views/flowable/task/todo/detail/flow'
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
 import { listUser } from "@/api/system/user";
+import ScTable from "../../../form/scTable.vue";
 
 export default {
   name: "Record",
@@ -160,7 +167,8 @@ export default {
     flow,
     FlowUser,
     FlowRole,
-  },
+    ScTable
+},
   props: {},
   data() {
     return {
@@ -223,6 +231,8 @@ export default {
       startUser: null, // 发起人信息,
       multiInstanceVars: '', // 会签节点
       formKeyExist: false, // 当前节点是否存在表单
+      // 表单信息
+      tableForm: {}
     };
   },
   created() {
@@ -234,10 +244,12 @@ export default {
       this.taskForm.procInsId = this.$route.query.procInsId;
       this.taskForm.executionId = this.$route.query.executionId;
       this.taskForm.instanceId = this.$route.query.procInsId;
+      this.taskForm.formId = this.$route.query.formId;
       // 流程任务获取变量信息
       if (this.taskForm.taskId) {
         this.processVariables(this.taskForm.taskId)
         this.getFlowTaskForm(this.taskForm.taskId)
+        this.getAssessByAssessId(this.taskForm.formId)
       }
       this.getFlowRecordList(this.taskForm.procInsId, this.taskForm.deployId);
     }
@@ -322,14 +334,25 @@ export default {
       if (taskId) {
         // 提交流程申请时填写的表单存入了流程变量中后续任务处理时需要展示
         flowTaskForm({ taskId: taskId }).then(res => {
-          debugger
           this.variablesData = res.data.formData;
-          console.log( res.data.formData);
           this.taskForm.variables = res.data.formData;
           this.formKeyExist = res.data.formKeyExist;
         });
       }
     },
+    // 获取需要处理的表单表格信息
+    getAssessByAssessId(formId) {
+      getAssess(formId ).then(res => {
+        let data = res.data;
+        for(let d in data){
+          if(d.includes('role') || d.includes('familiar')){
+            data[d] = data[d].split(',')
+          }
+        }
+        this.tableForm = data;
+        console.log(data);
+      })
+    },
     /** 加载审批任务弹框 */
     handleComplete() {
       // this.completeOpen = true;
@@ -477,6 +500,7 @@ export default {
         this.completeTitle = "流程审批";
       })
     },
+
   },
 };
 </script>

oa-ui/src/views/flowable/task/todo/index.vue

@@ -2,20 +2,12 @@
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
       <el-form-item label="名称" prop="name">
-        <el-input
-          v-model="queryParams.name"
-          placeholder="请输入名称"
-          clearable
-          size="small"
-          @keyup.enter.native="handleQuery"
-        />
+        <el-input v-model="queryParams.name" placeholder="请输入名称" clearable size="small"
+          @keyup.enter.native="handleQuery" />
       </el-form-item>
       <el-form-item label="开始时间" prop="deployTime">
-        <el-date-picker clearable size="small"
-                        v-model="queryParams.deployTime"
-                        type="date"
-                        value-format="yyyy-MM-dd"
-                        placeholder="选择时间">
+        <el-date-picker clearable size="small" v-model="queryParams.deployTime" type="date" value-format="yyyy-MM-dd"
+          placeholder="选择时间">
         </el-date-picker>
       </el-form-item>
       <el-form-item>
@@ -26,56 +18,40 @@
 
     <el-row :gutter="10" class="mb8">
       <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['system:deployment:remove']"
-        >删除
+        <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
+          v-hasPermi="['system:deployment:remove']">删除
         </el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="todoList" border @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center"/>
-      <el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true"/>
-      <el-table-column label="流程名称" align="center" prop="procDefName"/>
-      <el-table-column label="当前节点" align="center" prop="taskName"/>
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="任务编号" align="center" prop="taskId" :show-overflow-tooltip="true" />
+      <el-table-column label="流程名称" align="center" prop="procDefName" />
+      <el-table-column label="当前节点" align="center" prop="taskName" />
       <el-table-column label="流程版本" align="center">
         <template slot-scope="scope">
-          <el-tag size="medium" >v{{scope.row.procDefVersion}}</el-tag>
+          <el-tag size="medium">v{{ scope.row.procDefVersion }}</el-tag>
         </template>
       </el-table-column>
       <el-table-column label="流程发起人" align="center">
         <template slot-scope="scope">
-          <label>{{scope.row.startUserName}} <el-tag type="info" size="mini">{{scope.row.startDeptName}}</el-tag></label>
+          <label>{{ scope.row.startUserName }} <el-tag type="info" size="mini">{{ scope.row.startDeptName
+          }}</el-tag></label>
         </template>
       </el-table-column>
-      <el-table-column label="接收时间" align="center" prop="createTime" width="180"/>
+      <el-table-column label="接收时间" align="center" prop="createTime" width="180" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit-outline"
-            @click="handleProcess(scope.row)"
-          >处理
+          <el-button size="mini" type="text" icon="el-icon-edit-outline" @click="handleProcess(scope.row)">处理
           </el-button>
         </template>
       </el-table-column>
     </el-table>
 
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="queryParams.pageNum"
-      :limit.sync="queryParams.pageSize"
-      @pagination="getList"
-    />
+    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
+      @pagination="getList" />
   </div>
 </template>
 
@@ -90,7 +66,7 @@ import {
   delDeployment,
   exportDeployment
 } from "@/api/flowable/todo";
-
+import { getProcessVariables } from "@/api/flowable/definition";
 export default {
   name: "Deploy",
   components: {},
@@ -141,16 +117,23 @@ export default {
       });
     },
     // 跳转到处理页面
-    handleProcess(row){
-      this.$router.push({ path: '/flowable/task/todo/detail/index',
-        query: {
-          procInsId: row.procInsId,
-          executionId: row.executionId,
-          deployId: row.deployId,
-          taskId: row.taskId,
-          taskName: row.taskName,
-          startUser: row.startUserName + '-' + row.startDeptName,
-        }})
+    handleProcess(row) {
+      getProcessVariables(row.taskId).then(res => {
+        console.log(res);
+        this.$router.push({
+          path: '/flowable/task/todo/detail/index',
+          query: {
+            procInsId: row.procInsId,
+            executionId: row.executionId,
+            deployId: row.deployId,
+            taskId: row.taskId,
+            taskName: row.taskName,
+            startUser: row.startUserName + '-' + row.startDeptName,
+            formId: res.data.formId
+          }
+        })
+      })
+
     },
     // 取消按钮
     cancel() {
@@ -200,7 +183,7 @@ export default {
         return delDeployment(ids);
       }).then(() => {
         this.getList();
-       this.$modal.msgSuccess("删除成功");
+        this.$modal.msgSuccess("删除成功");
       })
     },
   }