alter

pages/welfare-community/index.vue

@@ -1,15 +1,16 @@
 <template>
   <div class="bg101010">
-    <van-skeleton :row="4" :loading="isLoading" avatar-shape="square" />
     <div v-for="item in list" :key="item.id" class="box-card">
       <div class="fcs">
         <img class="wh40 m15" :src="iconURL(item.gameFileKey)" alt="">
-        <span class="txt1">{{item.gameName.length > 10 ? item.gameName.slice(0, 10) + '...' : item.gameName}}</span>
+        <span class="txt1">{{ item.gameName.length > 10 ? item.gameName.slice(0, 10) + '...' : item.gameName }}</span>
       </div>
-      <span class="txt2">你有{{item.gameGiftBagList.length}}个礼包待领取</span>
+      <span class="txt2">你有{{ item.unclaimedCount }}个礼包待领取</span>
       <div class="fncb mt6">
         <div class="ml15 fnc">
-          <div v-for="(ele, index) in item.gameGiftBagList" :key="ele.id"><div v-if="index < 4" class="ibox"><img class="ibox" src="~/assets/image/activity/welfare-community/box.png" alt="" /></div></div>
+          <div v-for="(ele, index) in item.gameGiftBagList" :key="ele.id">
+            <div v-if="index < 4" class="ibox"><img class="ibox" src="~/assets/image/activity/welfare-community/box.png" alt="" /></div>
+          </div>
           <div v-if="item.gameGiftBagList.length > 4" class="ibox"><img class="ibox" src="~/assets/image/activity/welfare-community/icon_more@2x.png" alt="" /></div>
         </div>
         <div class="view-btn mr10" @click="view(item.id, item.gameName)">立即查看</div>
@@ -19,13 +20,13 @@
 </template>
 
 <script>
