<template>
  <div class="dec-box-good" :class="className">
    <!-- 图片 角标  -->
    <div class="good-img">
      <img
        :class="imgH ? 'imgH' : 'imgW'"
        :style="{ height: imgH }"
        :src="decImgDomain(good.targetImg)"
      />
    </div>
    <!-- 名称 -->
    <div class="good-info">
      <div class="good-title" :class="titleClass">{{ good.targetName }}</div>
    </div>
    <!-- 价格 购买｜兼容点击宽高问题 -->
    <div class="price-sale">
      {{ salePrice }}
    </div>
    <!-- 剩余多少件 -->
    <div class="good-valid" v-if="show.stock">
      <div class="text dec-truncate">剩余{{ good.stock || 0 }}件</div>
    </div>
    <!-- 到期时间 -->
    <!-- <div class="good-valid" v-if="show.stop">
      <div class="text dec-truncate">{{good.endTime}}到期</div>
    </div> -->
  </div>
</template>
<script>
export default {
  inject: ["decImgDomain"],
  props: {
    good: {
      type: Object,
      default: () => {
        return {};
      },
    },
    show: {
      type: Object,
      default: () => {
        return {};
      },
    },
    imgArg: {
      type: String,
      default: "",
    },
    imgH: {
      type: String,
      default: "auto",
    },
  },
  data() {
    return {
      dot: " ",
    };
  },
  computed: {
    className() {
      let str = [];
      if (this.imgArg) str.push(this.imgArg);
      if (this.show.radius) str.push("radius");
      return str;
    },
    titleClass() {
      if (!this.imgH || this.imgH == "auto") {
        return "dec-truncate2";
      } else {
        return "dec-truncate";
      }
    },
    salePrice() {
      let arr = [];
      if (this.good.integral && this.good.integral > 0)
        arr.push(this.good.integral + "积分");
      if (this.good.paymentAmount && this.good.paymentAmount > 0)
        arr.push(this.good.paymentAmount + "元");
      return arr.length > 0 ? arr.join("+") : 0;
    },
  },
};
</script>
