feat: 时间段选择器拓展

apps/web-antd/src/utils/TimeUtils.ts

@@ -0,0 +1,46 @@
+import dayjs from 'dayjs';
+
+/** 时间段选择器拓展  */
+export const rangePickerExtend = () => {
+  return {
+    showTime: {
+      format: 'HH:mm:ss',
+      defaultValue: [
+        dayjs('00:00:00', 'HH:mm:ss'),
+        dayjs('23:59:59', 'HH:mm:ss'),
+      ],
+    },
+    // 如果需要10位时间戳（秒级）可以使用 valueFormat: 'X'
+    valueFormat: 'YYYY-MM-DD HH:mm:ss',
+    format: 'YYYY-MM-DD HH:mm:ss', // 显示格式
+    placeholder: ['开始时间', '结束时间'],
+    ranges: {
+      今天: [dayjs().startOf('day'), dayjs().endOf('day')],
+
+      昨天: [
+        dayjs().subtract(1, 'day').startOf('day'),
+        dayjs().subtract(1, 'day').endOf('day'),
+      ],
+
+      本周: [dayjs().startOf('week'), dayjs().endOf('day')],
+
+      本月: [dayjs().startOf('month'), dayjs().endOf('day')],
+
+      最近7天: [
+        dayjs().subtract(7, 'day').startOf('day'),
+        dayjs().endOf('day'),
+      ],
+
+      最近30天: [
+        dayjs().subtract(30, 'day').startOf('day'),
+        dayjs().endOf('day'),
+      ],
+    },
+    transformDateFunc: (dates: any) => {
+      if (dates && dates.length === 2) {
+        return [dates.createTime[0], dates.createTime[1]].join(','); // 格式化为后台支持的时间格式
+      }
+      return {};
+    },
+  };
+};

apps/web-antd/src/views/system/notify/template/data.ts

@@ -5,6 +5,7 @@ import type { SystemNotifyTemplateApi } from '#/api/system/notify/template';
 import { z } from '#/adapter/form';
 import { CommonStatusEnum } from '#/utils/constants';
 import { DICT_TYPE, getDictOptions } from '#/utils/dict';
+import { rangePickerExtend } from '#/utils/TimeUtils';
 
 /** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
@@ -139,6 +140,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       component: 'RangePicker',
       componentProps: {
         allowClear: true,
+        ...rangePickerExtend(),
       },
     },
   ];

apps/web-antd/src/views/system/role/data.ts

@@ -3,8 +3,9 @@ import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { SystemRoleApi } from '#/api/system/role';
 
 import { z } from '#/adapter/form';
-import { DICT_TYPE, getDictOptions } from '#/utils/dict';
 import { CommonStatusEnum, SystemDataScopeEnum } from '#/utils/constants';
+import { DICT_TYPE, getDictOptions } from '#/utils/dict';
+import { rangePickerExtend } from '#/utils/TimeUtils';
 
 /** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
@@ -173,6 +174,10 @@ export function useGridFormSchema(): VbenFormSchema[] {
       fieldName: 'createTime',
       label: '创建时间',
       component: 'RangePicker',
+      componentProps: {
+        allowClear: true,
+        ...rangePickerExtend(),
+      },
     },
   ];
 }
@@ -254,7 +259,7 @@ export function useGridColumns<T = SystemRoleApi.SystemRole>(
           {
             code: 'assign-menu',
             text: '菜单权限',
-          }
+          },
         ],
       },
     },

apps/web-antd/src/views/system/sms/channel/data.ts

@@ -5,6 +5,7 @@ import type { SystemSmsChannelApi } from '#/api/system/sms/channel';
 import { z } from '#/adapter/form';
 import { CommonStatusEnum } from '#/utils/constants';
 import { DICT_TYPE, getDictOptions } from '#/utils/dict';
+import { rangePickerExtend } from '#/utils/TimeUtils';
 
 /** 新增/修改的表单 */
 export function useFormSchema(): VbenFormSchema[] {
@@ -54,7 +55,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Textarea',
       componentProps: {
         placeholder: '请输入备注',
-      }
+      },
     },
     {
       fieldName: 'apiKey',
@@ -71,7 +72,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Input',
       componentProps: {
         placeholder: '请输入短信 API 的密钥',
-      }
+      },
     },
     {
       fieldName: 'callbackUrl',
@@ -79,7 +80,7 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'Input',
       componentProps: {
         placeholder: '请输入短信发送回调 URL',
-      }
+      },
     },
   ];
 }
@@ -94,7 +95,7 @@ export function useGridFormSchema(): VbenFormSchema[] {
       componentProps: {
         allowClear: true,
         placeholder: '请输入短信签名',
-      }
+      },
     },
     {
       fieldName: 'code',
@@ -116,12 +117,12 @@ export function useGridFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      // TODO @芋艿：怎么解决范围检索
       fieldName: 'createTime',
       label: '创建时间',
       component: 'RangePicker',
       componentProps: {
         allowClear: true,
+        ...rangePickerExtend(),
       },
     },
   ];

