@lambo-design/workflow-approve 1.0.0-beta.96 → 1.0.0-beta.98

package/src/horizontal.vue

@@ -1,1002 +1,1002 @@
-<template>
-  <div style="margin-bottom: -10px">
-    <lamboIndicatorCard class="lamboIndicatorCard" :has-title="false" :hasExtend="false">
-      <Tabs name="auditInfo" v-model="custChange" @on-click="tabsChange">
-        <TabPane label="流程处理" :name="auditInfo" >
-          <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" dis-hover :bordered="false"
-                    v-if="!handleButtons || handleButtons.includes('auditHistory')">
-                <processHistory :list="processHistory" :smart-flow-server-context="smartFlowServerContext"></processHistory>
-              </Card>
-            </div>
-          </transition>
-
-          <a @click="attachListShow = !attachListShow">
-            <Title v-if="!handleButtons || handleButtons.includes('attachmentFile')">
-              <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')) && attachListShow" style="margin: 15px 20px 20px 100px">
-              <LamboPagingTable :requestSuccessCodes="requestSuccessCodes" :pageDisable="true" ref="table" :dataUrl="dataUrl" :columns="tableColumn"></LamboPagingTable>
-              <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>
-            </div>
-          </transition>
-          <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"/>
-
-        </TabPane>
-        <TabPane label="流程跟踪图" :name="auditProcess"  v-if="!handleButtons || handleButtons.includes('processTrace')">
-          <div>
-            <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>
-          </div>
-        </TabPane>
-      </Tabs>
-    </lamboIndicatorCard>
-    <div class="sticky" v-if="custChange.includes('auditInfo')">
-      <lamboIndicatorCard :has-title="false" :hasExtend="false">
-        <a @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 name="draw" @before-enter="beforeEnter" @enter="enter" @before-leave="beforeLeave" @leave="leave">
-          <div class="box horizontal-audit" v-show="auditShow">
-            <Form ref="auditOpinion" justify="center"
-                  v-if="!handleButtons || handleButtons.includes('auditOpinion') || handleButtons.includes('attachmentFile')"
-                  style=" margin-top: 15px;margin-left: 100px;margin-right: 100px" :rules="ruleValidate">
-              <Row>
-                <Col span="24" offset="0">
-                  <FormItem :label-width="120" label="处理意见：" prop="auditOpinion"
-                            v-if="!handleButtons || handleButtons.includes('auditOpinion')">
-                    <AuditOpinion v-model="auditOpinion" :smart-flow-server-context="smartFlowServerContext"></AuditOpinion>
-                  </FormItem>
-                  <UploadFile style="margin-left: 120px" v-if="!handleButtons || handleButtons.includes('attachmentFile')"
-                              @upload-result="uploadFile" :multiple="true"
-                              :oss-server-context="smartFlowServerContext" :oss-file-put-url="ossFilePutUrl"></UploadFile>
-                </Col>
-              </Row>
-            </Form>
-            <Divider/>
-            <Row type="flex" justify="center" style="margin-top: 10px;margin-bottom: 10px;">
-              <Button style="margin-left: 10px;" v-if="isShowSave && businessFormSave" @click="saveBusinessForm">保存</Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo30')"
-                      :disabled="disable" :loading="loading" @click="audit('30')">通过
-              </Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo70')"
-                      :disabled="disable" :loading="loading" @click="audit('70')">驳回到原点
-              </Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo40')"
-                      :disabled="disable" :loading="loading" @click="audit('40')">驳回到上一级
-              </Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo90')"
-                      :disabled="disable" :loading="loading" @click="audit('90')">驳回指定节点
-              </Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo80')"
-                      :disabled="disable" :loading="loading" @click="audit('80')">跳转指定节点
-              </Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo82')"
-                      :disabled="disable" :loading="loading" @click="audit('82')">指定他人处理
-              </Button>
-              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo50')"
-                      :disabled="disable" :loading="loading" @click="audit('50')">直接结束流程
-              </Button>
-              <Button style="margin-left: 10px;" v-if="isShowReturn"
-                      :disabled="disable" :loading="loading" @click="pageGoBack()">返回
-              </Button>
-            </Row>
-          </div>
-        </transition>
-      </lamboIndicatorCard>
-    </div>
-
-  </div>
-</template>
-
-
-<script>
-import LamboPageContainer from '@lambo-design/page-container'
-import LamboIndicatorCard from '@lambo-design/indicator-card'
-import Attachment from './components/horizontal/attachment';
-import Workflow_Diagram from './workflow-diagram'
-import ajax from "@lambo-design/shared/utils/ajax";
-import { operateBtn } from '@lambo-design/shared/utils/assist';
-import bus from '@lambo-design/shared/utils/bus';
-import Title from "./components/title";
-import processHistory from "./components/horizontal/history";
-import assigneeBox from "./components/assignee-box";
-import LamboPagingTable from "@lambo-design/paging-table";
-import axios from "axios";
-import AuditOpinion from "./components/horizontal/opinion";
-import UploadFile from "@lambo-design/upload-file";
-
-// 引入docx-preview插件
-let docx = require('docx-preview');
-
-
-export default {
-  props: {
-    procId: {
-      type: String,
-      required: true,
-    },
-    taskNode: {
-      type: String,
-      required: true,
-    },
-    applyId: {
-      type: String,
-      required: true,
-    },
-    isShowSave: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    isShowReturn: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    //业务表单保存方法
-    businessFormSave: {
-      type: Function,
-      required: false
-    },
-    //按钮执行完毕回调方法
-    executionCompleted: {
-      type: Function,
-      required: false,
-    },
-    smartFlowServerContext: {
-      type: String,
-      default: '/api/smart-flow-server',
-    },
-    upmsServerContext: {
-      type: String,
-      default: '/api/upms-server',
-    },
-  },
-  components: {
-    Title,
-    LamboPageContainer,
-    Workflow_Diagram,
-    Attachment,
-    processHistory,
-    assigneeBox,
-    LamboPagingTable,
-    AuditOpinion,
-    LamboIndicatorCard,
-    UploadFile
-  },
-  data() {
-    return {
-      dataUrl: this.smartFlowServerContext + '/manage/processDone/getAttachmentList?procId='+this.procId + '&applyId=' + this.applyId,
-      requestSuccessCodes: [200, "200"],
-      auditShow: false,
-      historyShow: true,
-      attachListShow: false,
-      tableData: [],
-      modalVisible: false,
-      modalDocx:false,
-      imageUrl: '',
-      assigneeBoxData: {},
-      selectedUserId: '',
-      targetTaskNode: '',
-      allNode: [],
-      auditParams: {},
-      modal1: false,
-      hisNode: [],
-      processHistory: [],
-      ruleValidate: {
-        auditOpinion: [{required: true, trigger: "blur", message: "审批意见不能为空", type: "String"}]
-      },
-      auditOpinion: '',
-      loading: false,
-      disable: false,
-      instanceId: '',
-      taskId: '',
-      handleButtons: [],
-      auditResult: '',
-      custChange: 'auditInfo',
-      auditInfo:"auditInfo",
-      auditProcess:"auditProcess",
-      fileList: [],
-      ossFilePutUrl: '/manage/oss/file/put',
-      hisAudit: [],
-      datas: {
-        orgName: "",
-        orgId: ""
-      },
-      editForm: {
-        approvalCost: '',
-        cost: '',
-        activityDate: []
-      },
-      process: {
-        tableData: [],
-        instanceId: '',
-        applyId: '',
-        procId: ''
-      },
-      handleButtonsNames: {
-        '30': '同意',
-        '70': '驳回原点',
-        '40': '驳回上一节点',
-        '90': '驳回指定节点',
-        '80': '跳转指定节点',
-        '82': '转办',
-        '50': '人工终止'
-      }
-    }
-
-  },
-
-  mounted() {
-    if (this.procId){
-      this.initData()
-    }
-
-  },
-  computed: {
-    title: function () {
-      return this.$route.query.procName;
-    },
-    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 == '90' && 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
-    },
-
-    tableColumn() {
-      let column = [];
-      let self = this;
-      column.push({
-        title: '序号',
-        type: 'index',
-        width: 70,
-        align: 'center',
-      });
-      column.push({
-        title: '附件名称', key: 'fileName', minWidth: 150, align: 'center',
-        render(h, {row}) {
-          const index= row.fileName.lastIndexOf(".");
-          const fileName=row.fileName.substr(0,index)
-          return h("span",fileName)
-
-        }
-      });
-      column.push({
-        title: '附件类型', width: 100, align: 'center',
-        render:(h,{row})=>{
-          const index= row.fileName.lastIndexOf(".");
-          const fileType=row.fileName.substr(index+1)
-          return h("span",fileType)
-        }
-      });
-
-      column.push({
-        title: "上传人姓名",
-        key: "uploadUserName",
-        width: 170,
-        align: "center",
-      });
-
-      column.push({
-        title: "节点名称",
-        key: "taskName",
-        width: 170,
-        align: "center",
-      });
-
-      column.push({
-        title: "上传时间",
-        key: "updTime",
-        width: 170,
-        align: "center",
-        render: (v, param) => {
-          if (param.row.updTime){
-            let date = new Date(param.row.updTime)
-            let y = date.getFullYear() // 年
-            let MM = date.getMonth() + 1 // 月
-            MM = MM < 10 ? ('0' + MM) : MM
-            let d = date.getDate() // 日
-            d = d < 10 ? ('0' + d) : d
-            let h = date.getHours() // 时
-            h = h < 10 ? ('0' + h) : h
-            let m = date.getMinutes()// 分
-            m = m < 10 ? ('0' + m) : m
-            let s = date.getSeconds()// 秒
-            s = s < 10 ? ('0' + s) : s
-            let state =y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
-            return v("span", state);
-          }
-          return v("span", '')
-        }
-      });
-
-      column.push({
-        title: "操作", width: 160, align: 'center', tooltip: true,
-        render: (h, {row}) => {
-          const index= row.fileName.lastIndexOf(".");
-          const fileType=row.fileName.substr(index+1).toLowerCase()
-          // const typeList=['jpg','pdf','gif','png','docx']
-          //由于pdf预览显示乱码 暂时不提供pdf预览功能
-          const typeList=['jpg','gif','png','docx']
-          if (typeList.indexOf(fileType)!==-1){
-            return h("div", [
-              operateBtn(this, h, row, "下载", () => {
-                this.getAttach(row);
-              }, "primary"),
-              operateBtn(this, h, row, "预览", () => {
-                this.preViewAttach(row);
-              }, "primary")
-            ]);
-          }else {
-            return h("div", [
-              operateBtn(this, h, row, "下载", () => {
-                this.getAttach(row);
-              }, "primary")
-            ]);
-          }
-
-        }
-
-      });
-
-      return column;
-    },
-
-
-  },
-  provide() {
-    return {
-      toBeDoneListDoSearch: this.doSearch
-    };
-  },
-  methods: {
-    initData(){
-      this.getAttachList()
-      this.getTaskId()
-      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.tableData = resp.data.data.rows
-        self.attachListShow = true
-      }).catch(err => {
-        console.log(err);
-      })
-    },
-    getTaskId(){
-      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
-          self.processPrint()
-        }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, taskId) => {
-          if (this.executionCompleted) {
-            this.executionCompleted(execResult, instanceId, taskId);
-          }
-        });
-      } else {
-        console.error('保存失败');
-      }
-    },
-    executeButtonAction(callback) {
-      const self = this;
-      if (self.auditResult == '82') {
-        self.assigneeBoxData = self.auditParams
-        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);
-                    bus.$emit('triggerTimer')
-                  } else {
-                    self.loading = false
-                    self.disable = false
-                    self.$Message.error(result.message)
-                    callback(false, null, null);
-                  }
-                  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){
-                  callback(true, result.data.processInstanceId, result.data.id)
-                }else {
-                  callback(true, null, null)
-                }
-              } else {
-                self.loading = false
-                self.disable = false
-                self.$Message.error(result.message)
-                callback(false, null, null);
-              }
-              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){
-              callback(true, result.data.processInstanceId, result.data.id)
-            }else {
-              callback(true, null, null)
-            }
-            self.$Message.success(result.message);
-          } else if (result.code == '20002') {
-            // 流程结束
-            self.loading = false
-            self.disable = false
-            callback(true, null, null)
-            self.$Message.success(result.message)
-          } else {
-            self.loading = false
-            self.disable = false
-            callback(false, null, null)
-            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.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.auditOpinion == '' || self.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
-        }
-      })
-    },
-
-    pageGoBack() {
-      bus.$emit('triggerTimer')
-      window.history.back()
-    },
-
-    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);
-
-        }
-      })
-    },
-
-    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.$refs['radio5'].currentValue = false;
-      this.auditResult = '';
-    },
-    ok() {
-      this.modal = false
-      if (this.targetTaskNode == '' || this.targetTaskNode == null) {
-        // this.$refs['radio5'].currentValue = false;
-        this.auditResult = '';
-        this.$Message.error("请选择审批节点！");
-      } else {
-        let self = this;
-
-        self.auditParams = {
-          procId: self.procId,
-          applyId: self.applyId,
-          taskId: self.taskId,
-          auditOpinion: self.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) {
-                self.executionCompleted(true, result.data.processInstanceId, result.data.id);
-              }
-              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) {
-      // 处理选中的用户ID，比如将其保存到数据中或执行其他逻辑
-      this.selectedUserId = userId;
-      // if (userId == null || userId == '') {
-      //   this.$refs['radio6'].currentValue = false;
-      // }
-    },
-
-    //折叠动画效果
-    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);
-    },
-    uploadFile(file){
-      const self = this;
-      self.fileList = []
-      file.forEach(item => {
-        self.fileList.push({
-          fileName: item.fileName,
-          fileId: item.fileCode,
-        });
-      })
-    },
-  },
-  watch: {
-    auditOpinionText(label) {
-      this.auditOpinion = label;
-    },
-    procId(val) {
-      this.procId = val;
-      this.initData()
-    },
-  }
-}
-</script>
-
-<style lang="less" scoped>
-
-/deep/ .ivu-table-row-highlight td {
-  background-color: #50c1ff !important;
-  color: #fff !important;
-}
-
-.process-history {
-  height: 68vh;
-  width: 100%;
-  overflow-y: auto;
-}
-
-.process-history::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-.process-history::-webkit-scrollbar-thumb {
-  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
-  border-radius: 5px;
-}
-
-.box {
-  overflow: hidden;
-  transition: height 0.3s ease;
-  height: auto;
-}
-
-.draw-enter-active, .draw-leave-active {
-
-}
-.horizontal-audit{
-  overflow-y: auto;
-}
-.horizontal-audit::-webkit-scrollbar {
-  width: 5px;
-  height: 5px;
-}
-
-.horizontal-audit::-webkit-scrollbar-thumb {
-  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
-  border-radius: 5px;
-}
-.draw-enter, .draw-leave-to {
-  height: 0;
-}
-.sticky{
-  position: sticky;
-  bottom : 0;
-  z-index: 100;
-  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-}
-</style>
+<template>
+  <div style="margin-bottom: -10px">
+    <lamboIndicatorCard class="lamboIndicatorCard" :has-title="false" :hasExtend="false">
+      <Tabs name="auditInfo" v-model="custChange" @on-click="tabsChange">
+        <TabPane label="流程处理" :name="auditInfo" >
+          <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" dis-hover :bordered="false"
+                    v-if="!handleButtons || handleButtons.includes('auditHistory')">
+                <processHistory :list="processHistory" :smart-flow-server-context="smartFlowServerContext"></processHistory>
+              </Card>
+            </div>
+          </transition>
+
+          <a @click="attachListShow = !attachListShow">
+            <Title v-if="!handleButtons || handleButtons.includes('attachmentFile')">
+              <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')) && attachListShow" style="margin: 15px 20px 20px 100px">
+              <LamboPagingTable :requestSuccessCodes="requestSuccessCodes" :pageDisable="true" ref="table" :dataUrl="dataUrl" :columns="tableColumn"></LamboPagingTable>
+              <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>
+            </div>
+          </transition>
+          <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"/>
+
+        </TabPane>
+        <TabPane label="流程跟踪图" :name="auditProcess"  v-if="!handleButtons || handleButtons.includes('processTrace')">
+          <div>
+            <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>
+          </div>
+        </TabPane>
+      </Tabs>
+    </lamboIndicatorCard>
+    <div class="sticky" v-if="custChange.includes('auditInfo')">
+      <lamboIndicatorCard :has-title="false" :hasExtend="false">
+        <a @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 name="draw" @before-enter="beforeEnter" @enter="enter" @before-leave="beforeLeave" @leave="leave">
+          <div class="box horizontal-audit" v-show="auditShow">
+            <Form ref="auditOpinion" justify="center"
+                  v-if="!handleButtons || handleButtons.includes('auditOpinion') || handleButtons.includes('attachmentFile')"
+                  style=" margin-top: 15px;margin-left: 100px;margin-right: 100px" :rules="ruleValidate">
+              <Row>
+                <Col span="24" offset="0">
+                  <FormItem :label-width="120" label="处理意见：" prop="auditOpinion"
+                            v-if="!handleButtons || handleButtons.includes('auditOpinion')">
+                    <AuditOpinion v-model="auditOpinion" :smart-flow-server-context="smartFlowServerContext"></AuditOpinion>
+                  </FormItem>
+                  <UploadFile style="margin-left: 120px" v-if="!handleButtons || handleButtons.includes('attachmentFile')"
+                              @upload-result="uploadFile" :multiple="true"
+                              :oss-server-context="smartFlowServerContext" :oss-file-put-url="ossFilePutUrl"></UploadFile>
+                </Col>
+              </Row>
+            </Form>
+            <Divider/>
+            <Row type="flex" justify="center" style="margin-top: 10px;margin-bottom: 10px;">
+              <Button style="margin-left: 10px;" v-if="isShowSave && businessFormSave" @click="saveBusinessForm">保存</Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo30')"
+                      :disabled="disable" :loading="loading" @click="audit('30')">通过
+              </Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo70')"
+                      :disabled="disable" :loading="loading" @click="audit('70')">驳回到原点
+              </Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo40')"
+                      :disabled="disable" :loading="loading" @click="audit('40')">驳回到上一级
+              </Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo90')"
+                      :disabled="disable" :loading="loading" @click="audit('90')">驳回指定节点
+              </Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo80')"
+                      :disabled="disable" :loading="loading" @click="audit('80')">跳转指定节点
+              </Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo82')"
+                      :disabled="disable" :loading="loading" @click="audit('82')">指定他人处理
+              </Button>
+              <Button style="margin-left: 10px;" v-if="!handleButtons || handleButtons.includes('auditTo50')"
+                      :disabled="disable" :loading="loading" @click="audit('50')">直接结束流程
+              </Button>
+              <Button style="margin-left: 10px;" v-if="isShowReturn"
+                      :disabled="disable" :loading="loading" @click="pageGoBack()">返回
+              </Button>
+            </Row>
+          </div>
+        </transition>
+      </lamboIndicatorCard>
+    </div>
+
+  </div>
+</template>
+
+
+<script>
+import LamboPageContainer from '@lambo-design/page-container'
+import LamboIndicatorCard from '@lambo-design/indicator-card'
+import Attachment from './components/horizontal/attachment';
+import Workflow_Diagram from './workflow-diagram'
+import ajax from "@lambo-design/shared/utils/ajax";
+import { operateBtn } from '@lambo-design/shared/utils/assist';
+import bus from '@lambo-design/shared/utils/bus';
+import Title from "./components/title";
+import processHistory from "./components/horizontal/history";
+import assigneeBox from "./components/assignee-box";
+import LamboPagingTable from "@lambo-design/paging-table";
+import axios from "axios";
+import AuditOpinion from "./components/horizontal/opinion";
+import UploadFile from "@lambo-design/upload-file";
+
+// 引入docx-preview插件
+let docx = require('docx-preview');
+
+
+export default {
+  props: {
+    procId: {
+      type: String,
+      required: true,
+    },
+    taskNode: {
+      type: String,
+      required: true,
+    },
+    applyId: {
+      type: String,
+      required: true,
+    },
+    isShowSave: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    isShowReturn: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    //业务表单保存方法
+    businessFormSave: {
+      type: Function,
+      required: false
+    },
+    //按钮执行完毕回调方法
+    executionCompleted: {
+      type: Function,
+      required: false,
+    },
+    smartFlowServerContext: {
+      type: String,
+      default: '/api/smart-flow-server',
+    },
+    upmsServerContext: {
+      type: String,
+      default: '/api/upms-server',
+    },
+  },
+  components: {
+    Title,
+    LamboPageContainer,
+    Workflow_Diagram,
+    Attachment,
+    processHistory,
+    assigneeBox,
+    LamboPagingTable,
+    AuditOpinion,
+    LamboIndicatorCard,
+    UploadFile
+  },
+  data() {
+    return {
+      dataUrl: this.smartFlowServerContext + '/manage/processDone/getAttachmentList?procId='+this.procId + '&applyId=' + this.applyId,
+      requestSuccessCodes: [200, "200"],
+      auditShow: false,
+      historyShow: true,
+      attachListShow: false,
+      tableData: [],
+      modalVisible: false,
+      modalDocx:false,
+      imageUrl: '',
+      assigneeBoxData: {},
+      selectedUserId: '',
+      targetTaskNode: '',
+      allNode: [],
+      auditParams: {},
+      modal1: false,
+      hisNode: [],
+      processHistory: [],
+      ruleValidate: {
+        auditOpinion: [{required: true, trigger: "blur", message: "审批意见不能为空", type: "String"}]
+      },
+      auditOpinion: '',
+      loading: false,
+      disable: false,
+      instanceId: '',
+      taskId: '',
+      handleButtons: [],
+      auditResult: '',
+      custChange: 'auditInfo',
+      auditInfo:"auditInfo",
+      auditProcess:"auditProcess",
+      fileList: [],
+      ossFilePutUrl: '/manage/oss/file/put',
+      hisAudit: [],
+      datas: {
+        orgName: "",
+        orgId: ""
+      },
+      editForm: {
+        approvalCost: '',
+        cost: '',
+        activityDate: []
+      },
+      process: {
+        tableData: [],
+        instanceId: '',
+        applyId: '',
+        procId: ''
+      },
+      handleButtonsNames: {
+        '30': '同意',
+        '70': '驳回原点',
+        '40': '驳回上一节点',
+        '90': '驳回指定节点',
+        '80': '跳转指定节点',
+        '82': '转办',
+        '50': '人工终止'
+      }
+    }
+
+  },
+
+  mounted() {
+    if (this.procId){
+      this.initData()
+    }
+
+  },
+  computed: {
+    title: function () {
+      return this.$route.query.procName;
+    },
+    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 == '90' && 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
+    },
+
+    tableColumn() {
+      let column = [];
+      let self = this;
+      column.push({
+        title: '序号',
+        type: 'index',
+        width: 70,
+        align: 'center',
+      });
+      column.push({
+        title: '附件名称', key: 'fileName', minWidth: 150, align: 'center',
+        render(h, {row}) {
+          const index= row.fileName.lastIndexOf(".");
+          const fileName=row.fileName.substr(0,index)
+          return h("span",fileName)
+
+        }
+      });
+      column.push({
+        title: '附件类型', width: 100, align: 'center',
+        render:(h,{row})=>{
+          const index= row.fileName.lastIndexOf(".");
+          const fileType=row.fileName.substr(index+1)
+          return h("span",fileType)
+        }
+      });
+
+      column.push({
+        title: "上传人姓名",
+        key: "uploadUserName",
+        width: 170,
+        align: "center",
+      });
+
+      column.push({
+        title: "节点名称",
+        key: "taskName",
+        width: 170,
+        align: "center",
+      });
+
+      column.push({
+        title: "上传时间",
+        key: "updTime",
+        width: 170,
+        align: "center",
+        render: (v, param) => {
+          if (param.row.updTime){
+            let date = new Date(param.row.updTime)
+            let y = date.getFullYear() // 年
+            let MM = date.getMonth() + 1 // 月
+            MM = MM < 10 ? ('0' + MM) : MM
+            let d = date.getDate() // 日
+            d = d < 10 ? ('0' + d) : d
+            let h = date.getHours() // 时
+            h = h < 10 ? ('0' + h) : h
+            let m = date.getMinutes()// 分
+            m = m < 10 ? ('0' + m) : m
+            let s = date.getSeconds()// 秒
+            s = s < 10 ? ('0' + s) : s
+            let state =y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
+            return v("span", state);
+          }
+          return v("span", '')
+        }
+      });
+
+      column.push({
+        title: "操作", width: 160, align: 'center', tooltip: true,
+        render: (h, {row}) => {
+          const index= row.fileName.lastIndexOf(".");
+          const fileType=row.fileName.substr(index+1).toLowerCase()
+          // const typeList=['jpg','pdf','gif','png','docx']
+          //由于pdf预览显示乱码 暂时不提供pdf预览功能
+          const typeList=['jpg','gif','png','docx']
+          if (typeList.indexOf(fileType)!==-1){
+            return h("div", [
+              operateBtn(this, h, row, "下载", () => {
+                this.getAttach(row);
+              }, "primary"),
+              operateBtn(this, h, row, "预览", () => {
+                this.preViewAttach(row);
+              }, "primary")
+            ]);
+          }else {
+            return h("div", [
+              operateBtn(this, h, row, "下载", () => {
+                this.getAttach(row);
+              }, "primary")
+            ]);
+          }
+
+        }
+
+      });
+
+      return column;
+    },
+
+
+  },
+  provide() {
+    return {
+      toBeDoneListDoSearch: this.doSearch
+    };
+  },
+  methods: {
+    initData(){
+      this.getAttachList()
+      this.getTaskId()
+      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.tableData = resp.data.data.rows
+        self.attachListShow = true
+      }).catch(err => {
+        console.log(err);
+      })
+    },
+    getTaskId(){
+      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
+          self.processPrint()
+        }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, taskId) => {
+          if (this.executionCompleted) {
+            this.executionCompleted(execResult, instanceId, taskId);
+          }
+        });
+      } else {
+        console.error('保存失败');
+      }
+    },
+    executeButtonAction(callback) {
+      const self = this;
+      if (self.auditResult == '82') {
+        self.assigneeBoxData = self.auditParams
+        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);
+                    bus.$emit('triggerTimer')
+                  } else {
+                    self.loading = false
+                    self.disable = false
+                    self.$Message.error(result.message)
+                    callback(false, null, null);
+                  }
+                  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){
+                  callback(true, result.data.processInstanceId, result.data.id)
+                }else {
+                  callback(true, null, null)
+                }
+              } else {
+                self.loading = false
+                self.disable = false
+                self.$Message.error(result.message)
+                callback(false, null, null);
+              }
+              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){
+              callback(true, result.data.processInstanceId, result.data.id)
+            }else {
+              callback(true, null, null)
+            }
+            self.$Message.success(result.message);
+          } else if (result.code == '20002') {
+            // 流程结束
+            self.loading = false
+            self.disable = false
+            callback(true, null, null)
+            self.$Message.success(result.message)
+          } else {
+            self.loading = false
+            self.disable = false
+            callback(false, null, null)
+            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.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.auditOpinion == '' || self.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
+        }
+      })
+    },
+
+    pageGoBack() {
+      bus.$emit('triggerTimer')
+      window.history.back()
+    },
+
+    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);
+
+        }
+      })
+    },
+
+    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.$refs['radio5'].currentValue = false;
+      this.auditResult = '';
+    },
+    ok() {
+      this.modal = false
+      if (this.targetTaskNode == '' || this.targetTaskNode == null) {
+        // this.$refs['radio5'].currentValue = false;
+        this.auditResult = '';
+        this.$Message.error("请选择审批节点！");
+      } else {
+        let self = this;
+
+        self.auditParams = {
+          procId: self.procId,
+          applyId: self.applyId,
+          taskId: self.taskId,
+          auditOpinion: self.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) {
+                self.executionCompleted(true, result.data.processInstanceId, result.data.id);
+              }
+              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) {
+      // 处理选中的用户ID，比如将其保存到数据中或执行其他逻辑
+      this.selectedUserId = userId;
+      // if (userId == null || userId == '') {
+      //   this.$refs['radio6'].currentValue = false;
+      // }
+    },
+
+    //折叠动画效果
+    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);
+    },
+    uploadFile(file){
+      const self = this;
+      self.fileList = []
+      file.forEach(item => {
+        self.fileList.push({
+          fileName: item.fileName,
+          fileId: item.fileCode,
+        });
+      })
+    },
+  },
+  watch: {
+    auditOpinionText(label) {
+      this.auditOpinion = label;
+    },
+    procId(val) {
+      this.procId = val;
+      this.initData()
+    },
+  }
+}
+</script>
+
+<style lang="less" scoped>
+
+/deep/ .ivu-table-row-highlight td {
+  background-color: #50c1ff !important;
+  color: #fff !important;
+}
+
+.process-history {
+  height: 68vh;
+  width: 100%;
+  overflow-y: auto;
+}
+
+.process-history::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+.process-history::-webkit-scrollbar-thumb {
+  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
+  border-radius: 5px;
+}
+
+.box {
+  overflow: hidden;
+  transition: height 0.3s ease;
+  height: auto;
+}
+
+.draw-enter-active, .draw-leave-active {
+
+}
+.horizontal-audit{
+  overflow-y: auto;
+}
+.horizontal-audit::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+.horizontal-audit::-webkit-scrollbar-thumb {
+  background: linear-gradient(to bottom right, #bbbbbb 0%, #bbbbbb 100%);
+  border-radius: 5px;
+}
+.draw-enter, .draw-leave-to {
+  height: 0;
+}
+.sticky{
+  position: sticky;
+  bottom : 0;
+  z-index: 100;
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+}
+</style>