2018-02-05 05:25:19 +00:00
|
|
|
<template>
|
|
|
|
<time>
|
|
|
|
<span v-if=" mode == 'relative' ">{{ relative }}</span>
|
|
|
|
<span v-if=" mode == 'absolute' ">{{ absolute }}</span>
|
|
|
|
<span v-if=" mode == 'detail' ">{{ absolute }} ({{ relative }})</span>
|
2017-02-21 10:10:07 +00:00
|
|
|
</time>
|
2018-02-05 05:25:19 +00:00
|
|
|
</template>
|
2016-12-28 22:49:51 +00:00
|
|
|
|
2018-02-05 05:25:19 +00:00
|
|
|
<script>
|
|
|
|
export default {
|
|
|
|
props: ['time', 'mode'],
|
|
|
|
data: {
|
|
|
|
mode: 'relative',
|
|
|
|
tickId: null,
|
|
|
|
},
|
|
|
|
created: function() {
|
|
|
|
this.absolute =
|
|
|
|
this.time.getFullYear() + '年' +
|
|
|
|
(this.time.getMonth() + 1) + '月' +
|
|
|
|
this.time.getDate() + '日' +
|
|
|
|
' ' +
|
|
|
|
this.time.getHours() + '時' +
|
|
|
|
this.time.getMinutes() + '分';
|
2016-12-28 22:49:51 +00:00
|
|
|
|
2017-02-21 10:10:07 +00:00
|
|
|
if (this.mode == 'relative' || this.mode == 'detail') {
|
|
|
|
this.tick();
|
2018-02-05 05:25:19 +00:00
|
|
|
this.tickId = setInterval(this.tick, 1000);
|
2017-02-21 10:10:07 +00:00
|
|
|
}
|
2018-02-05 05:25:19 +00:00
|
|
|
},
|
|
|
|
destroyed: function() {
|
2017-02-21 10:10:07 +00:00
|
|
|
if (this.mode === 'relative' || this.mode === 'detail') {
|
2018-02-05 05:25:19 +00:00
|
|
|
clearInterval(this.tickId);
|
2017-02-21 10:10:07 +00:00
|
|
|
}
|
2018-02-05 05:25:19 +00:00
|
|
|
},
|
|
|
|
tick: function() {
|
2017-02-20 02:02:43 +00:00
|
|
|
const now = new Date();
|
2017-02-21 10:10:07 +00:00
|
|
|
const ago = (now - this.time) / 1000/*ms*/;
|
|
|
|
this.relative =
|
2017-03-22 21:31:46 +00:00
|
|
|
ago >= 31536000 ? '%i18n:common.time.years_ago%' .replace('{}', ~~(ago / 31536000)) :
|
|
|
|
ago >= 2592000 ? '%i18n:common.time.months_ago%' .replace('{}', ~~(ago / 2592000)) :
|
|
|
|
ago >= 604800 ? '%i18n:common.time.weeks_ago%' .replace('{}', ~~(ago / 604800)) :
|
|
|
|
ago >= 86400 ? '%i18n:common.time.days_ago%' .replace('{}', ~~(ago / 86400)) :
|
|
|
|
ago >= 3600 ? '%i18n:common.time.hours_ago%' .replace('{}', ~~(ago / 3600)) :
|
|
|
|
ago >= 60 ? '%i18n:common.time.minutes_ago%'.replace('{}', ~~(ago / 60)) :
|
|
|
|
ago >= 10 ? '%i18n:common.time.seconds_ago%'.replace('{}', ~~(ago % 60)) :
|
|
|
|
ago >= 0 ? '%i18n:common.time.just_now%' :
|
|
|
|
ago < 0 ? '%i18n:common.time.future%' :
|
|
|
|
'%i18n:common.time.unknown%';
|
2018-02-05 05:25:19 +00:00
|
|
|
}
|
|
|
|
};
|
|
|
|
</script>
|