@lambo-design/workflow-approve 1.0.0-beta.10

package/src/portrait.vue

@@ -0,0 +1,1059 @@
+<template>
+  <LamboPageContainer>
+    <template slot="page-title">
+      {{ title }}
+    </template>
+    <template slot="page-extend">
+      <slot name="return-button"></slot>
+    </template>
+    <div class="portrait-lambo-indicator-card" :style="{float: 'left', width: isExpanded ? `calc(100% - ${portraitWidth+10}px)` : '99%'}">
+      <slot name="business-content">
+      </slot>
+    </div>
+
+    <a @click="isExpanded = !isExpanded" class="arrow-button-container" :style="{right: isExpanded ? portraitWidth+10 + 'px' : '10px'}">
+      <Icon class="icon-class" v-if="isExpanded" type="ios-arrow-forward"/>
+      <Icon class="icon-class" v-if="!isExpanded" type="ios-arrow-back"/>
+    </a>
+    <transition name="draw" @before-enter="beforeFlowInfoEnter" @enter="flowInfoEnter"
+                @before-leave="beforeFlowInfoLeave" @leave="flowInfoLeave">
+      <lamboIndicatorCard  v-if="isExpanded" class="portrait-lambo-indicator-card" :style="{width: portraitWidth + 'px', float: 'right'}" :hasExtend="false">
+        <div slot="content-title">流程信息</div>
+        <a v-if="!isDetail" @click="auditShow = !auditShow">
+          <Title v-if="!handleButtons || handleButtons.includes('auditOpinion') || handleButtons.includes('attachmentFile')">
+            <a style="color: #989898">
+              <Icon v-if="auditShow" type="ios-arrow-down"/>
+              <Icon v-if="!auditShow" type="ios-arrow-up"/>
+              审批信息
+            </a>
+          </Title>
+        </a>
+        <transition v-if="!isDetail" name="draw" @before-enter="beforeEnter" @enter="enter" @before-leave="beforeLeave" @leave="leave">
+          <div class="box" v-show="auditShow">
+            <Form ref="auditOpinion" justify="center" :label-width="100" :model="form"
+                  v-if="!handleButtons || handleButtons.includes('auditOpinion')"
+                  style="margin: 10px 0 0 10px;" :rules="ruleValidate">
+              <FormItem label="审批意见：" prop="auditOpinion" >
+                <AuditOpinion v-model="form.auditOpinion" :attachment-file="handleButtons.includes('attachmentFile')"
+                              :attachmentdata="fileList" :smart-flow-server-context="smartFlowServerContext"></AuditOpinion>
+              </FormItem>
+            </Form>
+            <Form ref="auditOpinion" justify="center" :label-width="100"
+                  v-if="handleButtons && !handleButtons.includes('auditOpinion') && handleButtons.includes('attachmentFile')"
+                  style="margin: 10px 0 0 10px;">
+              <FormItem style="min-height: 70px">
+                <Tooltip placement="bottom" max-width="200">
+                  <div style="font-size: smaller" slot="content">支持扩展名：.pdf .doc .docx .txt .xls .xlsx .jpg .jpeg .png .gif</div>
+                  <UploadFile @upload-result="uploadFile" :multiple="true"
+                              :oss-server-context="smartFlowServerContext" :oss-file-put-url="ossFilePutUrl"></UploadFile>
+                </Tooltip>
+              </FormItem>
+            </Form>
+          </div>
+        </transition>
+        <a v-if="isDetail && hisAuditOpinion[0].auditOpinion" @click="auditShow = !auditShow">
+          <Title v-if="!handleButtons || handleButtons.includes('auditOpinion') || handleButtons.includes('attachmentFile')">
+            <a style="color: #989898">
+            <Icon v-if="auditShow" type="ios-arrow-down"/>
+            <Icon v-if="!auditShow" type="ios-arrow-up"/>
+            审批信息
+            </a>
+          </Title>
+        </a>
+        <transition v-if="isDetail && hisAuditOpinion[0].auditOpinion" name="draw" @before-enter="beforeEnter" @enter="enter" @before-leave="beforeLeave" @leave="leave">
+          <div class="box" v-show="auditShow">
+            <Form ref="auditOpinion" justify="center" :model="form"
+                  v-if="!handleButtons || handleButtons.includes('auditOpinion')"
+                  style="margin: 10px 0 0 10px;" :rules="ruleValidate">
+              <FormItem style="margin-left: -60px">
+                <Card v-for="(item, index) in hisAuditOpinion" :key="index">
+                  <Row>
+                    <Col span="12" style="word-wrap: break-word">{{ item.auditOpinion }}</Col>
+                    <Col span="2"></Col>
+                    <Col span="10">{{ item.auditTime }}</Col>
+                  </Row>
+                </Card>
+              </FormItem>
+            </Form>
+          </div>
+        </transition>
+        <a @click="historyShow = !historyShow">
+          <Title v-if="!handleButtons || handleButtons.includes('auditHistory')">
+            <a style="color: #989898">
+              <Icon v-if="historyShow" type="ios-arrow-down"/>
+              <Icon v-if="!historyShow" type="ios-arrow-up"/>
+              审批记录
+            </a>
+          </Title>
+        </a>
+        <transition name="draw" @before-enter="beforeEnter" @enter="enter" @before-leave="beforeLeave" @leave="leave">
+          <div class="box" v-show="historyShow">
+            <Card class="process-history" :style="processHistoryHeight" dis-hover :bordered="false"
+                  v-if="!handleButtons || handleButtons.includes('auditHistory')">
+              <processHistory :portrait-width="portraitWidth" :list="processHistory" :done-page="isDetail"
+                              :smart-flow-server-context="smartFlowServerContext"></processHistory>
+            </Card>
+          </div>
+        </transition>
+
+        <a @click="attachListShow = !attachListShow">
+          <Title v-if="(!handleButtons || handleButtons.includes('attachmentFile')) && attachmentList.length > 0">
+            <a style="color: #989898">
+              <Icon v-if="attachListShow" type="ios-arrow-down"/>
+              <Icon v-if="!attachListShow" type="ios-arrow-up"/>
+              查看附件
+            </a>
+          </Title>
+        </a>
+        <transition name="draw" @before-enter="beforeEnter" @enter="enter" @before-leave="beforeLeave" @leave="leave">
+          <div class="box" v-show="(!handleButtons || handleButtons.includes('attachmentFile')) && attachmentList.length > 0 && attachListShow">
+            <div v-for="(item, index) in attachmentList" :key="index">
+              <Card dis-hover class="attach-card">
+                <List item-layout="vertical">
+                  <ListItem style="margin-top: -8px">
+                    <Row style="display: flex; align-items: center;">
+                      <!-- 左边：图片 -->
+                      <Col span="4" style="margin-top: -25px">
+                        <avatar v-if="item.fileType === 'image'" icon="ios-image-outline" class="attach-avatar" style="background-color: #005aff" :style="portraitWidth >= 600 ? 'margin-left: 10px' : ''"
+                                :size="portraitWidth >= 600 ? 'middle' : 'small'"></avatar>
+                        <avatar v-else-if="item.fileType === 'doc'" icon="ios-document-outline" class="attach-avatar" style="background-color: #005aff" :style="portraitWidth >= 600 ? 'margin-left: 10px' : ''"
+                                :size="portraitWidth >= 600 ? 'middle' : 'small'">
+                        </avatar>
+                        <avatar v-else-if="item.fileType === 'xlsx'" icon="ios-document-outline" class="attach-avatar" style="background-color: #19be6b" :style="portraitWidth >= 600 ? 'margin-left: 10px' : ''"
+                                :size="portraitWidth >= 600 ? 'middle' : 'small'"></avatar>
+                        <avatar v-else-if="item.fileType === 'pdf'" icon="ios-document-outline" class="attach-avatar" style="background-color: #ed4014" :style="portraitWidth >= 600 ? 'margin-left: 10px' : ''"
+                                :size="portraitWidth >= 600 ? 'middle' : 'small'"></avatar>
+                        <avatar v-else icon="ios-document-outline" class="attach-avatar" :style="portraitWidth >= 600 ? 'margin-left: 10px' : ''"
+                                :size="portraitWidth >= 600 ? 'middle' : 'small'"></avatar>
+                      </Col>
+                      <!-- 右边：附件信息 -->
+                      <Col span="20">
+                        <Row>
+                          <tooltip>
+                            <span class="attach-name-style"> {{ item.attachName }}</span>
+                            <div slot="content" style="white-space: normal"> {{ item.attachName }}</div>
+                          </tooltip>
+                        </Row>
+                        <Row style="margin-top: 3px">
+                          <span style="color: #005aff; font-size: 13px;">{{ item.uploadUserName }}</span>
+                          <Divider style="background-color:#808695;height: 1em;margin: 4px 9px 0 6px;"
+                                   type="vertical"/>
+                          <span style="color: #808695;font-size: 13px"
+                          >{{ showTaskNode(item.taskId) }}</span>
+                        </Row>
+                        <Row style="margin-bottom: -10px; margin-top: 10px">
+                          <template>
+                            <Button @click="getAttach(item)" size="small">下载</Button>
+                            <Button v-if="item.showPreview" ghost type="primary" @click="preViewAttach(item)"
+                                    style="margin-left: 10px" size="small">预览
+                            </Button>
+                          </template>
+                        </Row>
+                      </Col>
+                    </Row>
+
+                  </ListItem>
+                </List>
+              </Card>
+            </div>
+          </div>
+        </transition>
+        <Modal title="查看附件" v-model="modalVisible" fullscreen scrollable :mask="false">
+          <img :src="imageUrl" v-if="modalVisible"  alt="" style="width: 100%">
+          <div slot="footer">
+            <Button type="primary" @click="modalVisible = false">关闭</Button>
+          </div>
+        </Modal>
+        <Modal title="查看附件" v-model="modalDocx" fullscreen scrollable :mask="false">
+          <div ref="file" ></div>
+        </Modal>
+        <Modal v-model="modal1" title="选择节点"
+               @on-cancel="cancel"
+               @on-ok="ok">
+          <Table border
+                 :data="allNode"
+                 :columns="nodeColumn"
+                 highlight-row
+                 @on-current-change="selectNode">
+          </Table>
+        </Modal>
+        <assigneeBox ref="assigneeHelpBox" :executionCompleted="executionCompleted" @update-selected="handleSelectedUser"
+                     :data="assigneeBoxData" :smart-flow-server-context="smartFlowServerContext" :upms-server-context="upmsServerContext"/>
+        <Modal v-model="modalBoxShow" width="1000" title="流程跟踪图">
+          <Workflow_Diagram ref="processTrace" :instanceId="process.instanceId" :applyId="process.applyId"
+                          :procId="process.procId"
+                          :tableData="process.tableData" :hisAudit="hisAudit"
+                          :smart-flow-server-context="smartFlowServerContext">
+          </Workflow_Diagram>
+        </Modal>
+      </lamboIndicatorCard>
+    </transition>
+    <template slot="page-footer">
+      <div>
+        <slot name="footer-button"></slot>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo70')) && !isDetail"
+                :disabled="disable" :loading="loading" @click="audit('70')">驳回到原点
+        </Button>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo40')) && !isDetail"
+                :disabled="disable" :loading="loading" @click="audit('40')">驳回到上一级
+        </Button>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo90')) && !isDetail"
+                :disabled="disable" :loading="loading" @click="audit('90')">驳回指定节点
+        </Button>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo80')) && !isDetail"
+                :disabled="disable" :loading="loading" @click="audit('80')">跳转指定节点
+        </Button>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo82')) && !isDetail"
+                :disabled="disable" :loading="loading" @click="audit('82')">指定他人处理
+        </Button>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo50')) && !isDetail"
+                :disabled="disable" :loading="loading" @click="audit('50')">直接结束流程
+        </Button>
+        <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('processTrace')"
+                @click="processPrint" >流程跟踪图</Button>
+        <Button style="margin-left: 10px;" v-if="(!handleButtons || handleButtons.includes('auditTo30')) && !isDetail"
+                :disabled="disable" :loading="loading" type="primary" @click="audit('30')">通过
+        </Button>
+      </div>
+    </template>
+  </LamboPageContainer>
+</template>
+
+
+<script>
+import LamboPageContainer from '@lambo-design/page-container'
+import LamboIndicatorCard from '@lambo-design/indicator-card'
+import Workflow_Diagram from './workflow-diagram'
+import ajax from "@lambo-design/shared/utils/ajax";
+import bus from '@lambo-design/shared/utils/bus';
+import Title from "./components/title";
+import processHistory from "./components/history";
+import assigneeBox from "./components/assignee-box";
+import LamboPagingTable from "@lambo-design/paging-table";
+import AuditOpinion from "./components/opinion";
+import axios from "axios";
+import UploadFile from "@lambo-design/upload-file";
+import {timestampToTime} from "@lambo-design/shared/utils/date";
+
+// 引入docx-preview插件
+let docx = require('docx-preview');
+
+
+export default {
+  props: {
+    isDetail: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    width: {
+      type: Number,
+      required: false,
+      default: 400
+    },
+    procId: {
+      type: String,
+      required: true,
+    },
+    taskNode: {
+      type: String,
+      required: true,
+    },
+    applyId: {
+      type: String,
+      required: true,
+    },
+    //业务表单保存方法
+    businessFormSave: {
+      type: Function,
+      required: false
+    },
+    //按钮执行完毕回调方法
+    executionCompleted: {
+      type: Function,
+      required: false,
+    },
+    title:{
+      type: String,
+      default: "流程办理"
+    },
+    smartFlowServerContext: {
+      type: String,
+      default: '/api/smart-flow-server',
+    },
+    upmsServerContext: {
+      type: String,
+      default: '/api/upms-server',
+    },
+  },
+  components: {
+    Title,
+    LamboPageContainer,
+    Workflow_Diagram,
+    processHistory,
+    assigneeBox,
+    LamboPagingTable,
+    AuditOpinion,
+    LamboIndicatorCard,
+    UploadFile
+  },
+  data() {
+    return {
+      isExpanded: true,
+      portraitWidth: 0,
+      requestSuccessCodes: [200, "200"],
+      auditShow: true,
+      historyShow: true,
+      attachListShow: true,
+      attachmentList: [],
+      modalVisible: false,
+      modalDocx: false,
+      imageUrl: '',
+      assigneeBoxData: {},
+      selectedUserId: '',
+      targetTaskNode: '',
+      allNode: [],
+      auditParams: {},
+      modal1: false,
+      modalBoxShow: false,
+      hisNode: [],
+      processHistory: [],
+      ruleValidate: {
+        auditOpinion: [{required: true, trigger: "blur", message: "审批意见不能为空"}]
+      },
+      form: {
+        auditOpinion: '',
+      },
+      loading: false,
+      disable: false,
+      instanceId: '',
+      taskId: '',
+      handleButtons: [],
+      auditResult: '',
+      custChange: 'auditInfo',
+      auditInfo: "auditInfo",
+      auditProcess: "auditProcess",
+      fileList: [],
+      ossFilePutUrl: '/manage/oss/file/put',
+      hisAudit: [],
+      hisAuditOpinion: [{
+        auditOpinion: '',
+        auditTime: '',
+      }],
+      datas: {
+        orgName: "",
+        orgId: ""
+      },
+      editForm: {
+        approvalCost: '',
+        cost: '',
+        activityDate: []
+      },
+      process: {
+        tableData: [],
+        instanceId: '',
+        applyId: '',
+        procId: ''
+      },
+      handleButtonsNames: {
+        '30': '同意',
+        '70': '驳回原点',
+        '40': '驳回上一节点',
+        '90': '驳回指定节点',
+        '80': '跳转指定节点',
+        '82': '转办',
+        '50': '人工终止'
+      },
+    }
+
+  },
+
+  mounted() {
+    this.getWidth()
+    if (this.procId){
+      this.initData()
+    }
+
+  },
+  computed: {
+    processHistoryHeight(){
+      let str = '';
+      const hasAuditOpinion = !this.handleButtons || this.handleButtons.includes('auditOpinion')
+      const hasAttachmentFile = (!this.handleButtons || this.handleButtons.includes('attachmentFile')) && this.attachmentList.length > 0
+      const isDetail = this.isDetail && this.hisAuditOpinion[0].auditOpinion
+      if (hasAuditOpinion && !hasAttachmentFile && !isDetail){
+        str+= "height: 43vh"
+      } else if (hasAuditOpinion && hasAttachmentFile && !isDetail){
+        str+= "height: 40vh"
+      } else {
+        str+= "height: 60vh"
+      }
+      return str;
+    },
+    nodeColumn: function () {
+      let column = []
+      column.push({title: '序号', type: 'index', width: 70, align: 'center', fixed: 'left'});
+      column.push({title: '节点名称', key: 'taskName', minWidth: 150, align: 'center', fixed: 'left'})
+
+      column.push({
+        title: '节点状态', key: 'auditResult', minWidth: 150, align: 'center', fixed: 'left',
+        render: (h, params) => {
+          if (params.row.taskNode == this.taskNode) {
+            return h('div', [
+              h('tag', {
+                props: {
+                  color: '#ff9900'
+                }
+              }, '当前节点')
+            ])
+          } else if (!params.row.auditResult) {
+            return h('div', [
+              h('tag', {
+                props: {
+                  color: '#ff9900'
+                }
+              }, '未审批')
+            ])
+          } else {
+            if (params.row.auditResult == '30' && params.row.taskNode != this.taskNode) {
+              return h('div', [
+                h('tag', {
+                  props: {
+                    color: '#19be6b'
+                  }
+                }, '已审批通过')
+              ])
+            } else if (params.row.auditResult == '40' && params.row.taskNode != this.taskNode) {
+              return h('div', [
+                h('tag', {
+                  props: {
+                    color: '#ed4014'
+                  }
+                }, '已驳回到上一节点')
+              ])
+            } else if (params.row.auditResult == '60' && params.row.taskNode != this.taskNode) {
+              return h('div', [
+                h('tag', {
+                  props: {
+                    color: '#ed4014'
+                  }
+                }, '已撤回')
+              ])
+            } else if (params.row.auditResult == '80' && params.row.taskNode != this.taskNode) {
+              return h('div', [
+                h('tag', {
+                  props: {
+                    color: '#19be6b'
+                  }
+                }, '已跳转到指定节点')
+              ])
+            } else if (params.row.auditResult == '80' && params.row.taskNode != this.taskNode) {
+              return h('div', [
+                h('tag', {
+                  props: {
+                    color: '#19be6b'
+                  }
+                }, '已驳回到指定节点')
+              ])
+            }
+          }
+        }
+      })
+      column.push({
+        title: "操作", width: 100, align: 'center',
+        render: (h, params) => {
+          return h('div', [
+            h('Button', {
+              props: {
+                type: 'primary',
+                size: 'small'
+              },
+              style: {
+                marginRight: '5px'
+              },
+              on: {
+                click: () => {
+                  this.selectNode(params.row)
+                }
+              }
+            }, '选择')
+          ])
+        },
+      })
+      return column
+    },
+
+  },
+  provide() {
+    return {
+      toBeDoneListDoSearch: this.doSearch
+    };
+  },
+  methods: {
+    getWidth() {
+      if (this.width && this.width < 400) {
+        this.portraitWidth = 400
+      }
+      this.portraitWidth = this.width
+    },
+    initData(){
+      this.getAttachList()
+      if (!this.isDetail){
+        this.getTodoTaskId()
+      } else {
+        this.getDoneTaskId()
+      }
+      this.getHandleButtons()
+      this.getHisAudit();
+      this.getProcessHistory();
+    },
+    saveBusinessForm() {
+      this.businessFormSave(() => {
+      })
+    },
+    getAttachList() {
+      const self = this
+      const param = {
+        procId: this.procId,
+        applyId: this.applyId
+      }
+      ajax.get(self.smartFlowServerContext + '/manage/processDone/getAttachmentList', {params: param}).then(function (resp) {
+        self.attachmentList = resp.data.data.rows
+        self.attachmentList.forEach(item => {
+          const index = item.fileName.lastIndexOf(".")
+          const fileType = item.fileName.substr(index + 1).toLowerCase()
+          const imageList = ['jpg', 'gif', 'png', 'svg']
+          const docList = ['doc', 'docx']
+          const zipList = ['rar', 'zip']
+          const typeList = ['jpg', 'gif', 'png', 'docx']
+          item.fileType = imageList.indexOf(fileType) !== -1 ? 'image' : docList.indexOf(fileType) !== -1 ? 'doc' : zipList.indexOf(fileType) !== -1 ? 'zip' : fileType
+          item.showPreview = typeList.indexOf(fileType) !== -1
+        })
+      }).catch(err => {
+        console.log(err);
+      })
+    },
+    getTodoTaskId() {
+      const self = this
+      let param = {
+        procId: this.procId,
+        applyId: this.applyId,
+        taskNode:this.taskNode
+      }
+      ajax.get(self.smartFlowServerContext + "/manage/processTodo/list", {params: param}).then(function (resp) {
+        if (resp.data.code === '200') {
+          self.taskId = resp.data.data.rows[0].taskId
+          self.instanceId = resp.data.data.rows[0].procInstanceId
+        } else {
+          self.$Message.error(resp.data.message)
+        }
+      }).catch((err) => {
+        console.log(err)
+      })
+    },
+    getDoneTaskId() {
+      const self = this
+      let param = {
+        procId: this.procId,
+        applyId: this.applyId,
+        taskNode:this.taskNode
+      }
+      ajax.get(self.smartFlowServerContext + "/manage/processDone/getDoneDetail", {params: param}).then(function (resp) {
+        if (resp.data.code === '200') {
+          let rows = resp.data.data.rows
+          if (rows.length > 0) {
+            self.hisAuditOpinion = []
+            let taskList = resp.data.data.rows
+            taskList.forEach(item => {
+              self.hisAuditOpinion.push({
+                auditOpinion: item.auditComment,
+                auditTime: timestampToTime(item.auditDate)
+              })
+            })
+            self.taskId = taskList[0].taskId
+            self.instanceId = taskList[0].procInstanceId
+          } else {
+            ajax.get(self.smartFlowServerContext + "/manage/processTodo/list", {params: param}).then(function (todoResp) {
+              if (todoResp.data.code === '200') {
+                self.taskId = todoResp.data.data.rows[0].taskId
+                self.instanceId = todoResp.data.data.rows[0].procInstanceId
+              } else {
+                self.$Message.error(todoResp.data.message)
+              }
+            }).catch((err) => {
+              console.log(err)
+            })
+          }
+        } else {
+          self.$Message.error(resp.data.message)
+        }
+      }).catch((err) => {
+        console.log(err)
+      })
+    },
+    getHandleButtons() {
+      const self = this
+      let param = {
+        procId: this.procId,
+        taskNode: this.taskNode
+      }
+      ajax.post(self.smartFlowServerContext + '/manage/approvalCenter/getNodeData', param).then(function (resp) {
+        if (resp.data.code === '200') {
+          self.handleButtons = resp.data.data[0].handleButtons
+        } else {
+          self.$Message.error(resp.data.message)
+        }
+      }).catch((err) => {
+        console.log(err)
+      })
+    },
+    handleSaveResult(saveResult) {
+      if (saveResult) {
+        this.executeButtonAction((execResult, instanceId, taskIds, auditResult, curTaskId) => {
+          if (this.executionCompleted) {
+            this.executionCompleted(execResult, instanceId, taskIds, auditResult, curTaskId);
+          }
+        });
+      } else {
+        console.error('保存失败');
+      }
+    },
+    executeButtonAction(callback) {
+      const self = this;
+      let auditResult = {
+        code: self.auditResult,
+        name: self.handleButtonsNames[self.auditResult]
+      }
+      if (self.auditResult === '82') {
+        self.assigneeBoxData = self.auditParams
+        self.assigneeBoxData.auditResultName = self.handleButtonsNames[self.auditResult]
+        self.assigneeBoxData.instanceId = self.instanceId
+        self.$refs.assigneeHelpBox.toggleShowHelpBox();
+      } else if (self.auditResult === '80') {
+        self.getNodesBehind()
+      } else if (self.auditResult === '90') {
+        self.getAllPreNodes()
+      } else if (self.auditResult === '40') {
+        self.loading = true
+        self.disable = true
+        let url = self.smartFlowServerContext + '/manage/processTodo/getPreNode'
+        ajax.post(url, self.auditParams).then(function (resp) {
+          let result = resp.data
+          if (result.code == '30010') {
+            self.$Modal.confirm({
+              title: "提示",
+              content: result.message,
+              onOk: () => {
+                self.auditParams.auditResult = '70'
+                let url = self.smartFlowServerContext + '/manage/processTodo/audit'
+                ajax.post(url, self.auditParams).then(function (resp) {
+                  let result = resp.data
+                  if (result.code == '200') {
+                    self.loading = false
+                    self.disable = false
+                    self.$Message.success(result.message);
+                    //后端没有返回数据
+                    callback(true, null, null, auditResult, self.taskId);
+                    bus.$emit('triggerTimer')
+                  } else {
+                    self.loading = false
+                    self.disable = false
+                    self.$Message.error(result.message)
+                    callback(false, null, null, auditResult, self.taskId);
+                  }
+                  bus.$emit('triggerTimer')
+                })
+              },
+              onCancel: () => {
+                self.loading = false
+                self.disable = false
+              }
+            })
+          } else {
+            self.loading = true
+            self.disable = true
+            let url = self.smartFlowServerContext + '/manage/processTodo/audit'
+            ajax.post(url, self.auditParams).then(function (resp) {
+              let result = resp.data
+              if (result.code == '200') {
+                self.loading = false
+                self.disable = false
+                self.$Message.success(result.message);
+                if (result.data){
+                  let taskIds = result.data.map(item => item.id).join(',');
+                  callback(true, result.data[0].processInstanceId, taskIds, auditResult, self.taskId)
+                } else {
+                  callback(true, null, null)
+                }
+              } else {
+                self.loading = false
+                self.disable = false
+                self.$Message.error(result.message)
+                callback(false, null, null, auditResult, self.taskId);
+              }
+              bus.$emit('triggerTimer')
+            })
+          }
+        })
+      } else {
+        self.loading = true
+        self.disable = true
+        let url = self.smartFlowServerContext + '/manage/processTodo/audit'
+        ajax.post(url, self.auditParams).then(function (resp) {
+          let result = resp.data
+          if (result.code == '200') {
+            self.loading = false
+            self.disable = false
+            if (result.data){
+              let taskIds = result.data.map(item => item.id).join(',');
+              callback(true, result.data[0].processInstanceId, taskIds, auditResult, self.taskId)
+            } else {
+              callback(true, null, null, auditResult, self.taskId)
+            }
+            self.$Message.success(result.message);
+          } else if (result.code == '20002') {
+            // 流程结束
+            self.loading = false
+            self.disable = false
+            callback(true, '流程已结束', '流程已结束', auditResult, self.taskId)
+            self.$Message.success(result.message)
+          } else {
+            self.loading = false
+            self.disable = false
+            callback(false, null, null, auditResult, self.taskId)
+            self.$Message.error(result.message)
+          }
+          bus.$emit('triggerTimer')
+        })
+
+      }
+    },
+
+    doSearch() {
+      //不需要实现，是子组件assigneeBox要求使用父组件的这个方法
+    },
+    tabsChange(tab) {
+      console.log(tab)
+    },
+    audit: function (auditResult) {
+      let self = this
+      self.auditResult = auditResult
+      self.submit()
+    },
+    getAttach(row) {
+      window.open(this.smartFlowServerContext + "/manage/oss/file/get/" + row.fileId, "_blank");
+    },
+    preViewAttach(row) {
+      let reg = /\.(gif|jpg|jpeg|bmp|png|PNG)$/
+      let regs = /\.(pdf)$/
+      if (reg.test(row.fileName)) {
+        let url = this.smartFlowServerContext + "/manage/oss/file/get/" + row.fileId;
+        this.imgPreview(url);
+      } else if (regs.test(row.fileName)) {
+        window.open(this.smartFlowServerContext + "/manage/oss/file/getFileStream?fileId=" + row.fileId, "_blank");
+      } else {
+        this.modalDocx = true
+        axios({
+          method: 'get',
+          responseType: 'blob', // 因为是流文件，所以要指定blob类型
+          url: this.smartFlowServerContext + "/manage/oss/file/get/" + row.fileId// 一个word下载文件的接口
+        }).then(({data}) => {
+            docx.renderAsync(data, this.$refs.file, null, {
+              className: "docx", //默认和文档样式类的类名/前缀
+              inWrapper: true, //启用围绕文档内容呈现包装器
+              ignoreWidth: false, //禁用页面的渲染宽度
+              ignoreHeight: false, //禁用页面的渲染高度
+              ignoreFonts: false, //禁用字体渲染
+              breakPages: true, //在分页符上启用分页
+              ignoreLastRenderedPageBreak: true, //在lastRenderedPageBreak元素上禁用分页
+              experimental: false, //启用实验功能（制表符停止计算）
+              trimXmlDeclaration: true, //如果为true，则在解析之前将从xml文档中删除xml声明
+              useBase64URL: false, //如果为true，图像、字体等将转换为base 64 URL，否则使用URL.createObjectURL
+              useMathMLPolyfill: false, //包括用于铬、边等的MathML多填充。
+              showChanges: false, //启用文档更改的实验渲染（插入/删除）
+              debug: false, //启用额外的日志记录
+            })
+          }
+        )
+      }
+    },
+    imgPreview(url) {
+      this.imageUrl = url;
+      this.modalVisible = true;
+    },
+    submit() {
+      let self = this;
+
+      self.auditParams = {
+        procId: self.procId,
+        applyId: self.applyId,
+        taskId: self.taskId,
+        auditOpinion: self.form.auditOpinion,
+        fileListStr: JSON.stringify(self.fileList),
+        auditResult: self.auditResult,
+        params: JSON.stringify(self.datas),
+        targetTaskNode: self.targetTaskNode,
+        selectedUserId: self.selectedUserId,
+      }
+      if (self.auditResult == '' || self.auditResult == null) {
+        self.$Message.error("请选择审批结果！");
+        return;
+      }
+      if (self.form.auditOpinion == '' || self.form.auditOpinion == null) {
+        if (!self.handleButtons || self.handleButtons.includes('auditOpinion')) {
+          self.$Message.error("请输入审批意见！")
+          return;
+        } else {
+          self.auditParams.auditOpinion = self.handleButtonsNames[self.auditResult];
+        }
+      }
+
+      self.businessFormSave ? self.businessFormSave(self.handleSaveResult) : self.handleSaveResult(true)
+    },
+
+    //打印流程图信息
+    processPrint() {
+      let self = this
+      let params = {
+        applyId: self.applyId,
+        instanceId: self.instanceId,
+        procId: self.procId,
+        taskId: self.taskId,
+      }
+      ajax.get(self.smartFlowServerContext + '/manage/processTodo/getPrintData', {params: params}).then(function (resp) {
+        let result = resp.data.data
+        if (resp.data.code === '200') {
+          let tableData = result
+          self.process.tableData = tableData
+          self.process.applyId = self.applyId
+          self.process.instanceId = self.instanceId
+          self.process.procId = self.procId
+          self.datas.orgId = tableData[0].orgId
+          self.datas.orgName = tableData[0].orgName
+          self.modalBoxShow = true
+        }
+      })
+    },
+
+    getHisAudit() {
+      let self = this
+      let params = {
+        applyId: self.applyId,
+        instanceId: self.instanceId,
+        procId: self.procId,
+        taskId: self.taskId
+      }
+      ajax.get(self.smartFlowServerContext + '/manage/processTodo/getHisAudit', {params: params}).then(function (resp) {
+        if (resp.data.code === '200') {
+          self.hisAudit = resp.data.data
+          let uniqueDataMap = {};
+          self.hisAudit.forEach((item) => {
+            uniqueDataMap[item["taskNode"]] = item;
+          })
+          self.hisNode = Object.values(uniqueDataMap);
+
+        }
+      })
+    },
+    showTaskNode(taskId) {
+      if (this.processHistory.length > 0) {
+        let task = null
+        this.processHistory.some(itemList => {
+          task = itemList.find(item => item.taskId === taskId);
+          return task !== undefined;
+        });
+        return task ? task.taskName : ''
+      }
+      return ''
+    },
+    getProcessHistory() {
+      let self = this
+      let params = {
+        applyId: self.applyId,
+        instanceId: self.instanceId,
+        procId: self.procId,
+        taskId: self.taskId
+      }
+      ajax.get(self.smartFlowServerContext + '/manage/processTodo/getProcessHis', {params: params}).then(function (resp) {
+        if (resp.data.code === '200') {
+          self.processHistory = resp.data.data
+        }
+      })
+    },
+    cancel() {
+      this.modal = false
+      this.auditResult = '';
+    },
+    ok() {
+      this.modal = false
+      let auditResult = {
+        code: self.auditResult,
+        name: self.handleButtonsNames[self.auditResult]
+      }
+      if (this.targetTaskNode == '' || this.targetTaskNode == null) {
+        this.auditResult = '';
+        this.$Message.error("请选择审批节点！");
+      } else {
+        let self = this;
+
+        self.auditParams = {
+          procId: self.procId,
+          applyId: self.applyId,
+          taskId: self.taskId,
+          auditOpinion: self.form.auditOpinion,
+          fileListStr: JSON.stringify(self.fileList),
+          auditResult: self.auditResult,
+          params: JSON.stringify(self.datas),
+          targetTaskNode: self.targetTaskNode,
+          selectedUserId: self.selectedUserId,
+        }
+        self.loading = true
+        self.disable = true
+
+        let url = self.smartFlowServerContext + '/manage/processTodo/audit'
+        ajax.post(url, self.auditParams).then(function (resp) {
+          let result = resp.data
+          if (result.code === '200') {
+            setTimeout(() => {
+              self.loading = false
+              self.disable = false
+              self.$Message.success("审批成功");
+              if (self.executionCompleted) {
+                let taskIds = result.data.map(item => item.id).join(',');
+                self.executionCompleted(true, result.data[0].processInstanceId, taskIds, auditResult, self.taskId)
+              }
+              bus.$emit('triggerTimer')
+            }, 500)
+          } else {
+            self.loading = false
+            self.disable = false
+            self.$Message.error(result.message)
+            if (self.executionCompleted) {
+              self.executionCompleted(false, null, null);
+            }
+          }
+        })
+      }
+    },
+    selectNode(currentRow, oldCurrentRow) {
+      let self = this
+      self.targetTaskNode = currentRow.taskNode
+    },
+    getAllPreNodes() {
+      let self = this
+      let params = {
+        processDefId: self.procId,
+        taskId: self.taskId,
+      }
+      ajax.get(self.smartFlowServerContext + '/manage/processTodo/getAllPreNodes', {params: params}).then(function (resp) {
+        if (resp.data.code === '200') {
+          if (resp.data.data.length > 0){
+            self.allNode = resp.data.data
+            self.modal1 = true
+          }else {
+            self.$Message.warning('当前流程无前序节点')
+          }
+        } else {
+          self.$Message.error(resp.data.message)
+        }
+      })
+    },
+    getNodesBehind() {
+      let self = this
+      let params = {
+        processDefId: self.procId,
+        taskId: self.taskId,
+      }
+      ajax.get(self.smartFlowServerContext + '/manage/processTodo/getNodesBehind', {params: params}).then(function (resp) {
+        if (resp.data.code === '200') {
+          if (resp.data.data.length > 0){
+            self.allNode = resp.data.data
+            self.modal1 = true
+          }else {
+            self.$Message.warning('当前流程无后续节点')
+          }
+        } else {
+          self.$Message.error(resp.data.message)
+        }
+      })
+    },
+    handleSelectedUser(userId) {
+      this.selectedUserId = userId;
+    },
+
+    //折叠动画效果
+    beforeEnter(el) {
+      el.style.height = '0';
+    },
+    enter(el, done) {
+      setTimeout(() => {
+        el.style.height = el.scrollHeight + 'px';
+      }, 0);
+
+      el.addEventListener('transitionend', done);
+    },
+    beforeLeave(el) {
+      el.style.height = el.scrollHeight + 'px';
+    },
+    leave(el, done) {
+      setTimeout(() => {
+        el.style.height = '0';
+      }, 0);
+
+      el.addEventListener('transitionend', done);
+    },
+
+    beforeFlowInfoEnter(el) {
+      el.style.transform = 'translateX(100%)';
+    },
+    flowInfoEnter(el, done) {
+      const transitionDuration = 0.5;
+      el.style.transition = `transform ${transitionDuration}s`;
+      el.style.transform = 'translateX(0)';
+      el.addEventListener('transitionend', done);
+    },
+    beforeFlowInfoLeave(el) {
+      el.style.transform = 'translateX(0)';
+    },
+    flowInfoLeave(el, done) {
+      const transitionDuration = 0.5;
+      el.style.transition = `transform ${transitionDuration}s`;
+      el.style.transform = 'translateX(100%)';
+      el.addEventListener('transitionend', done);
+    },
+    uploadFile(file){
+      const self = this;
+      self.fileList = []
+      file.forEach(item => {
+        self.fileList.push({
+          fileName: item.fileName,
+          fileId: item.fileCode,
+        });
+      })
+    },
+  },
+  watch: {
+    auditOpinionText(label) {
+      this.form.auditOpinion = label;
+    },
+    procId(val) {
+      this.procId = val;
+      this.initData()
+    },
+  }
+}
+</script>
+
+<style lang="less" scoped>
+@import "./styles/css/index.less";
+/deep/ .ivu-table-row-highlight td {
+  background-color: #50c1ff !important;
+  color: #fff !important;
+}
+/deep/ .ivu-card-body{
+  padding: 10px;
+}
+.page-info /deep/ .page-body{
+  overflow-y: hidden;
+}
+</style>