<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 { getPolicyDetail } from "@/api/policy";

export default {
  name: "PolicyList",
  mixins: [policyStatusMixin],
  provide() {
    return {
      getPolicy: this.getPolicy
    };
  },
  components: {
    Guarantee,
    Refund
  },
  data() {
    return {
      policy: {
        cardConfig: {
          component: ""
        }
      }
    };
  },
  created() {
    this.getPolicy();
  },
  methods: {
    async getPolicy() {
      const detail = await getPolicyDetail(this.$route.params.orderNo);
      this.policy = this.getData(detail);
    }
  }
};
</script>
<style lang="less" src="./index.less" scoped></style>
