<template>
  <div class="order-goods-list-con common">
    <div class="shop flex-default" @click="goShop(data.merchantId)">
      <m-icon icon="icon-shop" :size="15" />
      <span class="name">{{ data.enterpriseName }}</span>
      <m-icon icon="icon-more" :size="10" />
    </div>
    <div
      class="goods flex-default"
      v-for="(item, index) of data.orders"
      :key="`goods-item-${index}`"
      @click="goGoods(item.goodsId, item.type,item.salesType)"
    >
      <img class="thumb" :src="item.thumb" />
      <div class="spu">
        <div class="name">{{ item.name }}</div>
        <div class="sku">{{ item.propList | propFilter(item) }}</div>
      </div>
      <div class="price">
        <div class="amt">￥{{ item.amount || 0 }}</div>
        <div class="num">X{{ item.number }}</div>
      </div>
    </div>

    <!-- <div class="opt flex-default">
      <m-button size="small" plain class="opt-btn black">追加评价</m-button>
      <m-button size="small" plain class="opt-btn">再次购买</m-button>
    </div> -->

    <div class="info-list">
      <div class="info">
        <span class="label">商品总价</span>
        <span class="amt">￥{{ data.total }}</span>
      </div>
      <!-- <div class="info">
        <span class="label">运费</span>
        <span class="amt">￥{{ data.postFee }}</span>
      </div> -->
      <div class="info" v-show="data.couponAmount">
        <span class="label">优惠券</span>
        <span class="amt">-￥{{ data.couponAmount }}</span>
      </div>
      <div class="info" v-show="data.promotionAmount">
        <span class="label">促销</span>
        <span class="amt">-￥{{ data.promotionAmount }}</span>
      </div>
      <!-- <div class="info">
        <span class="label">积分</span>
        <span class="amt">-￥0</span>
      </div> -->
      <div class="total flex-default">
        <span class="label">实付款</span>
        <m-price
          :amt="data.amount || 0"
          :intSize="16"
          :floatSize="13"
          :rmbSize="11"
        />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    data: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  computed: {},
  filters: {
    // propFilter(val) {
    //   if (!val) {
    //     return "";
    //   }
    //   return val.map((item) => item.value).join(" + ");
    // },
    propFilter(props,detail) {
      if(props){
        return props.map((item) => item.value).join("+");
      }else{
        if(detail.salesType===4){
          return '盲盒'
        }
        return ""
      }
    },
  },
  methods: {},
};
</script>

<style lang="less">
@import "../components/goods-list.less";
</style>



