<template>
  <div>
    <status-desc :cardConfig="data.cardConfig" :policySecId="data.policySecId"></status-desc>
    <pay-cost
      v-if="showPayCost"
      :statusKey="data.cardConfig.key"
      :payCostConfig="data.cardConfig.payCostConfig"
      :payInfo="payInfo"
    ></pay-cost>
    <refund
      v-else
      :refundConfig="data.cardConfig.refundConfig"
      :amount="amount"
      :payTime="payTime"
      :payTimeText="payTimeText"
    ></refund>
    <Phone></Phone>
  </div>
</template>
<script>
import StatusDesc from "../modules/StatusDesc";
import Phone from "../modules/Phone";
import Refund from "../modules/Refund";
import PayCost from "../modules/PayCost";
import detailPayMixin from "@/views/Policy/mixin/orderInfo.mixin";
// import { parseTime } from "@/service/utils";

export default {
  name: "Guarantee",
  mixins: [detailPayMixin],
  components: {
    StatusDesc,
    Phone,
    Refund,
    PayCost
  },
  props: {
    data: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {};
  },
  computed: {
    amount() {
      console.log(this.data);
      return this.data.refundInfo?.amount || 0;
    },
    payTime() {
      return this.data.cardConfig.key === "8"
        ? this.data.refundInfo?.refundTime || "-"
        : this.data.refundInfo?.payTime || "-";
    },
    payTimeText() {
      return this.data.cardConfig.key === "8" ? "到账时间" : "支付时间";
    },
    showPayCost() {
      return ["4", "14", "13"].includes(this.data?.cardConfig?.key);
    }
  }
};
</script>
<style lang="less" src="../index.less" scoped></style>
