Files
xdd-uniapp-new/pkg-video/views/lottery-log.vue
T

130 lines
3.0 KiB
Vue

<template>
<view class="pkg-lottery-log" v-if="ready">
<image style="width: 734rpx;height: 1418rpx" :src="webUrl+'/20240125215943273915.png'" mode="scaleToFill"/>
<view class="th flex">
<view>日期</view>
<view style="margin-left: 168rpx;">抽奖结果</view>
</view>
<scroll-view class="list-box" scroll-y @scrolltolower="onBottom">
<view class="item flex jc-between ai-center" v-for="(item,index) in list" :key="index">
<view class="flex ai-center">
<view style="width: 288rpx;color:#BD2323;font-size: 28rpx">{{ item['drawTime'] }}</view>
<view class="more-t">{{ item['prizeName'] }}</view>
</view>
<image class="flex-0" style="width: 111rpx;height: 64rpx" :src="webUrl+'/20240124232010456109.png'"
mode="scaleToFill" v-if="item['isHit']===1 && item['status']===1" @click="takeItem(item)"/>
</view>
</scroll-view>
</view>
</template>
<script>
import {getLogs, takePrize} from "@/api/lottery";
export default {
data() {
return {
webUrl: this.$VUE_APP_RESOURCES_URL,
ready: false,
page: 1,
list: []
}
},
onShow() {
this.page = 1
this.list = []
this.fetchList()
},
methods: {
async fetchList() {
const res = await getLogs(this.page, 20)
if (res.success) {
res.data['records']?.forEach(item => this.list.push(item))
this.ready = true
}
},
onBottom() {
this.page++
this.fetchList()
},
async takeItem (item) {
if (item['prizeType'] === 1 && item['status'] === 1) {
uni.navigateTo({
url: '/pages/order/OrderSubmission/index?lotteryRecordId=' + item['id']
})
return
}
const res = await takePrize(item.id)
if (res.success) {
item['status'] = 2
uni.showModal({
title: '领取成功',
content: '您的奖品已经领取成功,请前往我的订单查看奖品发货信息',
cancelText: '下次再说',
confirmText: '查看订单',
success: function (res) {
if (res.confirm) {
console.log('用户点击确定');
uni.navigateTo({
url: '/pages/order/MyOrder/index'
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
}
}
}
</script>
<style scoped lang="less">
.pkg-lottery-log {
position: relative;
min-height: 100vh;
box-sizing: border-box;
padding: 32rpx 8rpx 24rpx;
background-color: #BD2323
}
.th {
position: absolute;
left: 160rpx;
top: 136rpx;
}
.list-box {
position: absolute;
left: 42rpx;
top: 200rpx;
width: 672rpx;
height: 1150rpx;
.item {
width: 672rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
padding: 16rpx 6rpx 16rpx 32rpx;
border-radius: 24rpx;
background: #FFFBEE;
.more-t {
width: 204rpx;
color: #333333;
font-size: 32rpx;
line-height: 40rpx;
}
}
}
</style>