@jiaozhiye/qm-design-react 1.11.2 → 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/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,5 +1,8 @@
 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;
 };
@@ -18,7 +21,7 @@ export type FieldCalculations = Record<string, (dataList: number[]) => number>;
 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;
+    avg: (arr: number[]) => string | 0;
     max: (arr: number[]) => number | undefined;
     min: (arr: number[]) => number | undefined;
     count: (arr: number[]) => number;
@@ -26,4 +29,3 @@ export declare const calculations: {
     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,239 +1,239 @@
-/*
- * @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;
-    }
-  }
-}
+/*
+ * @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/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

@@ -1,7 +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';
+/*
+ * @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';

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;