@jiaozhiye/qm-design-react 1.11.1 → 1.11.3

package/lib/locale/lang/en.d.ts

@@ -319,10 +319,10 @@ declare const _default: {
                 queryPrev: string;
                 queryNext: string;
             };
-        };
-        pivotGrid: {
-            text: string;
-            settingTitle: string;
+            pivotGrid: {
+                text: string;
+                settingTitle: string;
+            };
         };
     };
 };

package/lib/locale/lang/en.js

@@ -324,11 +324,11 @@ export default {
         clear: 'Clear condition',
         queryPrev: 'Find previous',
         queryNext: 'Find next'
+      },
+      pivotGrid: {
+        text: 'Pivot Grid',
+        settingTitle: 'Pivot Grid Dashboard'
       }
-    },
-    pivotGrid: {
-      text: 'Pivot Grid',
-      settingTitle: 'Pivot Grid Dashboard'
     }
   }
 };

package/lib/locale/lang/zh-cn.d.ts

@@ -319,10 +319,10 @@ declare const _default: {
                 queryPrev: string;
                 queryNext: string;
             };
-        };
-        pivotGrid: {
-            text: string;
-            settingTitle: string;
+            pivotGrid: {
+                text: string;
+                settingTitle: string;
+            };
         };
     };
 };

package/lib/locale/lang/zh-cn.js

@@ -324,11 +324,11 @@ export default {
         clear: '清空条件',
         queryPrev: '查找上一个',
         queryNext: '查找下一个'
+      },
+      pivotGrid: {
+        text: '透视表',
+        settingTitle: '透视表看板'
       }
-    },
-    pivotGrid: {
-      text: '透视表',
-      settingTitle: '透视表看板'
     }
   }
 };

package/lib/pivot-grid/src/config/index.d.ts

@@ -1,9 +1,6 @@
+import type { IColumn } from '../../../table/src/table/types';
 declare const _default: {
-    selectionColumnDefine: {
-        title: string;
-        dataIndex: string;
-        width: number;
-    };
+    selectionColumnDefine: IColumn;
     indentWidth: number;
 };
 export default _default;

package/lib/pivot-grid/src/grid-layout/Context.d.ts

@@ -1,11 +1,13 @@
 import React from 'react';
 import type { IRowKey } from '../../../table/src/table/types';
 import type { ScrollbarRef } from '../../../scrollbar';
