2120 feature support icon in corner

common/changes/@visactor/vtable/2120-feature-support-icon-in-corner_2024-07-24-03-54.json

@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "feat: pivot table corner cell support icon #2120\n\n",
+      "type": "none",
+      "packageName": "@visactor/vtable"
+    }
+  ],
+  "packageName": "@visactor/vtable",
+  "email": "[email protected]"
+}

docs/assets/option/en/dimension/base-dimension-type.md

@@ -2,18 +2,19 @@
 
 ${prefix} dimensionKey(string)
 
-**Required**  Unique identifier of the dimension, corresponding to the field name of the dataset
+**Required** Unique identifier of the dimension, corresponding to the field name of the dataset
 
 ${prefix} title(string)
 
-**Required**  Dimension name, the angle header can be configured to display the dimension name
+**Required** Dimension name, the angle header can be configured to display the dimension name
 
 ${prefix} headerFormat(FieldFormat)
 
 Format of the dimension value
+
 ```
 type FieldFormat = (title: number|string, col:number, row:number, table:PivotTable) => any;
-  ```
+```
 
 ${prefix} width(number|string)
 
@@ -33,9 +34,11 @@ This property takes effect when the dimension serves as a row header and represe
 ${prefix} headerStyle(IStyleOption|Function)
 
 Header cell style, type declaration:
+
 ```
 headerStyle?: IStyleOption | ((styleArg: StylePropertyFunctionArg) => ITextStyleOption);
 ```
+
 {{ use: common-StylePropertyFunctionArg() }}
 
 IStyleOption type structure is as follows:
@@ -57,7 +60,7 @@ Header cell icon configuration
     | ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);
 ```
 
-ColumnIconOption specific configuration: TODO
+ColumnIconOption specific configuration: https://visactor.io/vtable/option/ListTable-columns-text#icon
 
 ${prefix} description(string|Function)
 Description information for header hover, displayed as a tooltip
@@ -81,6 +84,7 @@ Custom layout element definition for header cells, this customization is suitabl
 ```
 (args: CustomRenderFunctionArg) => ICustomLayoutObj;
 ```
