feat(cascader): add panel content api (#414)

TDesignOteam · Sep 10, 2024 · 18792c7 · 18792c7
1 parent 794bd41
commit 18792c7
Show file tree

Hide file tree

Showing 13 changed files with 138 additions and 0 deletions.
diff --git a/db/TDesign.db b/db/TDesign.db
diff --git a/packages/products/tdesign-react/src/cascader/cascader.en-US.md b/packages/products/tdesign-react/src/cascader/cascader.en-US.md
@@ -30,6 +30,8 @@ minCollapsedNum | Number | 0 | \- | N
 multiple | Boolean | false | \- | N
 option | TElement | - | customize one option。Typescript：`TNode<{ item: CascaderOption; index: number }>`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 options | Array | [] | Typescript：`Array<CascaderOption>` | N
+panelBottomContent | TNode | - | bottom content of the cascader panel。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+panelTopContent | TNode | - | top content of the cascader panel。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 placeholder | String | undefined | \- | N
 popupProps | Object | - | Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-react/blob/develop/src/cascader/type.ts) | N
 popupVisible | Boolean | - | \- | N

diff --git a/packages/products/tdesign-react/src/cascader/cascader.md b/packages/products/tdesign-react/src/cascader/cascader.md
@@ -30,6 +30,8 @@ minCollapsedNum | Number | 0 | 最小折叠数量，用于多选情况下折叠
 multiple | Boolean | false | 是否允许多选 | N
 option | TElement | - | 自定义单个级联选项。TS 类型：`TNode<{ item: CascaderOption; index: number }>`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 options | Array | [] | 可选项数据源。TS 类型：`Array<CascaderOption>` | N
+panelBottomContent | TNode | - | 面板内的底部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
+panelTopContent | TNode | - | 面板内的顶部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/common.ts) | N
 placeholder | String | undefined | 占位符 | N
 popupProps | Object | - | 参考 popup 组件 API。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-react/blob/develop/src/cascader/type.ts) | N
 popupVisible | Boolean | - | 是否显示下拉框 | N

diff --git a/packages/products/tdesign-react/src/cascader/type.ts b/packages/products/tdesign-react/src/cascader/type.ts
@@ -119,6 +119,14 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
    * @default []
    */
   options?: Array<CascaderOption>;
+  /**
+   * 面板内的底部内容
+   */
+  panelBottomContent?: TNode;
+  /**
+   * 面板内的顶部内容
+   */
+  panelTopContent?: TNode;
   /**
    * 占位符
    */

diff --git a/packages/products/tdesign-vue-next/src/cascader/cascader.en-US.md b/packages/products/tdesign-vue-next/src/cascader/cascader.en-US.md
@@ -28,6 +28,8 @@ minCollapsedNum | Number | 0 | \- | N
 multiple | Boolean | false | \- | N
 option | Slot / Function | - | customize one option。Typescript：`TNode<{ item: CascaderOption; index: number }>`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 options | Array | [] | Typescript：`Array<CascaderOption>` | N
+panelBottomContent | String / Slot / Function | - | bottom content of the cascader panel。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
+panelTopContent | String / Slot / Function | - | top content of the cascader panel。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 placeholder | String | undefined | \- | N
 popupProps | Object | - | Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
 popupVisible | Boolean | - | \- | N

diff --git a/packages/products/tdesign-vue-next/src/cascader/cascader.md b/packages/products/tdesign-vue-next/src/cascader/cascader.md
@@ -28,6 +28,8 @@ minCollapsedNum | Number | 0 | 最小折叠数量，用于多选情况下折叠
 multiple | Boolean | false | 是否允许多选 | N
 option | Slot / Function | - | 自定义单个级联选项。TS 类型：`TNode<{ item: CascaderOption; index: number }>`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 options | Array | [] | 可选项数据源。TS 类型：`Array<CascaderOption>` | N
+panelBottomContent | String / Slot / Function | - | 面板内的底部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
+panelTopContent | String / Slot / Function | - | 面板内的顶部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/src/common.ts) | N
 placeholder | String | undefined | 占位符 | N
 popupProps | Object | - | 参考 popup 组件 API。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue-next/tree/develop/src/cascader/type.ts) | N
 popupVisible | Boolean | - | 是否显示下拉框 | N

diff --git a/packages/products/tdesign-vue-next/src/cascader/props.ts b/packages/products/tdesign-vue-next/src/cascader/props.ts
@@ -87,6 +87,14 @@ export default {
     type: Array as PropType<TdCascaderProps['options']>,
     default: (): TdCascaderProps['options'] => [],
   },
