yohood抽奖定时器实现

lea guo
Commit ba340986b8346e7a28e050a77e04aa81abe10b7d 1 parent 87f65697
Showing 6 changed files with 71 additions and 83 deletions
pages/zeroSell/components/yohoodLottery/action-bar.js
pages/zeroSell/components/yohoodLottery/action-bar.wxml
pages/zeroSell/components/yohoodLottery/product-detail-header.js
pages/zeroSell/originalPriceSell.js
pages/zeroSell/originalPriceSell.wxml
utils/util.js
--- a/pages/zeroSell/components/yohoodLottery/action-bar.js
View file @ba34098
+++ b/pages/zeroSell/components/yohoodLottery/action-bar.js
View file @ba34098
@@ -50,12 +50,12 @@ Component({
       value: 0,
     },
     // time in seconds
-    startTime: {
-      type: Number,
-      value: 0,
-      observer: function(startTime) {
+    formatTimeList: {
+      type: Array,
+      value: [],
+      observer(value) {
         this.setData({
-          remainingTime: fomartCountdownTime({ startTime }).join(':'),
+          remainingTime: value.join(':'),
         });
       },
     },
@@ -77,26 +77,12 @@ Component({
     code: '',
     error: false,
     fellow: false,
-    isStart: false,
     remainingTime: '',
   },
   ready() {
     this.service = new ZeroSellService();
     this.commonService = new CommonService();
-    const timeId = setInterval(() => {
-      if (this.data.isStart) {
-        this.triggerEvent('changeStatus');
-        clearInterval(timeId);
-      }
-      const fomartTimes = fomartCountdownTime({
-        startTime: this.properties.startTime,
-      });
-      this.setData({
-        remainingTime: fomartTimes.join(':') || '00:00:00',
-        isStart: fomartTimes.join('') === "000000" && this.properties.status === 1,
-      });
-    }, 1000);
   },
   /**
--- a/pages/zeroSell/components/yohoodLottery/action-bar.wxml
View file @ba34098
+++ b/pages/zeroSell/components/yohoodLottery/action-bar.wxml
View file @ba34098
@@ -42,7 +42,9 @@
       <view class="code">{{code}}</view>
     </view>
     <form bindsubmit='submitFormId' report-submit='true'>
-      <button open-type="share" class="share" form-type="submit" bindtap="hadJoinToShare">分享一下，中奖概率立马double</button>
+      <button open-type="share" class="share" form-type="submit" bindtap="hadJoinToShare">
+        分享一下，中奖概率立马double
+      </button>
     </form>
     <view class="share-desc">1个好友参加=1个抽奖码=中奖几率UP！</view>
   </view>
--- a/pages/zeroSell/components/yohoodLottery/product-detail-header.js
View file @ba34098
+++ b/pages/zeroSell/components/yohoodLottery/product-detail-header.js
View file @ba34098
 // page/subPackage/pages/zeroSell/components/product-detail-header.js
-import { fomartCountdownTime,formatTimeByDefined } from '../../../../utils/util';
+import { formatTimeByDefined } from '../../../../utils/util';
 Component({
   properties: {
     product: {
       type: Object,
       observer(product) {
-        const {end_time: endTime, start_time: startTime, status} = product
-        let nextActivityTime = ''
-        if(status === 1 && endTime) {
-          nextActivityTime = `${formatTimeByDefined(startTime, 'Y-M-D h:m')}-${formatTimeByDefined(endTime, 'h:m')}`
+        const { end_time: endTime, start_time: startTime, status } = product;
+        let nextActivityTime = '';
+        if (status === 1 && endTime) {
+          nextActivityTime = `${formatTimeByDefined(
+            startTime,
+            'Y-M-D h:m',
+          )}-${formatTimeByDefined(endTime, 'h:m')}`;
         }
         this.setData({
-          formatTimeList: this.formatCountDown(),
-          nextActivityTime
+          nextActivityTime,
         });
       },
     },
@@ -27,31 +29,16 @@ Component({
         this.setData({ show: value });
       },
     },
+    formatTimeList: {
+      type: Array,
+      value: [],
+    },
   },
   data: {
     show: false,
     isEnd: false,
-    formatTimeList: [],
-    nextActivityTime: ''
-  },
-  ready: function() {
-    const timeId = setInterval(() => {
-      if (this.data.isEnd) {
-        this.triggerEvent('changeStatus');
-        clearInterval(timeId);
-      }
-      const formatTimeList = this.formatCountDown();
-      this.setData({
-        formatTimeList: formatTimeList,
-        isEnd: formatTimeList.join('') === "000000" && this.properties.product.status === 2,
-      });
-    }, 1000);
-  },
-  methods: {
-    formatCountDown() {
-      // 时间单位为S
-      let { end_time: endTime = 0 } = this.properties.product || {};
-      return fomartCountdownTime({ endTime });
-    },
+    nextActivityTime: '',
   },
+  ready() {},
+  methods: {},
 });
--- a/pages/zeroSell/originalPriceSell.js
View file @ba34098
+++ b/pages/zeroSell/originalPriceSell.js
View file @ba34098
@@ -9,15 +9,9 @@ import {
 import { getQRCodeSource } from '../../libs/miniQRCodeRoute';
 import { Toast } from '../../vendors/zanui/index';
 import router from './router/router';
-import { wrapperName } from './helper';
-import { formatImageUrl } from '../../utils/util';
+import { formatImageUrl, fomartCountdownTime } from '../../utils/util';
 import { jumpByUrl } from '../../libs/urlRoute';
-import {
-  yasReport,
-  YB_PAGE_OPEN_L,
-  YB_LUCK_DT_GDS_C,
-  YB_LUCK_DT_JOIN_C,
-} from '../../libs/yas';
+import { yasReport, YB_PAGE_OPEN_L, YB_LUCK_DT_JOIN_C } from '../../libs/yas';
 const ACTIVITY = {
   UNKNOWN: 0,
@@ -77,7 +71,9 @@ Page(
         shareFlag: false,
         notice: {},
         lottery: {},
-        remainingTime: '',
+        formatTimeList: [],
+        isCountdownEnd: false,
+        timeId: null,
       },
       /**
@@ -299,20 +295,17 @@ Page(
           actPrizeId: this.data.actPrizeId,
         };
-        return this.service.getYohoodDetail(params)
-          .then((r1) => {
+        return this.service
+          .getYohoodDetail(params)
+          .then(r1 => {
             wx.hideLoading();
             if (r1.code === 200 && r1.data) {
               let product = r1.data;
-
-              let qrcode = this.service.getQrCode({
-                shareUid: app.getUid(),
-                actPrizeId: this.data.actPrizeId || product.id || '',
-              });
-
               this._getMineCode(product.id);
+              this._formatCountdownTime(product.remaining);
+
               this.setData({
                 product: product,
                 actPrizeId: this.data.actPrizeId || product.id || '',
@@ -332,6 +325,30 @@ Page(
           });
       },
+      _formatCountdownTime(remaining) {
+        if (this.data.timeId || !remaining) {
+          return;
+        }
+        // 初始化倒计时时间
+        const formatTimeList = fomartCountdownTime(remaining);
+        this.setData({
+          formatTimeList,
+        });
+        const timeId = setInterval(() => {
+          if (this.data.isCountdownEnd) {
+            this.changeActionStatus();
+            clearInterval(timeId);
+          }
+          remaining--;
+          const formatTimeList = fomartCountdownTime(remaining);
+          this.setData({
+            formatTimeList,
+            timeId,
+            isCountdownEnd: formatTimeList.join('') === '000000',
+          });
+        }, 1000);
+      },
+
       _fetchParams(code) {
         return getQRCodeSource(code).then(result => {
           this.setData({
@@ -387,7 +404,7 @@ Page(
         return this.data.myPrizeCount > 0;
       },
-      changeActionStatus(isStart) {
+      changeActionStatus() {
         wx.showLoading({
           mask: true,
         });
@@ -454,7 +471,9 @@ Page(
       },
       onShareAppMessage(res) {
         let params = {
-          TITLE: `有货UFO在Yohood现场搞事情，点一下可原价购买${this.data.product.name}`,
+          TITLE: `有货UFO在Yohood现场搞事情，点一下可原价购买${
+            this.data.product.name
+          }`,
           DESC: '我在YOHOOD发现一个不错的商品赶快来看看吧！',
         };
         this.setData({
@@ -471,7 +490,9 @@ Page(
           return {
             title: params.TITLE, // 分享标题
             desc: params.DESC, // 分享描述
-            path: `/pages/zeroSell/originalPriceSell?actPrizeId=${this.data.product.id}`,
+            path: `/pages/zeroSell/originalPriceSell?actPrizeId=${
+              this.data.product.id
+            }`,
           };
         } else if (res.from === 'button') {
           // 用户点击分享按钮
--- a/pages/zeroSell/originalPriceSell.wxml
View file @ba34098
+++ b/pages/zeroSell/originalPriceSell.wxml
View file @ba34098
 <view class="header {{shareFlag || (notice.content || product.status >= 3 ? 'mt-header': '') }}">
-  <product-header product="{{product}}" shareFlag="{{shareFlag}}" bindchangeStatus="changeActionStatus" avatars="{{avatars}}"></product-header>
+  <product-header product="{{product}}" shareFlag="{{shareFlag}}" format-timeList="{{formatTimeList}}" bindchangeStatus="changeActionStatus" avatars="{{avatars}}"></product-header>
 </view>
 <view class="lottery-info">
   <view class="flow-tile-wrap">
@@ -40,7 +40,7 @@
   </block>
 </view>
 <view class="action-bar">
-  <action-bar activity-status="{{product.status}}" start-time="{{product.start_time}}" is-login="{{isLogin}}" status="{{actionStatus}}" num="{{myPrizeCount}}" share-uid="{{shareUid}}" act-id="{{actPrizeId}}" bindchangeStatus="changeActionStatus" bindshare="share" copyText="{{lottery.miniappCopy}}" text="{{lottery.miniappTip}}" bindgaincodesuccess="reportSuccess" type="{{lottery.miniappType}}"></action-bar>
+  <action-bar activity-status="{{product.status}}" format-timeList="{{formatTimeList}}" is-login="{{isLogin}}" status="{{actionStatus}}" num="{{myPrizeCount}}" share-uid="{{shareUid}}" act-id="{{actPrizeId}}" bindchangeStatus="changeActionStatus" bindshare="share" copyText="{{lottery.miniappCopy}}" text="{{lottery.miniappTip}}" bindgaincodesuccess="reportSuccess" type="{{lottery.miniappType}}"></action-bar>
 </view>
 <view class="foot"></view>
 <import src="../../vendors/zanui/toast/index.wxml" />
--- a/utils/util.js
View file @ba34098
+++ b/utils/util.js
View file @ba34098
@@ -402,21 +402,13 @@ function removeStorageSync(key, fromPage) {
  * 格式化倒计时时间
  * time in seconds
  */
-function fomartCountdownTime({ startTime, endTime }) {
-  let remainingTime = 0;
-
-  if (endTime) {
-    remainingTime = endTime - Date.now() / 1000;
-  } else if (startTime) {
-    remainingTime = startTime - Date.now() / 1000;
-  }
-
-  if (remainingTime <= 0) {
+function fomartCountdownTime(remainingTimeInSeconds = 0) {
+  if (remainingTimeInSeconds < 0) {
     return [];
   }
-  const timeInHour = Math.floor(remainingTime / 3600);
-  remainingTime = remainingTime - timeInHour * 3600;
+  const timeInHour = Math.floor(remainingTimeInSeconds / 3600);
+  let remainingTime = remainingTimeInSeconds - timeInHour * 3600;
   const timeInMinute = Math.floor(remainingTime / 60);
   remainingTime = parseInt(remainingTime - timeInMinute * 60);