<template>
  <baseTabPane
    :label="$t2('流程信息', 'components.wf.wfInfo')"
    :showFold="showWfFold"
    :defaultShowContent="showWfContent"
    v-if="!isHideWf"
  >
    <template #default>
      <div
        style="margin: -36px 0 8px 124px; position: relative; z-index: 2; height: 28px"
        v-if="!wfConfig.hiddenAllButton"
      >
        <el-button
          type="success"
          class="button-sty"
          @click="openAgreeDialog"
          v-show="wfInfo.toSubmit"
          icon="iconfont icon-tongguo"
          >{{ $t2("通过", "components.wf.agree") }}
        </el-button>
        <el-button
          type="warning"
          class="button-sty"
          @click="openManualDialog"
          v-show="wfInfo.toInterrupt"
          icon="iconfont icon-caozuozhongduan"
          >{{ $t2("中断", "components.wf.manual") }}
        </el-button>
        <el-button
          type="danger"
          class="button-sty"
          @click="rejectWfTask"
          v-show="wfInfo.toReject"
          icon="iconfont icon-a-bohui1"
          >{{ $t2("驳回", "components.wf.reject") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          @click="openChangeWfForm"
          v-show="
            wfInfo.toTransfer === null || wfInfo.toTransfer === undefined
              ? wfInfo.toSubmit
              : wfInfo.toTransfer
          "
          icon="iconfont icon-zhuanban"
          >{{ $t2("转办", "components.wf.transfer") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          @click="openUrgingDialog"
          v-show="wfInfo.toInterrupt"
          icon="iconfont icon-cuiban"
          >{{ $t2("催办", "components.wf.urging") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          @click="openAddIncreaseSign"
          v-show="wfInfo.toAddIncreaseSign"
          icon="el-icon-plus"
          >{{ $t2("加签", "components.wf.addIncreaseSign") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          @click="openDeleteTaskUserDialog"
          v-show="wfInfo.toDeleteIncreaseSign"
          icon="el-icon-delete"
          >{{ $t2("减签", "components.wf.deleteIncreaseSign") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          @click="openTalkDialog()"
          icon="el-icon-chat-dot-square"
          v-if="toTalk && wfInfo.toLinkup"
        >
          {{ $t2("沟通", "components.wf.talk") }}
        </el-button>
        <el-button
          type="primary"
          class="button-sty"
          @click="openSetCandidateDialog(null)"
          v-show="wfInfo.toSetCandidate"
          icon="el-icon-user"
          >{{ $t2("修改候选人", "components.wf.setCandidate") }}
        </el-button>
        <el-button
          type="danger"
          class="button-sty"
          @click="openRevokeDialog(null)"
          v-show="wfInfo.toRevoke"
          icon="el-icon-document-delete"
          >{{ $t2("撤回", "components.wf.revoke") }}
        </el-button>
        <addOpinionButton
          v-if="showAddOpinionButton"
          @confirm="reloadContent()"
          :wfInfo="wfInfo"
          :wfSendTaskId="wfSendTaskId"
          :current_prefix="current_prefix"
        ></addOpinionButton>
        <el-button
          type="primary"
          class="button-sty"
          @click="openWfFlowEleScriptDialog"
          v-if="wfInfo.wfAdmin"
          icon="el-icon-edit"
          >{{ $t1("修改脚本") }}
        </el-button>
      </div>
      <div class="title-name">
        <b>
          <em>{{ $t2("流程主题", "components.wf.theme") }}：</em>
          {{ wfInfo.name }}
        </b>
        <span v-html="wfInfo.statusStr" class="status"></span>
      </div>
      <div
        class="title-second"
        @click="showFlowImg = !showFlowImg"
        style="margin: 14px 0 24px; line-height: 29px; cursor: pointer"
      >
        <b>{{ $t2("流程图", "components.wf.wfImage") }}</b>
        <div class="fr" v-if="showFlowImg == true" style="font-weight: 400">
          <span>{{ $t2("收起", "components.wf.collapse") }}</span>
          <i class="el-icon-arrow-up"></i>
        </div>
        <div class="fr" v-else style="font-weight: 400">
          <span>{{ $t2("展开", "components.wf.expand") }}</span>
          <i class="el-icon-arrow-down"></i>
        </div>
      </div>
      <div class="flow-tree" style="padding-right: 0" v-show="showFlowImg == true">
        <div class="flow-box">
          <img :src="wfImage" />
          <el-tooltip
            :enterable="false"
            class="item"
            effect="dark"
            :content="$t2('放大', 'components.wf.enlarge')"
            placement="bottom"
          >
            <i
              class="el-icon-zoom-in btn-magnifier"
              @click="$window.open(wfImage)"
              style="right: 0"
            ></i>
          </el-tooltip>
        </div>
      </div>
      <div v-show="showWfInfoTab">
        <div class="title-tab">
          <div>
            <b :class="{ on: tabIndex == '1' }" @click="tabIndex = '1'">{{
              $t2("任务情况", "components.wf.taskInfo")
            }}</b>
            <b :class="{ on: tabIndex == '2' }" @click="tabIndex = '2'" v-if="toTalk">{{
              $t2("流程沟通", "components.wf.wfTalk")
            }}</b>
            <b
              :class="{ on: tabIndex == '4' }"
              @click="tabIndex = '4'"
              v-if="showCandidate"
              >{{ $t1("节点候选人") }}</b
            >
            <b
              :class="{ on: tabIndex == '3' }"
              @click="tabIndex = '3'"
              v-if="showAllWfOpinon"
              >{{ $t2("全部任务情况", "components.wf.allTaskInfo") }}</b
            >
          </div>
        </div>
        <div v-show="tabIndex == '1'">
          <div class="title-five"><b>任务流程</b></div>
          <div class="task-situation" style="padding-left: 14px">
            <div
              class="item"
              v-for="wftaskLineData in wftaskData"
              :key="wftaskLineData.id"
            >
              <div class="time">
                {{
                  wftaskLineData.approveTime
                    ? wftaskLineData.approveTime.substring(0, 10)
                    : ""
                }}
                <br />
                {{
                  wftaskLineData.approveTime
                    ? wftaskLineData.approveTime.substring(11)
                    : ""
                }}
              </div>
              <div
                class="status"
                :class="
                  taskStatuses[wftaskLineData.type]
                    ? taskStatuses[wftaskLineData.type].class
                    : ''
                "
              >
                {{
                  taskStatuses[wftaskLineData.type]
                    ? taskStatuses[wftaskLineData.type].value
                    : null
                }}
              </div>
              <i class="circle"></i>
              <div class="info">
                <p>
                  <span class="name">{{ wftaskLineData.taskName }}</span>
                  <span
                    >{{ $t2("执行人", "components.wf.approverName") }}：{{
                      wftaskLineData.approverName
                    }}</span
                  >
                  <span>
                    {{ $t2("候选人", "components.wf.candidateName") }}：
                    <span>
                      <span style="float: left; width: auto; margin-right: 10px">{{
                        wftaskLineData.candidateNames
                      }}</span>
                      <setCandidateButton
                        v-if="wftaskLineData.flag == 1"
                        style="float: left; width: auto"
                        :current_prefix="current_prefix"
                        :wfInfo="wfInfo"
                        :checkRow="wftaskLineData"
                        @confirm="reloadContent()"
                      ></setCandidateButton>
                    </span>
                  </span>
                </p>
                <p class="t">
                  <span class="t1">{{ $t2("备注/意见", "components.wf.opinion") }}：</span
                  ><span>{{ wftaskLineData.opinion }}</span>
                </p>
              </div>
            </div>
          </div>
          <div class="title-five" v-if="showWfMemo">
            <b>{{ $t1("发起人附言") }}</b>
            <el-button
              v-if="wfInfo.toAddMemo && !wfConfig.hiddenAllButton"
              class="button-sty"
              icon="el-icon-plus"
              @click="openWfMemoDialog()"
              type="primary"
              >{{ $t1("新增") }}</el-button
            >
          </div>
          <div class="postscript-box">
            <div class="item" v-for="(item, index) in wfMemoData" :key="index">
              <div class="txt" style="white-space: pre-wrap">{{ item.content }}</div>
              <div
                class="attach-box"
                v-if="item.attachmentDTOs && item.attachmentDTOs.length"
              >
                <baseUpload
                  accept="file"
                  multi="true"
                  :edit="false"
                  :widgetSize="1"
                  :file.sync="item.attachmentDTOs"
                ></baseUpload>
              </div>
              <div class="time">{{ item.createDate }}</div>
            </div>
          </div>
        </div>
        <div class="task-situation" v-show="toTalk && tabIndex == '2'">
          <vxe-grid
            ref="table-linkup"
            :auto-resize="true"
            v-bind="linkupOption"
            @resizable-change="$vxeTableUtil.onColumnWitchChange"
            @custom="$vxeTableUtil.customHandle"
          >
            <template #form>
              <div style="margin-bottom: 8px" class="clearfix">
                <div class="fl">
                  <el-button
                    type="primary"
                    class="button-sty"
                    @click="openTalkDialog()"
                    icon="el-icon-chat-dot-square"
                    v-if="wfInfo.toLinkup && !wfConfig.hiddenAllButton"
                    >{{ $t2("沟通", "components.wf.talk") }}
                  </el-button>
                </div>
                <div class="fr">
                  <!--                <vxe-button status="warning" icon="el-icon-search" class="button-sty" @click="searchEvent">搜索
                                  </vxe-button>-->
                </div>
              </div>
            </template>
            <template #sender="{ row }">
              <a
                href="javascript:void(0);"
                class="a-link"
                @click="openTalkDialog(row.sender, row.senderName, null, null, row.id)"
                v-if="row.replyToSender"
              >
                <el-tooltip
                  :enterable="false"
                  effect="dark"
                  :content="$t2('沟通', 'components.wf.talk')"
                  placement="top"
                  popper-class="tooltip-skin"
                >
                  <div>
                    <i class="el-icon-chat-dot-square"></i>
                    <span>{{ row.senderName }}</span>
                  </div>
                </el-tooltip>
              </a>
              <span v-else>{{ row.senderName }}</span>
            </template>
            <template #receiver="{ row }">
              <a
                href="javascript:void(0);"
                class="a-link"
                @click="
                  openTalkDialog(row.receiver, row.receiverName, null, null, row.id)
                "
                v-if="row.replyToReceiver"
              >
                <el-tooltip
                  :enterable="false"
                  effect="dark"
                  :content="$t2('沟通', 'components.wf.talk')"
                  placement="top"
                  popper-class="tooltip-skin"
                >
                  <div>
                    <i class="el-icon-chat-dot-square"></i>
                    <span>{{ row.receiverName }}</span>
                  </div>
                </el-tooltip>
              </a>
              <span v-else>{{ row.receiverName }}</span>
            </template>
            <template #operate="{ row }">
              <a
                href="javascript:void(0);"
                class="a-link"
                style="font-weight: bold; text-decoration: underline"
                @click="cancelTalk(row)"
                v-if="row.toCancel"
              >
                <el-tooltip
                  :enterable="false"
                  effect="dark"
                  :content="$t2('取消', 'system.button.cancel')"
                  placement="top"
                  popper-class="tooltip-skin"
                >
                  <div class="vxe-grid">
                    <i class="el-icon-document-delete"></i>
                    <span>{{ $t2("取消", "system.button.cancel") }}</span>
                  </div>
                </el-tooltip>
              </a>
            </template>
          </vxe-grid>
        </div>
        <div
          class="task-situation"
          v-show="showAllWfOpinon && tabIndex == '3'"
          style="max-height: 500px; overflow: hidden auto"
        >
          <div
            class="item"
            v-for="wftaskLineData in allWfTaskOpinions"
            :key="'allWfTaskOpinions' + wftaskLineData.id"
          >
            <div class="time">
              {{
                wftaskLineData.approveTime
                  ? wftaskLineData.approveTime.substring(0, 10)
                  : ""
              }}
              <br />
              {{
                wftaskLineData.approveTime ? wftaskLineData.approveTime.substring(11) : ""
              }}
            </div>
            <div
              class="status"
              :class="
                taskStatuses[wftaskLineData.type]
                  ? taskStatuses[wftaskLineData.type].class
                  : ''
              "
            >
              {{
                taskStatuses[wftaskLineData.type]
                  ? taskStatuses[wftaskLineData.type].value
                  : null
              }}
            </div>
            <i class="circle"></i>
            <div class="info">
              <p>
                <span class="name">{{ wftaskLineData.taskName }}</span>
                <span
                  >{{ $t2("执行人", "components.wf.approverName") }}：{{
                    wftaskLineData.approverName
                  }}</span
                >
                <span>
                  {{ $t2("候选人", "components.wf.candidateName") }}：
                  <span class="">{{ wftaskLineData.candidateNames }}</span>
                </span>
              </p>
              <p class="t">
                <span class="t1">{{ $t2("备注/意见", "components.wf.opinion") }}：</span
                ><span>{{ wftaskLineData.opinion }}</span>
              </p>
            </div>
          </div>
        </div>
        <template v-if="showCandidate">
          <div v-show="tabIndex == '4'">
            <div style="width: 800px">
              <vxe-grid
                ref="table-candidate"
                v-bind="candidateOption"
                :data="candidateDatas"
                @resizable-change="$vxeTableUtil.onColumnWitchChange"
                @custom="$vxeTableUtil.customHandle"
              ></vxe-grid>
            </div>
          </div>
        </template>
      </div>
      <!--沟通-->
      <el-dialog
        v-if="showTalkDialog"
        :visible.sync="showTalkDialog"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        :append-to-body="true"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("沟通", "components.wf.talk")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="talkForm">
          <div id="containt" style="height: 500px">
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("接收人", "components.wf.receiverName") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item field="receiverName">
                      <el-input
                        class="search-input"
                        max="200"
                        v-model="talkForm.receiverName"
                        @clear="
                          talkForm.receiver = null;
                          talkForm.replyId = null;
                          $forceUpdate();
                        "
                        :placeholder="$t2('接收人', 'components.wf.receiverName')"
                        v-el-readonly
                        clearable
                        :disabled="!!talkForm.replyId"
                      >
                        <i
                          slot="suffix"
                          class="el-input__icon el-icon-search"
                          @click="openTalkUserDialog"
                        ></i>
                      </el-input>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("沟通内容", "components.wf.talkContent") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item field="content">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="
                          $t2('沟通内容', 'components.wf.talkContentPlaceholder')
                        "
                        v-model="talkForm.content"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("沟通资料", "components.wf.talkAttachment") }}
                    </span>
                  </th>
                  <td>
                    <baseUpload
                      accept="file"
                      multi="true"
                      :file.sync="talkForm.attachmentDTOs"
                    ></baseUpload>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="showTalkDialog = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="submitTalkForm" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确 定", "system.button.confirm2") }}
          </el-button>
        </span>
      </el-dialog>

      <!--发起人附言-->
      <el-dialog
        v-if="showWfMemoDialog"
        :visible.sync="showWfMemoDialog"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        :append-to-body="true"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t1("发起人附言")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="wfMemoForm">
          <div id="containt" style="height: 500px">
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t1("内容") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item field="content">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="$t1('内容')"
                        v-model="wfMemoForm.content"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t1("附件") }}
                    </span>
                  </th>
                  <td>
                    <baseUpload
                      accept="file"
                      multi="true"
                      :file.sync="wfMemoForm.attachmentDTOs"
                    ></baseUpload>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="showWfMemoDialog = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="submitWfMemoForm" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确 定", "system.button.confirm2") }}
          </el-button>
        </span>
      </el-dialog>

      <el-dialog
        v-if="rejectDialogVisible"
        :visible.sync="rejectDialogVisible"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("流程驳回", "components.wf.wfReject")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="rejectForm">
          <div id="containt">
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("驳回节点", "components.wf.rejectNode") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="nodeId">
                      <el-select
                        v-model="rejectForm.nodeId"
                        :placeholder="
                          $t2('请选择驳回节点', 'components.wf.rejectNodePlaceholder')
                        "
                      >
                        <el-option
                          v-for="(rejectNode, index) in rejectNodes"
                          :label="rejectNode.nodeName"
                          :value="rejectNode.nodeId"
                          :key="index"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("驳回意见", "components.wf.rejectOpinion") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="opinion">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="
                          $t2('请输入内容', 'components.wf.rejectOpinionPlaceholder')
                        "
                        v-model="rejectForm.opinion"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="rejectDialogVisible = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="subRejectForm" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确 定", "system.button.confirm2") }}
          </el-button>
        </span>
      </el-dialog>
      <el-dialog
        v-if="agreeDialogVisible"
        :visible.sync="agreeDialogVisible"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("流程通过", "components.wf.wfAgree")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="agreeForm">
          <div id="containt">
            <table class="table-detail">
              <tbody>
                <tr v-if="agreeNodes.length > 0">
                  <th>
                    <span class="t">
                      {{ $t2("通过节点", "components.wf.agreeNode") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="nodeId">
                      <el-select
                        v-model="agreeForm.nodeId"
                        :placeholder="
                          $t2('请选择通过节点', 'components.wf.agreeNodePlaceholder')
                        "
                      >
                        <el-option
                          v-for="(node, index) in agreeNodes"
                          :label="node.nodeName"
                          :value="node.nodeId"
                          :key="index"
                        ></el-option>
                      </el-select>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("通过意见", "components.wf.agreeOpinion") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="opinion">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="
                          $t2(
                            `请填写您的意见~
         注：
         通过默认意见为“同意”
          `,
                            'components.wf.agreeOpinionPlaceholder'
                          )
                        "
                        v-model="agreeForm.opinion"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="agreeDialogVisible = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="subAgreeForm" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确 定", "system.button.confirm2") }}
          </el-button>
        </span>
      </el-dialog>
      <el-dialog
        v-if="changeWfDialogVisible"
        :visible.sync="changeWfDialogVisible"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        v-el-drag-dialog
        v-el-dialog-center
        :append-to-body="true"
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("流程转办", "components.wf.wfTransfer")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="changeWfForm">
          <div id="containt">
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("转办人", "components.wf.transferUser") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="nodeId">
                      <el-input
                        class="search-input"
                        max="200"
                        v-model="changeWfForm.userNickNames"
                        @clear="
                          changeWfForm.userIds = '';
                          changeUserRows = [];
                          $forceUpdate();
                        "
                        v-el-readonly
                        clearable
                      >
                        <i
                          slot="suffix"
                          class="el-input__icon el-icon-search"
                          @click="showUserDialog = true"
                        ></i>
                      </el-input>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("转办意见", "components.wf.transferOpinion") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="opinion">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="
                          $t2('请输入内容', 'components.wf.transferOpinionPlaceholder')
                        "
                        v-model="changeWfForm.opinion"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="changeWfDialogVisible = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="subChangeWfForm" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确认转办", "components.wf.confirmTransfer") }}
          </el-button>
        </span>
      </el-dialog>
      <el-dialog
        v-if="showWfManualDialog"
        :visible.sync="showWfManualDialog"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        width="501px"
        custom-class="dialog-style tips-dialog warning"
        :append-to-body="true"
        :show-close="false"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("流程中断", "components.wf.wfManual")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <div class="cont">
          {{ $t2("您确定要中断流程吗？", "components.wf.manualTip") }}
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="showWfManualDialog = false"
            ><i class="el-icon-close el-icon"></i
            >{{ $t2("取 消", "system.button.cancel2") }}</el-button
          >
          <el-button type="primary" @click="manualEndWf" class="button-sty"
            ><i class="el-icon-check el-icon"></i
            >{{ $t2("确 定", "system.button.confirm2") }}</el-button
          >
        </span>
      </el-dialog>
      <el-dialog
        v-if="revokeDialogVisible"
        :visible.sync="revokeDialogVisible"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        v-el-drag-dialog
        v-el-dialog-center
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("流程撤回", "components.wf.wfRevoke")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="revokeForm">
          <div id="containt">
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("撤回意见", "components.wf.revokeOpinion") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item label="" field="opinion">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="
                          $t2('请输入内容', 'components.wf.revokeOpinionPlaceholder')
                        "
                        v-model="revokeForm.opinion"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="revokeDialogVisible = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="subRevokeForm(0)" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确 定", "system.button.confirm2") }}
          </el-button>
        </span>
      </el-dialog>
      <el-dialog
        v-if="showAddIncreaseSignDialog"
        :visible.sync="showAddIncreaseSignDialog"
        :modal-append-to-body="false"
        :close-on-click-modal="false"
        :modal="false"
        custom-class="dialog-style wf-dialog"
        v-el-drag-dialog
        v-el-dialog-center
        :append-to-body="true"
      >
        <template #title>
          <span class="el-dialog__title"
            >{{ $t2("流程加签", "components.wf.wfAddIncreaseSign")
            }}<span style="margin-left: 10px; margin-right: 10px">—</span
            ><b class="f-red" style="font-size: 12px"
              >{{ $t2("节点", "components.wf.node") }}：{{ wfInfo.taskName }}</b
            ></span
          >
        </template>
        <el-form :model="addIncreaseSignForm">
          <div id="containt">
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("候选人", "components.wf.addIncreaseSignUser") }}
                    </span>
                  </th>
                  <td>
                    <el-form-item field="receiverName">
                      <el-input
                        class="search-input"
                        max="200"
                        v-model="addIncreaseSignForm.userNickNames"
                        @clear="
                          addIncreaseSignUsers = [];
                          $forceUpdate();
                        "
                        :placeholder="$t2('候选人', 'components.wf.addIncreaseSignUser')"
                        v-el-readonly
                        clearable
                      >
                        <i
                          slot="suffix"
                          class="el-input__icon el-icon-search"
                          @click="showAddTaskUserDialog = true"
                        ></i>
                      </el-input>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <span class="t">
                      {{ $t2("加签意见", "components.wf.addIncreaseSignOpinion") }}
                    </span>
                  </th>
                  <td colspan="3">
                    <el-form-item field="opinion">
                      <el-input
                        type="textarea"
                        :rows="8"
                        :placeholder="
                          $t2(
                            '请输入内容',
                            'components.wf.addIncreaseSignOpinionPlaceholder'
                          )
                        "
                        v-model="addIncreaseSignForm.opinion"
                      ></el-input>
                    </el-form-item>
                  </td>
                </tr>
              </tbody>
            </table>
          </div>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button
            type="primary"
            plain
            class="button-sty"
            @click="showAddIncreaseSignDialog = false"
          >
            <i class="el-icon-close el-icon"></i>
            {{ $t2("取 消", "system.button.cancel2") }}
          </el-button>
          <el-button type="primary" @click="submitAddTaskUserForm(0)" class="button-sty">
            <i class="el-icon-check el-icon"></i>
            {{ $t2("确认加签", "components.wf.confirmAddIncreaseSign") }}
          </el-button>
        </span>
      </el-dialog>
      <user-dialog
        v-if="showUserDialog"
        :visiable.sync="showUserDialog"
        @close="showUserDialog = false"
        @confirm="userConfirm"
        multi="true"
        :param.sync="wfUserParamForTransfer"
        :rows="changeUserRows"
      ></user-dialog>

      <urgingDialog
        v-if="urgingDialogVisible"
        :visiable.sync="urgingDialogVisible"
        :wfInfo="wfInfo"
        :current_prefix="current_prefix"
        @confirm="reloadContent"
        multi="true"
      ></urgingDialog>
      <deleteTaskUserDialog
        v-if="showDeleteTaskUserDialog"
        :visiable.sync="showDeleteTaskUserDialog"
        :wfInfo="wfInfo"
        :current_prefix="current_prefix"
        @confirm="reloadContent"
        multi="true"
      ></deleteTaskUserDialog>

      <addTaskUserdialog
        v-if="showAddTaskUserDialog"
        :visiable.sync="showAddTaskUserDialog"
        :wfInfo="wfInfo"
        :current_prefix="current_prefix"
        :rows.sync="addIncreaseSignUsers"
        @confirm="confirmAddTaskUser"
        multi="true"
        :param.sync="wfUserParamForAddSign"
      ></addTaskUserdialog>
      <user-dialog
        v-if="showTalkUserDialog"
        :visiable.sync="showTalkUserDialog"
        @close="showTalkUserDialog = false"
        @confirm="confirmTalkUserDialog"
        multi="false"
        :param.sync="wfUserParamForTalk"
      ></user-dialog>
      <setCandidateDialog
        v-if="showSetCandidateDialog"
        :visiable.sync="showSetCandidateDialog"
        @close="closeSetCandidateDialog"
        :wfInfo="wfInfo"
        :current_prefix="current_prefix"
      ></setCandidateDialog>
      <wfFlowEleScriptDialog
        v-if="showWfFlowEleScriptDialog"
        :visiable.sync="showWfFlowEleScriptDialog"
        :wfInfo="wfInfo"
        :current_prefix="current_prefix"
      ></wfFlowEleScriptDialog>
    </template>
  </baseTabPane>
  <div v-else></div>
</template>

<script>
import { wfContentMixin } from "./wf.js";

export default {
  components: {
    UserDialog: () => import("../../views/user/user/dialog.vue"),
    urgingDialog: () => import("./urgingDialog"),
    deleteTaskUserDialog: () => import("./deleteTaskUserDialog"),
    addTaskUserdialog: () => import("./addTaskUserdialog"),
    setCandidateDialog: () => import("./setCandidateDialog"),
    setCandidateButton: () => import("./setCandidateButton"),
    addOpinionButton: () => import("./addOpinionButton"),
    wfFlowEleScriptDialog: () => import("./wfFlowEleScriptDialog"),
  },
  mixins: [wfContentMixin],
};
</script>