+import { Toast } from 'vant';
 import { fileKeyToUrl } from '@/plugins/file-center.js';
 export default {
   auth: false,
   data() {
     return {
-      list: [],
-      isLoading: false
+      list: []
     }
   },
   head: {
@@ -48,11 +49,13 @@ export default {
     },
     async getAppGameGiftActivityList() {
       try {
-        this.isLoading = true;
         const res = await this.$axios.$post('/activity/game/giftActivity/getAppGameGiftActivityList', {}, { headers: { Authorization: this.token } });
         this.list = res.data;
-      } finally {
-        this.isLoading = false;
+      } catch (err) {
+        Toast({
+          message: err.message,
+          duration: 3000
+        });
       }
     }
   }
@@ -65,9 +68,11 @@ export default {
   align-items: center;
   justify-content: flex-start;
 }
+
 .mr10 {
   margin-right: 10px;
 }
+
 .view-btn {
   width: 78px;
   height: 28px;
@@ -79,19 +84,24 @@ export default {
   line-height: 28px;
   text-align: center;
 }
+
 .mt6 {
   margin-top: 6px;
 }
+
 .fncb {
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
+
 .bg101010 {
   background: #101010;
   min-height: 100vh;
   padding-top: 15px;
+  padding-bottom: 70px;
 }
+
 .box-card {
   width: 345px;
   height: 136px;
@@ -101,30 +111,36 @@ export default {
   border-radius: 15px;
   overflow: hidden;
 }
+
 .wh40 {
   width: 40px;
   height: 40px;
 }
+
 .m15 {
   margin: 15px;
 }
+
 .fnc {
   display: flex;
   align-items: center;
   justify-content: center;
 }
+
 .txt1 {
   font-size: 20px;
   font-weight: 500;
   color: #FFFFFF;
   line-height: 28px;
 }
+
 .txt2 {
   font-size: 14px;
   color: #CFD1D4;
   line-height: 20px;
   margin-left: 15px;
 }
+
 .ibox {
   width: 26px;
   height: 26px;
@@ -132,10 +148,12 @@ export default {
   border-radius: 3px;
   margin-right: 6px;
 }
+
 .ibox img {
   width: 100%;
   height: 100%;
 }
+
 .ml15 {
   margin-left: 15px;
 }

pages/welfare-community/list.vue

@@ -1,6 +1,5 @@
 <template>
   <div class="bg101010">
-    <van-skeleton :row="4" :loading="isLoading" avatar-shape="square" />
     <div v-for="item in list" :key="item.id" class="m15">
       <div style="display: flex;align-items: center;">
         <div class="wh60">
@@ -17,8 +16,8 @@
     <van-popup v-model="showVideoSuccess" style="background: transparent;color: #999;" closeable close-icon-position="top-right" :close-on-click-overlay="false">
       <div class="w290h215 dialog-view">
         <div class="txt3">恭喜您获得礼包</div>
-        <div class="txt4">请在游戏中兑换<br />激活码为：{{ gameActivationCode }}。<span class="c3B86FF">复制</span></div>
-        <div class="buy-btn">购买云机</div>
+        <div class="txt4">请在游戏中兑换<br />激活码为：{{ gameActivationCode }}。<span class="c3B86FF" @click="copyCode()">复制</span></div>
+        <div class="buy-btn" @click="order">购买云机</div>
       </div>
     </van-popup>
     <van-popup v-model="showAd" style="background: transparent;color: #999;" :close-on-click-overlay="false">
@@ -26,7 +25,7 @@
         <div v-if="index === 0" class="fwc">
           <div v-if="time" class="countdown">{{ time }}s后关闭广告</div>
           <video ref="videoPlayer" class="w290h330" :src="item.adVideoBase.videoUrl" x5-video-orientation="landscape" x5-video-player-type="h5" :x5-video-player-fullscreen="false" :controls="false" :webkit-playsinline="true" :playsinline="true" :autoplay="true" play-btn-position="center" :show-fullscreen-btn="false" :muted="true" @ended="ended" />
-          <van-icon name="close" color="#999999" size="34" style="margin:15px auto 0;" @click="showAd = false; getAppGameGiftActivityDetailsList()" />
+          <van-icon name="close" color="#999999" size="34" style="margin:15px auto 0;" @click="closeAd" />
         </div>
       </div>
     </van-popup>
@@ -40,7 +39,7 @@
     <van-popup v-model="showBuySuccess" style="background: transparent;color: #999;" closeable close-icon-position="top-right" :close-on-click-overlay="false">
       <div class="w290h233 dialog-view">
         <div class="txt3">恭喜您获得礼包</div>
-        <div class="txt4">请在游戏中兑换<br />激活码为：{{ gameActivationCode }}。<span class="c3B86FF">复制</span></div>
+        <div class="txt4">请在游戏中兑换<br />激活码为：{{ gameActivationCode }}。<span class="c3B86FF" @click="copyCode()">复制</span></div>
         <div class="fsc mt20">
           <div class="fcc">
             <img class="wh40" src="~/assets/image/activity/welfare-community/icon_iphone@2x.png" alt="" />
@@ -81,13 +80,13 @@ export default {
       showBuySuccess: false,
       showLogin: false,
       list: [],
-      isLoading: false,
       id: '',
       token: '',
       giftBagId: '',
       gameActivationCode: '',
       adlist: [],
-      time: 30
+      time: 30,
+      timer: null
     }
   },
   fetch() {
@@ -108,6 +107,17 @@ export default {
     }
   },
   methods: {
+    closeAd() {
+      this.showAd = false;
+      clearInterval(this.timer);
+      if (this.time === 0) {
+        this.videoSuccess()
+      }
+    },
+    async copyCode() {
+      await this.$native.clipboard.writeText(this.gameActivationCode);
+      this.$toast.success('复制成功');
+    },
     order() {
       if (this.$userAgent.isSzx && this.$userAgent.isIos) {
         window.webkit.messageHandlers.order.postMessage({});
@@ -125,17 +135,15 @@ export default {
       }
     },
     ended() {
-      this.showAd = false
-      this.getAppGameGiftActivityDetailsList();
+      this.showAd = false;
+      clearInterval(this.timer);
+      this.videoSuccess();
     },
     returnUp() {
       this.$router.push({ path: '/welfare-community', query: { token: this.$route.query.token, user: this.user } })
     },
     async receive(item) {
-      console.log(item.availableStatus);
-      console.log(this.$route.query.user === '1');
       if (item.availableStatus === 2) {
-        this.buySuccess(item);
         return
       }
       if (item.availableStatus === 1) {
@@ -144,19 +152,21 @@ export default {
       this.giftBagId = item.id;
       if (this.$route.query.user === '2') {
         if (item.taskType === 2) {
-          this.showBuy = true
+          this.buySuccess(item);
         }
         if (item.taskType === 1) {
-          this.adlist = await this.$axios.$post('/public/v5/advertising/getAdInfoByAdPlace', { id: 1, adPlace: 24, os: this.$userAgent.isAndroid ? 1 : 2 }, { headers: { Authorization: this.token } });
+          const res = await this.$axios.$post('/public/v5/advertising/getAdInfoByAdPlace', { id: 1, adPlace: 24, os: this.$userAgent.isAndroid ? 1 : 2 }, { headers: { Authorization: this.token } });
+          this.adlist = res.data
           this.showAd = true
           this.$nextTick(() => {
             this.time = 30
-            const timer = setInterval(
-              () => --this.time <= 0 && clearInterval(timer),
+            this.timer = setInterval(
+              () => --this.time <= 0 && clearInterval(this.timer),
               1000);
           })
         }
       } else {
+          this.showLogin = true
         if (this.$userAgent.isSzx && this.$userAgent.isAndroid) {
           this.showLogin = true
         }
@@ -167,15 +177,16 @@ export default {
     },
     async getAppGameGiftActivityDetailsList() {
       try {
-        this.isLoading = true;
         const res = await this.$axios.$get('/activity/game/giftActivity/getAppGameGiftActivityDetailsList?giftActivityId=' + this.id, { headers: { Authorization: this.token } });
         this.list = res.data;
-      } finally {
-        this.isLoading = false;
+      } catch (err) {
+        Toast({
+          message: err.message,
+          duration: 3000
+        });
       }
     },
     async buySuccess(item) {
-      this.showBuy = false;
       try {
         const res = await this.$axios.$get('/activity/game/giftActivity/receiveGameGift?giftBagId=' + item.id, { headers: { Authorization: this.token } });
         this.gameActivationCode = res.data.gameActivationCode;
@@ -186,6 +197,23 @@ export default {
           this.showBuySuccess = true;
         }
       } catch (err) {
+        if (err.response.data.status === 8500) {
+          this.showBuy = true;
+        } else {
+          Toast({
+            message: err.message,
+            duration: 3000
+          });
+        }
+      }
+    },
+    async videoSuccess() {
+      try {
+        const res = await this.$axios.$get('/activity/game/giftActivity/receiveGameGift?giftBagId=' + this.giftBagId, { headers: { Authorization: this.token } });
+        this.gameActivationCode = res.data.gameActivationCode;
+        this.getAppGameGiftActivityDetailsList();
+        this.showVideoSuccess = true;
+      } catch (err) {
         Toast({
           message: err.message,
           duration: 3000
@@ -200,9 +228,9 @@ export default {
 .w80h67 {
   width: 80px;
   height: 67px;
-  position: absolute;
+  position: fixed;
   left: 0;
-  bottom: 0;
+  bottom: 70px;
 }
 
 .disabled {