dcp-design-react 1.11.5 → 1.11.6

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.
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ type UseContextMenuProps = {
3
+ ref: React.RefObject<HTMLElement>;
4
+ popup: (ev: MouseEvent) => React.ReactNode;
5
+ enabled?: boolean;
6
+ };
7
+ declare const useContextMenu: ({ ref, popup, enabled }: UseContextMenuProps) => {
8
+ contextMenu: React.JSX.Element;
9
+ closeMenu: () => void;
10
+ };
11
+ export default useContextMenu;
@@ -15,13 +15,17 @@ export type SearchResult = {
15
15
  rowKey: IRowKey;
16
16
  dataIndex: string;
17
17
  };
18
+ export type PivotRef = {
19
+ originGridData: IRecord[];
20
+ flatGroupData: IRecord[];
21
+ };
18
22
  export type IPivotGridContext = {
23
+ pivotRef: React.MutableRefObject<PivotRef>;
19
24
  prefixCls: string;
20
25
  viewMode: IPivotMode;
21
26
  size: ComponentSize;
22
27
  columns: IColumn[];
23
28
  gridData: IRecord[];
24
- originGridData: IRecord[];
25
29
  groupGridData: Record<string, any> | Record<string, any>[];
26
30
  groupList: GroupItem[];
27
31
  filterList: ISuperFilter[];
@@ -39,6 +43,7 @@ type IProps = {
39
43
  export declare const PivotGridProvider: React.FC<IProps>;
40
44
  export declare const usePivotGridContext: () => (IPivotGridContext & {
41
45
  setContext: (data: Partial<IPivotGridContext>) => void;
46
+ setPivotGridRef: (value: Partial<PivotRef>) => void;
42
47
  setColumns: (items: IColumn[]) => void;
43
48
  setGridData: (items: IRecord[]) => void;
44
49
  setGroupGridData: (data: Record<string, any> | Record<string, any>[]) => void;
@@ -29,3 +29,4 @@ export declare const calculations: {
29
29
  empty: (arr: number[]) => number;
30
30
  notEmpty: (arr: number[]) => number;
31
31
  };
32
+ export declare const flattenGroupedData: (groupData: Record<string, any> | Record<string, any>[]) => IRecord[];
@@ -2,12 +2,14 @@
2
2
  * @Author: 焦质晔
3
3
  * @Date: 2022-03-16 19:05:30
4
4
  * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-12-02 20:51:13
5
+ * @Last Modified time: 2024-12-11 17:28:36
6
6
  */
7
7
  @import '../../style/common';
8
8
 
9
9
  .@{prefix-pivot-grid}__layout {
10
10
  .reset-container();
11
+ display: flex;
12
+ flex-wrap: nowrap;
11
13
  height: 100%;
12
14
  .header,
13
15
  .footer {
@@ -33,6 +35,9 @@
33
35
  position: sticky;
34
36
  top: 0;
35
37
  z-index: 2;
38
+ .table-cell {
39
+ background-color: #d6f2ff !important;
40
+ }
36
41
  .resize-bar {
37
42
  position: absolute;
38
43
  top: 0;
@@ -127,6 +132,7 @@
127
132
  border-bottom: 1px solid @--border-color-secondary;
128
133
  &.active {
129
134
  box-shadow: inset 0 0 0 2px @--primary-color;
135
+ background-color: rgba(255, 235, 140, 1);
130
136
  }
131
137
  }
132
138
  }
@@ -1,136 +1,139 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2022-03-16 19:05:30
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-12-04 09:17:17
6
- */
7
- @import '../../style/common';
8
-
9
- .button-icon {
10
- display: inline-flex;
11
- text-align: center;
12
- text-transform: none;
13
- text-decoration: none;
14
- background: transparent;
15
- border: 0;
16
- outline: 0;
17
- line-height: 1;
18
- padding: 5px;
19
- color: @--text-color-placeholder;
20
- border-radius: @--border-radius-lg;
21
- transition: background-color 0.3s ease;
22
- cursor: pointer;
23
- &:not(.no-hover-bg):hover {
24
- background-color: @--background-color;
25
- }
26
- }
27
-
28
- .@{prefix-pivot-grid}__popper {
29
- .container {
30
- padding: 6px 15px;
31
- &.scroll-y {
32
- overflow-y: auto;
33
- max-height: calc(100vh - 10px);
34
- }
35
- & > .label {
36
- display: flex;
37
- justify-content: space-between;
38
- align-items: center;
39
- padding: 4px 0;
40
- }
41
- & > .list {
42
- li.item {
43
- display: flex;
44
- align-items: center;
45
- margin: 6px 0;
46
- .icon {
47
- padding: 6px 2px;
48
- color: @--text-color-placeholder;
49
- cursor: pointer;
50
- }
51
- .close {
52
- margin-left: @--margin-sm;
53
- font-size: @--font-size-lg;
54
- padding: @--padding-sm;
55
- border-radius: @--border-radius-lg;
56
- transition: all 0.3s ease;
57
- &:hover {
58
- background-color: @--background-color;
59
- }
60
- }
61
- }
62
- li.check-item {
63
- display: flex;
64
- align-items: center;
65
- justify-content: space-between;
66
- border-radius: @--border-radius-lg;
67
- &.active {
68
- .icon {
69
- display: block;
70
- }
71
- }
72
- .icon {
73
- color: @--primary-color;
74
- display: none;
75
- }
76
- }
77
- li.sort-item {
78
- display: flex;
79
- align-items: center;
80
- border-radius: @--border-radius-lg;
81
- transition: none;
82
- .handle {
83
- padding: 5px 6px 5px 2px;
84
- color: @--text-color-placeholder;
85
- cursor: s-resize;
86
- }
87
- .label {
88
- flex: 1 0;
89
- display: inline-flex;
90
- align-items: center;
91
- .title {
92
- flex: 1 0;
93
- }
94
- }
95
- }
96
- li.divider {
97
- padding: 6px;
98
- &::after {
99
- content: '';
100
- display: block;
101
- border-top: 1px solid @--border-color-secondary;
102
- }
103
- }
104
- }
105
- & > .add-record {
106
- display: flex;
107
- justify-content: space-between;
108
- align-items: center;
109
- padding: @--margin-md 0 4px;
110
- .insert {
111
- color: @--primary-4;
112
- cursor: pointer;
113
- .icon {
114
- margin-right: 4px;
115
- }
116
- }
117
- }
118
- & > .search {
119
- .search-switch {
120
- display: inline-flex;
121
- align-items: center;
122
- margin-right: -7px;
123
- &.disabled {
124
- .btn {
125
- pointer-events: none;
126
- }
127
- }
128
- .num {
129
- margin: 0 4px;
130
- color: @--text-color-placeholder;
131
- line-height: 1;
132
- }
133
- }
134
- }
135
- }
136
- }
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2022-03-16 19:05:30
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2024-12-04 09:17:17
6
+ */
7
+ @import '../../style/common';
8
+
9
+ .button-icon {
10
+ display: inline-flex;
11
+ text-align: center;
12
+ text-transform: none;
13
+ text-decoration: none;
14
+ background: transparent;
15
+ border: 0;
16
+ outline: 0;
17
+ line-height: 1;
18
+ padding: 5px;
19
+ color: @--text-color-placeholder;
20
+ border-radius: @--border-radius-lg;
21
+ transition: background-color 0.3s ease;
22
+ cursor: pointer;
23
+ &:not(.no-hover-bg):hover {
24
+ background-color: @--background-color;
25
+ }
26
+ &.disabled {
27
+ cursor: not-allowed;
28
+ }
29
+ }
30
+
31
+ .@{prefix-pivot-grid}__popper {
32
+ .container {
33
+ padding: 6px 15px;
34
+ &.scroll-y {
35
+ overflow-y: auto;
36
+ max-height: calc(100vh - 10px);
37
+ }
38
+ & > .label {
39
+ display: flex;
40
+ justify-content: space-between;
41
+ align-items: center;
42
+ padding: 4px 0;
43
+ }
44
+ & > .list {
45
+ li.item {
46
+ display: flex;
47
+ align-items: center;
48
+ margin: 6px 0;
49
+ .icon {
50
+ padding: 6px 2px;
51
+ color: @--text-color-placeholder;
52
+ cursor: pointer;
53
+ }
54
+ .close {
55
+ margin-left: @--margin-sm;
56
+ font-size: @--font-size-lg;
57
+ padding: @--padding-sm;
58
+ border-radius: @--border-radius-lg;
59
+ transition: all 0.3s ease;
60
+ &:hover {
61
+ background-color: @--background-color;
62
+ }
63
+ }
64
+ }
65
+ li.check-item {
66
+ display: flex;
67
+ align-items: center;
68
+ justify-content: space-between;
69
+ border-radius: @--border-radius-lg;
70
+ &.active {
71
+ .icon {
72
+ display: block;
73
+ }
74
+ }
75
+ .icon {
76
+ color: @--primary-color;
77
+ display: none;
78
+ }
79
+ }
80
+ li.sort-item {
81
+ display: flex;
82
+ align-items: center;
83
+ border-radius: @--border-radius-lg;
84
+ transition: none;
85
+ .handle {
86
+ padding: 5px 6px 5px 2px;
87
+ color: @--text-color-placeholder;
88
+ cursor: s-resize;
89
+ }
90
+ .label {
91
+ flex: 1 0;
92
+ display: inline-flex;
93
+ align-items: center;
94
+ .title {
95
+ flex: 1 0;
96
+ }
97
+ }
98
+ }
99
+ li.divider {
100
+ padding: 6px;
101
+ &::after {
102
+ content: '';
103
+ display: block;
104
+ border-top: 1px solid @--border-color-secondary;
105
+ }
106
+ }
107
+ }
108
+ & > .add-record {
109
+ display: flex;
110
+ justify-content: space-between;
111
+ align-items: center;
112
+ padding: @--margin-md 0 4px;
113
+ .insert {
114
+ color: @--primary-4;
115
+ cursor: pointer;
116
+ .icon {
117
+ margin-right: 4px;
118
+ }
119
+ }
120
+ }
121
+ & > .search {
122
+ .search-switch {
123
+ display: inline-flex;
124
+ align-items: center;
125
+ margin-right: -7px;
126
+ &.disabled {
127
+ .btn {
128
+ pointer-events: none;
129
+ }
130
+ }
131
+ .num {
132
+ margin: 0 4px;
133
+ color: @--text-color-placeholder;
134
+ line-height: 1;
135
+ }
136
+ }
137
+ }
138
+ }
139
+ }
@@ -31034,6 +31034,9 @@ body {
31034
31034
  .button-icon:not(.no-hover-bg):hover {
31035
31035
  background-color: #f2f2f2;
31036
31036
  }
31037
+ .button-icon.disabled {
31038
+ cursor: not-allowed;
31039
+ }
31037
31040
  .qm-pivot-grid__popper .container {
31038
31041
  padding: 6px 15px;
31039
31042
  }
@@ -31137,7 +31140,7 @@ body {
31137
31140
  * @Author: 焦质晔
31138
31141
  * @Date: 2022-03-16 19:05:30
31139
31142
  * @Last Modified by: 焦质晔
31140
- * @Last Modified time: 2024-12-02 20:51:13
31143
+ * @Last Modified time: 2024-12-11 17:28:36
31141
31144
  */
31142
31145
  .qm-pivot-grid__layout {
31143
31146
  box-sizing: border-box;
@@ -31148,6 +31151,8 @@ body {
31148
31151
  line-height: 1.5715;
31149
31152
  list-style: none;
31150
31153
  font-feature-settings: 'tnum';
31154
+ display: flex;
31155
+ flex-wrap: nowrap;
31151
31156
  height: 100%;
31152
31157
  }
31153
31158
  .qm-pivot-grid__layout .header,
@@ -31181,6 +31186,9 @@ body {
31181
31186
  top: 0;
31182
31187
  z-index: 2;
31183
31188
  }
31189
+ .qm-pivot-grid__layout .header .table-cell {
31190
+ background-color: #d6f2ff !important;
31191
+ }
31184
31192
  .qm-pivot-grid__layout .header .resize-bar {
31185
31193
  position: absolute;
31186
31194
  top: 0;
@@ -31273,6 +31281,7 @@ body {
31273
31281
  }
31274
31282
  .qm-pivot-grid__layout .body .grid-list .table-row .table-cell.active {
31275
31283
  box-shadow: inset 0 0 0 2px #1890ff;
31284
+ background-color: #ffeb8c;
31276
31285
  }
31277
31286
  .qm-pivot-grid__layout .footer {
31278
31287
  position: sticky;