karlcarlo
a5c5d753b6
- 新增大量图片资源，包括图标、背景图、海报等，用于页面展示 - 添加字体文件及样式配置，支持自定义字体 - 引入 uni-ui 组件库，包括图标、弹窗、日期选择器等常用组件 - 添加网络状态监听、加密工具等基础工具函数 - 配置 Vuex 状态管理，包括购物车数量、热门搜索词等 - 增加页面组件，如用户协议、分销信息、提现状态等 - 配置项目构建和忽略文件，优化开发体验
119 lines
2.6 KiB
Vue
119 lines
2.6 KiB
Vue
<template>
|
||
<view class="lottery_container">
|
||
<view class="grid_wrap">
|
||
<view class="lottery_wrap">
|
||
<ul class="lottery_grid">
|
||
<li v-for="(item, index) in prizeData" :class="{ active: current_index == index && index != 8 }"
|
||
:key="index" @click="luck_draw" :data-index="index">
|
||
<view :class="{in_line:index != 8 }" class="lottery-msg">
|
||
<image v-if="index != 8" class="grid_img" mode='aspectFit' :src="item.image" alt="" />
|
||
<text v-if="index !=8" class="name">
|
||
{{ index == 8 ? '抽奖' : item.name }}
|
||
</text>
|
||
<view v-else class="flex-col flex-center lottery-click">
|
||
<image src="../../static/lottery_text.png" class="w-140 h-32 block"></image>
|
||
<text class="fs-20 lh-28rpx pt-6">剩余 {{lotteryNum}} 次机会</text>
|
||
</view>
|
||
</view>
|
||
</li>
|
||
</ul>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script>
|
||
import LotteryDraw from './js/grids_lottery.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
current_index: -1,
|
||
lotteryBtn: true
|
||
};
|
||
},
|
||
props: {
|
||
prizeData: {
|
||
type: Array,
|
||
default: function() {
|
||
return []
|
||
}
|
||
},
|
||
lotteryType: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
datatime: {
|
||
type: Number,
|
||
default: 0
|
||
},
|
||
lotteryNum:{
|
||
type: Number,
|
||
default: 0
|
||
}
|
||
},
|
||
onLoad() {
|
||
|
||
},
|
||
|
||
methods: {
|
||
luck_draw(event) {
|
||
console.log(123456);
|
||
let timestamp = Date.parse(new Date())/1000;
|
||
if(this.lotteryType == 1 && parseInt(timestamp)>parseInt(this.datatime)){
|
||
return this.$util.Tips({
|
||
title: '您抽奖的有效时间已到期'
|
||
},function(){
|
||
uni.switchTab({
|
||
url: '/pages/index/index'
|
||
})
|
||
});
|
||
}
|
||
let index = event.currentTarget.dataset.index;
|
||
if (this.lotteryBtn && index == 8) {
|
||
this.lotteryBtn = false
|
||
} else {
|
||
return
|
||
}
|
||
let that = this;
|
||
if (index == 8) {
|
||
// 点击抽奖之后知道获奖位置，修改父组件中lottery_draw_param的值
|
||
this.$emit('get_winingIndex', function(res) {
|
||
let lottery_draw_param = res;
|
||
let win = new LotteryDraw({
|
||
domData: that.prizeData,
|
||
...lottery_draw_param
|
||
},
|
||
function(index, count) {
|
||
that.current_index = index;
|
||
if (lottery_draw_param.winingIndex == index && lottery_draw_param.totalCount ==
|
||
count) {
|
||
that.lotteryBtn = true
|
||
that.$emit('luck_draw_finish', that.prizeData[index])
|
||
}
|
||
}
|
||
);
|
||
});
|
||
|
||
}
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
@import './css/pay_lottery.css';
|
||
|
||
.lottery-msg {
|
||
width: 100%;
|
||
height: 100%;
|
||
padding: 0 4rpx;
|
||
|
||
.name {}
|
||
}
|
||
|
||
.lottery-click {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
</style> |