dcp-design-react 1.11.2 → 1.11.3

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.
Files changed (45) hide show
  1. package/lib/form/style/index.less +3 -1
  2. package/lib/index.d.ts +2 -2
  3. package/lib/index.esm.js +1 -1
  4. package/lib/index.full.js +1 -1
  5. package/lib/index.js +1 -1
  6. package/lib/locale/lang/en.d.ts +4 -4
  7. package/lib/locale/lang/en.js +4 -4
  8. package/lib/locale/lang/zh-cn.d.ts +4 -4
  9. package/lib/locale/lang/zh-cn.js +4 -4
  10. package/lib/pivot-grid/src/main/Context.d.ts +6 -2
  11. package/lib/pivot-grid/src/utils/index.d.ts +4 -2
  12. package/lib/pivot-grid/style/grid-layout.less +239 -239
  13. package/lib/pivot-grid/style/top-bar.less +34 -3
  14. package/lib/pivot-grid/style/variable.less +7 -7
  15. package/lib/scrollbar/src/scrollbar.d.ts +1 -0
  16. package/lib/scrollbar/style/index.less +1 -0
  17. package/lib/style/index.css +49 -10
  18. package/lib/style/index.less +43 -43
  19. package/lib/style/index.min.css +1 -1
  20. package/lib/table/src/body/DraggableTr.d.ts +2 -1
  21. package/lib/table/src/body/index.d.ts +2 -6
  22. package/lib/table/src/config/index.d.ts +1 -0
  23. package/lib/table/src/context/index.d.ts +3 -8
  24. package/lib/table/src/export/useExport.d.ts +1 -1
  25. package/lib/table/src/footer/index.d.ts +1 -4
  26. package/lib/table/src/header/index.d.ts +1 -3
  27. package/lib/table/src/hooks/useImperativeMethod.d.ts +0 -1
  28. package/lib/table/src/hooks/useTableCore.d.ts +3 -17
  29. package/lib/table/src/hooks/useTableEffect.d.ts +0 -2
  30. package/lib/table/src/hooks/useTableLayout.d.ts +3 -15
  31. package/lib/table/src/hooks/useTableMemo.d.ts +1 -3
  32. package/lib/table/src/hooks/useTableRef.d.ts +4 -33
  33. package/lib/table/src/hooks/useTableState.d.ts +5 -14
  34. package/lib/table/src/hooks/useTableVirtual.d.ts +17 -0
  35. package/lib/table/src/table/props.d.ts +0 -1
  36. package/lib/table/src/table/types.d.ts +3 -2
  37. package/lib/table/style/body.less +103 -103
  38. package/lib/table/style/column-filter.less +5 -5
  39. package/lib/table/style/index.less +31 -31
  40. package/lib/table/style/pivot-grid.less +19 -19
  41. package/lib/virtual-list/index.d.ts +1 -1
  42. package/lib/virtual-list/src/list-item.d.ts +2 -1
  43. package/lib/virtual-list/src/virtual-list.d.ts +5 -4
  44. package/lib/virtual-list/style/index.less +21 -16
  45. package/package.json +1 -1
@@ -319,10 +319,10 @@ declare const _default: {
319
319
  queryPrev: string;
320
320
  queryNext: string;
321
321
  };
322
- };
323
- pivotGrid: {
324
- text: string;
325
- settingTitle: string;
322
+ pivotGrid: {
323
+ text: string;
324
+ settingTitle: string;
325
+ };
326
326
  };
327
327
  };
328
328
  };
@@ -324,11 +324,11 @@ export default {
324
324
  clear: 'Clear condition',
325
325
  queryPrev: 'Find previous',
326
326
  queryNext: 'Find next'
327
+ },
328
+ pivotGrid: {
329
+ text: 'Pivot Grid',
330
+ settingTitle: 'Pivot Grid Dashboard'
327
331
  }
328
- },
329
- pivotGrid: {
330
- text: 'Pivot Grid',
331
- settingTitle: 'Pivot Grid Dashboard'
332
332
  }
333
333
  }
334
334
  };
@@ -319,10 +319,10 @@ declare const _default: {
319
319
  queryPrev: string;
320
320
  queryNext: string;
321
321
  };
322
- };
323
- pivotGrid: {
324
- text: string;
325
- settingTitle: string;
322
+ pivotGrid: {
323
+ text: string;
324
+ settingTitle: string;
325
+ };
326
326
  };
327
327
  };
328
328
  };