+
 {{ use: common-CustomRenderFunctionArg() }}
 
 {{ use: custom-layout(
@@ -93,6 +97,20 @@ Dropdown menu item configuration. Dropdown menu items can be top-level menu item
 ${prefix} cornerDropDownMenu(Array)
 Angle header cell display drop-down button and drop-down menu item configuration. Dropdown menu items can be top-level menu items or second-level menu items, and only one configuration is required. The specific type is MenuListItem[].
 
+${prefix} cornerHeaderIcon(string|Object|Array|Function)
+
+Pivot table corner cell icon configuration
+
+```
+cornerHeaderIcon?:
+| string
+| ColumnIconOption
+| (string | ColumnIconOption)[]
+| ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);
+```
+
+For the specific configuration of ColumnIconOption, please refer to: https://visactor.io/vtable/option/ListTable-columns-text#icon
+
 ${prefix} dragHeader(boolean)
 Whether the header can be dragged
 
@@ -103,4 +121,4 @@ ${prefix} drillUp(boolean)
 Display drill-up icon, clicking it will trigger a corresponding event
 
 ${prefix} showSort(boolean)
-Whether to display the sort icon, no data sorting logic
+Whether to display the sort icon, no data sorting logic

docs/assets/option/zh/dimension/base-dimension-type.md

@@ -1,17 +1,17 @@
-
 {{ target: base-dimension-type }}
 
 ${prefix} dimensionKey(string)
 
-**必填**  维度的唯一标识，对应数据集的字段名称
+**必填** 维度的唯一标识，对应数据集的字段名称
 
 ${prefix} title(string)
 
-**必填**  维度名称，角头可配置显示维度名称
+**必填** 维度名称，角头可配置显示维度名称
 
 ${prefix} headerFormat(FieldFormat)
 
-维度值的format
+维度值的 format
+
 ```
 type FieldFormat = (title: string, col:number, row:number,table: PivotTable) => any;
 ```
@@ -25,7 +25,7 @@ ${prefix} width(number|string)
 
 ${prefix} maxWidth(number|string)
 
-维度作为行表头时起作用，表示该维度单元格的最大宽度 
+维度作为行表头时起作用，表示该维度单元格的最大宽度
 
 ${prefix} minWidth(number|string)
 
@@ -34,12 +34,14 @@ ${prefix} minWidth(number|string)
 ${prefix} headerStyle(IStyleOption|Function)
 
 表头单元格样式，类型声明：
+
 ```
 headerStyle?: IStyleOption | ((styleArg: StylePropertyFunctionArg) => ITextStyleOption);
 ```
+
 {{ use: common-StylePropertyFunctionArg() }}
 
-IStyleOption类型结构如下：
+IStyleOption 类型结构如下：
 
 {{ use: common-style(
   prefix = ${prefix},
@@ -58,18 +60,18 @@ ${prefix} headerIcon(string|Object|Array|Function)
     | ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);
 ```
 
-ColumnIconOption的具体配置：TODO
+ColumnIconOption 的具体配置可以参考：https://visactor.io/vtable/option/ListTable-columns-text#icon
 
 ${prefix} description(string|Function)
-表头hover时的描述信息 会以tooltip形式展示出来
+表头 hover 时的描述信息 会以 tooltip 形式展示出来
 
 ```
  description?: string | ((args: CellInfo) => string);
 ```
 
 ${prefix} cornerDescription(string)
 
-描述信息 hover时提示信息
+描述信息 hover 时提示信息
 
 ${prefix} headerCustomRender(Function|Object)
 
@@ -82,17 +84,32 @@ ${prefix} headerCustomLayout(Function)
 ```
 (args: CustomRenderFunctionArg) => ICustomLayoutObj;
 ```
+
 {{ use: common-CustomRenderFunctionArg() }}
 
 {{ use: custom-layout(
     prefix =  '#'+${prefix},
 ) }}
 
 ${prefix} dropDownMenu(Array)
-下拉菜单项配置。下拉菜单项可以是一级菜单项或者二级菜单项，只要有一个配置即可。具体类型为MenuListItem[]。
+下拉菜单项配置。下拉菜单项可以是一级菜单项或者二级菜单项，只要有一个配置即可。具体类型为 MenuListItem[]。
 
 ${prefix} cornerDropDownMenu(Array)
-角头单元格显示下拉按钮及下拉菜单项配置。下拉菜单项可以是一级菜单项或者二级菜单项，只要有一个配置即可。具体类型为MenuListItem[]。
+角头单元格显示下拉按钮及下拉菜单项配置。下拉菜单项可以是一级菜单项或者二级菜单项，只要有一个配置即可。具体类型为 MenuListItem[]。
+
+${prefix} cornerHeaderIcon(string|Object|Array|Function)
+
+透视表角头单元格图标配置
+
+```
+  cornerHeaderIcon?:
+    | string
+    | ColumnIconOption
+    | (string | ColumnIconOption)[]
+    | ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);
+```
+
+ColumnIconOption 的具体配置可以参考：https://visactor.io/vtable/option/ListTable-columns-text#icon
 
 ${prefix} dragHeader(boolean)
 是否可以拖拽表头
@@ -104,4 +121,4 @@ ${prefix} drillUp(boolean)
 显示向上钻取图标 点击后会有对应事件
 
 ${prefix} showSort(boolean)
-是否显示排序icon，无数据排序逻辑
+是否显示排序 icon，无数据排序逻辑

packages/vtable/src/layout/pivot-header-layout.ts

@@ -698,6 +698,7 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
                 disableHeaderSelect: !!this.cornerSetting.disableHeaderSelect
               },
               dropDownMenu: dimensionInfo?.cornerDropDownMenu,
+              headerIcon: dimensionInfo?.cornerHeaderIcon,
               pivotInfo: {
                 value: dimensionInfo?.title ?? '',
                 dimensionKey,
@@ -749,6 +750,7 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
                 disableHeaderSelect: !!this.cornerSetting.disableHeaderSelect
               },
               dropDownMenu: dimensionInfo?.cornerDropDownMenu,
+              headerIcon: dimensionInfo?.cornerHeaderIcon,
               pivotInfo: {
                 value: dimensionInfo?.title ?? '',
                 dimensionKey,
@@ -802,6 +804,7 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
                 disableHeaderSelect: !!this.cornerSetting.disableHeaderSelect
               },
               dropDownMenu: dimensionInfo?.cornerDropDownMenu,
+              headerIcon: dimensionInfo?.cornerHeaderIcon,
               pivotInfo: {
                 value: dimensionInfo?.title ?? '',
                 dimensionKey,
@@ -853,6 +856,7 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
                 disableHeaderSelect: !!this.cornerSetting.disableHeaderSelect
               },
               dropDownMenu: dimensionInfo?.cornerDropDownMenu,
+              headerIcon: dimensionInfo?.cornerHeaderIcon,
               pivotInfo: {
                 value: dimensionInfo?.title ?? '',
                 dimensionKey,
@@ -911,6 +915,7 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
               disableHeaderSelect: !!this.cornerSetting.disableHeaderSelect
             },
             dropDownMenu: dimensionInfo?.cornerDropDownMenu,
+            headerIcon: dimensionInfo?.cornerHeaderIcon,
             pivotInfo: {
               value: dimensionInfo?.title ?? '',
               dimensionKey,

packages/vtable/src/ts-types/pivot-table/dimension/basic-dimension.ts

@@ -67,4 +67,10 @@ export interface IBasicDimension {
   disableHeaderSelect?: boolean;
   /** 设置表头编辑器 */
   headerEditor?: string | IEditor | ((args: BaseCellInfo & { table: BaseTableAPI }) => string | IEditor);
+  /** 定义角头维度名称对应的icon */
+  cornerHeaderIcon?:
+    | string
+    | ColumnIconOption
+    | (string | ColumnIconOption)[]
+    | ((args: CellInfo) => string | ColumnIconOption | (string | ColumnIconOption)[]);
 }