chenhaodong / mew-iview

Commit de30f1b30d987810d1d7e157bc5ae8a6a8cd8b9a

Authored by 梁灏
1 parent 468bde3c

update Time func

Showing 2 changed files with 79 additions and 91 deletions   Show diff stats
Inline Side-by-side
examples/routers/time.vue
  Show/Hide comments   View file @de30f1b
... ... @@ -2,14 +2,14 @@
2 2 <div>
3 3 <Time :time="1526608921" />
4 4 <Time :time="1652839997" />
5   - <Time :time="ddd" />
  5 + <Time :time="ddd" interval="1" />
6 6 </div>
7 7 </template>
8 8 <script>
9 9 export default {
10 10 data () {
11 11 return {
12   - ddd: new Date('2018-01-01')
  12 + ddd: new Date('2019-05-28 14:12:00')
13 13 };
14 14 },
15 15 computed: {},
... ...
src/components/time/time.js
  Show/Hide comments   View file @de30f1b
1   -const time = {
2   - getUnix (place) {
3   - const date = new Date();
4   - const timestamp = date.getTime(); // 得到的是毫秒
  1 +/**
  2 + * @param {Number} timeStamp 判断时间戳格式是否是毫秒
  3 + * @returns {Boolean}
  4 + */
  5 +// const isMillisecond = timeStamp => {
  6 +// const timeStr = String(timeStamp);
  7 +// return timeStr.length > 10;
  8 +// };
5 9  
6   - if (place === 's') { // 秒
7   - return Math.floor(timestamp / 1000);
8   - } else { // 毫秒
9   - return timestamp;
10   - }
11   - },
12   - getToday (place) {
13   - const today = new Date();
14   - const year = today.getFullYear();
15   - const month = today.getMonth() + 1;
16   - const day = today.getDate();
17   - const hours = 0;
18   - const mins = 0;
19   - const secs = 0;
20   - const datetime = year + '-' + month + '-' + day + ' ' + hours + ':' + mins + ':' + secs;
21   - let tmp_datetime = datetime.replace(/:/g,'-');
22   - tmp_datetime = tmp_datetime.replace(/ /g,'-');
23   - const arr = tmp_datetime.split('-');
24   - const now = new Date(Date.UTC(arr[0],arr[1]-1,arr[2],arr[3]-8,arr[4],arr[5]));
25   -
26   - if (place === 's') {
27   - return parseInt(now.getTime() / 1000);
28   - } else {
29   - return parseInt(now.getTime());
30   - }
31   - },
32   - getYear (place) {
33   - const today = new Date();
34   - const year = today.getFullYear();
35   - const month = 0;
36   - const day = 1;
37   - const hours = 0;
38   - const mins = 0;
39   - const secs = 0;
40   - const datetime = year + '-' + month + '-' + day + ' ' + hours + ':' + mins + ':' + secs;
41   - let tmp_datetime = datetime.replace(/:/g,'-');
42   - tmp_datetime = tmp_datetime.replace(/ /g,'-');
43   - const arr = tmp_datetime.split('-');
44   - const now = new Date(Date.UTC(arr[0],arr[1]-1,arr[2],arr[3]-8,arr[4],arr[5]));
45   - if (place === 's') {
46   - return parseInt(now.getTime() / 1000);
47   - } else {
48   - return parseInt(now.getTime());
49   - }
50   - },
51   - getLastDate (time, type) {
52   - const unixtime = time * 1000;
53   - const date = new Date(unixtime);
54   - const month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1;
55   - const currentDate = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
56   - const hh = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
57   - const mm = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
58   - // const ss = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
  10 +/**
  11 + * @param {Number} timeStamp 传入的时间戳
  12 + * @param {Number} currentTime 当前时间时间戳
  13 + * @returns {Boolean} 传入的时间戳是否早于当前时间戳
  14 + */
  15 +const isEarly = (timeStamp, currentTime) => {
  16 + return timeStamp < currentTime;
  17 +};
59 18  
60   - if (type === 'month') {
61   - return month + '-' + currentDate + ' ' + hh + ':' + mm;
62   - //return month + "-" + currentDate;
63   - } else {
64   - return date.getFullYear() + '-' + month + '-' + currentDate + ' ' + hh + ':' + mm;
65   - }
66   - },
67   - // 时间戳转详细时间，比如5分钟前
68   - getMagic (timestamp) {
69   - const now = this.getUnix('s'); //当前时间戳
70   - const today = this.getToday('s'); //今天0点时间戳
71   - const year = this.getYear('s'); //今年0点时间戳
72   - const timer = now - timestamp;
  19 +/**
  20 + * @param {Number} num 数值
  21 + * @returns {String} 处理后的字符串
  22 + * @description 如果传入的数值小于10，即位数只有1位，则在前面补充0
  23 + */
  24 +const getHandledValue = num => {
  25 + return num < 10 ? '0' + num : num;
  26 +};
73 27  
74   - let tip = '';
  28 +/**
  29 + * @param {Number} timeStamp 传入的时间戳
  30 + * @param {Number} startType 要返回的时间字符串的格式类型，传入'year'则返回年开头的完整时间
  31 + */
  32 +const getDate = (timeStamp, startType) => {
  33 + const d = new Date(timeStamp * 1000);
  34 + const year = d.getFullYear();
  35 + const month = getHandledValue(d.getMonth() + 1);
  36 + const date = getHandledValue(d.getDate());
  37 + const hours = getHandledValue(d.getHours());
  38 + const minutes = getHandledValue(d.getMinutes());
  39 + const second = getHandledValue(d.getSeconds());
  40 + let resStr = '';
  41 + if (startType === 'year') resStr = year + '-' + month + '-' + date + ' ' + hours + ':' + minutes + ':' + second;
  42 + else resStr = month + '-' + date + ' ' + hours + ':' + minutes;
  43 + return resStr;
  44 +};
75 45  
76   - if (timer <= 0) {
77   - tip = '刚刚';
78   - } else if (Math.floor(timer/60) <= 0) {
79   - tip = '刚刚';
80   - } else if (timer < 3600) {
81   - tip = Math.floor(timer/60) + '分钟前';
82   - } else if (timer >= 3600 && (timestamp - today >= 0) ) {
83   - tip = Math.floor(timer/3600) + '小时前';
84   - } else if (timer/86400 <= 31) {
85   - tip = Math.ceil(timer/86400) + '天前';
86   - } else if (timestamp - today < 0 && (timestamp - year >= 0)) {
87   - tip = this.getLastDate(timestamp, 'month');
88   - } else {
89   - tip = this.getLastDate(timestamp, 'year');
90   - }
91   - return tip;
92   - }
  46 +/**
  47 + * @param {String|Number} timeStamp 时间戳
  48 + * @returns {String} 相对时间字符串
  49 + */
  50 +export const getRelativeTime = timeStamp => {
  51 + // 判断当前传入的时间戳是秒格式还是毫秒
  52 + // const IS_MILLISECOND = isMillisecond(timeStamp);
  53 + const IS_MILLISECOND = true;
  54 + // 如果是毫秒格式则转为秒格式
  55 + if (IS_MILLISECOND) Math.floor(timeStamp /= 1000);
  56 + // 传入的时间戳可以是数值或字符串类型，这里统一转为数值类型
  57 + timeStamp = Number(timeStamp);
  58 + // 获取当前时间时间戳
  59 + const currentTime = Math.floor(Date.parse(new Date()) / 1000);
  60 + // 判断传入时间戳是否早于当前时间戳
  61 + const IS_EARLY = isEarly(timeStamp, currentTime);
  62 + // 获取两个时间戳差值
  63 + let diff = currentTime - timeStamp;
  64 + // 如果IS_EARLY为false则差值取反
  65 + if (!IS_EARLY) diff = -diff;
  66 + let resStr = '';
  67 + const dirStr = IS_EARLY ? '前' : '后';
  68 + // 少于等于59秒
  69 + if (diff <= 59) resStr = diff + '秒' + dirStr;
  70 + // 多于59秒，少于等于59分钟59秒
  71 + else if (diff > 59 && diff <= 3599) resStr = Math.floor(diff / 60) + '分钟' + dirStr;
  72 + // 多于59分钟59秒，少于等于23小时59分钟59秒
  73 + else if (diff > 3599 && diff <= 86399) resStr = Math.floor(diff / 3600) + '小时' + dirStr;
  74 + // 多于23小时59分钟59秒，少于等于29天59分钟59秒
  75 + else if (diff > 86399 && diff <= 2623859) resStr = Math.floor(diff / 86400) + '天' + dirStr;
  76 + // 多于29天59分钟59秒，少于364天23小时59分钟59秒
  77 + else if (diff > 2623859 && diff <= 31567859) resStr = getDate(timeStamp);
  78 + // 多于364天23小时59分钟59秒
  79 + else resStr = getDate(timeStamp, 'year');
  80 + return resStr;
93 81 };
94 82  
95 83 export default function (timestamp) {
96   - return time.getMagic(timestamp / 1000);
  84 + return getRelativeTime(timestamp);
97 85 }
98 86 \ No newline at end of file
... ...