lachang-wxapp/ThorUI/components/countdown/countdown.js

Component({
  externalClasses: ['tui-countdown-class'],
  properties: {
    //数字框宽度
    width: {
      type: Number,
      value: 24
    },
    //数字框高度
    height: {
      type: Number,
      value: 24
    },
    //数字框border颜色
    bcolor: {
      type: String,
      value: "#333"
    },
    //数字框背景颜色
    bgcolor: {
      type: String,
      value: "#fff"
    },
    //数字框字体大小
    size: {
      type: Number,
      value: 24
    },
    //数字框字体颜色
    color: {
      type: String,
      value: "#333"
    },
    //是否缩放 0.9
    scale: {
      type: Boolean,
      value: false
    },
    //冒号大小
    colonSize: {
      type: Number,
      value: 28
    },
    //冒号颜色
    colonColor: {
      type: String,
      value: "#333"
    },
    //剩余时间 (单位：秒)
    time: {
      type: Number,
      value: 0,
      observer(val) {
        clearInterval(this.data.countdown)
        this.doLoop();
      }
    },
    //是否包含天
    days: {
      type: Boolean,
      value: false
    },
    //是否包含小时
    hours: {
      type: Boolean,
      value: true
    },
    //是否包含分钟
    minutes: {
      type: Boolean,
      value: true
    },
    //是否包含秒
    seconds: {
      type: Boolean,
      value: true
    },
    //是否展示为冒号,false为文字
    isColon: {
      type: Boolean,
      value: true
    }
  },
  data: {
    countdown: null,
    h: '00',
    i: '00',
    s: '00'
  },
  lifetimes: {
    detached: function() {
      clearInterval(this.data.countdown)
      this.setData({
        countdown: null
      })
    }
  },
  methods: {
    endOfTime() {
      clearInterval(this.data.countdown)
      this.setData({
        countdown: null
      })
      this.triggerEvent('end', {});
    },
    doLoop: function() {
      let seconds = this.data.time || 0
      this.countDown(seconds)
      this.setData({
        countdown: setInterval(() => {
          seconds--
          if (seconds < 0) {
            this.endOfTime()
            return
          }
          this.countDown(seconds)
        }, 1000)
      })
    },
    countDown(seconds) {
      let [day, hour, minute, second] = [0, 0, 0, 0]
      if (seconds > 0) {
        day = this.data.days ? Math.floor(seconds / (60 * 60 * 24)) : 0
        hour = Math.floor(seconds / (60 * 60)) - (day * 24)
        minute = Math.floor(seconds / 60) - (hour * 60) - (day * 24 * 60)
        second = Math.floor(seconds) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60)
      } else {
        this.endOfTime()
      }
      hour = hour < 10 ? ('0' + hour) : hour
      minute = minute < 10 ? ('0' + minute) : minute
      second = second < 10 ? ('0' + second) : second
      this.setData({
        d: day,
        h: hour,
        i: minute,
        s: second
      })
    }
  }
})