7f9ea0dc
 梁灏
init Time component
|
1
|
<template>
|
|
42f644a3
梁灏
add CSS
|
2
|
<span :class="classes" @click="handleClick">{{ date }}</span>
|
|
7f9ea0dc
梁灏
init Time component
|
3
4
|
</template>
<script>
|
|
492f652b
梁灏
sse
|
5
6
|
import Vue from 'vue';
const isServer = Vue.prototype.$isServer;
|
|
b8509c59
梁灏
update Time
|
7
|
import { oneOf } from '../../utils/assist';
|
|
eb37e68c
梁灏
update Time
|
8
|
import Time from './time';
|
|
b8509c59
梁灏
update Time
|
9
10
|
const prefixCls = 'ivu-time';
|
|
7f9ea0dc
梁灏
init Time component
|
11
|
|
|
b8509c59
梁灏
update Time
|
12
13
14
15
|
export default {
name: 'Time',
props: {
time: {
|
|
9e4b6e8e
梁灏
Time support String
|
16
|
type: [Number, Date, String],
|
|
b8509c59
梁灏
update Time
|
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
|
required: true
},
type: {
type: String,
validator (value) {
return oneOf(value, ['relative', 'date', 'datetime']);
},
default: 'relative'
},
hash: {
type: String,
default: ''
},
interval: {
type: Number,
default: 60
}
},
data () {
return {
date: ''
};
},
computed: {
classes () {
return [
`${prefixCls}`,
{
[`${prefixCls}-with-hash`]: this.hash
}
];
}
},
methods: {
handleClick () {
if (this.hash !== '') window.location.hash = this.hash;
|
|
492f652b
梁灏
sse
|
53
54
|
},
setTime () {
|
|
eb37e68c
梁灏
update Time
|
55
56
57
58
59
60
61
62
|
const type = typeof this.time;
let time;
if (type === 'number') {
const timestamp = this.time.toString().length > 10 ? this.time : this.time * 1000;
time = (new Date(timestamp)).getTime();
} else if (type === 'object') {
time = this.time.getTime();
|
|
9e4b6e8e
梁灏
Time support String
|
63
64
|
} else if (type === 'string') {
time = (new Date(this.time)).getTime();
|
|
eb37e68c
梁灏
update Time
|
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
|
}
if (this.type === 'relative') {
this.date = Time(time);
} else {
const date = new Date(this.time);
const year = date.getFullYear();
const month = (date.getMonth() + 1) < 10 ? '0' + (date.getMonth() + 1) : (date.getMonth() + 1);
const day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
const hour = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
const minute = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
const second = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
if (this.type === 'datetime') {
this.date = `${year}-${month}-${day} ${hour}:${minute}:${second}`;
} else if (this.type === 'date') {
this.date = `${year}-${month}-${day}`;
}
}
|
|
b8509c59
梁灏
update Time
|
84
85
86
87
|
}
},
mounted () {
this.setTime();
|
|
492f652b
梁灏
sse
|
88
|
if (isServer) return;
|
|
b8509c59
梁灏
update Time
|
89
90
91
92
93
94
95
|
this.timer = setInterval(() => {
this.setTime();
}, 1000 * this.interval);
},
beforeDestroy () {
if (this.timer) clearInterval(this.timer);
}
|
|
7f9ea0dc
梁灏
init Time component
|
96
97
|
};
</script>
|
