feat: 引入dayjs

CHANGELOG.md

@@ -64,6 +64,7 @@
 ### 🔨 代码重构
 范围|描述|commitId
 --|--|--
+ - | 下滑时间轴添加备注 | [4fd20e3](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/4fd20e3)
  template | eslint prettier sass uview tailwindcss | [9c966a1](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/9c966a1)
 
 

src/main.js

@@ -4,6 +4,7 @@ import Tall from '@/utils/tall';
 import App from './App';
 import './common/styles/index.css';
 import store from './store';
+import dayjs from 'dayjs';
 
 //#ifdef H5
 import './registerServiceWorker';
@@ -18,6 +19,7 @@ Vue.use(indexedDB);
 Vue.config.productionTip = false;
 Vue.use(uView);
 Vue.use(Tall);
+Vue.use(dayjs);
 
 App.mpType = 'app';
 

src/utils/tall.js

@@ -2,12 +2,14 @@ import app from '@/config/app.js';
 import zIndex from '@/config/zIndex.js';
 import plugin from '@/config/plugin.js';
 import storage from '@/utils/storage.js';
+import time from '@/utils/time.js';
 
 const $t = {
   zIndex, // 定位元素层级
   app, // app级别的相关配置
   plugin, // 插件相关配置信息
   storage, // 本地存储storage封装
+  time, // 时间处理
 };
 
 uni.$t = $t;

src/utils/time.js

