<template>
  <div class="policy-recommend">
    <div class="policy-recommend-content">
      <cr-image class="Prc-left" width="" height="" :src="goods.img" />
      <div class="Prc-right">
        <p class="Prc-right-title">
          <span>30万</span>
          <span>{{ goods.guarantee_title }}</span>
        </p>
        <p class="Prc-right-desc">{{ goods.guarantee_sub }}</p>
      </div>
    </div>
    <cr-button class="policy-recommend-button" @click="goNext()">点此投保</cr-button>
    <cr-image
      class="policy-recommend-angle"
      width=""
      height=""
      src="@/assets/images/policy/recommend-angle@2x.png"
    />
  </div>
</template>
<script>
import GOODS_LIST from "@/api/goodsList.mock";

const goods = GOODS_LIST.find(v => v.id === "HTDQZJX001");

export default {
  name: "InsuranceRecommend",
  data() {
    return {
      goods
    };
  },
  methods: {
    goNext() {
      this.$router.push({
        path: "/goods/detail",
        query: { id: this.goods.id, type: this.goods.itype }
      });
    }
  }
};
</script>
<style lang="less" src="../index.less" scoped></style>