@@ -324,11 +324,11 @@ export default {
324
324
  clear: '清空条件',
325
325
  queryPrev: '查找上一个',
326
326
  queryNext: '查找下一个'
327
+ },
328
+ pivotGrid: {
329
+ text: '透视表',
330
+ settingTitle: '透视表看板'
327
331
  }
328
- },
329
- pivotGrid: {
330
- text: '透视表',
331
- settingTitle: '透视表看板'
332
332
  }
333
333
  }
334
334
  };
@@ -15,7 +15,9 @@ export type IPivotGridContext = {
15
15
  viewMode: IPivotMode;
16
16
  size: ComponentSize;
17
17
  columns: IColumn[];
18
- tableData: IRecord[];
18
+ gridData: IRecord[];
19
+ originGridData: IRecord[];
20
+ groupGridData: Record<string, any> | Record<string, any>[];
19
21
  groupList: GroupItem[];
20
22
  filterList: ISuperFilter[];
21
23
  sorterList: SorterItem[];
@@ -23,6 +25,7 @@ export type IPivotGridContext = {
23
25
  };
24
26
  type IProps = {
25
27
  prefixCls: string;
28
+ tableData: IRecord[];
26
29
  flatColumns: IColumn[];
27
30
  children?: React.ReactNode;
28
31
  };
@@ -30,7 +33,8 @@ export declare const PivotGridProvider: React.FC<IProps>;
30
33
  export declare const usePivotGridContext: () => (IPivotGridContext & {
31
34
  setContext: (data: Partial<IPivotGridContext>) => void;
32
35
  setColumns: (items: IColumn[]) => void;
33
- setTableData: (records: IRecord[]) => void;
36
+ setGridData: (items: IRecord[]) => void;
37
+ setGroupGridData: (data: Record<string, any> | Record<string, any>[]) => void;
34
38
  setGroupList: (items: GroupItem[]) => void;
35
39
  setFilterList: (items: ISuperFilter[]) => void;
36
40
  setSorterList: (items: SorterItem[]) => void;
@@ -1,5 +1,8 @@
1
1
  import type { IRecord, IOrderBy, IColumn } from '../../../table/src/table/types';
2
+ export declare const createGridColumns: (columns: IColumn[]) => IColumn[];
3
+ export declare const getStickyLeft: (flattenColumns: IColumn[], fieldName: string) => number;
2
4
  export declare const groupMultiData: (records: IRecord[], groupKeys: Record<string, IOrderBy>[] | undefined, fn: (row: IRecord, key: string) => string | number) => any;
5
+ export declare const getAllKeys: (data: Record<string, any> | Record<string, any>[], parentKey?: string) => string[];
3
6
  export type Subtotal = {
4
7
  [key: string]: number;
5
8
  };
@@ -18,7 +21,7 @@ export type FieldCalculations = Record<string, (dataList: number[]) => number>;
18
21
  export declare const calculateSummary: (groupData: Record<string, any> | Record<string, any>[], fieldCalculations: Record<string, (data: number[]) => number>) => Summary;
19
22
  export declare const calculations: {
20
23
  sum: (arr: number[]) => number;
21
- avg: (arr: number[]) => number;
24
+ avg: (arr: number[]) => string | 0;
22
25
  max: (arr: number[]) => number | undefined;
23
26
  min: (arr: number[]) => number | undefined;
24
27
  count: (arr: number[]) => number;
@@ -26,4 +29,3 @@ export declare const calculations: {
26
29
  empty: (arr: number[]) => number;
27
30
  notEmpty: (arr: number[]) => number;
28
31
  };
29
- export declare const getStickyLeft: (flattenColumns: IColumn[], fieldName: string) => number;
@@ -1,239 +1,239 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2022-03-16 19:05:30
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-12-02 20:51:13
6
- */
7
- @import '../../style/common';
8
-
9
- .@{prefix-pivot-grid}__layout {
10
- .reset-container();
11
- height: 100%;
12
- .header,
13
- .footer {
14
- border: 1px solid @--border-color-secondary;
15
- .table {
16
- table-layout: fixed;
17
- display: contents;
18
- thead th,
19
- tfoot td {
20
- text-align: left;
21
- font-weight: normal;
22
- border-right: 1px solid @--border-color-secondary;
23
- position: relative;
24
- &.selection-column {
25
- text-align: center;
26
- justify-content: center;
27
- border-right-color: transparent;
28
- }
29
- }
30
- }
31
- }
32
- .header {
33
- position: sticky;
34
- top: 0;
35
- z-index: 2;
36
- .resize-bar {
37
- position: absolute;
38
- top: 0;
39
- bottom: 0;
40
- right: -3px;
41
- width: 6px;
42
- z-index: 2;
43
- cursor: col-resize;
44
- }
45
- }
46
- .body {
47
- min-height: fit-content;
48
- .group-card {
49
- margin: 15px 0;
50
- background-color: #fff;
51
- border: 1px solid @--border-color-secondary;
52
- &.inner {
53
- margin: 0 12px 12px;
54
- }
55
- &:has(.inner) > .label-row > .label-cell {
56
- border-bottom: 0;
57
- }
58
- .label-row {
59
- display: flex;
60
- align-items: center;
61
- .label-cell {
62
- align-self: stretch;
63
- display: inline-flex;
64
- align-items: center;
65
- background-color: #fff;
66
- border-bottom: 1px solid @--border-color-secondary;
67
- &.expandable-column {
68
- justify-content: center;
69
- .button-icon {
70
- & > .anticon {
71
- transition: transform 0.3s ease;
72
- }
73
- &.expand > .anticon {
74
- transform: rotate(90deg);
75
- }
76
- }
77
- }
78
- &.col--fix-left {
79
- position: sticky;
80
- z-index: 1;
81
- }
82
- .title {
83
- flex-shrink: 0;
84
- margin-right: 20px;
85
- }
86
- }
87
- }
88
- .grid-list {
89
- margin: 0;
90
- border: 0;
91
- background: transparent;
92
- }
93
- }
94
- .grid-list {
95
- margin: 15px 0;
96
- border: 1px solid @--border-color-secondary;
97
- .table-row {
98
- display: flex;
99
- align-items: center;
100
- &:hover {
101
- .table-cell {
102
- background-color: @--background-color-light;
103
- .order {
104
- display: none;
105
- }
106
- .checkbox {
107
- display: inline-flex;
108
- }
109
- }
110
- }
111
- &.row--selection {
112
- background-color: @--primary-1;
113
- .table-cell {
114
- .order {
115
- display: none;
116
- }
117
- .checkbox {
118
- display: inline-flex;
119
- }
120
- }
121
- }
122
- .table-cell {
123
- align-self: stretch; // 子元素高度和父元素一致
124
- display: inline-flex;
125
- align-items: center;
126
- border-bottom: 1px solid @--border-color-secondary;
127
- }
128
- }
129
- }
130
- }
131
- .footer {
132
- position: sticky;
133
- bottom: 0;
134
- z-index: 2;
135
- }
136
- .header,
137
- .body,
138
- .footer {
139
- .table-cell {
140
- background-color: #fff;
141
- border-right: 1px solid @--border-color-secondary;
142
- &:last-child {
143
- border-right: 0;
144
- }
145
- &.selection-column {
146
- justify-content: center;
147
- border-right-color: transparent;
148
- }
149
- .order {
150
- display: inline-block;
151
- }
152
- .checkbox {
153
- display: none;
154
- }
155
- &.col--center {
156
- text-align: center !important;
157
- justify-content: center;
158
- }
159
- &.col--right {
160
- text-align: right !important;
161
- justify-content: flex-end;
162
- }
163
- &.col--fix-left {
164
- position: sticky;
165
- z-index: 1;
166
- }
167
- .cell {
168
- .text-overflow-cut();
169
- padding: 0 @--padding-sm;
170
- }
171
- }
172
- .label-cell,
173
- .table-cell {
174
- &:hover {
175
- .count-select {
176
- visibility: visible;
177
- }
178
- }
179
- }
180
- .count-select {
181
- .text-overflow-cut();
182
- display: inline-flex;
183
- align-items: center;
184
- justify-content: flex-end;
185
- height: 100%;
186
- width: 100%;
187
- padding: 0 @--padding-sm;
188
- color: @--text-color-placeholder;
189
- cursor: pointer;
190
- visibility: hidden;
191
- &:hover,
192
- &.ant-dropdown-open {
193
- visibility: visible;
194
- background-color: @--background-color-light;
195
- }
196
- &.show {
197
- visibility: visible;
198
- }
199
- .icon {
200
- margin-left: 4px;
201
- }
202
- }
203
- }
204
- .resize-line {
205
- position: absolute;
206
- left: -2px;
207
- top: 0;
208
- width: 2px;
209
- height: 100%;
210
- background-color: @--primary-color;
211
- cursor: col-resize;
212
- z-index: 2;
213
- }
214
- // size
215
- &.small {
216
- .header .table th,
217
- .footer .table td,
218
- .body .grid-list > li,
219
- .body .group-card > li {
220
- height: 26px;
221
- }
222
- }
223
- &.middle {
224
- .header .table th,
225
- .footer .table td,
226
- .body .grid-list > li,
227
- .body .group-card > li {
228
- height: 34px;
229
- }
230
- }
231
- &.large {
232
- .header .table th,
233
- .footer .table td,
234
- .body .grid-list > li,
235
- .body .group-card > li {
236
- height: 42px;
237
- }
238
- }
239
- }
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2022-03-16 19:05:30
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2024-12-02 20:51:13
6
+ */
7
+ @import '../../style/common';
8
+
9
+ .@{prefix-pivot-grid}__layout {
10
+ .reset-container();
11
+ height: 100%;
12
+ .header,
13
+ .footer {
14
+ border: 1px solid @--border-color-secondary;
15
+ .table {
16
+ table-layout: fixed;
17
+ display: contents;
18
+ thead th,
19
+ tfoot td {
20
+ text-align: left;
21
+ font-weight: normal;
22
+ border-right: 1px solid @--border-color-secondary;
23
+ position: relative;
24
+ &.selection-column {
25
+ text-align: center;
26
+ justify-content: center;
27
+ border-right-color: transparent;
28
+ }
29
+ }
30
+ }
31
+ }
32
+ .header {
33
+ position: sticky;
34
+ top: 0;
35
+ z-index: 2;
36
+ .resize-bar {
37
+ position: absolute;
38
+ top: 0;
39
+ bottom: 0;
40
+ right: -3px;
41
+ width: 6px;
42
+ z-index: 2;
43
+ cursor: col-resize;
44
+ }
45
+ }
46
+ .body {
47
+ min-height: fit-content;
48
+ .group-card {
49
+ margin: 15px 0;
50
+ background-color: #fff;
51
+ border: 1px solid @--border-color-secondary;
52
+ &.inner {
53
+ margin: 0 12px 12px;
54
+ }
55
+ &:has(.inner) > .label-row > .label-cell {
56
+ border-bottom: 0;
57
+ }
58
+ .label-row {
59
+ display: flex;
60
+ align-items: center;
61
+ .label-cell {
62
+ align-self: stretch;
63
+ display: inline-flex;
64
+ align-items: center;
65
+ background-color: #fff;
66
+ border-bottom: 1px solid @--border-color-secondary;
67
+ &.expandable-column {
68
+ justify-content: center;
69
+ .button-icon {
70
+ & > .anticon {
71
+ transition: transform 0.3s ease;
72
+ }
73
+ &.expand > .anticon {
74
+ transform: rotate(90deg);
75
+ }
76
+ }
77
+ }
78
+ &.col--fix-left {
79
+ position: sticky;
80
+ z-index: 1;
81
+ }
82
+ .title {
83
+ flex-shrink: 0;
84
+ margin-right: 20px;
85
+ }
86
+ }
87
+ }
88
+ .grid-list {
89
+ margin: 0;
90
+ border: 0;
91
+ background: transparent;
92
+ }
93
+ }
94
+ .grid-list {
95
+ margin: 15px 0;
96
+ border: 1px solid @--border-color-secondary;
97
+ .table-row {
98
+ display: flex;
99
+ align-items: center;
100
+ &:hover {
101
+ .table-cell {
102
+ background-color: @--background-color-light;
103
+ .order {
104
+ display: none;
105
+ }
106
+ .checkbox {
107
+ display: inline-flex;
108
+ }
109
+ }
110
+ }
111
+ &.row--selection {
112
+ background-color: @--primary-1;
113
+ .table-cell {
114
+ .order {
115
+ display: none;
116
+ }
117
+ .checkbox {
118
+ display: inline-flex;
119
+ }
120
+ }
121
+ }
122
+ .table-cell {
123
+ align-self: stretch; // 子元素高度和父元素一致
124
+ display: inline-flex;
125
+ align-items: center;
126
+ border-bottom: 1px solid @--border-color-secondary;
127
+ }
128
+ }
129
+ }
130
+ }
131
+ .footer {
132
+ position: sticky;
133
+ bottom: 0;
134
+ z-index: 2;
135
+ }
136
+ .header,
137
+ .body,
138
+ .footer {
139
+ .table-cell {
140
+ background-color: #fff;
141
+ border-right: 1px solid @--border-color-secondary;
142
+ &:last-child {
143
+ border-right: 0;
144
+ }
145
+ &.selection-column {
146
+ justify-content: center;
147
+ border-right-color: transparent;
148
+ }
149
+ .order {
150
+ display: inline-block;
151
+ }
152
+ .checkbox {
153
+ display: none;
154
+ }
155
+ &.col--center {
156
+ text-align: center !important;
157
+ justify-content: center;
158
+ }
159
+ &.col--right {
160
+ text-align: right !important;
161
+ justify-content: flex-end;
162
+ }
163
+ &.col--fix-left {
164
+ position: sticky;
165
+ z-index: 1;
166
+ }
167
+ .cell {
168
+ .text-overflow-cut();
169
+ padding: 0 @--padding-sm;
170
+ }
171
+ }
172
+ .label-cell,
173
+ .table-cell {
174
+ &:hover {
175
+ .count-select {
176
+ visibility: visible;
177
+ }
178
+ }
179
+ }
180
+ .count-select {
181
+ .text-overflow-cut();
182
+ display: inline-flex;
183
+ align-items: center;
184
+ justify-content: flex-end;
185
+ height: 100%;
186
+ width: 100%;
187
+ padding: 0 @--padding-sm;
188
+ color: @--text-color-placeholder;
189
+ cursor: pointer;
190
+ visibility: hidden;
191
+ &:hover,
192
+ &.ant-dropdown-open {
193
+ visibility: visible;
194
+ background-color: @--background-color-light;
195
+ }
196
+ &.show {
197
+ visibility: visible;
198
+ }
199
+ .icon {
200
+ margin-left: 4px;
201
+ }
202
+ }
203
+ }
204
+ .resize-line {
205
+ position: absolute;
206
+ left: -2px;
207
+ top: 0;
208
+ width: 2px;
209
+ height: 100%;
210
+ background-color: @--primary-color;
211
+ cursor: col-resize;
212
+ z-index: 2;
213
+ }
214
+ // size
215
+ &.small {
216
+ .header .table th,
217
+ .footer .table td,
218
+ .body .grid-list > li,
219
+ .body .group-card > li {
220
+ height: 26px;
221
+ }
222
+ }
223
+ &.middle {
224
+ .header .table th,
225
+ .footer .table td,
226
+ .body .grid-list > li,
227
+ .body .group-card > li {
228
+ height: 34px;
229
+ }
230
+ }
231
+ &.large {
232
+ .header .table th,
233
+ .footer .table td,
234
+ .body .grid-list > li,
235
+ .body .group-card > li {
236
+ height: 42px;
237
+ }
238
+ }
239
+ }
@@ -2,19 +2,19 @@
2
2
  * @Author: 焦质晔
3
3
  * @Date: 2022-03-16 19:05:30
4
4
  * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-11-29 10:34:35
5
+ * @Last Modified time: 2024-12-04 09:17:17
6
6
  */
7
7
  @import '../../style/common';
8
8
 
9
9
  .button-icon {
10
- display: inline-block;
10
+ display: inline-flex;
11
11
  text-align: center;
12
12
  text-transform: none;
13
13
  text-decoration: none;
14
14
  background: transparent;
15
15
  border: 0;
16
16
  outline: 0;
17
- line-height: 0;
17
+ line-height: 1;
18
18
  padding: 5px;
19
19
  color: @--text-color-placeholder;
20
20
  border-radius: @--border-radius-lg;
@@ -28,6 +28,10 @@
28
28
  .@{prefix-pivot-grid}__popper {
29
29
  .container {
30
30
  padding: 6px 15px;
31
+ &.scroll-y {
32
+ overflow-y: auto;
33
+ max-height: calc(100vh - 10px);
34
+ }
31
35
  & > .label {
32
36
  display: flex;
33
37
  justify-content: space-between;
@@ -70,6 +74,33 @@
70
74
  display: none;
71
75
  }
72
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
+ }
73
104
  }
74
105
  & > .add-record {
75
106
  display: flex;
@@ -1,7 +1,7 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2020-02-28 21:58:58
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2024-11-28 20:04:56
6
- */
7
- @prefix-pivot-grid: ~'@{qm-prefix}-pivot-grid';
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2020-02-28 21:58:58
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2024-11-28 20:04:56
6
+ */
7
+ @prefix-pivot-grid: ~'@{qm-prefix}-pivot-grid';
@@ -9,6 +9,7 @@ type IProps = {
9
9
  style?: CSSProperties;
10
10
  wrapClassName?: string;
11
11
  wrapStyle?: CSSProperties;
12
+ innerStyle?: CSSProperties;
12
13
  barWidth?: number;
13
14
  showTopScrollbar?: boolean;
14
15
  always?: boolean;