<template>
  <div class="approval-button-item revoke-button">
    <el-button
      type="danger"
      :size="btnSize"
      :disabled="disabled"
      @click="handleRevoke"
    >
      {{ $t('task.Recall') }}
    </el-button>
    <approval-dialog
      ref="approvalDialog"
      :dialog-title="$t('task.RecallSettings')"
      :is-show-upload="false"
      :opinion-label="$t('task.RecallReason')"
      :dialog-before-click="dialogBeforeClick"
      :alias="alias"
      @submit-form="handleSubmitForm"
    ></approval-dialog>
  </div>
</template>

<script>
  import ApprovalDialog from './ApprovalDialog'
  import approvalButton from '@/mixins/approvalButton'
  import { savaRevoke } from '@/api/process'
  import { resultJudge } from '@/utils/event.js'
  export default {
    name: 'RevokeButton',
    components: {
      ApprovalDialog,
    },
    mixins: [approvalButton],
    props: {
      nodeId: {
        type: String,
        default: '',
      },
    },
    computed: {
      isRequest() {
        return this.$route?.query?.type === 'request'
      },
      isDone() {
        return this.$route?.query?.type === 'done'
      },
    },
    methods: {
      handleRevoke() {
        if (this.beforeClick) {
          resultJudge(this.beforeClick(this.alias)).then((result) => {
            if (result) {
              this.$refs.approvalDialog.openDialog()
            }
          })
        } else {
          this.$refs.approvalDialog.openDialog()
        }
      },
      handleSubmitForm(dialogFormData, cb) {
        const { opinion } = dialogFormData
        let data = {
          instanceId: this.instId,
          isHandRevoke: this.isDone ? this.isDone : false,
          cause: opinion,
          taskId: this.doneTaskId,
        }
        if (this.nodeId) {
          data.revokeNodeId = this.nodeId
        }
        savaRevoke(data)
          .then((res) => {
            if (!res.state) return this.$message.error(res.message)
            if (res.value) {
              this.filterHasHandleTask()
              const query = {
                taskId: res.value,
                leaderId: 0,
                instId: this.instId,
                isGetApprovalBtn: true,
              }
              this.$router.push({
                path: `/matter/approvalForm`,
                query,
              })
              this.$baseEventBus.$emit('reload-router-view')
            } else {
              this.$router.push('/matter/myTask')
            }
            this.dialogAfterClick(this.alias)
          })
          .finally(() => {
            cb()
          })
      },
    },
  }
</script>

<style lang="scss" scoped></style>
