<template>
  <div class="refund-apply">
    <refund-apply-content ref="appluContent" :details-info="detailsData"></refund-apply-content>
    <div class="submit-btn">
      <el-button type="primary" style="width: 150px;" @click="onSubmit">提交</el-button>
      <el-button style="width: 150px;" @click="() => { $router.go(-1) }">取消</el-button>
    </div>
  </div>
</template>

<script>
import { applyRefund, submitApplyRefund } from '@/api/refundManage'

export default {
  components: {
    refundApplyContent: () => import('./components/refundApplyContent')
  },
  data() {
    return {
      detailsData: {}
    }
  },
  created() {
    if (this.$route.params && this.$route.params.id) {
      this.queryRefundDetails(this.$route.params.id)
    }
  },
  methods: {
    // 查询申请退款详情接口
    queryRefundDetails(queryId) {
      applyRefund({ id: queryId }).then((res) => {
        this.$nextTick(() => {
          this.detailsData = res.data
        })
      })
    },
    // 提交退款申请
    onSubmit() {
      this.$nextTick(() => {
        this.$refs.appluContent.beforeSubmitValidate().then((res) => {
          if (res.status === 'success') {
            const params = {
              ...this.$refs.appluContent.ruleForm,
              ledgerDetails: this.$refs.appluContent.refundDetails,
              paymentCollectionPlanFactorings: this.$refs.appluContent.payPlanData,
              businessKey: this.$route.params.id
            }
            if (this.$route.query && this.$route.query.taskId !== '') {
              params.taskId = this.$route.query.taskId
            }
            submitApplyRefund(params).then((res) => {
              this.$message.success(res.data)
              this.$router.go(-1)
            })
          }
        }).catch((err) => {
          console.log('appluContent.beforeSubmitValidate', err)
        })
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.refund-apply {

}
</style>