+  /** 面板内的底部内容 */
+  panelBottomContent: {
+    type: [String, Function] as PropType<TdCascaderProps['panelBottomContent']>,
+  },
+  /** 面板内的顶部内容 */
+  panelTopContent: {
+    type: [String, Function] as PropType<TdCascaderProps['panelTopContent']>,
+  },
   /** 占位符 */
   placeholder: {
     type: String,

diff --git a/packages/products/tdesign-vue-next/src/cascader/type.ts b/packages/products/tdesign-vue-next/src/cascader/type.ts
@@ -118,6 +118,14 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
    * @default []
    */
   options?: Array<CascaderOption>;
+  /**
+   * 面板内的底部内容
+   */
+  panelBottomContent?: string | TNode;
+  /**
+   * 面板内的顶部内容
+   */
+  panelTopContent?: string | TNode;
   /**
    * 占位符
    */

diff --git a/packages/products/tdesign-vue/src/cascader/cascader.en-US.md b/packages/products/tdesign-vue/src/cascader/cascader.en-US.md
@@ -28,6 +28,8 @@ minCollapsedNum | Number | 0 | \- | N
 multiple | Boolean | false | \- | N
 option | Slot / Function | - | customize one option。Typescript：`TNode<{ item: CascaderOption; index: number }>`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 options | Array | [] | Typescript：`Array<CascaderOption>` | N
+panelBottomContent | String / Slot / Function | - | bottom content of the cascader panel。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
+panelTopContent | String / Slot / Function | - | top content of the cascader panel。Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 placeholder | String | undefined | \- | N
 popupProps | Object | - | Typescript：`PopupProps`，[Popup API Documents](./popup?tab=api)。[see more ts definition](https://github.com/Tencent/tdesign-vue/tree/develop/src/cascader/type.ts) | N
 popupVisible | Boolean | - | \- | N

diff --git a/packages/products/tdesign-vue/src/cascader/cascader.md b/packages/products/tdesign-vue/src/cascader/cascader.md
@@ -28,6 +28,8 @@ minCollapsedNum | Number | 0 | 最小折叠数量，用于多选情况下折叠
 multiple | Boolean | false | 是否允许多选 | N
 option | Slot / Function | - | 自定义单个级联选项。TS 类型：`TNode<{ item: CascaderOption; index: number }>`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 options | Array | [] | 可选项数据源。TS 类型：`Array<CascaderOption>` | N
+panelBottomContent | String / Slot / Function | - | 面板内的底部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
+panelTopContent | String / Slot / Function | - | 面板内的顶部内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue/blob/develop/src/common.ts) | N
 placeholder | String | undefined | 占位符 | N
 popupProps | Object | - | 参考 popup 组件 API。TS 类型：`PopupProps`，[Popup API Documents](./popup?tab=api)。[详细类型定义](https://github.com/Tencent/tdesign-vue/tree/develop/src/cascader/type.ts) | N
 popupVisible | Boolean | - | 是否显示下拉框 | N

diff --git a/packages/products/tdesign-vue/src/cascader/props.ts b/packages/products/tdesign-vue/src/cascader/props.ts
@@ -87,6 +87,14 @@ export default {
     type: Array as PropType<TdCascaderProps['options']>,
     default: (): TdCascaderProps['options'] => [],
   },
+  /** 面板内的底部内容 */
+  panelBottomContent: {
+    type: [String, Function] as PropType<TdCascaderProps['panelBottomContent']>,
+  },
+  /** 面板内的顶部内容 */
+  panelTopContent: {
+    type: [String, Function] as PropType<TdCascaderProps['panelTopContent']>,
+  },
   /** 占位符 */
   placeholder: {
     type: String,

diff --git a/packages/products/tdesign-vue/src/cascader/type.ts b/packages/products/tdesign-vue/src/cascader/type.ts
@@ -118,6 +118,14 @@ export interface TdCascaderProps<CascaderOption extends TreeOptionData = TreeOpt
    * @default []
    */
   options?: Array<CascaderOption>;
+  /**
+   * 面板内的底部内容
+   */
+  panelBottomContent?: string | TNode;
+  /**
+   * 面板内的顶部内容
+   */
+  panelTopContent?: string | TNode;
   /**
    * 占位符
    */

diff --git a/packages/scripts/api.json b/packages/scripts/api.json
@@ -20748,6 +20748,92 @@
         "Array"
       ]
     },
+    {
+      "id": 1725941069,
+      "platform_framework": [
+        "1",
+        "2",
+        "4"
+      ],
+      "component": "Cascader",
+      "field_category": 1,
+      "field_name": "panelBottomContent",
+      "field_type": [
+        "1",
+        "64"
+      ],
+      "field_default_value": "",
+      "field_enum": "",
+      "field_desc_zh": "面板内的底部内容",
+      "field_desc_en": "bottom content of the cascader panel",
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-09-10 04:04:29",
+      "update_time": "2024-09-10 04:04:29",
+      "event_output": null,
+      "custom_field_type": null,
+      "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": [
+        "Vue(PC)",
+        "React(PC)",
+        "Angular(PC)"
+      ],
+      "field_type_text": [
+        "String",
+        "TNode"
+      ]
+    },
+    {
+      "id": 1725941091,
+      "platform_framework": [
+        "1",
+        "2",
+        "4"
+      ],
+      "component": "Cascader",
+      "field_category": 1,
+      "field_name": "panelTopContent",
+      "field_type": [
+        "1",
+        "64"
+      ],
+      "field_default_value": "",
+      "field_enum": "",
+      "field_desc_zh": "面板内的顶部内容",
+      "field_desc_en": "top content of the cascader panel",
+      "field_required": 0,
+      "event_input": "",
+      "create_time": "2024-09-10 04:04:51",
+      "update_time": "2024-09-10 04:04:51",
+      "event_output": null,
+      "custom_field_type": null,
+      "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": [
+        "Vue(PC)",
+        "React(PC)",
+        "Angular(PC)"
+      ],
+      "field_type_text": [
+        "String",
+        "TNode"
+      ]
+    },
     {
       "id": 386,
       "platform_framework": [