纪念日调整

components/countdown/countdown.js

@@ -0,0 +1,41 @@
+function setTwo(num){ return num<10 ? ('0'+num) : (''+num); };
+export default class CountDown{
+    constructor(t){
+        if(t instanceof Array){
+            this.time =new Date().getTime()+ (new Date(t[1]).getTime() - new Date(t[0]).getTime());
+        }else{
+            this.time =/\//gi.test(t.toString()) ? (new Date(t).getTime()) : ( new Date().getTime()+parseInt(t));
+        }
+    }
+    timeOut (fn,t) {
+        let _now = new Date().getTime(),
+            json={},
+            count = Math.round((this.time - _now)/1000);
+        if(count <= 0) {
+            json = {day :'00',hour :'00',min  :'00',sec :'00',ms :'00'}
+            fn.call(this, json)
+            this.endFn && this.endFn.call(this, json)
+            return;
+        };
+        json = {
+            day  : setTwo(Math.floor(count/86400)),  //天数
+            hour : setTwo(Math.floor(count/ (60 * 60) % 24 )), //小时
+            min  : setTwo(Math.floor(count/60 % 60)), //分钟
+            sec  : setTwo(Math.floor(count%60)), //秒
+            ms   : setTwo((this.time - _now)%1000).substr(0,2) //豪秒
+        };
+        let _end = new Date().getTime();
+        let _diff = _now - _end; //误差
+        fn.call(this, json);
+        setTimeout(function(that){
+            that.timeOut(fn,t)
+        }, t ? (t) : 1000 - _diff,this)
+    }
+    end(fn){
+        this.endFn = fn;
+    }
+    run(fn,t){
+        this.timeOut(fn,t);
+        return this
+    }
+};

components/countdown/index.js

@@ -0,0 +1,69 @@
+import CountDown from './countdown.js';
+Component({
+    properties: {
+        showDay : {
+            type: null,
+            value:  0 ,
+            observer(val) {
+                this.setData({
+                    dayOff : typeof val === 'string' ? JSON.parse(val) : val
+                });
+            }
+        },
+        format : {
+            type: null,
+            value:  ''
+        },
+        showHour : {
+            type: null,
+            value:  1 ,
+            observer(val) {
+                this.setData({
+                    hourOff :typeof val === 'string' ? JSON.parse(val) : val
+                });
+            }
+        },
+        showMin : {
+            type: null,
+            value:  1 ,
+            observer(val) {
+                this.setData({
+                    minOff :typeof val === 'string' ? JSON.parse(val) : val
+                });
+            }
+        },
+        showSec : {
+            type: null,
+            value:  1 ,
+            observer(val) {
+                this.setData({
+                    secOff :typeof val === 'string' ? JSON.parse(val) : val
+                });
+            }
+        },
+        index : {
+            type: null,
+            value:  0
+        },
+        time: {
+            type: null,
+            value:  0
+        }
+    },
+    data: {
+        dayOff : 0,
+        hourOff :1,
+        minOff :1,
+        secOff :1,
+        countTime: ''
+    },
+    attached(){
+        new CountDown(this.data.time).run(t=>{
+            this.setData({
+                countTime : t
+            });
+        }).end(()=>{
+            this.triggerEvent('end',{index : this.data.index})
+        });
+    }
+})

components/countdown/index.json

@@ -0,0 +1,5 @@
+{
+  "component": true,
+  "usingComponents": {
+  }
+}

components/countdown/index.wxml

@@ -0,0 +1,7 @@
+<!--index.wxml-->
+<view class="countDownView">
+    <view wx:if="{{dayOff}}"><text>{{countTime.day}}</text>{{format ? format :  '天'}}</view>
+    <view wx:if="{{hourOff}}"><text>{{countTime.hour}}</text>{{format ? format :  '时'}}</view>
+    <view wx:if="{{minOff}}"><text>{{countTime.min}}</text>{{format ? format :  '分'}}</view>
+    <view wx:if="{{secOff}}"><text>{{countTime.sec}}</text>{{format ? '' :  '秒'}}</view>
+</view>

components/countdown/index.wxss

@@ -0,0 +1,13 @@
+.countDownView {
+    display: inline-block;
+    line-height: 1
+}
+
+.countDownView text {
+    padding: 0 3px;
+    margin: 0 2px;
+}
+
+.countDownView view {
+    display: inline-block;
+}