@jiaozhiye/qm-design-react 1.11.13 → 1.11.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,10 +2,11 @@ import React from 'react';
2
2
  type UseContextMenuProps = {
3
3
  ref: React.RefObject<HTMLElement>;
4
4
  popup: (ev: MouseEvent) => React.ReactNode;
5
+ getTriggerContainer?: (el: HTMLElement | null) => HTMLElement | null;
5
6
  prevent?: (node: HTMLElement) => boolean;
6
7
  enabled?: boolean;
7
8
  };
8
- declare const useContextMenu: ({ ref, popup, prevent, enabled }: UseContextMenuProps) => {
9
+ declare const useContextMenu: ({ ref, popup, getTriggerContainer, prevent, enabled }: UseContextMenuProps) => {
9
10
  contextMenu: React.JSX.Element;
10
11
  closeMenu: () => void;
11
12
  };
@@ -34,5 +34,6 @@ export type PivotGridProps = {
34
34
  onGroupChange?: (group: GroupItem[]) => void;
35
35
  onFilterChange?: (filter: ISuperFilter[]) => void;
36
36
  onSorterChange?: (sorter: SorterItem[]) => void;
37
+ onRowEdit?: (record: IRecord, index: number) => void;
37
38
  onRowClick?: (row: IRecord, column: IColumn, event: React.MouseEvent<HTMLDivElement>) => void;
38
39
  };
@@ -2,15 +2,20 @@
2
2
  * @Author: 焦质晔
3
3
  * @Date: 2022-03-16 19:05:30
4
4
  * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-12-25 11:07:14
5
+ * @Last Modified time: 2025-01-09 17:14:40
6
6
  */
7
7
  @import '../../style/common';
8
8
 
9
9
  .@{prefix-pivot-grid}__layout {
10
10
  .reset-container();
11
11
  width: 100%;
12
- display: flex;
13
- flex-wrap: nowrap;
12
+ .@{qm-prefix}-scrollbar__wrap {
13
+ display: flex;
14
+ flex-wrap: nowrap;
15
+ & > div {
16
+ height: fit-content;
17
+ }
18
+ }
14
19
  .header,
15
20
  .footer {
16
21
  display: flex;
@@ -72,11 +77,34 @@
72
77
  justify-content: center;
73
78
  border-right-color: transparent;
74
79
  }
75
- .order {
76
- display: inline-block;
77
- }
78
- .checkbox {
79
- display: none;
80
+ .action {
81
+ display: inline-flex;
82
+ align-items: center;
83
+ justify-content: center;
84
+ .drag-icon,
85
+ .expand-icon {
86
+ display: inline-flex;
87
+ align-items: center;
88
+ justify-content: center;
89
+ width: 20px;
90
+ height: 20px;
91
+ color: @--text-color-placeholder;
92
+ visibility: hidden;
93
+ }
94
+ .expand-icon:hover {
95
+ color: @--primary-color;
96
+ }
97
+ .middle {
98
+ text-align: center;
99
+ width: 16px;
100
+ margin: 0 2px;
101
+ .order {
102
+ display: inline-block;
103
+ }
104
+ .checkbox {
105
+ display: none;
106
+ }
107
+ }
80
108
  }
81
109
  &.col--center {
82
110
  text-align: center;
@@ -228,11 +256,21 @@
228
256
  &.row--selection {
229
257
  .table-cell {
230
258
  background-color: @--background-color-light;
231
- .order {
232
- display: none;
259
+ .middle {
260
+ .order {
261
+ display: none;
262
+ }
263
+ .checkbox {
264
+ display: inline-flex;
265
+ }
233
266
  }
234
- .checkbox {
235
- display: inline-flex;
267
+ }
268
+ }
269
+ &.row--hover {
270
+ .table-cell {
271
+ .drag-icon,
272
+ .expand-icon {
273
+ visibility: visible;
236
274
  }
237
275
  }
238
276
  }
@@ -28000,6 +28000,12 @@ body {
28000
28000
  .qm-form .ant-form-item .ant-select-multiple:not(.ant-select-disabled) .ant-select-selection-overflow-item-rest * {
28001
28001
  pointer-events: none;
28002
28002
  }
28003
+ .qm-form .ant-form-vertical .ant-form-item .ant-form-item-label {
28004
+ padding-bottom: 4px;
28005
+ }
28006
+ .qm-form .ant-form-vertical .ant-form-item .ant-form-item-label label[title=''] {
28007
+ justify-content: left;
28008
+ }
28003
28009
  .qm-form--sm .ant-form-item {
28004
28010
  margin-bottom: 10px;
28005
28011
  }
@@ -31174,7 +31180,7 @@ body {
31174
31180
  * @Author: 焦质晔
31175
31181
  * @Date: 2022-03-16 19:05:30
31176
31182
  * @Last Modified by: 焦质晔
31177
- * @Last Modified time: 2024-12-25 11:07:14
31183
+ * @Last Modified time: 2025-01-09 17:14:40
31178
31184
  */
31179
31185
  .qm-pivot-grid__layout {
31180
31186
  box-sizing: border-box;
@@ -31186,9 +31192,15 @@ body {
31186
31192
  list-style: none;
31187
31193
  font-feature-settings: 'tnum';
31188
31194
  width: 100%;
31195
+ }
31196
+ .qm-pivot-grid__layout .qm-scrollbar__wrap {
31189
31197
  display: flex;
31190
31198
  flex-wrap: nowrap;
31191
31199
  }
31200
+ .qm-pivot-grid__layout .qm-scrollbar__wrap > div {
31201
+ height: -moz-fit-content;
31202
+ height: fit-content;
31203
+ }
31192
31204
  .qm-pivot-grid__layout .header,
31193
31205
  .qm-pivot-grid__layout .footer {
31194
31206
  display: flex;
@@ -31255,14 +31267,47 @@ body {
31255
31267
  justify-content: center;
31256
31268
  border-right-color: transparent;
31257
31269
  }
31258
- .qm-pivot-grid__layout .header .table-cell .order,
31259
- .qm-pivot-grid__layout .body .table-cell .order,
31260
- .qm-pivot-grid__layout .footer .table-cell .order {
31270
+ .qm-pivot-grid__layout .header .table-cell .action,
31271
+ .qm-pivot-grid__layout .body .table-cell .action,
31272
+ .qm-pivot-grid__layout .footer .table-cell .action {
31273
+ display: inline-flex;
31274
+ align-items: center;
31275
+ justify-content: center;
31276
+ }
31277
+ .qm-pivot-grid__layout .header .table-cell .action .drag-icon,
31278
+ .qm-pivot-grid__layout .body .table-cell .action .drag-icon,
31279
+ .qm-pivot-grid__layout .footer .table-cell .action .drag-icon,
31280
+ .qm-pivot-grid__layout .header .table-cell .action .expand-icon,
31281
+ .qm-pivot-grid__layout .body .table-cell .action .expand-icon,
31282
+ .qm-pivot-grid__layout .footer .table-cell .action .expand-icon {
31283
+ display: inline-flex;
31284
+ align-items: center;
31285
+ justify-content: center;
31286
+ width: 20px;
31287
+ height: 20px;
31288
+ color: rgba(0, 0, 0, 0.45);
31289
+ visibility: hidden;
31290
+ }
31291
+ .qm-pivot-grid__layout .header .table-cell .action .expand-icon:hover,
31292
+ .qm-pivot-grid__layout .body .table-cell .action .expand-icon:hover,
31293
+ .qm-pivot-grid__layout .footer .table-cell .action .expand-icon:hover {
31294
+ color: #1890ff;
31295
+ }
31296
+ .qm-pivot-grid__layout .header .table-cell .action .middle,
31297
+ .qm-pivot-grid__layout .body .table-cell .action .middle,
31298
+ .qm-pivot-grid__layout .footer .table-cell .action .middle {
31299
+ text-align: center;
31300
+ width: 16px;
31301
+ margin: 0 2px;
31302
+ }
31303
+ .qm-pivot-grid__layout .header .table-cell .action .middle .order,
31304
+ .qm-pivot-grid__layout .body .table-cell .action .middle .order,
31305
+ .qm-pivot-grid__layout .footer .table-cell .action .middle .order {
31261
31306
  display: inline-block;
31262
31307
  }
31263
- .qm-pivot-grid__layout .header .table-cell .checkbox,
31264
- .qm-pivot-grid__layout .body .table-cell .checkbox,
31265
- .qm-pivot-grid__layout .footer .table-cell .checkbox {
31308
+ .qm-pivot-grid__layout .header .table-cell .action .middle .checkbox,
31309
+ .qm-pivot-grid__layout .body .table-cell .action .middle .checkbox,
31310
+ .qm-pivot-grid__layout .footer .table-cell .action .middle .checkbox {
31266
31311
  display: none;
31267
31312
  }
31268
31313
  .qm-pivot-grid__layout .header .table-cell.col--center,
@@ -31439,14 +31484,18 @@ body {
31439
31484
  .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell {
31440
31485
  background-color: #f5f5f5;
31441
31486
  }
31442
- .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .order,
31443
- .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .order {
31487
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .middle .order,
31488
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .middle .order {
31444
31489
  display: none;
31445
31490
  }
31446
- .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .checkbox,
31447
- .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .checkbox {
31491
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .middle .checkbox,
31492
+ .qm-pivot-grid__layout .container .row-item .table-row.row--selection .table-cell .middle .checkbox {
31448
31493
  display: inline-flex;
31449
31494
  }
31495
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .drag-icon,
31496
+ .qm-pivot-grid__layout .container .row-item .table-row.row--hover .table-cell .expand-icon {
31497
+ visibility: visible;
31498
+ }
31450
31499
  .qm-pivot-grid__layout .container .row-item .table-row .cell--expand {
31451
31500
  display: inline-flex;
31452
31501
  padding: 4px;