<template>
  <div class="policy-detail">
    <div class="policy-detail-body">
      <Component :is="policy.cardConfig.component" :data="policy"></Component>
    </div>
  </div>
</template>
<script>
import Guarantee from "./Types/Guarantee";
import Refund from "./Types/Refund";
import policyStatusMixin from "../mixin/policyStatus.mixin";
import detailPayMixin from "@/views/Goods/Detail/modules/detailPay.mixin";
import { getPolicyDetail } from "@/api/policy";

export default {
  name: "PolicyList",
  mixins: [policyStatusMixin, detailPayMixin],
  provide() {
    return {
      getPolicy: this.getPolicy
    };
  },
  components: {
    Guarantee,
    Refund
  },
  data() {
    return {
      policy: {
        cardConfig: {
          component: ""
        }
      },
      timer: null
    };
  },
  async created() {
    await this.getPolicy();
    if (this.$route?.query?.isWxH5 && +this.policy?.payState !== 3) {
      this.$dialog({
        message: "请确认是否已经完成了微信免密支付签约",
        onCancel: this.refresh,
        onConfirm: this.refresh
      });
    }
  },
  methods: {
    async getPolicy() {
      const detail = await getPolicyDetail(this.$route.params.orderNo);
      this.policy = this.getData(detail);
    },
    refresh() {
      this.orderInfo = {
        payOrderNo: this.policy?.payInfo?.payOrderNo,
        payType: this.policy?.payInfo?.payOrderType,
        orderNo: this.policy?.orderNo
      };
      this.timer = window.setInterval(() => this.getPayResult(true), 3000);
      this.$once("hook:beforeDestroy", () => {
        window.clearInterval(this.timer);
        this.timer = null;
      });
    }
  }
};
</script>
<style lang="less" src="./index.less" scoped></style>
