<template>
  <div class="Pdb-content">
    <div class="Pdb-content-head">
      <span class="Pdbc-head-name">保障内容</span>
      <span class="Pdbc-head-status">查看详情</span>
    </div>
    <div class="Pdb-content-body">
      <div class="Pdbc-body-item">
        <span>100种重大疾病医疗保险金（0免赔额）</span>
        <span>600万</span>
      </div>
      <div class="Pdbc-body-item">
        <span>一般医疗保险金（1万免赔额）</span>
        <span>300万</span>
      </div>
      <div class="Pdbc-body-item">
        <span>质子重离子医疗保险金（60%赔付）</span>
        <span>600万</span>
      </div>
      <div class="Pdbc-body-item">
        <span>意外身故</span>
        <span>1万</span>
      </div>
      <div class="Pdbc-body-item">
        <span>意外伤残</span>
        <span>1万</span>
      </div>
      <div class="Pdbc-body-item">
        <span>意外住院津贴</span>
        <span>100元/天</span>
      </div>
      <div class="Pdbc-body-item">
        <span>生效日期</span>
        <span>{{ EffectiveDate }}</span>
      </div>
      <div class="Pdbc-body-item">
        <span>终止日期</span>
        <span>{{ EndDate }}</span>
      </div>
    </div>
    <div class="Pdb-content-operation">
      <cr-button class="Pdbc-button" @click="showPdf">电子保单</cr-button>
    </div>
    <div class="Pdb-content-user">
      <p class="Pdbc-user-who">投保人</p>
      <div class="Pdbc-user-info">
        <span>{{ data.holderUserNameMask }}</span>
        <span>身份证号 {{ data.holderIdNoMask }}</span>
      </div>
    </div>
    <div class="Pdb-content-user">
      <p class="Pdbc-user-who">被保人</p>
      <div class="Pdbc-user-info">
        <span>{{ data.insuredUserNameMask }}</span>
        <span>身份证号 {{ data.insuredIdNoMask }}</span>
      </div>
    </div>
  </div>
</template>
<script>
import { parseTime } from "@/service/utils";

export default {
  name: "SecurityContent",
  props: {
    data: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {};
  },
  computed: {
    EffectiveDate() {
      return parseTime(this.data.policyEffectiveDate, "{y}-{m}-{d}");
    },
    EndDate() {
      return parseTime(this.data.policyEndDate, "{y}-{m}-{d}");
    }
  },
  methods: {
    showPdf() {
      this.$router.push({ path: "/policy/virtual-detail", query: { url: this.data.policyUrl } });
    }
  }
};
</script>
<style lang="less" src="../index.less" scoped>
container {
  width: 100%;
  height: 100%;
}
</style>
