yicangzongtai_app_240321/components/ld-goods/ld-goods-black.vue

<template>
  <view class="goodsItem u-border-one  u-flex-center">
    <image :src="value.goods_cover" v-if="value.goods_cover" class="u-goods200 u-ml15" mode=""></image>
    <image :src="value.goods_img" v-if="value.goods_img" class="u-goods200 u-ml15" mode=""></image>
    <view class="right-block">
      <view class="u-text2 u-1A1A1A u-font28 textWidth u-text2">
        <text class="thirdTag" v-if="third == true">第三方</text><text>{{value.goods_title}}</text>
      </view>
      <view class="bottext u-flex-column-start u-flex1">
        <text class="u-font22 u-999 specifications" v-if="value.sku_set_name">规格： {{value.sku_set_name}}</text>

      </view>
      <view class="bottext  u-flex1 u-flex">
        <rich-text class="font-red" v-if="value.sale_price" :nodes="$mUtil.priceBigSmall(value.sale_price)">

        </rich-text>
        <text class="u-font26 u-666 num-left" v-if="value.refund_num">x {{value.refund_num}}</text>

      </view>

    </view>

  </view>
</template>

<script>
  export default {
    props: {
      value: {
        type: Object,
        default: {}
      },
      position: {
        type: Number,
        default: 0
      },
      keys: {
        type: Number,
        default: 0
      },
      third: {
        type: Boolean,
        default: false
      }
    },
    data() {
      return {
        price: 66.2
      }
    },
    methods: {
      evaluation(id) {
        let data = {
          id: id,
          keys: this.keys
        }
        this.$emit('parentevaluation', data)
      }
    }
  }
</script>

<style>
  .num-left {
    margin-left: 10rpx;
    font-weight: 500;
  }

  .font-red {
    color: red;
  }

  .specifications {
    margin-top: 20rpx;
    margin-bottom: 14rpx;
  }

  .right-block {
    height: 200rpx;
    margin-left: 30rpx;
  }

  .goodsItem {
    padding: 40rpx 0;
    position: relative;
  }

  .thirdTag {
    display: inline-block;
    background: #30b885;
    border-radius: 10rpx;
    line-height: 40rpx;
    text-align: center;
    margin-right: 10rpx;
    padding: 0 10rpx;
    color: #fff;
    font-size: 26rpx;
  }

  .textWidth {
    width: 420rpx;
    height: 80rpx;
    line-height: 40rpx;

  }

  .btnComment_status {
    position: absolute;
    right: 0;
    bottom: 60rpx;
    background-color: #0B844A;
    width: 180rpx;
    height: 65rpx;
    text-align: center;
    line-height: 65rpx;
    color: #fff;
    font-size: 28rpx;
    border-radius: 40rpx;
  }
</style>