|
|
@@ -11,14 +11,15 @@
|
|
|
<view class="barrage-swiper-item flex">
|
|
|
<view class="barrage-swiper-item-content flex">
|
|
|
<image :src="item.avatar" mode="scaleToFill" />
|
|
|
- <view class="title ells-one">{{ item.nickName }} {{ item.type == 1 ? '刮出了' : '兑换了' }} {{ item.prizeInfo }}</view>
|
|
|
+ <view class="title ells-one">{{ item.nickName }}
|
|
|
+ {{ item.type == 1 ? '刮出了' : '兑换了' }} {{ item.prizeInfo }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</swiper-item>
|
|
|
</swiper>
|
|
|
<view class="barrage-none"></view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 查看规则 -->
|
|
|
<view class="rule">
|
|
|
<view class="rule-content flex" @click="toRule">
|
|
|
@@ -26,14 +27,16 @@
|
|
|
<text>查看规则</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 盲票轮播 -->
|
|
|
<view class="ticket">
|
|
|
- <swiper class="ticket-swiper" :current="ticketIndex" :autoplay="false" :circular="true" :duration="200" @change="changeTicket">
|
|
|
+ <swiper class="ticket-swiper" :current="ticketIndex" :autoplay="false" :circular="true"
|
|
|
+ :duration="200" @change="changeTicket">
|
|
|
<swiper-item v-for="(item, index) in ticketList" :key="index">
|
|
|
<view class="ticket-swiper-item flex" @click="toTicketBox(item)">
|
|
|
<image class="ticket-swiper-item-box" :src="item.picUrl[2]" mode="scaleToFill"></image>
|
|
|
- <image class="ticket-swiper-item-prize" :src="item.picUrl[1]" mode="scaleToFill"></image>
|
|
|
+ <image class="ticket-swiper-item-prize" :src="item.picUrl[1]" mode="scaleToFill">
|
|
|
+ </image>
|
|
|
</view>
|
|
|
</swiper-item>
|
|
|
</swiper>
|
|
|
@@ -43,20 +46,22 @@
|
|
|
<view class="ticket-right" @click="ticketLeft()">
|
|
|
<image src="../../static/index/index_tip_left.png" mode="scaleToFill"></image>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 投诉建议 -->
|
|
|
<view class="proposal flex">
|
|
|
<view class="proposal-time flex" v-if="activityTime && activityTime > 0" @click="toActivity">
|
|
|
<image src="../../static/index/index_time_top.png" mode="scaleToFill"></image>
|
|
|
<view class="time">
|
|
|
- <u-count-down :time="activityTime" format="HH:mm:ss:SSS" autoStart millisecond></u-count-down>
|
|
|
+ <u-count-down :time="activityTime" format="HH:mm:ss:SSS" autoStart millisecond>
|
|
|
+ </u-count-down>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-else></view>
|
|
|
<view class="proposal-progress">
|
|
|
- <u-line-progress :percentage="percentage" height="3" :showText="false" inactiveColor="rgba(255, 255, 255, .36)" activeColor="#fff" />
|
|
|
+ <u-line-progress :percentage="percentage" height="3" :showText="false"
|
|
|
+ inactiveColor="rgba(255, 255, 255, .36)" activeColor="#fff" />
|
|
|
</view>
|
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
|
<view class="proposal-tip" @click="contactService">
|
|
|
@@ -66,29 +71,33 @@
|
|
|
<!-- #endif -->
|
|
|
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 中奖概率 -->
|
|
|
<view class="chance flex">
|
|
|
<view class="chance-title">中奖概率:</view>
|
|
|
<view class="chance-hitRate flex">
|
|
|
- <view class="chance-hitRate-content flex" v-for="(item, index) in ticketInfo.ticketAwardsLabelList" :key="index">
|
|
|
+ <view class="chance-hitRate-content flex"
|
|
|
+ v-for="(item, index) in ticketInfo.ticketAwardsLabelList" :key="index">
|
|
|
<image :src="item.picUrl" mode="scaleToFill"></image>
|
|
|
<text>{{ item.hitRate }}%</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 盲票名称轮播 -->
|
|
|
<view class="ticket-title" flex>
|
|
|
- <swiper class="ticket-title-swiper flex" :duration="0" :current="ticketTitleIndex" previous-margin="110px" next-margin="110px" :autoplay="false" :circular="true" @change="changeTicketTitle">
|
|
|
+ <swiper class="ticket-title-swiper flex" :duration="0" :current="ticketTitleIndex"
|
|
|
+ previous-margin="110px" next-margin="110px" :autoplay="false" :circular="true"
|
|
|
+ @change="changeTicketTitle">
|
|
|
<swiper-item v-for="(item, index) in ticketList" :key="index" @click="clickTicketTitle(index)">
|
|
|
- <view class="ticket-title-swiper-item flex" :class="{ 'action': ticketTitleIndex == index }">
|
|
|
+ <view class="ticket-title-swiper-item flex"
|
|
|
+ :class="{ 'action': ticketTitleIndex == index }">
|
|
|
<text>{{ item.title }}</text>
|
|
|
</view>
|
|
|
</swiper-item>
|
|
|
</swiper>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 刮开盲票 -->
|
|
|
<view class="ticket-btn flex">
|
|
|
<view class="ticket-btn-left flex" @click="toRollingGame">
|
|
|
@@ -98,7 +107,8 @@
|
|
|
<view class="ticket-btn-center flex" @click="payment">
|
|
|
<view class="image-wrap flex">
|
|
|
<image class="btn" src="../../static/index/index_btn.png" mode="scaleToFill"></image>
|
|
|
- <image class="shadow" src="../../static/index/index_btn_shadow.png" mode="scaleToFill"></image>
|
|
|
+ <image class="shadow" src="../../static/index/index_btn_shadow.png" mode="scaleToFill">
|
|
|
+ </image>
|
|
|
</view>
|
|
|
<view class="ticket-btn-center-wrap flex">
|
|
|
<view class="ticket-btn-center-wrap__title">刮开<br />盲票</view>
|
|
|
@@ -109,7 +119,7 @@
|
|
|
<view class="ticket-btn-right__title">更多盲票</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
<!-- 盲票价格 -->
|
|
|
<view class="ticket-price flex">
|
|
|
<view class="ticket-price-amt flex">
|
|
|
@@ -121,7 +131,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
+
|
|
|
</view>
|
|
|
<!-- tabbar组件 -->
|
|
|
<custom-tab-bar :activeValue="'index'" />
|
|
|
@@ -154,9 +164,9 @@
|
|
|
statusHeight: 20,
|
|
|
ticketIndex: 0, // 盲票选中下标
|
|
|
ticketTitleIndex: 0, // 盲票标题选中下边
|
|
|
- list: [1,2,3,4,5],
|
|
|
+ list: [1, 2, 3, 4, 5],
|
|
|
percentage: 0,
|
|
|
- checkStatus: true,
|
|
|
+ checkStatus: true,
|
|
|
filterActivityList: [],
|
|
|
activityTime: null,
|
|
|
ticketInfo: {},
|
|
|
@@ -166,7 +176,16 @@
|
|
|
},
|
|
|
onLoad(opthios) {
|
|
|
if (opthios.userId) {
|
|
|
- uni.setStorageSync('shareUid', opthios.userId)
|
|
|
+ uni.setStorageSync('shareUid', opthios.userId != 'undefined' ? opthios.userId : null)
|
|
|
+ if (opthios.userId === undefined || opthios.userId === 'undefined') {
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success(res) {
|
|
|
+ log.error(
|
|
|
+ `基础库：${ res.SDKVersion },设备：${ res.model }-${ res.system },页面：/pages/index/index.vue.`
|
|
|
+ )
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
}
|
|
|
if (opthios.type) {
|
|
|
uni.setStorageSync('shareType', opthios.type)
|
|
|
@@ -180,23 +199,40 @@
|
|
|
let sceneStr = decodeURIComponent(opthios.scene)
|
|
|
this.sceneArr = sceneStr.split('&')
|
|
|
uni.setStorageSync('shareUid', this.sceneArr[0])
|
|
|
+ if (this.sceneArr[0] === undefined || this.sceneArr[0] === 'undefined') {
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success(res) {
|
|
|
+ log.error(
|
|
|
+ `基础库：${ res.SDKVersion },设备：${ res.model }-${ res.system },页面：/pages/index/index.vue，来源：票赢天下小程序分享盲票，`
|
|
|
+ )
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
uni.setStorageSync('shareType', this.sceneArr[1])
|
|
|
}
|
|
|
-
|
|
|
/**
|
|
|
- * 外部app跳转接受的参数
|
|
|
- * shareUid: 用户ID
|
|
|
- * shareType: 分享类型
|
|
|
- * */
|
|
|
- if(opthios.uid) {
|
|
|
- uni.setStorageSync('shareUid', opthios.uid)
|
|
|
+ * 外部app跳转接受的参数
|
|
|
+ * shareUid: 用户ID
|
|
|
+ * shareType: 分享类型
|
|
|
+ * */
|
|
|
+ if (opthios.uid) {
|
|
|
+ uni.setStorageSync('shareUid', opthios.uid != 'undefined' ? opthios.uid : null)
|
|
|
+ if (opthios.uid === undefined || opthios.uid === 'undefined') {
|
|
|
+ uni.getSystemInfo({
|
|
|
+ success(res) {
|
|
|
+ log.error(
|
|
|
+ `基础库：${ res.SDKVersion },设备：${ res.model }-${ res.system },页面：/pages/index/index.vue，来源：外部app，`
|
|
|
+ )
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
uni.setStorageSync('shareType', opthios.t)
|
|
|
}
|
|
|
// #ifdef MP-WEIXIN
|
|
|
const res = uni.getMenuButtonBoundingClientRect()
|
|
|
this.statusHeight = res.top //胶囊距离顶部
|
|
|
// #endif
|
|
|
-
|
|
|
+
|
|
|
// #ifdef MP-ALIPAY
|
|
|
uni.getSystemInfo({
|
|
|
success: (res) => {
|
|
|
@@ -204,11 +240,11 @@
|
|
|
}
|
|
|
})
|
|
|
// #endif
|
|
|
-
|
|
|
+
|
|
|
let num = Math.round(100 / this.list.length)
|
|
|
this.percentage = num
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
this.getList()
|
|
|
},
|
|
|
onShow() {
|
|
|
@@ -221,33 +257,37 @@
|
|
|
},
|
|
|
methods: {
|
|
|
// 切换盲票
|
|
|
- changeTicket({ detail }) {
|
|
|
- if(this.clickLoading) {
|
|
|
+ changeTicket({
|
|
|
+ detail
|
|
|
+ }) {
|
|
|
+ if (this.clickLoading) {
|
|
|
this.clickLoading = false
|
|
|
this.ticketIndex = detail.current
|
|
|
this.ticketTitleIndex = detail.current
|
|
|
this.getTicketDetail(this.ticketList[detail.current].boxId)
|
|
|
this.setNum(detail.current)
|
|
|
- setTimeout(()=> {
|
|
|
+ setTimeout(() => {
|
|
|
this.clickLoading = true
|
|
|
}, 200)
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 切换盲票名称
|
|
|
- changeTicketTitle({ detail }) {
|
|
|
- if(this.clickLoading) {
|
|
|
+ changeTicketTitle({
|
|
|
+ detail
|
|
|
+ }) {
|
|
|
+ if (this.clickLoading) {
|
|
|
this.clickLoading = false
|
|
|
this.ticketIndex = detail.current
|
|
|
this.ticketTitleIndex = detail.current
|
|
|
this.getTicketDetail(this.ticketList[detail.current].boxId)
|
|
|
this.setNum(detail.current)
|
|
|
- setTimeout(()=> {
|
|
|
+ setTimeout(() => {
|
|
|
this.clickLoading = true
|
|
|
}, 200)
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 点击名称
|
|
|
clickTicketTitle(index) {
|
|
|
this.ticketIndex = index
|
|
|
@@ -255,7 +295,7 @@
|
|
|
this.getTicketDetail(this.ticketList[index].boxId)
|
|
|
this.setNum(index)
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
setNum(index) {
|
|
|
let num = Math.round(100 / this.list.length)
|
|
|
if (index == 0) {
|
|
|
@@ -266,7 +306,7 @@
|
|
|
this.percentage = uni.$u.range(0, 100, num * (index + 1))
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 投诉建议
|
|
|
contactService() {
|
|
|
// #ifdef MP-WEIXIN
|
|
|
@@ -278,18 +318,18 @@
|
|
|
})
|
|
|
// #endif
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 活动
|
|
|
getActivityList() {
|
|
|
$http.post(`/api/v1/mp/user/marketing/recent`, {}).then(res => {
|
|
|
- if(res && res.data) {
|
|
|
+ if (res && res.data) {
|
|
|
let data = res && res.data
|
|
|
let timestamp = parseInt(new Date().getTime())
|
|
|
this.activityTime = data.endTime - timestamp
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
// 获取盲票列表
|
|
|
getList() {
|
|
|
uni.showLoading({
|
|
|
@@ -305,7 +345,8 @@
|
|
|
res => {
|
|
|
uni.hideLoading();
|
|
|
if (res.code == 0) {
|
|
|
- res.rows.forEach(item => item.picUrl = item.picUrl.split(',').map(item => env.filePublic + item + '?imageView2/2/w/750'))
|
|
|
+ res.rows.forEach(item => item.picUrl = item.picUrl.split(',').map(item => env.filePublic +
|
|
|
+ item + '?imageView2/2/w/750'))
|
|
|
this.ticketList = res.rows
|
|
|
this.getTicketDetail(this.ticketList[0].boxId)
|
|
|
}
|
|
|
@@ -348,10 +389,13 @@
|
|
|
}).then(res => {
|
|
|
uni.hideLoading();
|
|
|
if (res.code == 0) {
|
|
|
- this.ticketInfo = {
|
|
|
+ this.ticketInfo = {
|
|
|
...res.data,
|
|
|
ticketAwardsLabelList: res.data.ticketAwardsLabelList.map(item => {
|
|
|
- return { ...item, picUrl: env.filePublic + item.picUrl }
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ picUrl: env.filePublic + item.picUrl
|
|
|
+ }
|
|
|
})
|
|
|
}
|
|
|
this.payInfo = this.ticketList[this.ticketIndex]
|
|
|
@@ -433,7 +477,7 @@
|
|
|
this.ticketTitleIndex = this.ticketIndex
|
|
|
this.getTicketDetail(this.ticketList[this.ticketTitleIndex].boxId)
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
toRollingGame() {
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
uni.navigateTo({
|
|
|
@@ -491,7 +535,7 @@
|
|
|
})
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
toActivity() {
|
|
|
uni.switchTab({
|
|
|
url: '/pages/activity/index'
|
|
|
@@ -524,7 +568,7 @@
|
|
|
url: '/packageOther/rule/index'
|
|
|
})
|
|
|
},
|
|
|
-
|
|
|
+
|
|
|
getBaseInfo() {
|
|
|
$http.post('/api/v1/mp/user/getLoginUserinfo', {}).then(res => {
|
|
|
uni.hideLoading();
|
|
|
@@ -571,7 +615,7 @@
|
|
|
height: calc(100vh - 50px);
|
|
|
background: url(https://mp-public-1310078123.cos.ap-shanghai.myqcloud.com/v2/front_bk.png) center center no-repeat;
|
|
|
background-size: 100vw calc(100vh - 50px);
|
|
|
-
|
|
|
+
|
|
|
.index {
|
|
|
position: absolute;
|
|
|
width: 100%;
|
|
|
@@ -583,17 +627,17 @@
|
|
|
position: relative;
|
|
|
width: 518rpx;
|
|
|
height: 70rpx;
|
|
|
-
|
|
|
+
|
|
|
border-radius: 42rpx;
|
|
|
margin-bottom: 16rpx;
|
|
|
margin-left: 34rpx;
|
|
|
-
|
|
|
+
|
|
|
&-bg {
|
|
|
position: absolute;
|
|
|
width: 518rpx;
|
|
|
height: 70rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-swiper {
|
|
|
position: absolute;
|
|
|
z-index: 10;
|
|
|
@@ -601,17 +645,17 @@
|
|
|
height: 100%;
|
|
|
border-radius: 42rpx;
|
|
|
overflow: hidden;
|
|
|
-
|
|
|
+
|
|
|
&-item {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
-
|
|
|
+
|
|
|
&-content {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
width: 510rpx;
|
|
|
height: 70rpx;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
width: 58rpx;
|
|
|
height: 58rpx;
|
|
|
@@ -620,7 +664,7 @@
|
|
|
border: 1px solid #fff;
|
|
|
margin-left: 8rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.title {
|
|
|
flex: 1;
|
|
|
font-size: 26rpx;
|
|
|
@@ -630,7 +674,7 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-none {
|
|
|
position: absolute;
|
|
|
width: 518rpx;
|
|
|
@@ -638,7 +682,7 @@
|
|
|
z-index: 20;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 查看规则
|
|
|
.rule {
|
|
|
display: flex;
|
|
|
@@ -647,14 +691,14 @@
|
|
|
height: 34rpx;
|
|
|
padding-right: 34rpx;
|
|
|
margin-bottom: 24rpx;
|
|
|
-
|
|
|
+
|
|
|
&-content {
|
|
|
image {
|
|
|
width: 34rpx;
|
|
|
height: 34rpx;
|
|
|
margin-right: 14rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
text {
|
|
|
font-size: 40rpx;
|
|
|
font-family: 'YouSheBiaoTiHei';
|
|
|
@@ -663,26 +707,26 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 盲票
|
|
|
.ticket {
|
|
|
height: 36vh;
|
|
|
position: relative;
|
|
|
-
|
|
|
+
|
|
|
&-swiper {
|
|
|
height: 100%;
|
|
|
-
|
|
|
+
|
|
|
&-item {
|
|
|
position: relative;
|
|
|
height: 100%;
|
|
|
-
|
|
|
+
|
|
|
&-box {
|
|
|
position: absolute;
|
|
|
bottom: 0;
|
|
|
width: 75vw;
|
|
|
height: 75%;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-prize {
|
|
|
position: absolute;
|
|
|
top: 0;
|
|
|
@@ -692,7 +736,7 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-left {
|
|
|
width: 100rpx;
|
|
|
height: 100rpx;
|
|
|
@@ -701,14 +745,15 @@
|
|
|
left: 0;
|
|
|
display: table-cell;
|
|
|
vertical-align: middle;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
- display: block;
|
|
|
- margin: 25rpx auto;
|
|
|
- width: 45rpx;
|
|
|
- height: 40rpx;
|
|
|
+ display: block;
|
|
|
+ margin: 25rpx auto;
|
|
|
+ width: 45rpx;
|
|
|
+ height: 40rpx;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
&-right {
|
|
|
width: 100rpx;
|
|
|
height: 100rpx;
|
|
|
@@ -717,7 +762,7 @@
|
|
|
right: 0;
|
|
|
display: table-cell;
|
|
|
vertical-align: middle;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
display: block;
|
|
|
margin: 25rpx auto;
|
|
|
@@ -727,30 +772,30 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 投诉建议
|
|
|
.proposal {
|
|
|
position: relative;
|
|
|
height: 66rpx;
|
|
|
margin-bottom: 30rpx;
|
|
|
-
|
|
|
+
|
|
|
&-time {
|
|
|
position: absolute;
|
|
|
left: 30rpx;
|
|
|
bottom: 0;
|
|
|
flex-direction: column;
|
|
|
align-items: flex-start;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
width: 140rpx;
|
|
|
height: 78rpx;
|
|
|
margin-bottom: 12rpx;
|
|
|
animation: scaleTime 3s linear infinite;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.time {
|
|
|
animation: moveTime 0.5s linear infinite;
|
|
|
-
|
|
|
+
|
|
|
::v-deep .u-count-down__text {
|
|
|
line-height: 30rpx;
|
|
|
font-size: 30rpx;
|
|
|
@@ -760,13 +805,13 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-progress {
|
|
|
position: absolute;
|
|
|
bottom: 0;
|
|
|
width: 140rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-tip {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -775,7 +820,7 @@
|
|
|
bottom: 0;
|
|
|
width: 212rpx;
|
|
|
height: 66rpx;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
position: absolute;
|
|
|
right: 0;
|
|
|
@@ -783,7 +828,7 @@
|
|
|
width: 212rpx;
|
|
|
height: 66rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
text {
|
|
|
position: absolute;
|
|
|
right: 16rpx;
|
|
|
@@ -794,7 +839,7 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 中奖概率
|
|
|
.chance {
|
|
|
justify-content: flex-start;
|
|
|
@@ -805,17 +850,17 @@
|
|
|
color: #FFFFFF;
|
|
|
font-family: YouSheBiaoTiHei;
|
|
|
font-size: 14px;
|
|
|
-
|
|
|
+
|
|
|
&-title {
|
|
|
margin-left: 8rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-hitRate {
|
|
|
flex: 1;
|
|
|
justify-content: space-evenly;
|
|
|
-
|
|
|
+
|
|
|
&-content {
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
width: 56rpx;
|
|
|
height: 50rpx;
|
|
|
@@ -823,16 +868,16 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 盲票名称轮播
|
|
|
.ticket-title {
|
|
|
height: 66rpx;
|
|
|
padding: 0 34rpx;
|
|
|
-
|
|
|
+
|
|
|
&-swiper {
|
|
|
width: calc(100vw - 34px);
|
|
|
height: 100%;
|
|
|
-
|
|
|
+
|
|
|
&-item {
|
|
|
height: 100%;
|
|
|
background: rgba(255, 255, 255, .16);
|
|
|
@@ -840,29 +885,29 @@
|
|
|
color: #fff;
|
|
|
font-size: 34rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.action {
|
|
|
background: #FFAE00;
|
|
|
box-shadow: 0px 3px 3px 0px rgba(220, 145, 107, 0.57);
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 刮开盲票
|
|
|
.ticket-btn {
|
|
|
justify-content: space-between;
|
|
|
height: 20vh;
|
|
|
padding: 0 30rpx;
|
|
|
-
|
|
|
+
|
|
|
&-left {
|
|
|
flex-direction: column;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
width: 142rpx;
|
|
|
height: 142rpx;
|
|
|
margin-bottom: 16rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&__title {
|
|
|
line-height: 30rpx;
|
|
|
font-size: 30rpx;
|
|
|
@@ -871,12 +916,12 @@
|
|
|
color: #FFFFFF;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-center {
|
|
|
position: relative;
|
|
|
flex-direction: column;
|
|
|
height: 100%;
|
|
|
-
|
|
|
+
|
|
|
.image-wrap {
|
|
|
position: absolute;
|
|
|
width: 310rpx;
|
|
|
@@ -884,12 +929,12 @@
|
|
|
border-radius: 50%;
|
|
|
overflow: hidden;
|
|
|
box-shadow: 2px 2px 10px rgba(255, 189, 24, .8), -2px -2px 10px rgba(255, 189, 24, .8), 2px -2px 10px rgba(255, 189, 24, .8), -2px 2px 10px rgba(255, 189, 24, .8);
|
|
|
-
|
|
|
+
|
|
|
.btn {
|
|
|
width: 310rpx;
|
|
|
height: 100%;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.shadow {
|
|
|
position: absolute;
|
|
|
width: 310rpx;
|
|
|
@@ -898,12 +943,12 @@
|
|
|
animation: shadowMove 1.5s linear infinite;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-wrap {
|
|
|
width: 300rpx;
|
|
|
position: absolute;
|
|
|
animation: scaleBtn 1.5s linear infinite;
|
|
|
-
|
|
|
+
|
|
|
&__title {
|
|
|
width: 300rpx;
|
|
|
text-align: center;
|
|
|
@@ -916,16 +961,16 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-right {
|
|
|
flex-direction: column;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
width: 142rpx;
|
|
|
height: 142rpx;
|
|
|
margin-bottom: 16rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&__title {
|
|
|
line-height: 30rpx;
|
|
|
font-size: 30rpx;
|
|
|
@@ -935,11 +980,11 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 盲票价格
|
|
|
.ticket-price {
|
|
|
height: 44rpx;
|
|
|
-
|
|
|
+
|
|
|
&-checkbox {
|
|
|
width: 44rpx;
|
|
|
height: 44rpx;
|
|
|
@@ -947,13 +992,13 @@
|
|
|
border-radius: 50%;
|
|
|
overflow: hidden;
|
|
|
margin-right: 20rpx;
|
|
|
-
|
|
|
+
|
|
|
image {
|
|
|
width: 44rpx;
|
|
|
height: 44rpx;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-amt {
|
|
|
height: 44rpx;
|
|
|
font-family: YouSheBiaoTiHei;
|
|
|
@@ -961,22 +1006,22 @@
|
|
|
align-items: flex-end;
|
|
|
color: #FFFFFF;
|
|
|
margin-right: 20rpx;
|
|
|
-
|
|
|
+
|
|
|
.num {
|
|
|
font-size: 56rpx;
|
|
|
line-height: 40rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.txt {
|
|
|
line-height: 36rpx;
|
|
|
font-size: 40rpx;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
&-discount {
|
|
|
height: 44rpx;
|
|
|
align-items: flex-end;
|
|
|
-
|
|
|
+
|
|
|
.num {
|
|
|
line-height: 26rpx;
|
|
|
font-size: 26rpx;
|
|
|
@@ -986,128 +1031,128 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 奖品移动动画
|
|
|
@keyframes movePrize {
|
|
|
0% {
|
|
|
transform: translate(0, 10px)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
25% {
|
|
|
transform: translate(0, 5px)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
50% {
|
|
|
transform: translate(0, 0px)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
75% {
|
|
|
transform: translate(0, 5px)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
100% {
|
|
|
transform: translate(0, 10px)
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 倒计时移动动画
|
|
|
@keyframes moveTime {
|
|
|
0% {
|
|
|
transform: translate(2px, 0)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
25% {
|
|
|
transform: translate(0, 0)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
50% {
|
|
|
transform: translate(1px, 0)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
75% {
|
|
|
transform: translate(0, 0)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
100% {
|
|
|
transform: translate(2px, 0)
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 放大缩小动画
|
|
|
@keyframes scaleTime {
|
|
|
0% {
|
|
|
transform: scale(1.05)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
25% {
|
|
|
transform: scale(1.02)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
50% {
|
|
|
transform: scale(0.9)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
75% {
|
|
|
transform: scale(1.02)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
100% {
|
|
|
transform: scale(1.05)
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 刮开刮票呼吸动画
|
|
|
@keyframes scaleBtn {
|
|
|
0% {
|
|
|
transform: scale(1.04)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
25% {
|
|
|
transform: scale(1.02)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
50% {
|
|
|
transform: scale(1)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
75% {
|
|
|
transform: scale(1.02)
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
100% {
|
|
|
transform: scale(1.04)
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 刮开刮票阴影动画
|
|
|
@keyframes shadowBtn {
|
|
|
0% {
|
|
|
text-shadow: 2px -2px 3px #fff;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
25% {
|
|
|
text-shadow: none;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
50% {
|
|
|
text-shadow: none;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
75% {
|
|
|
text-shadow: none;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
100% {
|
|
|
text-shadow: 2px -2px 3px #fff;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
// 刮开盲票光影移动动画
|
|
|
@keyframes shadowMove {
|
|
|
0% {
|
|
|
left: -100%;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
100% {
|
|
|
left: 110%;
|
|
|
}
|