+import type { Summary } from '../utils';
 export type IGridLayoutContext = {
     scrollbarRef: React.RefObject<ScrollbarRef>;
     indentDepth: number;
     selectionKeys: IRowKey[];
-    countMethod: Record<string, any>;
+    countMethod: Record<string, string>;
+    summationData: Summary;
 };
 type IProps = {
     scrollbar: React.RefObject<ScrollbarRef>;
@@ -15,6 +17,7 @@ export declare const GridLayoutProvider: React.FC<IProps>;
 export declare const useGridLayoutContext: () => (IGridLayoutContext & {
     setContext: (data: Partial<IGridLayoutContext>) => void;
     setSelectionKeys: (rowKeys: IRowKey[]) => void;
-    setCountMethod: (value: IGridLayoutContext[`countMethod`]) => void;
+    setCountMethod: (value: Record<string, string | undefined>) => void;
+    setSummationData: (value: Summary) => void;
 }) | undefined;
 export {};

package/lib/pivot-grid/src/grid-layout/CountPanel.d.ts

@@ -2,6 +2,8 @@ import React from 'react';
 import type { IColumn } from '../../../table/src/table/types';
 type IProps = {
     column: IColumn;
+    keyPath: string;
+    type: 'total' | 'subtotal';
 };
 declare const CountPanel: React.FC<IProps>;
 export default CountPanel;

package/lib/pivot-grid/src/grid-layout/GroupCard.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 type IProps = {
-    labelKey: string;
+    dataKey: string;
+    dataKeyPath: string;
     depth: number;
     className?: string;
     style?: React.CSSProperties;

package/lib/pivot-grid/src/main/Context.d.ts

@@ -15,7 +15,9 @@ export type IPivotGridContext = {
     viewMode: IPivotMode;
     size: ComponentSize;
     columns: IColumn[];
-    tableData: IRecord[];
+    gridData: IRecord[];
+    originGridData: IRecord[];
+    groupGridData: Record<string, any> | Record<string, any>[];
     groupList: GroupItem[];
     filterList: ISuperFilter[];
     sorterList: SorterItem[];
@@ -23,6 +25,7 @@ export type IPivotGridContext = {
 };
 type IProps = {
     prefixCls: string;
+    tableData: IRecord[];
     flatColumns: IColumn[];
     children?: React.ReactNode;
 };
@@ -30,7 +33,8 @@ export declare const PivotGridProvider: React.FC<IProps>;
 export declare const usePivotGridContext: () => (IPivotGridContext & {
     setContext: (data: Partial<IPivotGridContext>) => void;
     setColumns: (items: IColumn[]) => void;
-    setTableData: (records: IRecord[]) => void;
+    setGridData: (items: IRecord[]) => void;
+    setGroupGridData: (data: Record<string, any> | Record<string, any>[]) => void;
     setGroupList: (items: GroupItem[]) => void;
     setFilterList: (items: ISuperFilter[]) => void;
     setSorterList: (items: SorterItem[]) => void;

package/lib/pivot-grid/src/utils/index.d.ts

@@ -1,2 +1,31 @@
-import type { IRecord, IOrderBy } from '../../../table/src/table/types';
+import type { IRecord, IOrderBy, IColumn } from '../../../table/src/table/types';
+export declare const createGridColumns: (columns: IColumn[]) => IColumn[];
+export declare const getStickyLeft: (flattenColumns: IColumn[], fieldName: string) => number;
 export declare const groupMultiData: (records: IRecord[], groupKeys: Record<string, IOrderBy>[] | undefined, fn: (row: IRecord, key: string) => string | number) => any;
+export declare const getAllKeys: (data: Record<string, any> | Record<string, any>[], parentKey?: string) => string[];
+export type Subtotal = {
+    [key: string]: number;
+};
+export type GroupSummary = {
+    subtotal: Subtotal;
+};
+export type Summary = {
+    [key: string]: GroupSummary | Subtotal;
+};
+export type FieldCalculations = Record<string, (dataList: number[]) => number>;
+/**
+ * 递归计算分组数据
+ * @param {Object} group - 当前分组数据
+ * @returns {Object} - 计算后的结果
+ */
+export declare const calculateSummary: (groupData: Record<string, any> | Record<string, any>[], fieldCalculations: Record<string, (data: number[]) => number>) => Summary;
+export declare const calculations: {
+    sum: (arr: number[]) => number;
+    avg: (arr: number[]) => string | 0;
+    max: (arr: number[]) => number | undefined;
+    min: (arr: number[]) => number | undefined;
+    count: (arr: number[]) => number;
+    unique: (arr: number[]) => number;
+    empty: (arr: number[]) => number;
+    notEmpty: (arr: number[]) => number;
+};

package/lib/pivot-grid/style/grid-layout.less

@@ -2,7 +2,7 @@
  * @Author: 焦质晔
  * @Date: 2022-03-16 19:05:30
  * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-11-29 13:20:19
+ * @Last Modified time: 2024-12-02 20:51:13
  */
 @import '../../style/common';
 
@@ -11,10 +11,7 @@
   height: 100%;
   .header,
   .footer {
-    overflow: hidden;
-    background-color: #fff;
     border: 1px solid @--border-color-secondary;
-    border-radius: @pivot-border-radius;
     .table {
       table-layout: fixed;
       display: contents;
@@ -35,7 +32,7 @@
   .header {
     position: sticky;
     top: 0;
-    z-index: 1;
+    z-index: 2;
     .resize-bar {
       position: absolute;
       top: 0;
@@ -50,9 +47,8 @@
     min-height: fit-content;
     .group-card {
       margin: 15px 0;
-      border: 1px solid @--border-color-secondary;
-      border-radius: @pivot-border-radius;
       background-color: #fff;
+      border: 1px solid @--border-color-secondary;
       &.inner {
         margin: 0 12px 12px;
       }
@@ -66,6 +62,7 @@
           align-self: stretch;
           display: inline-flex;
           align-items: center;
+          background-color: #fff;
           border-bottom: 1px solid @--border-color-secondary;
           &.expandable-column {
             justify-content: center;
@@ -78,26 +75,31 @@
               }
             }
           }
+          &.col--fix-left {
+            position: sticky;
+            z-index: 1;
+          }
+          .title {
+            flex-shrink: 0;
+            margin-right: 20px;
+          }
         }
       }
       .grid-list {
         margin: 0;
         border: 0;
-        border-radius: 0;
         background: transparent;
       }
     }
     .grid-list {
       margin: 15px 0;
       border: 1px solid @--border-color-secondary;
-      border-radius: @pivot-border-radius;
-      background-color: #fff;
       .table-row {
         display: flex;
         align-items: center;
         &:hover {
-          background-color: @--background-color-light;
           .table-cell {
+            background-color: @--background-color-light;
             .order {
               display: none;
             }
@@ -121,26 +123,7 @@
           align-self: stretch; // 子元素高度和父元素一致
           display: inline-flex;
           align-items: center;
-          border-right: 1px solid @--border-color-secondary;
           border-bottom: 1px solid @--border-color-secondary;
-          &:last-child {
-            border-right: 0;
-          }
-          &.selection-column {
-            justify-content: center;
-            border-right-color: transparent;
-          }
-          .order {
-            display: inline-block;
-          }
-          .checkbox {
-            display: none;
-          }
-        }
-        &:last-child {
-          .table-cell {
-            border-bottom: 0;
-          }
         }
       }
     }
@@ -148,12 +131,27 @@
   .footer {
     position: sticky;
     bottom: 0;
-    z-index: 1;
+    z-index: 2;
   }
   .header,
   .body,
   .footer {
     .table-cell {
+      background-color: #fff;
+      border-right: 1px solid @--border-color-secondary;
+      &:last-child {
+        border-right: 0;
+      }
+      &.selection-column {
+        justify-content: center;
+        border-right-color: transparent;
+      }
+      .order {
+        display: inline-block;
+      }
+      .checkbox {
+        display: none;
+      }
       &.col--center {
         text-align: center !important;
         justify-content: center;
@@ -162,10 +160,17 @@
         text-align: right !important;
         justify-content: flex-end;
       }
+      &.col--fix-left {
+        position: sticky;
+        z-index: 1;
+      }
       .cell {
         .text-overflow-cut();
         padding: 0 @--padding-sm;
       }
+    }
+    .label-cell,
+    .table-cell {
       &:hover {
         .count-select {
           visibility: visible;

package/lib/pivot-grid/style/top-bar.less

@@ -2,19 +2,19 @@
  * @Author: 焦质晔
  * @Date: 2022-03-16 19:05:30
  * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-11-29 10:34:35
+ * @Last Modified time: 2024-12-04 09:17:17
  */
 @import '../../style/common';
 
 .button-icon {
-  display: inline-block;
+  display: inline-flex;
   text-align: center;
   text-transform: none;
   text-decoration: none;
   background: transparent;
   border: 0;
   outline: 0;
-  line-height: 0;
+  line-height: 1;
   padding: 5px;
   color: @--text-color-placeholder;
   border-radius: @--border-radius-lg;
@@ -28,6 +28,10 @@
 .@{prefix-pivot-grid}__popper {
   .container {
     padding: 6px 15px;
+    &.scroll-y {
+      overflow-y: auto;
+      max-height: calc(100vh - 10px);
+    }
     & > .label {
       display: flex;
       justify-content: space-between;
@@ -70,6 +74,33 @@
           display: none;
         }
       }
+      li.sort-item {
+        display: flex;
+        align-items: center;
+        border-radius: @--border-radius-lg;
+        transition: none;
+        .handle {
+          padding: 5px 6px 5px 2px;
+          color: @--text-color-placeholder;
+          cursor: s-resize;
+        }
+        .label {
+          flex: 1 0;
+          display: inline-flex;
+          align-items: center;
+          .title {
+            flex: 1 0;
+          }
+        }
+      }
+      li.divider {
+        padding: 6px;
+        &::after {
+          content: '';
+          display: block;
+          border-top: 1px solid @--border-color-secondary;
+        }
+      }
     }
     & > .add-record {
       display: flex;

package/lib/pivot-grid/style/variable.less

@@ -5,5 +5,3 @@
  * @Last Modified time: 2024-11-28 20:04:56
  */
 @prefix-pivot-grid: ~'@{qm-prefix}-pivot-grid';
-
-@pivot-border-radius: 6px;

package/lib/scrollbar/src/scrollbar.d.ts

@@ -9,6 +9,7 @@ type IProps = {
     style?: CSSProperties;
     wrapClassName?: string;
     wrapStyle?: CSSProperties;
+    innerStyle?: CSSProperties;
     barWidth?: number;
     showTopScrollbar?: boolean;
     always?: boolean;

package/lib/scrollbar/style/index.less

@@ -13,6 +13,7 @@
   &__wrap {
     display: grid;
     height: 100%;
+    max-height: inherit;
     overflow: auto;
     &--hidden {
       scrollbar-width: none;