<template>
  <view class="page">
    <RefundSuccessful
      v-if="refundDetail.goods[0].refund.status == 1"
      @checkMoney="checkMoney"
      :refundDetail="refundDetail"
      :i18n="i18n"
    />

    <RefundInProgress
      v-if="refundDetail.goods[0].refund.status == 0"
      :refundDetail="refundDetail"
    />

    <RefusalToRefund
      v-if="
        refundDetail.goods[0].refund.status == 2 ||
        refundDetail.goods[0].refund.status == 3
      "
      :refundDetail="refundDetail"
    />

    <RefundInformation
      :goodsDetail="refundDetail.goods[0]"
      :refundDetail="refundDetail"
      :language="language"
    />
    <MoneyDestination
      :show="show"
      @close="close"
      :refundDetail="refundDetail"
    />
    <view class="footer" v-if="refundDetail.goods[0].refund.status == 0">
      <button class="btn" @click="platformIntervene">
        {{ i18n.platformIntervention }}
      </button>
    </view>
  </view>
</template>

<script>
import RefundSuccessful from "./component/refundSuccessful.vue";
import RefundInProgress from "./component/refundInProgress.vue";
import RefusalToRefund from "./component/refusalToRefund.vue";
import RefundInformation from "./component/refundInformation.vue";
import MoneyDestination from "./component/moneyDestination.vue";
export default {
  components: {
    RefundInformation,
    MoneyDestination,
    RefundSuccessful,
    RefundInProgress,
    RefusalToRefund,
  },
  data() {
    return {
      show: false,
      status: 1,
      orderRefundId: "",
      refundDetail: {},
      language: this._language,
    };
  },
  onLoad(options) {
    this.orderRefundId = options.orderId;
    this.getDetail();
  },
  computed: {
    i18n() {
      return this.$t("index");
    },
  },
  methods: {
    checkMoney() {
      this.show = true;
    },
    close() {
      this.show = false;
    },
    //申请平台介入
    platformIntervene() {
      if (this.refundDetail.goods[0].refund.status != 3) {
        uni.$u.http
          .post(`/api/order_refund/platform_intervention`, {
            order_refund_id: this.refundDetail.goods[0].refund.id,
          })
          .then((res) => {
            uni.showToast({
              title: this.i18n.appliedIntervene,
              icon: "none",
            });
          });
      } else {
        uni.showToast({
          title: this.i18n.hasIntervened,
          icon: "none",
        });
      }
    },
    //获取售后订单详情
    getDetail() {
      uni.$u.http
        .post(`/api/order/refund_read`, { order_refund_id: this.orderRefundId })
        .then((res) => {
          this.refundDetail = res;
          console.log(this.refundDetail);
        });
    },
  },
  created() {
    uni.setNavigationBarTitle({
      title: this.i18n.refundDetails,
    });
  },
};
</script>

<style lang="scss" scoped>
.page {
  padding: 20rpx 24rpx;
  position: relative;
  .footer {
    position: fixed;
    bottom: 0;
    padding: 20rpx 24rpx 60rpx;
    background-color: #fff;
    left: 0;
    width: 94%;
    display: flex;
    justify-content: flex-end;
    .btn {
      margin: 0;
      padding: 0;
      background-color: #fff;
      border: 2rpx solid #979797;
      color: #222222;
      border-radius: 44rpx;
      width: 188rpx;
      height: 78rpx;
      line-height: 78rpx;
      font-size: 28rpx;
    }
  }
}
</style>
