|
@@ -30,65 +30,65 @@
|
|
|
</RoundTurntable>
|
|
|
<van-popup v-model="showPay" style="background: transparent;" :close-on-click-overlay="false">
|
|
|
<div class="dialog-view">
|
|
|
- <img v-if="luckDrawType===0" class="w219h26" src="~/assets/image/activity/lottery/title-9.9.png" alt="">
|
|
|
- <img v-if="luckDrawType===1" class="w219h26" src="~/assets/image/activity/lottery/15.9.png" alt="">
|
|
|
- <img v-if="luckDrawType===2" class="w219h26" src="~/assets/image/activity/lottery/9.9.png" alt="">
|
|
|
- <van-icon name="close" class="close" color="#939393" @click="closed();" />
|
|
|
- <div class="popup-view">
|
|
|
- <div class="meal-item">
|
|
|
- <div :class="selMealId === mealId ? 'coupon-1 active' : 'coupon-1'" @click="selMealId = mealId;originalPrice=yearOriginalPrice">
|
|
|
- <div class="coupon-title">
|
|
|
- <span>¥</span><span class="txt2">{{ actualPrice }}</span>
|
|
|
- </div>
|
|
|
- <div class="txt4"> 1年使用权 每月30小时</div>
|
|
|
- </div>
|
|
|
- <div class="fb">
|
|
|
- <div v-for="item in mealList" :key="item.id" :class="selMealId === item.id ? 'coupon-2 active' : 'coupon-2'" @click=" selMealId = item.id;originalPrice=+item.originalPrice;makePoint(item.day === 30 ? 'activity_38月卡' : 'activity_268年卡');">
|
|
|
+ <div>
|
|
|
+ <img v-if="luckDrawType===0" class="w219h26" src="~/assets/image/activity/lottery/title-9.9.png" alt="">
|
|
|
+ <img v-if="luckDrawType===1" class="w219h26" src="~/assets/image/activity/lottery/15.9.png" alt="">
|
|
|
+ <img v-if="luckDrawType===2" class="w219h26" src="~/assets/image/activity/lottery/9.9.png" alt="">
|
|
|
+ <van-icon name="close" class="close" color="#939393" @click="closed();" />
|
|
|
+ <div class="popup-view">
|
|
|
+ <div class="meal-item">
|
|
|
+ <div :class="selMealId === mealId ? 'coupon-1 active' : 'coupon-1'" @click="selMealId = mealId;actualPrice=yearActualPrice;originalPrice=yearOriginalPrice;copy='按时计费'">
|
|
|
<div class="coupon-title">
|
|
|
- <span>¥</span><span class="txt2">{{
|
|
|
- item.actualPrice
|
|
|
- }}</span>
|
|
|
+ <span>¥</span><span class="txt2">{{ yearActualPrice }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="txt4"> 1年使用权 每月30小时</div>
|
|
|
+ </div>
|
|
|
+ <div class="fb">
|
|
|
+ <div v-for="item in mealList" :key="item.id" :class="selMealId === item.id ? 'coupon-2 active' : 'coupon-2'" @click="selMealId = item.id;originalPrice=+item.originalPrice;actualPrice=item.actualPrice;copy=item.day===30?'包月':'包年';makePoint(item.day === 30 ? 'activity_38月卡' : 'activity_268年卡');">
|
|
|
+ <div class="coupon-title">
|
|
|
+ <span>¥</span><span class="txt2">{{ item.actualPrice }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="txt4">{{ item.day === 30 ? '月卡 30天' : '年卡 365天' }}</div>
|
|
|
</div>
|
|
|
- <div class="txt4">{{ item.day === 30 ? '月卡 30天' : '年卡 365天' }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <van-grid :column-num="5" :border="false" class="plr10">
|
|
|
- <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon1.png')" text="按时计费" />
|
|
|
- <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon2.png')" text="游戏托管" />
|
|
|
- <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon3.png')" text="iOS玩安卓" />
|
|
|
- <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon4.png')" text="上班自由" />
|
|
|
- <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon5.png')" text="影音听歌" />
|
|
|
- </van-grid>
|
|
|
- <div v-for="item in paySupportType" :key="item" class="fnbc" @click="payType = item;makePoint(item === 'aliPay' ? 'activity_支付宝' : 'activity_微信');">
|
|
|
- <div v-if="item === 'aliPay'" class="fnc">
|
|
|
- <van-icon class="icon-pay" :name="require('~/assets/image/activity/lottery/alipay.png')" />
|
|
|
- <span class="txt5">支付宝支付</span>
|
|
|
+ <van-grid :column-num="5" :border="false" class="plr10">
|
|
|
+ <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon1.png')" :text="copy" />
|
|
|
+ <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon2.png')" text="游戏托管" />
|
|
|
+ <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon3.png')" text="iOS玩安卓" />
|
|
|
+ <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon4.png')" text="上班自由" />
|
|
|
+ <van-grid-item :icon="require('../../../assets/image/activity/lottery/icon5.png')" text="影音听歌" />
|
|
|
+ </van-grid>
|
|
|
+ <div v-for="item in paySupportType" :key="item" class="fnbc" @click="payType = item;makePoint(item === 'aliPay' ? 'activity_支付宝' : 'activity_微信');">
|
|
|
+ <div v-if="item === 'aliPay'" class="fnc">
|
|
|
+ <van-icon class="icon-pay" :name="require('~/assets/image/activity/lottery/alipay.png')" />
|
|
|
+ <span class="txt5">支付宝支付</span>
|
|
|
+ </div>
|
|
|
+ <div v-else class="fnc">
|
|
|
+ <van-icon class="icon-pay" :name="require('~/assets/image/activity/lottery/wx.png')" />
|
|
|
+ <span class="txt5">微信支付</span>
|
|
|
+ </div>
|
|
|
+ <van-icon :name="payType === item? require('~/assets/image/activity/lottery/select-round-icon.png'): require('~/assets/image/activity/lottery/unselect-round-icon.png')" size="24" />
|
|
|
</div>
|
|
|
- <div v-else class="fnc">
|
|
|
- <van-icon class="icon-pay" :name="require('~/assets/image/activity/lottery/wx.png')" />
|
|
|
- <span class="txt5">微信支付</span>
|
|
|
+ <div v-if="time" class="count-down-time">
|
|
|
+ {{luckDrawType===1 ? '15.9':'9.9'}}元年卡抢购资格有效期:
|
|
|
+ <van-count-down :time="time">
|
|
|
+ <template #default="timeData">
|
|
|
+ <span class="block">{{ timeData.hours }}</span>
|
|
|
+ <span class="colon">:</span>
|
|
|
+ <span class="block">{{ timeData.minutes }}</span>
|
|
|
+ <span class="colon">:</span>
|
|
|
+ <span class="block">{{ timeData.seconds }}</span>
|
|
|
+ </template>
|
|
|
+ </van-count-down>
|
|
|
</div>
|
|
|
- <van-icon :name="payType === item? require('~/assets/image/activity/lottery/select-round-icon.png'): require('~/assets/image/activity/lottery/unselect-round-icon.png')" size="24" />
|
|
|
- </div>
|
|
|
- <div v-if="time" class="count-down-time">
|
|
|
- {{luckDrawType===1 ? '15.9':'9.9'}}元年卡抢购资格有效期:
|
|
|
- <van-count-down :time="time">
|
|
|
- <template #default="timeData">
|
|
|
- <span class="block">{{ timeData.hours }}</span>
|
|
|
- <span class="colon">:</span>
|
|
|
- <span class="block">{{ timeData.minutes }}</span>
|
|
|
- <span class="colon">:</span>
|
|
|
- <span class="block">{{ timeData.seconds }}</span>
|
|
|
- </template>
|
|
|
- </van-count-down>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
+
|
|
|
<div class="buy-bar">
|
|
|
原价¥{{originalPrice}}
|
|
|
<div class="buy-bar-btn" @click="createOrder">
|
|
|
<div>立即购买</div>
|
|
|
+ <div class="tip">节省¥{{originalPrice-actualPrice}}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="txt6">
|
|
@@ -220,6 +220,7 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ copy: '按时计费',
|
|
|
time: 0,
|
|
|
yearOriginalPrice: 0,
|
|
|
originalPrice: 0,
|
|
@@ -292,18 +293,19 @@ export default {
|
|
|
carousel: [],
|
|
|
phoneType: 'SVIP',
|
|
|
client: 0,
|
|
|
+ yearActualPrice: 0
|
|
|
};
|
|
|
},
|
|
|
async fetch() {
|
|
|
if (this.$route.query.type === 'pc') {
|
|
|
- this.$router.push({ path: '/activity/lottery/pc', query: {token: this.$route.query.token}})
|
|
|
+ this.$router.push({ path: '/activity/lottery/pc', query: { token: this.$route.query.token } })
|
|
|
}
|
|
|
if (this.$userAgent.isAndroid) {
|
|
|
this.token = await window.native.getToken();
|
|
|
} else {
|
|
|
this.token = this.$route.query.token;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
if (this.$userAgent.isAndroid) {
|
|
|
this.client = 1;
|
|
|
} else if (this.$userAgent.isIos) {
|
|
@@ -313,6 +315,7 @@ export default {
|
|
|
} else {
|
|
|
this.client = 7;
|
|
|
}
|
|
|
+ console.log(this.client);
|
|
|
},
|
|
|
head: {
|
|
|
title: '年卡抽奖活动',
|
|
@@ -461,6 +464,7 @@ export default {
|
|
|
if (this.num > 0) {
|
|
|
this.num--;
|
|
|
}
|
|
|
+ console.log(this.num);
|
|
|
// 告诉子组件,开始转动了
|
|
|
this.$refs.roundTurntable.rotate(this.prizeIndex);
|
|
|
},
|
|
@@ -473,6 +477,7 @@ export default {
|
|
|
);
|
|
|
if (res.status === 0) {
|
|
|
this.actualPrice = res.data.actualPrice;
|
|
|
+ this.yearActualPrice = res.data.actualPrice;
|
|
|
this.luckDrawType = res.data.luckDrawType;
|
|
|
if (res.data.luckDrawType === 1) {
|
|
|
this.makePoint('activity_15.9年卡');
|
|
@@ -530,6 +535,9 @@ export default {
|
|
|
this.showPay = true;
|
|
|
// 解锁
|
|
|
this.isLocking = false;
|
|
|
+ if (this.$userAgent.isAndroid) {
|
|
|
+ window.native.isMembersLotto()
|
|
|
+ }
|
|
|
},
|
|
|
// 判断是否可以转动
|
|
|
canBeRotated() {
|
|
@@ -593,7 +601,7 @@ export default {
|
|
|
height: 46.5px;
|
|
|
background: #333333;
|
|
|
font-size: 12px;
|
|
|
- color: #FFFFFF;
|
|
|
+ color: #ffffff;
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
@@ -601,7 +609,7 @@ export default {
|
|
|
.colon {
|
|
|
display: inline-block;
|
|
|
margin: 0 4.5px;
|
|
|
- color: #FFFFFF;;
|
|
|
+ color: #ffffff;
|
|
|
}
|
|
|
.block {
|
|
|
display: inline-block;
|
|
@@ -610,7 +618,7 @@ export default {
|
|
|
line-height: 17px;
|
|
|
color: #fff;
|
|
|
font-size: 11px;
|
|
|
- background: rgba($color: #FFFFFF, $alpha: 0.2);
|
|
|
+ background: rgba($color: #ffffff, $alpha: 0.2);
|
|
|
text-align: center;
|
|
|
}
|
|
|
.plr10 {
|
|
@@ -667,6 +675,19 @@ export default {
|
|
|
color: #ffffff;
|
|
|
line-height: 50px;
|
|
|
}
|
|
|
+ & .tip {
|
|
|
+ width: 76px;
|
|
|
+ height: 21px;
|
|
|
+ background: url('../../../assets/image/activity/lottery/tip.png');
|
|
|
+ background-size: 100% 100%;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 18px;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: -11px;
|
|
|
+ }
|
|
|
}
|
|
|
.buy-bar {
|
|
|
width: 320px;
|
|
@@ -680,7 +701,7 @@ export default {
|
|
|
text-decoration: line-through;
|
|
|
color: #666666;
|
|
|
padding-left: 28px;
|
|
|
- margin-top: -40px;
|
|
|
+ margin-top: 26px;
|
|
|
}
|
|
|
.van-grid-item__text {
|
|
|
font-size: 11px;
|
|
@@ -695,6 +716,7 @@ export default {
|
|
|
width: 219px;
|
|
|
height: 26px;
|
|
|
margin: 58px auto 0;
|
|
|
+ display: block;
|
|
|
}
|
|
|
.sl {
|
|
|
position: absolute;
|
|
@@ -832,7 +854,7 @@ export default {
|
|
|
border-radius: 10px;
|
|
|
background: #ffffff;
|
|
|
text-align: center;
|
|
|
- margin-top: -40px;
|
|
|
+ margin-top: 26.5px;
|
|
|
}
|
|
|
|
|
|
.popup-view-rule {
|
|
@@ -990,7 +1012,8 @@ export default {
|
|
|
margin: 0 22.5px;
|
|
|
border-top: 1px dashed rgba($color: #333, $alpha: 0.3);
|
|
|
position: relative;
|
|
|
- &::before, &::after {
|
|
|
+ &::before,
|
|
|
+ &::after {
|
|
|
content: '';
|
|
|
background: rgba($color: #000000, $alpha: 0.7);
|
|
|
width: 28px;
|