<template>
  <div class="approval-button-item transfer-button">
    <el-button :disabled="disabled" :size="btnSize" @click="handleTransfer">
      {{ name }}
    </el-button>
    <approval-dialog
      ref="approvalDialog"
      is-show-user-selector
      :user-selector-is-single="true"
      :alias="alias"
      :dialog-title="$t('task.TransferSettings')"
      :opinion-label="$t('task.TransferInstructions')"
      @submit-form="handleSubmitForm"
    ></approval-dialog>
  </div>
</template>

<script>
  import ApprovalDialog from './ApprovalDialog'
  import { savaTransfer } from '@/api/process'

  import approvalButton from '@/mixins/approvalButton'

  export default {
    name: 'TransferButton',
    components: {
      ApprovalDialog,
    },
    mixins: [approvalButton],
    methods: {
      handleTransfer() {
        this.$refs.approvalDialog.openDialog()
      },
      handleSubmitForm(dialogFormData, cb) {
        const params = {
          messageType: 'inner',
          taskId: this.taskId,
          formData: JSON.stringify(this.data),
          formKey: this.formKey,
          ...dialogFormData,
        }
        savaTransfer(params)
          .then((res) => {
            if (!res.state) return this.$message.warning(res.message)
            // this.$router.push('/matter/myTask')
            this.filterHasHandleTask()
            this.dialogModeApprovalCompletionToMyTask()
          })
          .finally(() => {
            cb()
          })
      },
    },
  }
</script>

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