dcp-design-react 1.11.14 → 1.11.16

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

@@ -1,17 +1,16 @@
 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[];
     treeExpandKeys: IRowKey[];
-    countMethod: Record<string, string>;
-    summationData: Summary;
+    highlightKey: IRowKey;
     checkedColumnKey: string;
     hoverRowKey: IRowKey;
     updateLayout: number;
+    clicked: [IRowKey, string] | [];
 };
 type IProps = {
     scrollbar: React.RefObject<ScrollbarRef>;
@@ -22,11 +21,12 @@ export declare const useGridLayoutContext: () => (IGridLayoutContext & {
     setContext: (data: Partial<IGridLayoutContext>) => void;
     setSelectionKeys: (rowKeys: IRowKey[]) => void;
     setTreeExpandKeys: (rowKeys: IRowKey[]) => void;
-    setCountMethod: (value: Record<string, string | undefined>) => void;
-    setSummationData: (value: Summary) => void;
+    setHighlightKey: (value: IRowKey) => void;
     setCheckColumnKey: (value: string) => void;
     setHoverRowKey: (value: IRowKey) => void;
     forceUpdateLayout: () => void;
     updateColumnsWidth: () => void;
+    setClicked: (value: [IRowKey, string] | [
+    ]) => void;
 }) | undefined;
 export {};

package/lib/pivot-grid/src/hooks/use-context-menu.d.ts

@@ -4,9 +4,10 @@ type UseContextMenuProps = {
     popup: (ev: MouseEvent) => React.ReactNode;
     getTriggerContainer?: (el: HTMLElement | null) => HTMLElement | null;
     prevent?: (node: HTMLElement) => boolean;
+    prefixCls?: string;
     enabled?: boolean;
 };
-declare const useContextMenu: ({ ref, popup, getTriggerContainer, prevent, enabled }: UseContextMenuProps) => {
+declare const useContextMenu: ({ ref, popup, getTriggerContainer, prevent, prefixCls, enabled }: UseContextMenuProps) => {
     contextMenu: React.JSX.Element;
     closeMenu: () => void;
 };

package/lib/pivot-grid/src/hooks/use-keyboard-event.d.ts

@@ -0,0 +1,3 @@
+import type { GroupLayout } from '../utils';
+declare const useKeyboardEvent: (layout: GroupLayout[]) => void;
+export default useKeyboardEvent;

package/lib/pivot-grid/src/hooks/use-row-cell.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { IColumn, IRecord, IRowKey } from '../../../table/src/table/types';
-declare const useRowCell: (isLeftPanel?: boolean) => {
-    renderGroupRow: (columns: IColumn[], row: IRecord, rowKey: IRowKey) => React.JSX.Element;
-    renderRow: (columns: IColumn[], row: IRecord, rowIndex: number, rowKey: IRowKey) => React.JSX.Element;
+declare const useRowCell: (columns: IColumn[], isLeftPanel?: boolean) => {
+    renderGroupRow: (row: IRecord, rowKey: IRowKey) => React.JSX.Element;
+    renderRow: (row: IRecord, rowIndex: number, rowKey: IRowKey) => React.JSX.Element;
 };
 export default useRowCell;

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

@@ -1,9 +1,8 @@
 import React from 'react';
 import type { IColumn, IOrderBy, IRecord, IRowKey, ISuperFilter } from '../../../table/src/table/types';
 import type { ComponentSize, ValueOf } from '../../../_utils/types';
-import type { IGridLayoutContext } from '../grid-layout/Context';
-import type { PivotGridProps } from './types';
-export type IPivotMode = 'table' | 'gantt' | 'card';
+import type { PivotGridProps, IPivotMode, ICountFn } from './types';
+import type { Summary } from '../utils';
 export type GroupItem = {
     fieldName: string;
     order: IOrderBy;
@@ -32,7 +31,6 @@ export type PivotRef = {
     flatGroupData: IRecord[];
     isTree: boolean;
     keyRecordMap: Map<IRowKey, IRecord>;
-    gridLayoutContext: Partial<IGridLayoutContext>;
 };
 export type IPivotGridContext = {
     pivotRef: React.MutableRefObject<PivotRef>;
@@ -50,6 +48,8 @@ export type IPivotGridContext = {
     searchResults: SearchResult[];
     switchIndex: number;
     fillColorCells: Map<string, string>;
+    countMethod: Record<string, ICountFn>;
+    summationData: Summary;
 };
 type IProps = {
     prefixCls: string;
@@ -76,5 +76,7 @@ export declare const usePivotGridContext: () => (IPivotGridContext & {
     setSearchResults: (value: SearchResult[]) => void;
     setSwitchIndex: (value: number) => void;
     setFillColor: (items: FillColorCell[]) => void;
+    setCountMethod: (value: Record<string, ICountFn | undefined>) => void;
+    setSummationData: (value: Summary) => void;
 }) | undefined;
 export {};

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

@@ -1,8 +1,11 @@
 /// <reference types="react" />
-import type { IColumn, IRecord, IRowKey, ISuperFilter } from '../../../table/src/table/types';
+import type { IColumn, IRecord, IRowHighlight, IRowKey, ISelectionType, ISuperFilter } from '../../../table/src/table/types';
 import type { ComponentSize } from '../../../_utils/types';
 import type { GroupItem, SorterItem } from './Context';
+export type IPivotMode = 'table' | 'gantt' | 'card';
+export type ICountFn = 'count' | 'unique' | 'empty' | 'notEmpty' | 'sum' | 'max' | 'min' | 'avg';
 export type RowSelectType = {
+    type?: ISelectionType;
     defaultSelectedRowKeys?: IRowKey[];
     selectedRowKeys?: IRowKey[];
     checkStrictly?: boolean;
@@ -14,6 +17,14 @@ export type TreeExpandType = {
     onChange?: (rowKeys: IRowKey[]) => void;
     onExpand?: (expanded: boolean, record: IRecord) => void;
 };
+export type CxtMenuItem = {
+    key: string | number;
+    label: React.ReactNode;
+    disabled?: (row: IRecord, column: IColumn) => boolean;
+    prefix?: React.ReactNode;
+    suffix?: React.ReactNode;
+    onClick?: (row: IRecord, column: IColumn) => void;
+};
 export type PivotGridRef = {};
 export type PivotGridProps = {
     fromTable?: boolean;
@@ -27,12 +38,16 @@ export type PivotGridProps = {
     className?: string;
     style?: React.CSSProperties;
     rowSelection?: RowSelectType;
+    rowHighlight?: IRowHighlight;
     treeExpandable?: TreeExpandType;
     initialGroup?: GroupItem[];
+    initialCount?: Record<string, ICountFn>;
+    contextMenues?: CxtMenuItem[];
     onDataChange?: (records: IRecord[]) => void;
     onColumnsChange?: (columns: IColumn[]) => void;
     onGroupChange?: (group: GroupItem[]) => void;
     onFilterChange?: (filter: ISuperFilter[]) => void;
     onSorterChange?: (sorter: SorterItem[]) => void;
+    onRowEdit?: (record: IRecord, index: number) => void;
     onRowClick?: (row: IRecord, column: IColumn, event: React.MouseEvent<HTMLDivElement>) => void;
 };

package/lib/pivot-grid/style/context-menu.less

@@ -0,0 +1,28 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2025-01-11 18:31:17
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2025-01-12 13:18:56
+ */
+@import '../../style/common';
+
+.@{prefix-pivot-grid}__context-menu {
+  min-width: 150px;
+  .ant-dropdown-menu-item {
+    display: flex;
+    align-items: center;
+    padding-left: @--padding-md;
+    padding-right: @--padding-md;
+    border-radius: @--border-radius-lg;
+    .label {
+      flex: auto;
+    }
+    .prefix {
+      margin-right: 5px;
+    }
+    .suffix {
+      margin-left: 4px;
+      color: @--text-color-placeholder;
+    }
+  }
+}

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

@@ -2,15 +2,21 @@
  * @Author: 焦质晔
  * @Date: 2022-03-16 19:05:30
  * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-12-25 11:07:14
+ * @Last Modified time: 2025-01-12 14:23:51
  */
 @import '../../style/common';
 
 .@{prefix-pivot-grid}__layout {
   .reset-container();
   width: 100%;
-  display: flex;
-  flex-wrap: nowrap;
+  .@{qm-prefix}-scrollbar__wrap {
+    // 调整为 flex 布局
+    display: flex;
+    flex-wrap: nowrap;
+    & > div {
+      height: fit-content;
+    }
+  }
   .header,
   .footer {
     display: flex;
@@ -72,11 +78,34 @@
         justify-content: center;
         border-right-color: transparent;
       }
-      .order {
-        display: inline-block;
-      }
-      .checkbox {
-        display: none;
+      .action {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        .drag-icon,
+        .expand-icon {
+          display: inline-flex;
+          align-items: center;
+          justify-content: center;
+          width: 20px;
+          height: 20px;
+          color: @--text-color-placeholder;
+          visibility: hidden;
+        }
+        .expand-icon:hover {
+          color: @--primary-color;
+        }
+        .middle {
+          text-align: center;
+          width: 16px;
+          margin: 0 2px;
+          .order {
+            display: inline-block;
+          }
+          .checkbox {
+            display: none;
+          }
+        }
       }
       &.col--center {
         text-align: center;
@@ -228,11 +257,26 @@
         &.row--selection {
           .table-cell {
             background-color: @--background-color-light;
-            .order {
-              display: none;
+            .middle {
+              .order {
+                display: none;
+              }
+              .checkbox {
+                display: inline-flex;
+              }
             }
-            .checkbox {
-              display: inline-flex;
+          }
+        }
+        &.row--highlight {
+          .table-cell {
+            background-color: @--primary-1;
+          }
+        }
+        &.row--hover {
+          .table-cell {
+            .drag-icon,
+            .expand-icon {
+              visibility: visible;
             }
           }
         }

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

@@ -1,10 +1,11 @@
-/*
- * @Author: 焦质晔
- * @Date: 2024-11-28 19:27:58
- * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-11-28 20:04:56
- */
-@import './variable.less';
-@import './main.less';
-@import './top-bar.less';
-@import './grid-layout.less';
+/*
+ * @Author: 焦质晔
+ * @Date: 2024-11-28 19:27:58
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2025-01-11 18:32:54
+ */
+@import './variable.less';
+@import './main.less';
+@import './top-bar.less';
+@import './grid-layout.less';
+@import './context-menu.less';

package/lib/style/index.css

@@ -30967,7 +30967,7 @@ body {
  * @Author: 焦质晔
  * @Date: 2024-11-28 19:27:58
  * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-11-28 20:04:56
+ * @Last Modified time: 2025-01-11 18:32:54
  */
 /*
  * @Author: 焦质晔
@@ -31180,7 +31180,7 @@ body {
  * @Author: 焦质晔
  * @Date: 2022-03-16 19:05:30
  * @Last Modified by: 焦质晔
- * @Last Modified time: 2024-12-25 11:07:14
+ * @Last Modified time: 2025-01-12 14:23:51
  */
 .qm-pivot-grid__layout {
   box-sizing: border-box;
@@ -31192,9 +31192,15 @@ body {
   list-style: none;
   font-feature-settings: 'tnum';
   width: 100%;
+}
+.qm-pivot-grid__layout .qm-scrollbar__wrap {
   display: flex;
   flex-wrap: nowrap;
 }
+.qm-pivot-grid__layout .qm-scrollbar__wrap > div {
+  height: -moz-fit-content;
+  height: fit-content;
+}
 .qm-pivot-grid__layout .header,
 .qm-pivot-grid__layout .footer {
   display: flex;
@@ -31261,14 +31267,47 @@ body {
   justify-content: center;
   border-right-color: transparent;
 }
-.qm-pivot-grid__layout .header .table-cell .order,
-.qm-pivot-grid__layout .body .table-cell .order,
-.qm-pivot-grid__layout .footer .table-cell .order {
+.qm-pivot-grid__layout .header .table-cell .action,
+.qm-pivot-grid__layout .body .table-cell .action,
+.qm-pivot-grid__layout .footer .table-cell .action {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+.qm-pivot-grid__layout .header .table-cell .action .drag-icon,
+.qm-pivot-grid__layout .body .table-cell .action .drag-icon,
+.qm-pivot-grid__layout .footer .table-cell .action .drag-icon,
+.qm-pivot-grid__layout .header .table-cell .action .expand-icon,
+.qm-pivot-grid__layout .body .table-cell .action .expand-icon,
+.qm-pivot-grid__layout .footer .table-cell .action .expand-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  color: rgba(0, 0, 0, 0.45);
+  visibility: hidden;
+}
+.qm-pivot-grid__layout .header .table-cell .action .expand-icon:hover,
+.qm-pivot-grid__layout .body .table-cell .action .expand-icon:hover,
+.qm-pivot-grid__layout .footer .table-cell .action .expand-icon:hover {
+  color: #1890ff;
+}
+.qm-pivot-grid__layout .header .table-cell .action .middle,
+.qm-pivot-grid__layout .body .table-cell .action .middle,
+.qm-pivot-grid__layout .footer .table-cell .action .middle {
+  text-align: center;
+  width: 16px;
+  margin: 0 2px;
+}
+.qm-pivot-grid__layout .header .table-cell .action .middle .order,
+.qm-pivot-grid__layout .body .table-cell .action .middle .order,
+.qm-pivot-grid__layout .footer .table-cell .action .middle .order {
   display: inline-block;
 }
-.qm-pivot-grid__layout .header .table-cell .checkbox,
-.qm-pivot-grid__layout .body .table-cell .checkbox,
-.qm-pivot-grid__layout .footer .table-cell .checkbox {
+.qm-pivot-grid__layout .header .table-cell .action .middle .checkbox,
+.qm-pivot-grid__layout .body .table-cell .action .middle .checkbox,
+.qm-pivot-grid__layout .footer .table-cell .action .middle .checkbox {
   display: none;
 }
 .qm-pivot-grid__layout .header .table-cell.col--center,
@@ -31445,14 +31484,21 @@ body {
 .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell {
   background-color: #f5f5f5;
 }
-.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .order,
-.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .order {
+.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .middle .order,
+.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .middle .order {
   display: none;
 }
-.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .checkbox,
-.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .checkbox {
+.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .middle .checkbox,
+.qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .middle .checkbox {
   display: inline-flex;
 }
+.qm-pivot-grid__layout .container .row-item .table-row.row--highlight .table-cell {
+  background-color: #e6f7ff;
+}
+.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .drag-icon,
+.qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .expand-icon {
+  visibility: visible;
+}
 .qm-pivot-grid__layout .container .row-item .table-row .cell--expand {
   display: inline-flex;
   padding: 4px;
@@ -31476,6 +31522,32 @@ body {
 .qm-pivot-grid__layout.large .table-cell {
   height: 42px;
 }
+/*
+ * @Author: 焦质晔
+ * @Date: 2025-01-11 18:31:17
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2025-01-12 13:18:56
+ */
+.qm-pivot-grid__context-menu {
+  min-width: 150px;
+}
+.qm-pivot-grid__context-menu .ant-dropdown-menu-item {
+  display: flex;
+  align-items: center;
+  padding-left: 10px;
+  padding-right: 10px;
+  border-radius: 4px;
+}
+.qm-pivot-grid__context-menu .ant-dropdown-menu-item .label {
+  flex: auto;
+}
+.qm-pivot-grid__context-menu .ant-dropdown-menu-item .prefix {
+  margin-right: 5px;
+}
+.qm-pivot-grid__context-menu .ant-dropdown-menu-item .suffix {
+  margin-left: 4px;
+  color: rgba(0, 0, 0, 0.45);
+}
 /*
  * @Author: 焦质晔
  * @Date: 2024-12-02 09:06:20