apps/web-antd/src/views/system/sms/log/data.ts

@@ -4,6 +4,7 @@ import type { SystemSmsLogApi } from '#/api/system/sms/log';
 
 import { getSimpleSmsChannelList } from '#/api/system/sms/channel';
 import { DICT_TYPE, getDictOptions } from '#/utils/dict';
+import { rangePickerExtend } from '#/utils/TimeUtils';
 
 /** 列表的搜索表单 */
 export function useGridFormSchema(): VbenFormSchema[] {
@@ -49,12 +50,12 @@ export function useGridFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      // TODO @芋艿：怎么解决范围检索
       fieldName: 'sendTime',
       label: '发送时间',
       component: 'RangePicker',
       componentProps: {
         allowClear: true,
+        ...rangePickerExtend(),
       },
     },
     {
@@ -68,12 +69,12 @@ export function useGridFormSchema(): VbenFormSchema[] {
       },
     },
     {
-      // TODO @芋艿：怎么解决范围检索
       fieldName: 'receiveTime',
       label: '接收时间',
       component: 'RangePicker',
       componentProps: {
         allowClear: true,
+        ...rangePickerExtend(),
       },
     },
   ];

pnpm-lock.yaml

@@ -78,6 +78,9 @@ catalogs:
     '@types/archiver':
       specifier: ^6.0.3
       version: 6.0.3
+    '@types/crypto-js':
+      specifier: ^4.2.2
+      version: 4.2.2
     '@types/eslint':
       specifier: ^9.6.1
       version: 9.6.1
@@ -189,6 +192,9 @@ catalogs:
     cross-env:
       specifier: ^7.0.3
       version: 7.0.3
+    crypto-js:
+      specifier: ^4.2.0
+      version: 4.2.0
     cspell:
       specifier: ^8.18.1
       version: 8.18.1
@@ -1548,6 +1554,9 @@ importers:
       '@vueuse/integrations':
         specifier: 'catalog:'
         version: 12.8.2(async-validator@4.2.5)(axios@1.8.4)(change-case@5.4.4)(focus-trap@7.6.4)(nprogress@0.2.0)(qrcode@1.5.4)(sortablejs@1.15.6)(typescript@5.8.2)
+      crypto-js:
+        specifier: 'catalog:'
+        version: 4.2.0
       qrcode:
         specifier: 'catalog:'
         version: 1.5.4
@@ -1567,6 +1576,9 @@ importers:
         specifier: 'catalog:'
         version: 6.7.0(vue@3.5.13(typescript@5.8.2))
     devDependencies:
+      '@types/crypto-js':
+        specifier: 'catalog:'
+        version: 4.2.2
       '@types/qrcode':
         specifier: 'catalog:'
         version: 1.5.5
@@ -4379,6 +4391,9 @@ packages:
   '@types/conventional-commits-parser@5.0.1':
     resolution: {integrity: sha512-7uz5EHdzz2TqoMfV7ee61Egf5y6NkcO4FB/1iCCQnbeiI1F3xzv3vK5dBCXUCLQgGYS+mUeigK1iKQzvED+QnQ==}
 
+  '@types/crypto-js@4.2.2':
+    resolution: {integrity: sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==}
+
   '@types/doctrine@0.0.9':
     resolution: {integrity: sha512-eOIHzCUSH7SMfonMG1LsC2f8vxBFtho6NGBznK41R84YzPuvSBzrhEps33IsQiOW9+VL6NQ9DbjQJznk/S4uRA==}
 
@@ -5630,6 +5645,9 @@ packages:
   crossws@0.3.4:
     resolution: {integrity: sha512-uj0O1ETYX1Bh6uSgktfPvwDiPYGQ3aI4qVsaC/LWpkIzGj1nUYm5FK3K+t11oOlpN01lGbprFCH4wBlKdJjVgw==}
 
+  crypto-js@4.2.0:
+    resolution: {integrity: sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==}
+
   crypto-random-string@2.0.0:
     resolution: {integrity: sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA==}
     engines: {node: '>=8'}
@@ -13409,6 +13427,8 @@ snapshots:
     dependencies:
       '@types/node': 22.13.10
 
+  '@types/crypto-js@4.2.2': {}
+
   '@types/doctrine@0.0.9': {}
 
   '@types/eslint@9.6.1':
@@ -14846,6 +14866,8 @@ snapshots:
     dependencies:
       uncrypto: 0.1.3
 
+  crypto-js@4.2.0: {}
+
   crypto-random-string@2.0.0: {}
 
   cspell-config-lib@8.18.1: