baiyuApp/pages_live/components/giftPopup.vue

<template>
 <u-popup :show="show" @close="handleClose" round="20rpx" bgColor="#f3f5f9" zIndex="10076">
 	<view class="more-block">
 		<view class="item" @click="navgetTo('/pages/user/integral/integralGoodsList'), (isMore = false)">
 			<image class="icon" src="/static/images/live/order.png" />
 			<view style="text-align: center">芳华币</view>
 		</view>
 		<view class="item"
 			@click="navgetTo('/pages_shopping/live/storeOrderRefundList?liveId=' + liveId), (isMore = false)">
 			<image class="icon" src="/static/images/live/after_sales.png" />
 			<view style="text-align: center">售后订单</view>
 		</view>
 		<view class="item" @click="goMiniProgram(), (isMore = false)">
 			<image class="icon" src="/static/images/live/points.png" />
 			<view style="text-align: center">兑换好礼</view>
 		</view>
 		<view class="item" @click="getMyLottery(), (isMore = false), (winning = true)">
 			<image class="icon" src="/static/images/live/health_sel.png" />
 			<view style="text-align: center">中奖记录</view>
 		</view>
 	</view>
 </u-popup>
</template>

<script>
export default {
  // name: 'giftPopup',
  
  props: {
    // 控制显示/隐藏
    show: {
      type: Boolean,
      default: false
    },
    // 中奖记录列表
    prizeList: {
      type: Array,
      default: () => []
    },
    // 直播间ID
    liveId: {
      type: [String, Number],
      default: ''
    },
    // 滚动区域高度
    scrollHeight: {
      type: Number,
      default: 500
    }
  },
  
  data() {
    return {};
  },
  
  methods: {
    /**
     * 关闭弹窗
     */
    handleClose() {
      this.$emit('close');
    },
    
    /**
     * 处理填写地址
     */
    handleFillAddress(item) {
      this.$emit('fill-address', {
        productId: item.productId,
        recordId: item.id,
        liveId: this.liveId,
        item: item
      });
    },
    
    /**
     * 格式化时间显示
     */
    formatTime(timeStr) {
      if (!timeStr) return '';
      // 简单的格式化，可以根据需要调整
      return timeStr.length > 10 ? timeStr.substring(5, 16) : timeStr;
    },
    
    /**
     * 截断字符串
     */
    truncateString(str, maxLength) {
      if (typeof str !== 'string' || str.length <= maxLength) {
        return str || '';
      }
      return str.slice(0, maxLength) + '...';
    }
  }
};
</script>

<style scoped lang="scss">
.icon {
  width: 48rpx;
  height:48rpx;
}
.winning_record {
  position: relative;
  height: 800rpx;
  
  .head_bg {
    position: absolute;
    top: -125rpx;
    left: 50%;
    width: 311rpx;
    transform: translateX(-50%);
  }
  
  .bg {
    width: 100%;
    height: 100%;
  }
  
  .winning_content {
    position: absolute;
    top: 50rpx;
    color: #fff;
    width: 100%;
    padding: 0 36rpx;
    box-sizing: border-box;
    
    .title {
      text-align: center;
      font-size: 40rpx;
      font-weight: 500;
      margin-bottom: 40rpx;
    }
    
    .row {
      display: flex;
      justify-content: space-between;
      text-align: center;
      
      .start {
        width: 40%;
      }
      
      .center {
        width: 20%;
        
      
      }
        .button {
          background-color: #fff;
          border-radius: 20rpx;
          color: #f4410b;
          padding: 4rpx 8rpx;
        }
      .end {
        width: 40%;
      }
    }
  }
}


</style>