<template>
  <span class="f-primary">{{ durationDisplay }}</span>
</template>

<script>
import questionMixin from '../mx-question-mixin'

export default {
  // NOTE: 一道题只能放一个timer插件，使用时请注意
  mixins: [questionMixin],
  name: 'plus-question-duration',
  data() {
    return {
      timer: null
    }
  },
  watch: {
    'question.questionId': {
      immediate: true,
      handler: function() {
        this.releaseTimer()
        if (this.allowAnswer) {
          this.timer = setInterval(_ => {
            this.setLocalDurationUp()
          }, 1000)
        }
      }
    }
  },
  beforeDestroy() {
    this.releaseTimer()
  },
  methods: {
    releaseTimer() {
      if (this.timer) {
        clearInterval(this.timer)
        this.timer = null
      }
    }
  }
}
</script>

<style scoped>

</style>
