<template>
  <div>
    <status-desc
      :cardConfig="data.cardConfig"
      :policySecId="data.policySecId"
      :payType="data.productItem && data.productItem.payType"
      :payTypeList="data.payType"
    ></status-desc>
    <pay-cost
      v-if="showPayCost"
      :statusKey="data.cardConfig.key"
      :payCostConfig="data.cardConfig.payCostConfig"
      :day="data.payInfo && data.payInfo.expiredDay"
      :payInfo="payInfo"
    ></pay-cost>
    <insurance-card
      :productNo="data.productNo"
      :policySecId="data.policySecId"
      :autoRenewPolicy="data.autoRenewPolicy"
      :policyNo="data.policyNo"
      :orderNo="data.orderNo"
      :clientReview="data.clientReview"
      :statusKey="data.cardConfig.key"
      v-if="showInsuranceCard"
    ></insurance-card>
    <security-content :data="data" :detail="planDetail"></security-content>
    <insurance-service :detail="qaDetail"></insurance-service>
    <customer-service></customer-service>
    <insurance-recommend class="Pdb-recommend" />
  </div>
</template>
<script>
import InsuranceRecommend from "../../modules/InsuranceRecommend";
import InsuranceCard from "../modules/InsuranceCard";
import SecurityContent from "../modules/SecurityContent";
import InsuranceService from "../modules/InsuranceService";
import PayCost from "../modules/PayCost";
import StatusDesc from "../modules/StatusDesc";
import CustomerService from "../modules/CustomerService";
import detailPayMixin from "@/views/Policy/mixin/orderInfo.mixin";
import { parseTime } from "@/service/utils";
import { cloneDeep } from "lodash-es";

import ciiDetail from "@/api/detail.huatai.zhongjixian";
import liDetail from "@/api/detail.huagui.shouxian";
import miDetail from "@/api/detail.taikang.yiliaobaozhang";
import aiDetail from "@/api/detail.zhongan.yiwai";
import biDetail from "@/api/detail.bainian.zhongshen";

export default {
  name: "Guarantee",
  mixins: [detailPayMixin],
  components: {
    InsuranceRecommend,
    InsuranceCard,
    SecurityContent,
    InsuranceService,
    PayCost,
    StatusDesc,
    CustomerService
  },
  props: {
    data: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      productInfo: {}
    };
  },
  watch: {
    data: {
      immediate: true,
      deep: true,
      handler() {
        this.setProductInfoByNo();
      }
    }
  },
  computed: {
    showPayCost() {
      return ["2", "4"].includes(this.data?.cardConfig?.key);
    },
    showInsuranceCard() {
      return this.data?.cardConfig?.key !== "4";
    },
    planDetail() {
      const {
        type,
        planCellInfo,
        securityContent,
        termOptions,
        benefitOptions,
        paywayOptions
      } = this.productInfo;
      let info = [];

      switch (this.data.productNo) {
        case "BNZJX001":
          info = securityContent
            .filter(v => {
              if (v.id === 7) {
                return this.data?.productItem?.additionalContract?.twiceSpecialDisease;
              } else if (v.id === 8) {
                return this.data?.productItem?.additionalContract?.deathCompensation;
              } else if (v.id === 9) {
                return this.data?.productItem?.additionalContract?.twiceSpecialDisease;
              }
              return true;
            })
            .map(v => {
              if (v.id === 10) {
                v.value = termOptions[this.data?.productItem?.policyPeriod - 1].label;
              } else if (v.id === 11) {
                v.value = this.EffectiveDate;
              } else if (v.id === 13) {
                v.value = benefitOptions[this.data?.productItem?.payPeriod - 1].label.slice(1);
              }
              return v;
            });
          break;
        case "HGSX001":
          info = securityContent.map(v => {
            if (v.id === 1 || v.id === 2) {
              v.value = `${this.data?.productItem?.amountInsured / 10000}万`;
            } else if (v.id === 3) {
              v.value = termOptions[this.data?.productItem?.policyPeriod - 1].label;
            } else if (v.id === 4) {
              v.value = this.EffectiveDate;
            } else if (v.id === 6) {
              v.value = benefitOptions[this.data?.productItem?.payPeriod - 1].label.slice(1);
            } else if (v.id === 7) {
              v.value = paywayOptions[this.data?.productItem?.payType - 1]?.label;
            }
            return v;
          });
          break;
        case "TKYLX001":
          info = [
            ...planCellInfo,
            ...[
              { title: "生效日期", value: this.EffectiveDate },
              { title: "终止日期", value: this.EndDate }
            ]
          ];
          break;
        case "HTDQZJX001":
          info = securityContent[this.data?.productItem?.amountInsured]?.map(v => {
            if (v.id === 3) {
              v.value = this.EffectiveDate;
            } else if (v.id === 4) {
              v.value = this.EndDate;
            }
            return v;
          });
          break;
        case "ZAYWX001":
          info = [
            ...planCellInfo[this.data?.productItem?.amountInsured],
            ...[
              { title: "生效日期", value: this.EffectiveDate },
              { title: "终止日期", value: this.EndDate }
            ]
          ];
          break;
      }

      return { type, planCellInfo: info };
    },
    qaDetail() {
      const { qaInfo, protocolData, popupArray } = this.productInfo;
      return { qaInfo, protocolData, popupArray };
    },
    EffectiveDate() {
      return parseTime(this.data.policyEffectiveDate, "{y}.{m}.{d}");
    },
    EndDate() {
      return parseTime(this.data.policyEndDate, "{y}.{m}.{d}");
    },
    payInfo() {
      return {
        payOrderNo: this.data?.payInfo?.payOrderNo,
        payType: this.data?.payInfo?.payOrderType,
        orderNo: this.data?.orderNo
      };
    }
  },
  methods: {
    // TODO 需要剔除无用的详情输入
    setProductInfoByNo() {
      const { productNo } = this.data;
      switch (productNo) {
        case "TKYLX001":
          this.productInfo = cloneDeep(miDetail);
          break;
        case "HTDQZJX001":
          this.productInfo = cloneDeep(ciiDetail);
          break;
        case "BNZJX001":
          this.productInfo = cloneDeep(biDetail);
          break;
        case "ZAYWX001":
          this.productInfo = cloneDeep(aiDetail);
          break;
        case "HGSX001":
          this.productInfo = cloneDeep(liDetail);
          break;
        default:
          break;
      }
    }
  }
};
</script>
<style lang="less" src="../index.less" scoped></style>