@@ -0,0 +1,297 @@
+import dayjs from 'dayjs';
+var advancedFormat = require('dayjs/plugin/advancedFormat');
+var weekOfYear = require('dayjs/plugin/weekOfYear');
+dayjs.extend(advancedFormat);
+dayjs.extend(weekOfYear);
+
+/**
+ * 格式化数字
+ * @param {*} n
+ */
+const formatNumber = n => {
+  const str = n.toString();
+  return str[1] ? str : `0${str}`;
+};
+
+/**
+ * 格式化时间
+ * @param {number} beginTime
+ */
+const formatTime = beginTime => {
+  const date = new Date(beginTime);
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
+  const hour = date.getHours();
+  const minute = date.getMinutes();
+  const second = date.getSeconds();
+
+  return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}`;
+};
+
+/**
+ * 时间转换 08:00 转换成8小时0分钟
+ * @param {string} time
+ * @returns {{hours: number, minutes: number}}
+ */
+const convertTime = time => {
+  const arr = time.split(':');
+  return {
+    hours: parseInt(arr[0], 10),
+    minutes: parseInt(arr[1], 10),
+  };
+};
+
+/**
+ * 将秒 -> 分 秒
+ * @param {number} seconds
+ */
+const secondToMinute = seconds => {
+  const minute = formatNumber(Math.floor(seconds / 60));
+  const second = formatNumber(parseInt(seconds % 60, 10));
+  return {
+    minute,
+    second,
+  };
+};
+
+/**
+ * 将时间戳  -> 时:分
+ * @param {Number} timestamp 时间戳
+ * @return date:2018/10/09   time: 12:59
+ */
+const setTimestampToStr = timestamp => {
+  const timeObj = new Date(timestamp);
+  const year = timeObj.getFullYear();
+  const month = formatNumber(timeObj.getMonth() + 1);
+  const day = formatNumber(timeObj.getDate());
+  const hour = formatNumber(timeObj.getHours());
+  const minute = formatNumber(timeObj.getMinutes());
+  const date = `${year}/${month}/${day}`;
+  const time = `${hour}:${minute}`;
+  return {
+    date,
+    time,
+  };
+};
+
+/**
+ * 检测时间(ms)是不是今天
+ * @param {Number} time 时间戳
+ */
+const validateTimeIsToday = time => {
+  const timeDate = new Date(time);
+  const date = new Date();
+  return timeDate.getFullYear() === date.getFullYear() && timeDate.getMonth() === date.getMonth() && timeDate.getDate() === date.getDate();
+};
+
+/**
+ * 格式化开始时间
+ * @param {Number} timestamp 时间戳
+ * @return
+ * 如果是今天 -> 时:分
+ * 如果不是今年 -> 年/月/日 时:分
+ * 否则 *月*日 时:分
+ */
+const formatBeginTime = timestamp => {
+  const timeObj = new Date(timestamp);
+  const year = timeObj.getFullYear();
+  const month = formatNumber(timeObj.getMonth() + 1);
+  const day = formatNumber(timeObj.getDate());
+  const hour = formatNumber(timeObj.getHours());
+  const minute = formatNumber(timeObj.getMinutes());
+  const date = `${year}/${month}/${day}`;
+  const time = `${hour}:${minute}`;
+  const currentYear = new Date().getFullYear();
+
+  if (validateTimeIsToday(timestamp)) {
+    // 今天
+    return `今天 ${time}`;
+  } else if (currentYear !== year) {
+    // 不是今年
+    return `${date} ${time}`;
+  } else {
+    return `${month}月${day}日 ${time}`;
+  }
+};
+
+/**
+ * 格式化时长
+ * @param {Number} duration 时长
+ * 超过24小时（ 24 * 60 * 60 * 1000 ms） 转换成天数 + 小时 + 分钟
+ * 小于1分钟（ 60 * 1000 ms） 转换成秒钟
+ * 其余的显示分钟
+ * 超过2小时（ 2 * 60 * 60 * 1000 ms） 转换成小时 + 分钟数
+ */
+const formatDuration = duration => {
+  const minuteTime = 60 * 1000;
+  const hourTime = 60 * minuteTime;
+  const dayTime = 24 * hourTime;
+  const days = Math.floor(duration / dayTime);
+  const hours = Math.floor((duration % dayTime) / hourTime);
+  const minutes = Math.floor((duration % hourTime) / minuteTime);
+  if (duration <= 60 * 1000) {
+    // 小于1分钟 返回几秒
+    return `${Math.floor(duration / 1000)}秒`;
+  } else if (duration > dayTime) {
+    // 大于1天
+    if (minutes === 0) {
+      if (hours === 0) {
+        // 分钟数是0 和 小时数是0 返回 几天
+        return `${days}天`;
+      } else {
+        // 分钟是0 小时不是0 返回 几天几小时
+        return `${days}天${hours}小时`;
+      }
+    } else {
+      // 分钟不是0 返回几天几时几分
+      return `${days}天${hours}时${minutes}分`;
+    }
+  } else if (duration > 2 * hourTime) {
+    // 大于2h
+    if (minutes === 0) {
+      // 分钟是0 返回几小时
+      return `${hours}小时`;
+    } else {
+      // 分钟不是0 返回几小时几分钟
+      return `${hours}小时${minutes}分钟`;
+    }
+  } else {
+    // 其余情况 返回 几分钟
+    return `${parseInt(duration / minuteTime)}分钟`;
+  }
+};
+
+/**
+ * 格式化时长 转换成对象格式
+ * @param {Number} duration 时长
+ * 超过24小时（ 24 * 60 * 60 * 1000 ms） 转换成{days, hours, minutes, seconds: 0}
+ * 小于1分钟（ 60 * 1000 ms） 转换成秒钟 { days: 0, hours: 0, minutes: 0, seconds }
+ * 其余的显示分钟 { days: 0, hours: 0, minutes, seconds: 0 }
+ * 超过2小时（ 2 * 60 * 60 * 1000 ms） 转换成{ days: 0, hours, minutes, seconds: 0 }
+ */
+const formatDurationToObject = duration => {
+  const minuteTime = 60 * 1000;
+  const hourTime = 60 * minuteTime;
+  const dayTime = 24 * hourTime;
+  const days = Math.floor(duration / dayTime);
+  const hours = Math.floor((duration % dayTime) / hourTime);
+  const minutes = Math.floor((duration % hourTime) / minuteTime);
+  const result = {
+    days: 0,
+    hours: 0,
+    minutes: 0,
+    seconds: 0,
+  };
+  if (duration <= 60 * 1000) {
+    // 小于1分钟 返回几秒
+    result.seconds = Math.floor(duration / 1000);
+  } else if (duration > dayTime) {
+    // 大于1天
+    if (minutes === 0) {
+      if (hours === 0) {
+        // 分钟数是0 和 小时数是0 返回 几天
+        result.days = days;
+      } else {
+        // 分钟是0 小时不是0 返回 几天几小时
+        result.days = days;
+        result.hours = hours;
+      }
+    } else {
+      // 分钟不是0 返回几天几时几分
+      result.days = days;
+      result.hours = hours;
+      result.minutes = minutes;
+    }
+  } else if (duration > 2 * hourTime) {
+    // 大于2h
+    if (minutes === 0) {
+      // 分钟是0 返回几小时
+      result.hours = hours;
+    } else {
+      // 分钟不是0 返回几小时几分钟
+      result.hours = hours;
+      result.minutes = minutes;
+    }
+  } else {
+    // 其余情况 返回 几分钟
+    result.minutes = minutes;
+  }
+  return result;
+};
+
+/**
+ * 将对象格式的时间转换成时间戳
+ * @param {obj} 对象格式的时间 days, hours, minutes, seconds
+ * @return 时长的ms
+ */
+const formatObjectTimeToMs = (days = 0, hours = 0, minutes = 0, seconds = 0) => {
+  return days * 24 * 60 * 60 * 1000 + hours * 60 * 60 * 1000 + minutes * 60 * 1000 + seconds * 1000;
+};
+
+/**
+ * 计算过滤 周期
+ * @param {string} time 周期字符串
+ * @return {string} cycle 周期英文字符串
+ */
+const computeCycle = time => {
+  // 加载下一个周期的任务
+  let cycle = 'day';
+  switch (time) {
+    case '天':
+      cycle = 'day';
+      break;
+    case '周':
+      cycle = 'week';
+      break;
+    case '月':
+      cycle = 'month';
+      break;
+    default:
+      cycle = '日程';
+      break;
+  }
+  return cycle;
+};
+
+/**
+ * 将时间按周期语义化
+ * @param {string} cycle 周期
+ * @param {number|string} time 时间
+ */
+const formatStartTimeToCycleTime = (cycle, time) => {
+  let result = '';
+  const _time = dayjs(+time);
+  switch (cycle) {
+    case '天':
+      result = _time.format('YYYY年M月D日');
+      break;
+    case '周':
+      result = _time.format('YYYY年w周');
+      break;
+    case '月':
+      result = _time.format('YYYY年M月');
+      break;
+    case '日程':
+      result = _time.format('YYYY年M月D日 HH:mm');
+      break;
+    default:
+      result = _time.format('YYYY年M月D日');
+      break;
+  }
+  return result;
+};
+
+export default {
+  formatNumber,
+  formatTime,
+  convertTime,
+  secondToMinute,
+  setTimestampToStr,
+  formatBeginTime,
+  formatDuration,
+  formatDurationToObject,
+  formatObjectTimeToMs,
+  computeCycle,
+  formatStartTimeToCycleTime,
+};