@peng_kai/kit 0.3.0-beta.12 → 0.3.0-beta.13

package/admin/components/date/helpers.ts

@@ -3,6 +3,10 @@ import { tryOnScopeDispose } from '@vueuse/core';
 import { computed, reactive, watch, ref, type Ref } from 'vue';
 import type { Simplify } from 'type-fest';
 
+/**
+ * 获取应用的时区，默认使用浏览器的时区
+ * @returns 返回一个响应式的时区字符串
+ */
 export function getTtaTimeZone() {
   const win = window as any;
   const key = '__APP_TZ__';
@@ -10,6 +14,9 @@ export function getTtaTimeZone() {
   return (win[key] || (win[key] = ref(dayjs.tz.guess()))) as Ref<string>;
 }
 
+/**
+ * 监听应用的时区变化的函数
+ */
 export const onTtaTimeZone = (() => {
   const ttaTz = getTtaTimeZone();
   const cbList: any[] = [];
@@ -34,47 +41,85 @@ export const onTtaTimeZone = (() => {
   }
 })();
 
-type OfDayType = Dayjs | undefined | null;
+type OfDayType = dayjs.Dayjs | undefined | null;
 type UnitType = dayjs.QUnitType | dayjs.OpUnitType;
-export const dayOf = {
-  rangeTs<KS extends readonly [string, string] = ['start_time', 'end_time']>(
-    unit: UnitType, 
-    day: Array<OfDayType> | undefined | null,
+export const datetime = {
+  /**
+   * 将日期范围转换为 API 参数格式的时间戳范围
+   * @param days 时间范围元组，包含开始和结束时间
+   * @param unit 时间单位，默认为 'day'
+   * @param useTz 是否使用时区，默认为 true
+   * @param keys 可选的键名元组，默认为 ['start_time', 'end_time']
+   * @returns 返回一个对象，包含开始和结束时间的时间戳
+   */
+  toTsRangeForApiParams<KS extends readonly [string, string] = ['start_time', 'end_time']>(
+    days: Array<OfDayType | undefined | null> | undefined | null,
+    unit: UnitType = 'day', 
+    useTz: boolean = true,
     keys?: KS
-  ): KS extends readonly [string, string]
-  ? Simplify<{ [K in KS[0]]: number } & { [K in KS[1]]: number }> 
-  : { start_time: number; end_time: number } {
-    if (!day || !day[0] || !day[1])
-      return undefined as any;
+  ) {
+    if (!days || !days[0] || !days[1])
+      return undefined;
 
-    const tz = getTtaTimeZone().value;
+    const tz = useTz ? getTtaTimeZone().value : dayjs.tz.guess();
     const _keys = (Array.isArray(keys) && keys?.length > 1) ? keys : ['start_time', 'end_time'];
 
+    type RetType = KS extends readonly [string, string]
+      ? Simplify<{ [K in KS[0]]: number } & { [K in KS[1]]: number }> 
+      : { start_time: number; end_time: number };
+
     return {
-      [_keys[0]]: dayjs(day[0].valueOf()).tz(tz).startOf(unit).valueOf(),
-      [_keys[1]]: dayjs(day[1].valueOf()).tz(tz).endOf(unit).valueOf(),
-    } as any;
+      [_keys[0]]: dayjs(days[0].valueOf()).tz(tz).startOf(unit).valueOf(),
+      [_keys[1]]: dayjs(days[1].valueOf()).tz(tz).endOf(unit).valueOf(),
+    } as RetType;
   },
-  start(unit: UnitType, day: OfDayType) {
+  /**
+   * 将日期范围转换为表单使用的时间范围
+   * @param days 时间范围元组，包含开始和结束时间
+   * @param unit 时间单位，默认为 'day'
+   * @returns 返回一个包含开始和结束时间的元组，格式为 [start, end]，其中 start 和 end 是 dayjs 对象
+   */
+  toRangeForForm(
+    days: Array<OfDayType | string | undefined | null>,
+    unit: UnitType = 'day', 
+  ) {
+    if (!days || !days[0] || !days[1])
+      return undefined;
+
+    const sDay = dayjs(typeof days[0] === 'string' ? Number(days[0]) : days[0].valueOf());
+    const eDay = dayjs(typeof days[1] === 'string' ? Number(days[1]) : days[1].valueOf());
+
+    if (!sDay.isValid() || !eDay.isValid())
+      return undefined;
+
+    return [sDay.startOf(unit), eDay.endOf(unit)] as [dayjs.Dayjs, dayjs.Dayjs];
+  },
+  /**
+   * 获取指定日期的开始时间
+   * @param unit 时间单位
+   * @param day 日期对象
+   * @returns 返回指定日期的开始时间，格式为 dayjs 对象
+   */
+  ofStart(unit: UnitType, day: OfDayType) {
     if (!day)
       return undefined;
 
     const tz = getTtaTimeZone().value;
     return dayjs(day.valueOf()).tz(tz).startOf(unit);
   },
-  startTs(unit: UnitType, day: OfDayType) {
-    this.start(unit, day);
-  },
-  end(unit: UnitType, day: OfDayType) {
+  /**
+   * 获取指定日期的结束时间
+   * @param unit 时间单位
+   * @param day 日期对象
+   * @returns 返回指定日期的结束时间，格式为 dayjs 对象
+   */
+  ofEnd(unit: UnitType, day: OfDayType) {
     if (!day)
       return undefined;
 
     const tz = getTtaTimeZone().value;
     return dayjs(day.valueOf()).tz(tz).endOf(unit);
   },
-  endTs(unit: UnitType, day: OfDayType) {
-    this.end(unit, day);
-  },
 }
 
 /** 为 DatePicker 组件提供响应式时区支持，当时区更新时，自动调整时间戳 */

package/admin/components/date/index.ts

@@ -1,4 +1,4 @@
 export { default as TimeFieldSelectForLabel } from './TimeFieldSelectForLabel.vue';
 export { default as TtaTimeZone } from './TtaTimeZone.vue';
 export { default as PeriodPicker } from './PeriodPicker.vue';
-export { useDatePickerPropsForTz, useRangePickerPropsForTz, getTtaTimeZone, onTtaTimeZone, dayOf } from './helpers';
+export { useDatePickerPropsForTz, useRangePickerPropsForTz, getTtaTimeZone, onTtaTimeZone, datetime } from './helpers';

package/admin/components/filter/src/more/TableSetting.vue

@@ -1,5 +1,5 @@
 <script lang="ts">
-import { Button, Switch, Divider, Select, type TableColumnsType } from 'ant-design-vue';
+import { RadioGroup,type TableColumnsType } from 'ant-design-vue';
 import { reactive, defineAsyncComponent, ref } from 'vue';
 import { useDragAndDrop } from "fluid-dnd/vue";
 import { useAntdModal } from '../../../../../antd/hooks/useAntdModal';
@@ -10,17 +10,10 @@ export const TableSettingModal = useAntdModal(
   {
     title: '表格设置',
     width: 500,
-    // footer: null,
     centered: true,
     maskClosable: false,
   }
 );
-
-const showTypeOptions = [
-  { label: '显示', value: 'show' },
-  { label: '简略', value: 'simple' },
-  { label: '隐藏', value: 'hidden' },
-];
 </script>
 
 <script lang="ts" setup>
@@ -32,6 +25,15 @@ const columnsConfig = ref(props.tableColumns.map((col: any) => ({
   dataIndex: col.dataIndex as string,
   visible: col.visible !== false,
 })));
+const columnsShowOptions = reactive(Object.fromEntries(props.tableColumns.map((col: any) => {
+  const options = [{ label: '显示', value: 'show' }, { label: '隐藏', value: 'hidden' }];
+  col.compactable === true && options.unshift({ label: '简略', value: 'compact' });
+  return [col.dataIndex, options];
+})) as Record<string, { value: string; options: string }[]>);
+const columnsShowValue = reactive(Object.fromEntries(props.tableColumns.map((col: any) => {
+  const value = col.visible === false ? 'hidden' : (col.compact === true && col.compactable === true) ? 'compact' : 'show';
+  return [col.dataIndex, value]
+})) as Record<string, string>);
 
 const [$ctn] = useDragAndDrop(columnsConfig, {
   handlerSelector: '.drag-handler',
@@ -43,21 +45,24 @@ const [$ctn] = useDragAndDrop(columnsConfig, {
 <template>
   <div>
     <div>
-      <Divider>列设置</Divider>
+      <!-- <Divider>列设置</Divider> -->
       <div ref="$ctn">
-        <div v-for="(col, i) in columnsConfig" :key="col.dataIndex" :index="i" class="flex items-center gap-2 p-2 select-none">
-          <div class="drag-handler flex items-center justify-center cursor-move p-1 -m-2">
-            <i class="i-material-symbols:drag-indicator" />
+        <div 
+          v-for="(col, i) in columnsConfig" :key="col.dataIndex" :index="i" 
+          class="flex items-center gap-2 p-2 select-none"
+        >
+          <div class="drag-handler flex items-center justify-center p-1 -m-2 mr-auto">
+            <i class="i-material-symbols:drag-indicator" />&nbsp;
+            <span >{{ col.title }}</span>
           </div>
-          <span class="mr-auto">{{ col.title }}</span>
-          <Select value="show" :options="showTypeOptions" />
-          <!-- <Switch checked-children="简略" un-checked-children="简略" />
-          <Switch checked-children="显示" un-checked-children="显示" />
-          <Button>上</Button>
-          <Button>下</Button> -->
+          <RadioGroup 
+            v-model:value="columnsShowValue[col.dataIndex]"
+            :options="columnsShowOptions[col.dataIndex]"
+            optionType="button" buttonStyle="solid" size="small"
+           />
+          <!-- <Select v-model:value="columnsShowValue[col.dataIndex]" :options="columnsShowOptions[col.dataIndex]" /> -->
         </div>
       </div>
-
     </div>
   </div>
 </template>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@peng_kai/kit",
   "type": "module",
-  "version": "0.3.0-beta.12",
+  "version": "0.3.0-beta.13",
   "description": "",
   "author": "",
   "license": "ISC",