<!--
  Copyright (c) 2018-2999 广州市蓝海创新科技有限公司 All rights reserved.

  https://www.mall4j.com/

  未经允许，不可做商业用途！

  版权所有，侵权必究！
-->

<template>
  <view
    v-if="goodsList.length"
    class="Mall4j snap-up component-promotional-activities"
  >
    <view class="snap-up-head">
      <text class="snap-up-tit">
        {{ fieldData.activityType === 1 ? '团购' : '秒杀' }}
      </text>
      <view
        class="more-goods"
        @tap="toActiveList"
      >
        <text class="more-goods-txt">
          更多{{ fieldData.activityType === 1 ? '团购' : '秒杀' }}
        </text>
        <view class="more-icon">
          <image src="@/static/images/more.png" />
        </view>
      </view>
    </view>

    <!-- 列表 -->
    <scroll-view
      class="snap-up-goods-show"
      scroll-x="true"
      :show-scrollbar="false"
    >
      <!-- 商品盒子 -->
      <view
        v-for="(item, index) in goodsList"
        :key="index"
        class="snap-up-goods-box"
        @tap="setImgs(item, 'show') &&item.status!==1? '' : toActiveDetails(item)"
      >
        <view
          v-if="fieldData.activityType===1&&item.groupNumber&&!setImgs(item, 'show')"
          class="group-number"
        >
          {{ item.groupNumber }}人团
        </view>
        <view class="img-box">
          <img-show
            :src="item.pic"
            img-mode="aspectFit"
          />
          <!-- 下架商品蒙版 start -->
          <!-- 限时秒活动 -->
          <view
            v-if="setImgs(item, 'show')"
            class="imgs_shelves"
          >
            <image
              mode="aspectFit"
              :src="setImgs(item, 'src')"
            />
          </view>
          <!-- 下架商品蒙版 end -->
        </view>
        <view class="snap-up-price">
          <text class="symbol">
            ￥
          </text>
          {{ wxs.parsePrice(item.price || item.oriPrice)[0] + '.' + wxs.parsePrice(item.price || item.oriPrice)[1] }}
        </view>
        <view class="original-price">
          <text class="symbol">
            ￥
          </text>
          {{ wxs.parsePrice(item.oriPrice)[0] + '.' + wxs.parsePrice(item.oriPrice)[0] }}
        </view>
      </view>
      <!-- 查看更多 -->
      <view
        v-if="goodsList.length > 3"
        class="view-more"
        @tap="toActiveList"
      >
        {{ '查看更多' }}
        <image
          class="view-more-icon"
          src="@/static/images/more.png"
        />
      </view>
    </scroll-view>
  </view>
</template>

<script setup>
import beenSheLvesSion from '@/static/images/been_shelves.png'
import hasEndSion from '@/static/images/has_end.png'

const props = defineProps({
  fieldData: {
    type: Object,
    default: () => {
      return {}
    }
  },
  shopId: {
    type: [Number, String],
    default: 0
  },
  will: {
    // 需要获取的类型 默认首页
    type: String,
    default: 'home' // home 首页 ，feature 微页面  传 化名ID , goods 商品详情页，传商品ID ,ad 公共广告
  }
})

const wxs = number()

const goodsList = ref([])

const setImgs = computed(() => {
  return (item, val) => {
    const params = {
      status: false,
      imgs: beenSheLvesSion
    }
    if (props.fieldData.activityType === 2) { // 秒杀
      if (item.status !== 1) { // 当前就显示下架图标
        params.imgs = beenSheLvesSion
        params.status = true
      } else if ((item.status === 1 && item.prodType !== 2) || item.activityStatus !== 1) { // 显示结束图标
        params.imgs = hasEndSion
        params.status = true
      } else {
        params.status = false
      }
    } else if (props.fieldData.activityType === 1) { // 拼团
      if (item.status !== 1) { // 当前就显示下架图标
        params.imgs = beenSheLvesSion
        params.status = true
      } else if ((item.status === 1 && item.prodType !== 1) || item.activityStatus !== 1) { // 显示结束图标
        params.imgs = hasEndSion
        params.status = true
      } else {
        params.status = false
      }
    }
    if (val === 'show') {
      return params.status
    } else if (val === 'src') {
      return params.imgs
    }
  }
})

onMounted(() => {
  getGoodsList()
})

/**
 * 跳转活动商品
 */
const toActiveDetails = (item) => {
  if (item.status !== 1) {
    uni.showToast({
      title: '当前商品已下架',
      icon: 'error'
    })
    return
  }
  uni.navigateTo({
    url: '/pages/detail/detail?spuId=' + item.prodId
  })
}

/**
 * 跳转活动列表
 */
const toActiveList = () => {
  // activityType: 1团购  2秒杀
  uni.navigateTo({
    url: props.fieldData.activityType === 1 ? '/package-activities/pages/group-prods/group-prods' : '/package-activities/pages/seckill-prods/seckill-prods'
  })
}

/**
 * 获取活动商品列表
 */
const getGoodsList = () => {
  if (props.fieldData.prodIds.length) {
    goodsList.value = props.fieldData.prodIds
  }
}

</script>

<style lang="scss" scoped>
@use "index";
</style>
