@jiaozhiye/qm-design-react 1.11.0 → 1.11.2

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/utils/index.d.ts

@@ -1,2 +1,29 @@
-import type { IRecord, IOrderBy } from '../../../table/src/table/types';
+import type { IRecord, IOrderBy, IColumn } from '../../../table/src/table/types';
 export declare const groupMultiData: (records: IRecord[], groupKeys: Record<string, IOrderBy>[] | undefined, fn: (row: IRecord, key: string) => string | number) => any;
+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[]) => number;
+    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;
+};
+export declare const getStickyLeft: (flattenColumns: IColumn[], fieldName: string) => number;

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

@@ -1,234 +1,239 @@
-/*
- * @Author: 焦质晔
- * @Date: 2022-03-16 19:05:30
- * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-11-29 13:20:19
- */
-@import '../../style/common';
-
-.@{prefix-pivot-grid}__layout {
-  .reset-container();
-  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;
-      thead th,
-      tfoot td {
-        text-align: left;
-        font-weight: normal;
-        border-right: 1px solid @--border-color-secondary;
-        position: relative;
-        &.selection-column {
-          text-align: center;
-          justify-content: center;
-          border-right-color: transparent;
-        }
-      }
-    }
-  }
-  .header {
-    position: sticky;
-    top: 0;
-    z-index: 1;
-    .resize-bar {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      right: -3px;
-      width: 6px;
-      z-index: 2;
-      cursor: col-resize;
-    }
-  }
-  .body {
-    min-height: fit-content;
-    .group-card {
-      margin: 15px 0;
-      border: 1px solid @--border-color-secondary;
-      border-radius: @pivot-border-radius;
-      background-color: #fff;
-      &.inner {
-        margin: 0 12px 12px;
-      }
-      &:has(.inner) > .label-row > .label-cell {
-        border-bottom: 0;
-      }
-      .label-row {
-        display: flex;
-        align-items: center;
-        .label-cell {
-          align-self: stretch;
-          display: inline-flex;
-          align-items: center;
-          border-bottom: 1px solid @--border-color-secondary;
-          &.expandable-column {
-            justify-content: center;
-            .button-icon {
-              & > .anticon {
-                transition: transform 0.3s ease;
-              }
-              &.expand > .anticon {
-                transform: rotate(90deg);
-              }
-            }
-          }
-        }
-      }
-      .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 {
-            .order {
-              display: none;
-            }
-            .checkbox {
-              display: inline-flex;
-            }
-          }
-        }
-        &.row--selection {
-          background-color: @--primary-1;
-          .table-cell {
-            .order {
-              display: none;
-            }
-            .checkbox {
-              display: inline-flex;
-            }
-          }
-        }
-        .table-cell {
-          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;
-          }
-        }
-      }
-    }
-  }
-  .footer {
-    position: sticky;
-    bottom: 0;
-    z-index: 1;
-  }
-  .header,
-  .body,
-  .footer {
-    .table-cell {
-      &.col--center {
-        text-align: center !important;
-        justify-content: center;
-      }
-      &.col--right {
-        text-align: right !important;
-        justify-content: flex-end;
-      }
-      .cell {
-        .text-overflow-cut();
-        padding: 0 @--padding-sm;
-      }
-      &:hover {
-        .count-select {
-          visibility: visible;
-        }
-      }
-    }
-    .count-select {
-      .text-overflow-cut();
-      display: inline-flex;
-      align-items: center;
-      justify-content: flex-end;
-      height: 100%;
-      width: 100%;
-      padding: 0 @--padding-sm;
-      color: @--text-color-placeholder;
-      cursor: pointer;
-      visibility: hidden;
-      &:hover,
-      &.ant-dropdown-open {
-        visibility: visible;
-        background-color: @--background-color-light;
-      }
-      &.show {
-        visibility: visible;
-      }
-      .icon {
-        margin-left: 4px;
-      }
-    }
-  }
-  .resize-line {
-    position: absolute;
-    left: -2px;
-    top: 0;
-    width: 2px;
-    height: 100%;
-    background-color: @--primary-color;
-    cursor: col-resize;
-    z-index: 2;
-  }
-  // size
-  &.small {
-    .header .table th,
-    .footer .table td,
-    .body .grid-list > li,
-    .body .group-card > li {
-      height: 26px;
-    }
-  }
-  &.middle {
-    .header .table th,
-    .footer .table td,
-    .body .grid-list > li,
-    .body .group-card > li {
-      height: 34px;
-    }
-  }
-  &.large {
-    .header .table th,
-    .footer .table td,
-    .body .grid-list > li,
-    .body .group-card > li {
-      height: 42px;
-    }
-  }
-}
+/*
+ * @Author: 焦质晔
+ * @Date: 2022-03-16 19:05:30
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2024-12-02 20:51:13
+ */
+@import '../../style/common';
+
+.@{prefix-pivot-grid}__layout {
+  .reset-container();
+  height: 100%;
+  .header,
+  .footer {
+    border: 1px solid @--border-color-secondary;
+    .table {
+      table-layout: fixed;
+      display: contents;
+      thead th,
+      tfoot td {
+        text-align: left;
+        font-weight: normal;
+        border-right: 1px solid @--border-color-secondary;
+        position: relative;
+        &.selection-column {
+          text-align: center;
+          justify-content: center;
+          border-right-color: transparent;
+        }
+      }
+    }
+  }
+  .header {
+    position: sticky;
+    top: 0;
+    z-index: 2;
+    .resize-bar {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      right: -3px;
+      width: 6px;
+      z-index: 2;
+      cursor: col-resize;
+    }
+  }
+  .body {
+    min-height: fit-content;
+    .group-card {
+      margin: 15px 0;
+      background-color: #fff;
+      border: 1px solid @--border-color-secondary;
+      &.inner {
+        margin: 0 12px 12px;
+      }
+      &:has(.inner) > .label-row > .label-cell {
+        border-bottom: 0;
+      }
+      .label-row {
+        display: flex;
+        align-items: center;
+        .label-cell {
+          align-self: stretch;
+          display: inline-flex;
+          align-items: center;
+          background-color: #fff;
+          border-bottom: 1px solid @--border-color-secondary;
+          &.expandable-column {
+            justify-content: center;
+            .button-icon {
+              & > .anticon {
+                transition: transform 0.3s ease;
+              }
+              &.expand > .anticon {
+                transform: rotate(90deg);
+              }
+            }
+          }
+          &.col--fix-left {
+            position: sticky;
+            z-index: 1;
+          }
+          .title {
+            flex-shrink: 0;
+            margin-right: 20px;
+          }
+        }
+      }
+      .grid-list {
+        margin: 0;
+        border: 0;
+        background: transparent;
+      }
+    }
+    .grid-list {
+      margin: 15px 0;
+      border: 1px solid @--border-color-secondary;
+      .table-row {
+        display: flex;
+        align-items: center;
+        &:hover {
+          .table-cell {
+            background-color: @--background-color-light;
+            .order {
+              display: none;
+            }
+            .checkbox {
+              display: inline-flex;
+            }
+          }
+        }
+        &.row--selection {
+          background-color: @--primary-1;
+          .table-cell {
+            .order {
+              display: none;
+            }
+            .checkbox {
+              display: inline-flex;
+            }
+          }
+        }
+        .table-cell {
+          align-self: stretch; // 子元素高度和父元素一致
+          display: inline-flex;
+          align-items: center;
+          border-bottom: 1px solid @--border-color-secondary;
+        }
+      }
+    }
+  }
+  .footer {
+    position: sticky;
+    bottom: 0;
+    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;
+      }
+      &.col--right {
+        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;
+        }
+      }
+    }
+    .count-select {
+      .text-overflow-cut();
+      display: inline-flex;
+      align-items: center;
+      justify-content: flex-end;
+      height: 100%;
+      width: 100%;
+      padding: 0 @--padding-sm;
+      color: @--text-color-placeholder;
+      cursor: pointer;
+      visibility: hidden;
+      &:hover,
+      &.ant-dropdown-open {
+        visibility: visible;
+        background-color: @--background-color-light;
+      }
+      &.show {
+        visibility: visible;
+      }
+      .icon {
+        margin-left: 4px;
+      }
+    }
+  }
+  .resize-line {
+    position: absolute;
+    left: -2px;
+    top: 0;
+    width: 2px;
+    height: 100%;
+    background-color: @--primary-color;
+    cursor: col-resize;
+    z-index: 2;
+  }
+  // size
+  &.small {
+    .header .table th,
+    .footer .table td,
+    .body .grid-list > li,
+    .body .group-card > li {
+      height: 26px;
+    }
+  }
+  &.middle {
+    .header .table th,
+    .footer .table td,
+    .body .grid-list > li,
+    .body .group-card > li {
+      height: 34px;
+    }
+  }
+  &.large {
+    .header .table th,
+    .footer .table td,
+    .body .grid-list > li,
+    .body .group-card > li {
+      height: 42px;
+    }
+  }
+}

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

@@ -1,9 +1,7 @@
-/*
- * @Author: 焦质晔
- * @Date: 2020-02-28 21:58:58
- * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-11-28 20:04:56
- */
-@prefix-pivot-grid: ~'@{qm-prefix}-pivot-grid';
-
-@pivot-border-radius: 6px;
+/*
+ * @Author: 焦质晔
+ * @Date: 2020-02-28 21:58:58
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2024-11-28 20:04:56
+ */
+@prefix-pivot-grid: ~'@{qm-prefix}-pivot-grid';