You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
907 B
Vue
51 lines
907 B
Vue
<template>
|
|
<div class="timer">
|
|
<p>remaining: {{mins}}:{{secs}}</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import Timer from './Timer.js'
|
|
|
|
export default {
|
|
data(){
|
|
return {
|
|
timer: null,
|
|
}
|
|
},
|
|
methods: {
|
|
restart(){
|
|
console.log('restart timer')
|
|
this.timer = new Timer(new Date(this.expires*1000));
|
|
}
|
|
},
|
|
props: ['expires', 'expired'],
|
|
computed: {
|
|
secs: function() {
|
|
if (this.timer){
|
|
return this.timer.secs;
|
|
}
|
|
},
|
|
mins: function(){
|
|
if (this.timer){
|
|
return this.timer.mins;
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
expires: function(val){
|
|
let self = this;
|
|
this.timer = new Timer(new Date(val*1000));
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
p.expired {
|
|
color: red;
|
|
}
|
|
</style>
|