|
@@ -6,7 +6,7 @@
|
|
|
梅山古镇
|
|
梅山古镇
|
|
|
</view>
|
|
</view>
|
|
|
<view class="head">
|
|
<view class="head">
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
<u-swiper :list="list1"></u-swiper>
|
|
<u-swiper :list="list1"></u-swiper>
|
|
|
</view>
|
|
</view>
|
|
|
<view class="text">
|
|
<view class="text">
|
|
@@ -15,8 +15,9 @@
|
|
|
</view>
|
|
</view>
|
|
|
<view class="content">
|
|
<view class="content">
|
|
|
<view class="chouka" style="width: 100%;">
|
|
<view class="chouka" style="width: 100%;">
|
|
|
- <view class="" style="margin-bottom: 10px;" >
|
|
|
|
|
- <u-row justify="space-between" customStyle="margin-bottom: 5px;display: flex; align-items: center;">
|
|
|
|
|
|
|
+ <view class="" style="margin-bottom: 10px;">
|
|
|
|
|
+ <u-row justify="space-between"
|
|
|
|
|
+ customStyle="margin-bottom: 5px;display: flex; align-items: center;">
|
|
|
<u-col span="4">
|
|
<u-col span="4">
|
|
|
</u-col>
|
|
</u-col>
|
|
|
<u-col span="4" class="center-col">
|
|
<u-col span="4" class="center-col">
|
|
@@ -28,35 +29,32 @@
|
|
|
</u-row>
|
|
</u-row>
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
- <template>
|
|
|
|
|
- <!-- 卡片区 -->
|
|
|
|
|
- <view class="cards">
|
|
|
|
|
- <view
|
|
|
|
|
- class="card"
|
|
|
|
|
- v-for="(item, idx) in cards"
|
|
|
|
|
- :key="idx"
|
|
|
|
|
- @click="flipCard(idx)"
|
|
|
|
|
- :class="{ 'flipping': item.isFlipping, 'flipped': item.flipped }"
|
|
|
|
|
- >
|
|
|
|
|
- <view v-if="item.checkStauts" class="select-tag">
|
|
|
|
|
- 已选
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="card-inner">
|
|
|
|
|
- <view class="card-front">
|
|
|
|
|
- <image class="card-img" :src="item.front" mode="scaleToFill"></image>
|
|
|
|
|
- </view>
|
|
|
|
|
- <view class="card-back">
|
|
|
|
|
- <image class="card-img" :src="item.prizeType == 2 ? item.img : item.back" mode="scaleToFill"></image>
|
|
|
|
|
- <view class="card-back-text">
|
|
|
|
|
- <view v-show="item.prizeType == 0" class="card-text">很遗憾</view>
|
|
|
|
|
- <view v-show="item.prizeType == 1" class="card-text">{{item.money/100}}元红包</view>
|
|
|
|
|
- <view v-show="item.prizeType == 0" class="card-text">下次继续</view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </view>
|
|
|
|
|
- </template>
|
|
|
|
|
|
|
+ <template>
|
|
|
|
|
+ <!-- 卡片区 -->
|
|
|
|
|
+ <view class="cards">
|
|
|
|
|
+ <view class="card" v-for="(item, idx) in cards" :key="idx" @click="flipCard(idx)"
|
|
|
|
|
+ :class="{ 'flipping': item.isFlipping, 'flipped': item.flipped }">
|
|
|
|
|
+ <view v-if="item.checkStauts" class="select-tag">
|
|
|
|
|
+ 已选
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="card-inner">
|
|
|
|
|
+ <view class="card-front">
|
|
|
|
|
+ <image class="card-img" :src="item.front" mode="scaleToFill"></image>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view class="card-back">
|
|
|
|
|
+ <image class="card-img" :src="item.prizeType == 2 ? item.img : item.back"
|
|
|
|
|
+ mode="scaleToFill"></image>
|
|
|
|
|
+ <view class="card-back-text">
|
|
|
|
|
+ <view v-show="item.prizeType == 0" class="card-text">很遗憾</view>
|
|
|
|
|
+ <view v-show="item.prizeType == 1" class="card-text">{{item.money/100}}元红包
|
|
|
|
|
+ </view>
|
|
|
|
|
+ <view v-show="item.prizeType == 0" class="card-text">下次继续</view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
|
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
@@ -130,7 +128,8 @@
|
|
|
<script>
|
|
<script>
|
|
|
import CustomTabbar from '@/components/tabbar.vue';
|
|
import CustomTabbar from '@/components/tabbar.vue';
|
|
|
import {
|
|
import {
|
|
|
- addWinDetail,saveCardData
|
|
|
|
|
|
|
+ addWinDetail,
|
|
|
|
|
+ saveCardData
|
|
|
} from '@/api/scan'
|
|
} from '@/api/scan'
|
|
|
export default {
|
|
export default {
|
|
|
components: {
|
|
components: {
|
|
@@ -138,7 +137,7 @@
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
rules: {
|
|
rules: {
|
|
|
'userInfo.name': {
|
|
'userInfo.name': {
|
|
|
type: 'string',
|
|
type: 'string',
|
|
@@ -157,7 +156,7 @@
|
|
|
userInfo: {
|
|
userInfo: {
|
|
|
name: '',
|
|
name: '',
|
|
|
tel: '',
|
|
tel: '',
|
|
|
- qrcodeId:''
|
|
|
|
|
|
|
+ qrcodeId: ''
|
|
|
},
|
|
},
|
|
|
},
|
|
},
|
|
|
showUnWin: false,
|
|
showUnWin: false,
|
|
@@ -166,8 +165,8 @@
|
|
|
"https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/1.jpg",
|
|
"https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/1.jpg",
|
|
|
"https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/2.jpg",
|
|
"https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/2.jpg",
|
|
|
"https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/3.jpg",
|
|
"https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/3.jpg",
|
|
|
- "https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/4.jpg",
|
|
|
|
|
- "https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/5.jpg",
|
|
|
|
|
|
|
+ "https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/4.jpg",
|
|
|
|
|
+ "https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/commodity/5.jpg",
|
|
|
],
|
|
],
|
|
|
cards: [{
|
|
cards: [{
|
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/one.png',
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/one.png',
|
|
@@ -176,10 +175,10 @@
|
|
|
prizeName: '',
|
|
prizeName: '',
|
|
|
title: '',
|
|
title: '',
|
|
|
checkStauts: false,
|
|
checkStauts: false,
|
|
|
- img:'',
|
|
|
|
|
- money:'',
|
|
|
|
|
- prizeType:'',
|
|
|
|
|
- isFlipping: false
|
|
|
|
|
|
|
+ img: '',
|
|
|
|
|
+ money: '',
|
|
|
|
|
+ prizeType: '',
|
|
|
|
|
+ isFlipping: false
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/two.png',
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/two.png',
|
|
@@ -188,10 +187,10 @@
|
|
|
prizeName: '',
|
|
prizeName: '',
|
|
|
title: '',
|
|
title: '',
|
|
|
checkStauts: false,
|
|
checkStauts: false,
|
|
|
- img:'',
|
|
|
|
|
- money:'',
|
|
|
|
|
- prizeType:'',
|
|
|
|
|
- isFlipping: false
|
|
|
|
|
|
|
+ img: '',
|
|
|
|
|
+ money: '',
|
|
|
|
|
+ prizeType: '',
|
|
|
|
|
+ isFlipping: false
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/three.png',
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/three.png',
|
|
@@ -200,10 +199,10 @@
|
|
|
prizeName: '',
|
|
prizeName: '',
|
|
|
title: '',
|
|
title: '',
|
|
|
checkStauts: false,
|
|
checkStauts: false,
|
|
|
- img:'',
|
|
|
|
|
- money:'',
|
|
|
|
|
- prizeType:'',
|
|
|
|
|
- isFlipping: false
|
|
|
|
|
|
|
+ img: '',
|
|
|
|
|
+ money: '',
|
|
|
|
|
+ prizeType: '',
|
|
|
|
|
+ isFlipping: false
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/four.png',
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/four.png',
|
|
@@ -212,10 +211,10 @@
|
|
|
prizeName: '',
|
|
prizeName: '',
|
|
|
title: '',
|
|
title: '',
|
|
|
checkStauts: false,
|
|
checkStauts: false,
|
|
|
- img:'',
|
|
|
|
|
- money:'',
|
|
|
|
|
- prizeType:'',
|
|
|
|
|
- isFlipping: false
|
|
|
|
|
|
|
+ img: '',
|
|
|
|
|
+ money: '',
|
|
|
|
|
+ prizeType: '',
|
|
|
|
|
+ isFlipping: false
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/five.png',
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/five.png',
|
|
@@ -224,10 +223,10 @@
|
|
|
prizeName: '',
|
|
prizeName: '',
|
|
|
title: '',
|
|
title: '',
|
|
|
checkStauts: false,
|
|
checkStauts: false,
|
|
|
- img:'',
|
|
|
|
|
- money:'',
|
|
|
|
|
- prizeType:'',
|
|
|
|
|
- isFlipping: false
|
|
|
|
|
|
|
+ img: '',
|
|
|
|
|
+ money: '',
|
|
|
|
|
+ prizeType: '',
|
|
|
|
|
+ isFlipping: false
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/six.png',
|
|
front: 'https://hyscancode.oss-cn-hangzhou.aliyuncs.com/xiaochengxu/guzhenganzi/six.png',
|
|
@@ -236,25 +235,26 @@
|
|
|
prizeName: '',
|
|
prizeName: '',
|
|
|
title: '',
|
|
title: '',
|
|
|
checkStauts: false,
|
|
checkStauts: false,
|
|
|
- img:'',
|
|
|
|
|
- money:'',
|
|
|
|
|
- prizeType:'',
|
|
|
|
|
- isFlipping: false
|
|
|
|
|
-
|
|
|
|
|
|
|
+ img: '',
|
|
|
|
|
+ money: '',
|
|
|
|
|
+ prizeType: '',
|
|
|
|
|
+ isFlipping: false
|
|
|
|
|
+
|
|
|
}
|
|
}
|
|
|
],
|
|
],
|
|
|
totalDetail: '',
|
|
totalDetail: '',
|
|
|
prizeJson: {},
|
|
prizeJson: {},
|
|
|
saveData: {},
|
|
saveData: {},
|
|
|
- scanCode:'',
|
|
|
|
|
- saveStatus: true,
|
|
|
|
|
|
|
+ scanCode: '',
|
|
|
|
|
+ saveStatus: true,
|
|
|
|
|
+ fankaStatu:false
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
onLoad() {
|
|
onLoad() {
|
|
|
let scanDetail = uni.getStorageSync('scanDetail');
|
|
let scanDetail = uni.getStorageSync('scanDetail');
|
|
|
this.scanCode = uni.getStorageSync('scanCode');
|
|
this.scanCode = uni.getStorageSync('scanCode');
|
|
|
this.model1.userInfo.qrcodeId = this.scanCode;
|
|
this.model1.userInfo.qrcodeId = this.scanCode;
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
this.prizeJson = scanDetail.prizeJson;
|
|
this.prizeJson = scanDetail.prizeJson;
|
|
|
let planDetail = JSON.parse(scanDetail.planDetail);
|
|
let planDetail = JSON.parse(scanDetail.planDetail);
|
|
|
while (planDetail.length < 5) {
|
|
while (planDetail.length < 5) {
|
|
@@ -264,52 +264,54 @@
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
|
this.totalDetail = planDetail;
|
|
this.totalDetail = planDetail;
|
|
|
- console.log(planDetail);
|
|
|
|
|
- if(scanDetail.result.click){
|
|
|
|
|
|
|
+ console.log(planDetail);
|
|
|
|
|
+ if (scanDetail.result.click) {
|
|
|
this.initCardData(scanDetail.clickJson);
|
|
this.initCardData(scanDetail.clickJson);
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
|
- initCardData(clickJson){
|
|
|
|
|
|
|
+ initCardData(clickJson) {
|
|
|
let list = JSON.parse(clickJson);
|
|
let list = JSON.parse(clickJson);
|
|
|
for (let i = 0; i < this.cards.length; i++) {
|
|
for (let i = 0; i < this.cards.length; i++) {
|
|
|
- if(i == list.index){
|
|
|
|
|
|
|
+ if (i == list.index) {
|
|
|
this.cards[i].checkStauts = true
|
|
this.cards[i].checkStauts = true
|
|
|
}
|
|
}
|
|
|
- this.cards[i].img = list['card'+i].img;
|
|
|
|
|
|
|
+ this.cards[i].img = list['card' + i].img;
|
|
|
this.cards[i].flipped = true;
|
|
this.cards[i].flipped = true;
|
|
|
- this.cards[i].prizeType = list['card'+i].prize_type == undefined ? list['card'+i].prizeType :list['card'+i].prize_type;
|
|
|
|
|
- this.cards[i].money =list['card'+i].money;
|
|
|
|
|
- this.cards[i].prizeName = list['card'+i].prizeName == undefined ? list['card'+i].prize_name :list['card'+i].prizeName;
|
|
|
|
|
|
|
+ this.cards[i].prizeType = list['card' + i].prize_type == undefined ? list['card' + i].prizeType : list[
|
|
|
|
|
+ 'card' + i].prize_type;
|
|
|
|
|
+ this.cards[i].money = list['card' + i].money;
|
|
|
|
|
+ this.cards[i].prizeName = list['card' + i].prizeName == undefined ? list['card' + i].prize_name : list[
|
|
|
|
|
+ 'card' + i].prizeName;
|
|
|
}
|
|
}
|
|
|
this.$forceUpdate();
|
|
this.$forceUpdate();
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
},
|
|
},
|
|
|
- addWinDetail(){
|
|
|
|
|
|
|
+ addWinDetail() {
|
|
|
let that = this;
|
|
let that = this;
|
|
|
this.$refs.uForm.validate().then(res => {
|
|
this.$refs.uForm.validate().then(res => {
|
|
|
addWinDetail(that.model1.userInfo).then(data => {
|
|
addWinDetail(that.model1.userInfo).then(data => {
|
|
|
this.showWin = false;
|
|
this.showWin = false;
|
|
|
- if(data.code == 0){
|
|
|
|
|
- that.saveStatus = false;
|
|
|
|
|
|
|
+ if (data.code == 0) {
|
|
|
|
|
+ that.saveStatus = false;
|
|
|
// uni.redirectTo({
|
|
// uni.redirectTo({
|
|
|
// url: '/pages/lgz/index/claim' // 目标页面路径
|
|
// url: '/pages/lgz/index/claim' // 目标页面路径
|
|
|
// })
|
|
// })
|
|
|
- let params = {
|
|
|
|
|
- type: "success",
|
|
|
|
|
- title: "成功主题(带图标)",
|
|
|
|
|
- message: "提交成功",
|
|
|
|
|
- iconUrl: "https://uviewui.com/demo/toast/success.png",
|
|
|
|
|
- }
|
|
|
|
|
- that.$refs.uToast.show({
|
|
|
|
|
- ...params
|
|
|
|
|
- });
|
|
|
|
|
- }else{
|
|
|
|
|
-
|
|
|
|
|
|
|
+ let params = {
|
|
|
|
|
+ type: "success",
|
|
|
|
|
+ title: "成功主题(带图标)",
|
|
|
|
|
+ message: "提交成功",
|
|
|
|
|
+ iconUrl: "https://uviewui.com/demo/toast/success.png",
|
|
|
|
|
+ }
|
|
|
|
|
+ that.$refs.uToast.show({
|
|
|
|
|
+ ...params
|
|
|
|
|
+ });
|
|
|
|
|
+ } else {
|
|
|
|
|
+
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
}).catch(errors => {
|
|
}).catch(errors => {
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
})
|
|
})
|
|
|
},
|
|
},
|
|
|
open() {
|
|
open() {
|
|
@@ -319,84 +321,88 @@
|
|
|
this.showUnWin = false;
|
|
this.showUnWin = false;
|
|
|
this.showWin = false
|
|
this.showWin = false
|
|
|
},
|
|
},
|
|
|
- flipCard(idx) {
|
|
|
|
|
- if (this.cards[idx].flipped) {
|
|
|
|
|
- return;
|
|
|
|
|
- }
|
|
|
|
|
- setTimeout(() => {
|
|
|
|
|
- if (this.prizeJson.prizeType == 0 || this.prizeJson.prize_type == 0) {
|
|
|
|
|
- this.showUnWin = true;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- if ((this.prizeJson.prizeType == 2 || this.prizeJson.prize_type == 2) && this.saveStatus) {
|
|
|
|
|
- this.showWin = true;
|
|
|
|
|
- }
|
|
|
|
|
- }, 2500); //弹框延迟3.5秒后显示弹框
|
|
|
|
|
-
|
|
|
|
|
- // 标记被点击的卡牌正在翻转
|
|
|
|
|
- this.cards[idx].isFlipping = true;
|
|
|
|
|
- this.cards[idx].checkStauts = true;
|
|
|
|
|
-
|
|
|
|
|
- let that = this;
|
|
|
|
|
- // 延迟翻转其他卡牌
|
|
|
|
|
- setTimeout(() => {
|
|
|
|
|
- that.cards[idx].flipped = true;
|
|
|
|
|
- that.cards[idx].isFlipping = false;
|
|
|
|
|
-
|
|
|
|
|
- // 其他未翻转的卡牌延迟2秒后同时翻转
|
|
|
|
|
- setTimeout(() => {
|
|
|
|
|
- that.cards.forEach((card, index) => {
|
|
|
|
|
- if (index !== idx && !card.flipped) {
|
|
|
|
|
- card.isFlipping = true;
|
|
|
|
|
- that.$forceUpdate();
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
-
|
|
|
|
|
- // 所有其他卡牌同时翻转
|
|
|
|
|
- setTimeout(() => {
|
|
|
|
|
- that.cards.forEach((card, index) => {
|
|
|
|
|
- if (index !== idx && !card.flipped) {
|
|
|
|
|
- card.flipped = true;
|
|
|
|
|
- card.isFlipping = false;
|
|
|
|
|
- that.$forceUpdate();
|
|
|
|
|
- }
|
|
|
|
|
- });
|
|
|
|
|
- }, 300); // 与其他卡牌翻转动画保持一致
|
|
|
|
|
- }, 1000); // 延迟2秒翻转其他卡牌
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
- // 处理数据逻辑
|
|
|
|
|
- that.totalDetail.splice(idx, 0, this.prizeJson);
|
|
|
|
|
- that.saveData.index = idx;
|
|
|
|
|
-
|
|
|
|
|
- for (let i = 0; i < that.totalDetail.length; i++) {
|
|
|
|
|
- that.saveData['card' + i] = that.totalDetail[i];
|
|
|
|
|
-
|
|
|
|
|
- that.cards[i].prizeType = that.totalDetail[i].prize_type == undefined ?
|
|
|
|
|
- that.totalDetail[i].prizeType :
|
|
|
|
|
- that.totalDetail[i].prize_type;
|
|
|
|
|
- that.cards[i].img = that.totalDetail[i].img;
|
|
|
|
|
- that.cards[i].money = that.totalDetail[i].money;
|
|
|
|
|
- that.cards[i].prizeName = that.totalDetail[i].prizeName == undefined ?
|
|
|
|
|
- that.totalDetail[i].prize_name :
|
|
|
|
|
- that.totalDetail[i].prizeName;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- that.saveAllCardData();
|
|
|
|
|
- }, 100);
|
|
|
|
|
- },
|
|
|
|
|
- saveAllCardData(){
|
|
|
|
|
|
|
+ flipCard(idx) {
|
|
|
|
|
+ if(this.fankaStatu){
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ if (this.cards[idx].flipped) {
|
|
|
|
|
+ return;
|
|
|
|
|
+ }
|
|
|
|
|
+ this.fankaStatu = true;
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ if (this.prizeJson.prizeType == 0 || this.prizeJson.prize_type == 0) {
|
|
|
|
|
+ this.showUnWin = true;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ if ((this.prizeJson.prizeType == 2 || this.prizeJson.prize_type == 2) && this.saveStatus) {
|
|
|
|
|
+ this.showWin = true;
|
|
|
|
|
+ }
|
|
|
|
|
+ }, 2500); //弹框延迟3.5秒后显示弹框
|
|
|
|
|
+
|
|
|
|
|
+ // 标记被点击的卡牌正在翻转
|
|
|
|
|
+ this.cards[idx].isFlipping = true;
|
|
|
|
|
+ this.cards[idx].checkStauts = true;
|
|
|
|
|
+
|
|
|
|
|
+ let that = this;
|
|
|
|
|
+ // 延迟翻转其他卡牌
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ that.cards[idx].flipped = true;
|
|
|
|
|
+ that.cards[idx].isFlipping = false;
|
|
|
|
|
+
|
|
|
|
|
+ // 其他未翻转的卡牌延迟2秒后同时翻转
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ that.cards.forEach((card, index) => {
|
|
|
|
|
+ if (index !== idx && !card.flipped) {
|
|
|
|
|
+ card.isFlipping = true;
|
|
|
|
|
+ that.$forceUpdate();
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ // 所有其他卡牌同时翻转
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ that.cards.forEach((card, index) => {
|
|
|
|
|
+ if (index !== idx && !card.flipped) {
|
|
|
|
|
+ card.flipped = true;
|
|
|
|
|
+ card.isFlipping = false;
|
|
|
|
|
+ that.$forceUpdate();
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ }, 300); // 与其他卡牌翻转动画保持一致
|
|
|
|
|
+ }, 1000); // 延迟2秒翻转其他卡牌
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+ // 处理数据逻辑
|
|
|
|
|
+ that.totalDetail.splice(idx, 0, this.prizeJson);
|
|
|
|
|
+ that.saveData.index = idx;
|
|
|
|
|
+
|
|
|
|
|
+ for (let i = 0; i < that.totalDetail.length; i++) {
|
|
|
|
|
+ that.saveData['card' + i] = that.totalDetail[i];
|
|
|
|
|
+
|
|
|
|
|
+ that.cards[i].prizeType = that.totalDetail[i].prize_type == undefined ?
|
|
|
|
|
+ that.totalDetail[i].prizeType :
|
|
|
|
|
+ that.totalDetail[i].prize_type;
|
|
|
|
|
+ that.cards[i].img = that.totalDetail[i].img;
|
|
|
|
|
+ that.cards[i].money = that.totalDetail[i].money;
|
|
|
|
|
+ that.cards[i].prizeName = that.totalDetail[i].prizeName == undefined ?
|
|
|
|
|
+ that.totalDetail[i].prize_name :
|
|
|
|
|
+ that.totalDetail[i].prizeName;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ that.saveAllCardData();
|
|
|
|
|
+ }, 100);
|
|
|
|
|
+ },
|
|
|
|
|
+ saveAllCardData() {
|
|
|
let jsonStr = JSON.stringify(this.saveData);
|
|
let jsonStr = JSON.stringify(this.saveData);
|
|
|
- saveCardData(this.scanCode,jsonStr).then(res => {
|
|
|
|
|
|
|
+ saveCardData(this.scanCode, jsonStr).then(res => {
|
|
|
console.log(res)
|
|
console.log(res)
|
|
|
})
|
|
})
|
|
|
},
|
|
},
|
|
|
- openDetail(){
|
|
|
|
|
|
|
+ openDetail() {
|
|
|
uni.navigateTo({
|
|
uni.navigateTo({
|
|
|
url: '/pages/lgz/index/rules'
|
|
url: '/pages/lgz/index/rules'
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
</script>
|
|
</script>
|
|
@@ -481,56 +487,57 @@
|
|
|
width: 100%;
|
|
width: 100%;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- .card {
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 250rpx;
|
|
|
|
|
- position: relative;
|
|
|
|
|
- background: none;
|
|
|
|
|
- border-radius: 16rpx;
|
|
|
|
|
- margin: 0;
|
|
|
|
|
- perspective: 1000px;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .card-inner {
|
|
|
|
|
- position: relative;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 100%;
|
|
|
|
|
- transition: transform 0.8s cubic-bezier(0.5, 1.5, 0.5, 1);
|
|
|
|
|
- transform-style: preserve-3d;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .card.flipping .card-inner {
|
|
|
|
|
- transform: rotateY(180deg);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .card.flipped .card-inner {
|
|
|
|
|
- transform: rotateY(180deg);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .card-front, .card-back {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- height: 100%;
|
|
|
|
|
- backface-visibility: hidden;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .card-back {
|
|
|
|
|
- transform: rotateY(180deg);
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .card-back-text {
|
|
|
|
|
- position: absolute;
|
|
|
|
|
- top: 50%;
|
|
|
|
|
- left: 0;
|
|
|
|
|
- width: 100%;
|
|
|
|
|
- text-align: center;
|
|
|
|
|
- color: #9A1712;
|
|
|
|
|
- font-weight: bold;
|
|
|
|
|
- font-size: 28rpx;
|
|
|
|
|
- transform: translateY(-50%);
|
|
|
|
|
- z-index: 2;
|
|
|
|
|
- pointer-events: none;
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ .card {
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 250rpx;
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ background: none;
|
|
|
|
|
+ border-radius: 16rpx;
|
|
|
|
|
+ margin: 0;
|
|
|
|
|
+ perspective: 1000px;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .card-inner {
|
|
|
|
|
+ position: relative;
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+ transition: transform 0.8s cubic-bezier(0.5, 1.5, 0.5, 1);
|
|
|
|
|
+ transform-style: preserve-3d;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .card.flipping .card-inner {
|
|
|
|
|
+ transform: rotateY(180deg);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .card.flipped .card-inner {
|
|
|
|
|
+ transform: rotateY(180deg);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .card-front,
|
|
|
|
|
+ .card-back {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
+ backface-visibility: hidden;
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .card-back {
|
|
|
|
|
+ transform: rotateY(180deg);
|
|
|
|
|
+ }
|
|
|
|
|
+
|
|
|
|
|
+ .card-back-text {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 50%;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ color: #9A1712;
|
|
|
|
|
+ font-weight: bold;
|
|
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
+ transform: translateY(-50%);
|
|
|
|
|
+ z-index: 2;
|
|
|
|
|
+ pointer-events: none;
|
|
|
|
|
+ }
|
|
|
|
|
|
|
|
|
|
|
|
|
.card-img {
|
|
.card-img {
|
|
@@ -668,17 +675,20 @@
|
|
|
align-items: center !important;
|
|
align-items: center !important;
|
|
|
/* 垂直居中 */
|
|
/* 垂直居中 */
|
|
|
}
|
|
}
|
|
|
- .card-img-f{
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .card-img-f {
|
|
|
height: 100rpx;
|
|
height: 100rpx;
|
|
|
width: 100rpx;
|
|
width: 100rpx;
|
|
|
}
|
|
}
|
|
|
- .card-text{
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .card-text {
|
|
|
font-size: 26rpx;
|
|
font-size: 26rpx;
|
|
|
}
|
|
}
|
|
|
- .select-tag{
|
|
|
|
|
|
|
+
|
|
|
|
|
+ .select-tag {
|
|
|
position: absolute;
|
|
position: absolute;
|
|
|
right: 0px;
|
|
right: 0px;
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
font-weight: 400;
|
|
font-weight: 400;
|
|
|
font-size: 20rpx;
|
|
font-size: 20rpx;
|
|
|
color: #FFFFFF;
|
|
color: #FFFFFF;
|
|
@@ -688,6 +698,6 @@
|
|
|
height: 15px;
|
|
height: 15px;
|
|
|
border-radius: 3px;
|
|
border-radius: 3px;
|
|
|
line-height: 15px;
|
|
line-height: 15px;
|
|
|
- z-index: 5;
|
|
|
|
|
|
|
+ z-index: 5;
|
|
|
}
|
|
}
|
|
|
</style>
|
|
</style>
|