From 15017b2fffd18cd4094bac8e74c234310f06e3d9 Mon Sep 17 00:00:00 2001 From: anlyyao Date: Fri, 28 Feb 2025 16:49:05 +0800 Subject: [PATCH] feat(DateTimePicker): add formatter props --- db/TDesign.db | Bin 1011712 -> 1015808 bytes .../src/date-time-picker/README.en-US.md | 1 + .../src/date-time-picker/README.md | 1 + .../src/date-time-picker/props.ts | 4 ++ .../src/date-time-picker/type.ts | 7 ++++ .../src/picker-item/type.ts | 2 +- .../src/picker/README.en-US.md | 2 +- .../tdesign-miniprogram/src/picker/README.md | 2 +- packages/scripts/api.json | 39 +++++++++++++++++- 9 files changed, 54 insertions(+), 4 deletions(-) diff --git a/db/TDesign.db b/db/TDesign.db index 234a50e2408a1e858c78dc39e1087db41c215587..e95d9931960ea78e40437b3d89e80b93f4621343 100644 GIT binary patch delta 473 zcmZp8VB64OH$j?p3j+hgkBJKQK!#pf*T$3u`W!F0CNP3TH}e==U}WN&Fg+oIfAMD3 zyxWYMV@yog*no21=SDV9vudAa#R$YqK+FupEI`Z(#B4y!4#XVWr&)1kPnG0iWe{LE z&cJt_v5@x>uPe_v?pNHLT>T8kr%PSnTr1Y7HYGrciBXYLl988Jn}LJZ*qEVFc)HXr z&MYk*h2;F4(%d}Hyp+@mD}}t$+@#bZO$A#!g@DZD?9?L9lGI%Pf|AVqyzPY-Ij3;2 z0NvKr&UuRyh`E568;E(fbKc_p(F&Ae4B5__z_*f#iJM{jh9tfK4lYh+7N+!r#S8du zwR2_jZRg77|Hi__3p9k0-+1F6VZK1omUB^^Nv(qoi0EH96&xoN3I!$-&FP z%fJCL#K9%8BsC;6Hx=TxwEUvn#FCQKB86uQ_B`Fw|Fmb?vjy$X*X}biFf!FOFw!-$ pP%yBtGP1BTG{YjKkq`Ell>)@n=_{x4@yUYxi!)57znjJ<2>@M`lqvuK delta 208 zcmZo@uxof=J3*Rt69WUo_lXMjK!#pf$HtTe`W!E~rZIv9k; z&Co#C$XKCynpOKWD@Gt@0%B$$W&vVWAZ7z%b|B{1KFx|Vd#WVR3<1VM2EOZzg}je= zU3t!NzvAZP>gQseE_H!(?PQ0BRoe?Ma!%o3X=Ixc(9U^_6NtHhm>YKy$g$xZfV;m2T(C=G)Gd&Hs%B00n$Pu>b%7 diff --git a/packages/products/tdesign-miniprogram/src/date-time-picker/README.en-US.md b/packages/products/tdesign-miniprogram/src/date-time-picker/README.en-US.md index 94018d8be..0f9444624 100644 --- a/packages/products/tdesign-miniprogram/src/date-time-picker/README.en-US.md +++ b/packages/products/tdesign-miniprogram/src/date-time-picker/README.en-US.md @@ -16,6 +16,7 @@ end | String / Number | - | \- | N filter | Function | - | Typescript：`(type: TimeModeValues, columns: DateTimePickerColumn) => DateTimePickerColumn` `type DateTimePickerColumn = DateTimePickerColumnItem[]` `interface DateTimePickerColumnItem { label: string,value: string}`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/date-time-picker/type.ts) | N footer | Slot | - | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N format | String | 'YYYY-MM-DD HH:mm:ss' | \- | N +formatter | Function | - | Typescript：`(option: DateTimePickerColumnItem, columnIndex: number) => DateTimePickerColumnItem` | N header | Boolean / Slot | true | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N mode | String / Array | 'date' | Typescript：`DateTimePickerMode` `type DateTimePickerMode = TimeModeValues \| Array ` `type TimeModeValues = 'year' \| 'month' \| 'date' \| 'hour' \| 'minute' \| 'second'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/date-time-picker/type.ts) | N popup-props | Object | {} | popup properties。Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/date-time-picker/type.ts) | N diff --git a/packages/products/tdesign-miniprogram/src/date-time-picker/README.md b/packages/products/tdesign-miniprogram/src/date-time-picker/README.md index c41418a94..c576ef8bc 100644 --- a/packages/products/tdesign-miniprogram/src/date-time-picker/README.md +++ b/packages/products/tdesign-miniprogram/src/date-time-picker/README.md @@ -16,6 +16,7 @@ end | String / Number | - | 选择器的最大可选时间，默认为当前时 filter | Function | - | 列选项过滤函数，支持自定义列内容。(type 值可为: year, month, date, hour, minute, second)。TS 类型：`(type: TimeModeValues, columns: DateTimePickerColumn) => DateTimePickerColumn` `type DateTimePickerColumn = DateTimePickerColumnItem[]` `interface DateTimePickerColumnItem { label: string,value: string}`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/date-time-picker/type.ts) | N footer | Slot | - | 底部内容。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N format | String | 'YYYY-MM-DD HH:mm:ss' | 用于格式化 pick、change、confirm 事件返回的值，[详细文档](https://day.js.org/docs/en/display/format) | N +formatter | Function | - | 格式化标签。TS 类型：`(option: DateTimePickerColumnItem, columnIndex: number) => DateTimePickerColumnItem` | N header | Boolean / Slot | true | 头部内容。值为 true 显示空白头部，值为 false 不显示任何内容。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N mode | String / Array | 'date' | year = 年；month = 年月；date = 年月日；hour = 年月日时； minute = 年月日时分；当类型为数组时，第一个值控制年月日，第二个值控制时分秒。TS 类型：`DateTimePickerMode` `type DateTimePickerMode = TimeModeValues \| Array ` `type TimeModeValues = 'year' \| 'month' \| 'date' \| 'hour' \| 'minute' \| 'second'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/date-time-picker/type.ts) | N popup-props | Object | {} | 透传 Popup 组件全部属性。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/date-time-picker/type.ts) | N diff --git a/packages/products/tdesign-miniprogram/src/date-time-picker/props.ts b/packages/products/tdesign-miniprogram/src/date-time-picker/props.ts index 580ec5c91..0726612b5 100644 --- a/packages/products/tdesign-miniprogram/src/date-time-picker/props.ts +++ b/packages/products/tdesign-miniprogram/src/date-time-picker/props.ts @@ -39,6 +39,10 @@ const props: TdDateTimePickerProps = { type: String, value: 'YYYY-MM-DD HH:mm:ss', }, + /** 格式化标签 */ + formatter: { + type: null, + }, /** 头部内容。值为 true 显示空白头部，值为 false 不显示任何内容 */ header: { type: Boolean, diff --git a/packages/products/tdesign-miniprogram/src/date-time-picker/type.ts b/packages/products/tdesign-miniprogram/src/date-time-picker/type.ts index 77e63f082..8ddf5b70f 100644 --- a/packages/products/tdesign-miniprogram/src/date-time-picker/type.ts +++ b/packages/products/tdesign-miniprogram/src/date-time-picker/type.ts @@ -61,6 +61,13 @@ export interface TdDateTimePickerProps { type: StringConstructor; value?: string; }; + /** + * 格式化标签 + */ + formatter?: { + type: undefined; + value?: (option: DateTimePickerColumnItem, columnIndex: number) => DateTimePickerColumnItem; + }; /** * 头部内容。值为 true 显示空白头部，值为 false 不显示任何内容 * @default true diff --git a/packages/products/tdesign-miniprogram/src/picker-item/type.ts b/packages/products/tdesign-miniprogram/src/picker-item/type.ts index 8590f6744..8d80482c0 100644 --- a/packages/products/tdesign-miniprogram/src/picker-item/type.ts +++ b/packages/products/tdesign-miniprogram/src/picker-item/type.ts @@ -10,7 +10,7 @@ export interface TdPickerItemProps { */ format?: { type: undefined; - value?: (option: PickerItemOption) => string; + value?: (option: PickerItemOption, columnIndex: number) => PickerItemOption; }; /** * 数据源 diff --git a/packages/products/tdesign-miniprogram/src/picker/README.en-US.md b/packages/products/tdesign-miniprogram/src/picker/README.en-US.md index 0dcc4b8fc..9b0b4490b 100644 --- a/packages/products/tdesign-miniprogram/src/picker/README.en-US.md +++ b/packages/products/tdesign-miniprogram/src/picker/README.en-US.md @@ -40,5 +40,5 @@ name | type | default | description | required -- | -- | -- | -- | -- style | Object | - | CSS(Cascading Style Sheets) | N custom-style | Object | - | CSS(Cascading Style Sheets)，used to set style on virtual component | N -format | Function | - | Typescript：`(option: PickerItemOption) => string` | N +format | Function | - | Typescript：`(option: PickerItemOption, columnIndex: number) => PickerItemOption` | N options | Array | [] | Typescript：`PickerItemOption[]` `interface PickerItemOption { label: string; value: string \| number }`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker-item/type.ts) | N diff --git a/packages/products/tdesign-miniprogram/src/picker/README.md b/packages/products/tdesign-miniprogram/src/picker/README.md index dd2e1a427..8b75c4d31 100644 --- a/packages/products/tdesign-miniprogram/src/picker/README.md +++ b/packages/products/tdesign-miniprogram/src/picker/README.md @@ -40,5 +40,5 @@ pick | `(value: Array, label: string, column: number, index: number -- | -- | -- | -- | -- style | Object | - | 样式 | N custom-style | Object | - | 样式，一般用于开启虚拟化组件节点场景 | N -format | Function | - | 格式化标签。TS 类型：`(option: PickerItemOption) => string` | N +format | Function | - | 格式化标签。TS 类型：`(option: PickerItemOption, columnIndex: number) => PickerItemOption` | N options | Array | [] | 数据源。TS 类型：`PickerItemOption[]` `interface PickerItemOption { label: string; value: string \| number }`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/picker-item/type.ts) | N diff --git a/packages/scripts/api.json b/packages/scripts/api.json index a0546acf7..2598c753d 100644 --- a/packages/scripts/api.json +++ b/packages/scripts/api.json @@ -36291,6 +36291,43 @@ "String" ] }, + { + "id": 1740731296, + "platform_framework": [ + "64" + ], + "component": "DateTimePicker", + "field_category": 1, + "field_name": "formatter", + "field_type": [ + "32" + ], + "field_default_value": "", + "field_enum": "", + "field_desc_zh": "格式化标签", + "field_desc_en": null, + "field_required": 0, + "event_input": "", + "create_time": "2025-02-28 08:28:16", + "update_time": "2025-02-28 08:28:16", + "event_output": null, + "custom_field_type": "(option: DateTimePickerColumnItem, columnIndex: number) => DateTimePickerColumnItem", + "syntactic_sugar": null, + "readonly": 1, + "html_attribute": 0, + "trigger_elements": "", + "deprecated": 0, + "version": "", + "test_description": null, + "support_default_value": 0, + "field_category_text": "Props", + "platform_framework_text": [ + "Miniprogram" + ], + "field_type_text": [ + "Function" + ] + }, { "id": 2509, "platform_framework": [ @@ -81576,7 +81613,7 @@ "create_time": "2023-01-09 06:35:32", "update_time": "2023-01-09 06:35:32", "event_output": null, - "custom_field_type": "(option: PickerItemOption) => string", + "custom_field_type": "(option: PickerItemOption, columnIndex: number) => PickerItemOption", "syntactic_sugar": null, "readonly": 1, "html_attribute": 0,