@peng_kai/kit 0.2.35 → 0.2.36

package/admin/components/text/src/Datetime.vue

@@ -11,9 +11,11 @@ const props = withDefaults(
   defineProps<{
     timestamp?: number | string
     template?: string
+    utc?: boolean
   }>(),
   {
     template: 'MM-DD HH:mm:ss',
+    utc: false,
   },
 );
 const timestamp = computed(() => {
@@ -28,15 +30,24 @@ const timestamp = computed(() => {
 
   return Number.isNaN(tsNum) ? undefined : tsNum;
 });
+const text = computed(() => {
+  if (!timestamp.value)
+    return '-';
+
+  const ts = dayjs(timestamp.value);
+
+  return props.utc ? ts.utc().format(props.template) : ts.format(props.template);
+});
 </script>
 
 <template>
   <ATooltip destroyTooltipOnHide>
     <template v-if="timestamp" #title>
       <div>{{ dayjs(timestamp).fromNow?.() }}</div>
-      <div>{{ dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss') }}</div>
+      <div><span class="inline-block w-2em">本地</span> {{ dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss') }}</div>
+      <div><span class="inline-block w-2em">UTC</span> {{ dayjs(timestamp).utc().format('YYYY-MM-DD HH:mm:ss') }}</div>
     </template>
-    <span v-bind="$attrs" class="text">{{ timestamp ? dayjs(timestamp).format(props.template) : '-' }}</span>
+    <span v-bind="$attrs" class="text">{{ text }}</span>
   </ATooltip>
 </template>
 

package/libs/dayjs.ts

@@ -3,6 +3,8 @@ import dayjs from 'dayjs/esm';
 import relativeTime from 'dayjs/esm/plugin/relativeTime';
 import weekday from 'dayjs/esm/plugin/weekday';
 import localeData from 'dayjs/esm/plugin/localeData';
+import utc from 'dayjs/esm/plugin/utc';
+import tz from 'dayjs/esm/plugin/timezone';
 import 'dayjs/esm/locale/zh';
 import 'dayjs/esm/locale/en';
 
@@ -13,3 +15,5 @@ dayjs.locale('zh');
 dayjs.extend(relativeTime);
 dayjs.extend(weekday);
 dayjs.extend(localeData);
+dayjs.extend(utc);
+dayjs.extend(tz);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@peng_kai/kit",
   "type": "module",
-  "version": "0.2.35",
+  "version": "0.2.36",
   "description": "",
   "author": "",
   "license": "ISC",

package/utils/date.ts

@@ -20,6 +20,29 @@ export function endOfDay(day: dayjs.ConfigType) {
   return _day.isValid() ? _day.endOf('day').valueOf() : undefined;
 }
 
+/**
+ * 将时间范围转换为各自当天时间戳范围。
+ * @param range - 要转换的时间范围。
+ * @param fields - 转换后的时间戳范围的字段名称。
+ * @param unit - 要使用的时间单位。
+ * @param utc - 是否使用 UTC 时间。
+ */
+export function rangeOf<F extends string>(
+  range: [dayjs.ConfigType, dayjs.ConfigType],
+  fields: [F, F],
+  unit: dayjs.OpUnitType = 'day',
+  utc = true,
+) {
+  const start = range[0] && dayjs(range[0]);
+  const end = range[1] && dayjs(range[1]);
+  const region = utc ? 'utc' : 'local';
+
+  return {
+    [fields[0]]: (start && start.isValid()) ? start[region]().startOf(unit).valueOf() : undefined,
+    [fields[1]]: (end && end.isValid()) ? end[region]().endOf(unit).valueOf() : undefined,
+  } as Record<F, number | undefined>;
+}
+
 /**
  * 将一个值转换为 Day.js 实例。
  * @param day - 要转换的值。