@bit-sun/business-component 4.0.13-alpha.9 → 4.2.0-alpha.1
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.
- package/.umirc.ts +21 -10
- package/dist/components/Business/BsSulaQueryTable/setting.d.ts +5 -2
- package/dist/components/Business/DetailPageWrapper/index.d.ts +6 -0
- package/dist/components/Business/ItemPropertySelector/index.d.ts +3 -0
- package/dist/components/Business/ModalUtils/index.d.ts +8 -0
- package/dist/components/Business/SearchSelect/utils.d.ts +4 -2
- package/dist/components/Business/columnSettingTable/columnSetting.d.ts +3 -2
- package/dist/components/Business/columnSettingTable/index.d.ts +19 -2
- package/dist/components/Business/columnSettingTable/sulaSettingTable.d.ts +20 -3
- package/dist/components/Functional/DataValidation/index.d.ts +11 -1
- package/dist/components/Functional/QueryMutipleInput/index.d.ts +2 -1
- package/dist/components/Functional/SearchSelect/utils.d.ts +2 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.esm.js +2233 -1001
- package/dist/index.js +2233 -1000
- package/dist/plugin/TableColumnSetting/index.d.ts +1 -0
- package/package.json +16 -14
- package/src/assets/btn-cancel.svg +3 -0
- package/src/assets/btn-copy.svg +3 -0
- package/src/assets/btn-delete.svg +2 -29
- package/src/assets/btn-edit.svg +2 -19
- package/src/assets/btn-hangUp.svg +3 -0
- package/src/assets/btn-print.svg +3 -0
- package/src/assets/btn-refresh.svg +3 -0
- package/src/assets/btn-unhook.svg +3 -0
- package/src/components/Business/AddSelectBusiness/index.md +8 -2
- package/src/components/Business/AddSelectBusiness/index.tsx +3 -0
- package/src/components/Business/BsLayouts/Components/GlobalHeader/index.less +1 -1
- package/src/components/Business/BsLayouts/Components/RightContent/home.less +1 -1
- package/src/components/Business/BsLayouts/Components/SearchFunc/index.less +2 -2
- package/src/components/Business/BsSulaQueryTable/SearchItemSetting.tsx +6 -4
- package/src/components/Business/BsSulaQueryTable/bssulaquerytable.less +0 -4
- package/src/components/Business/BsSulaQueryTable/index.less +5 -3
- package/src/components/Business/BsSulaQueryTable/index.md +45 -32
- package/src/components/Business/BsSulaQueryTable/index.tsx +153 -76
- package/src/components/Business/BsSulaQueryTable/setting.tsx +40 -10
- package/src/components/Business/BsSulaQueryTable/utils.less +1 -1
- package/src/components/Business/BsSulaQueryTable/utils.tsx +15 -12
- package/src/components/Business/CommodityEntry/index.md +1 -1
- package/src/components/Business/CommodityEntry/index.tsx +11 -9
- package/src/components/Business/DetailPageWrapper/index.less +1 -1
- package/src/components/Business/DetailPageWrapper/index.tsx +24 -5
- package/src/components/Business/DetailPageWrapper/utils.tsx +7 -2
- package/src/components/Business/HomePageWrapper/index.less +1 -1
- package/src/components/Business/ItemPropertySelector/index.tsx +88 -0
- package/src/components/Business/JsonQueryTable/function.ts +1 -1
- package/src/components/Business/ModalUtils/index.tsx +45 -0
- package/src/components/Business/SearchSelect/BusinessUtils.tsx +284 -57
- package/src/components/Business/SearchSelect/index.md +4 -4
- package/src/components/Business/SearchSelect/utils.ts +26 -4
- package/src/components/Business/columnSettingTable/columnSetting.tsx +27 -11
- package/src/components/Business/columnSettingTable/index.less +5 -3
- package/src/components/Business/columnSettingTable/index.md +200 -136
- package/src/components/Business/columnSettingTable/index.tsx +167 -39
- package/src/components/Business/columnSettingTable/sulaSettingTable.tsx +178 -47
- package/src/components/Functional/AddSelect/index.tsx +39 -12
- package/src/components/Functional/BillEntry/index.less +3 -0
- package/src/components/Functional/DataValidation/index.md +1 -0
- package/src/components/Functional/DataValidation/index.tsx +138 -23
- package/src/components/Functional/QueryMutipleInput/index.tsx +11 -2
- package/src/components/Functional/QueryMutipleSelect/index.tsx +2 -1
- package/src/components/Functional/SearchSelect/index.less +4 -0
- package/src/components/Functional/SearchSelect/index.tsx +61 -20
- package/src/components/Functional/SearchSelect/utils.tsx +13 -10
- package/src/components/Functional/TreeSearchSelect/index.tsx +2 -1
- package/src/components/Solution/RuleComponent/InnerSelect.tsx +1 -0
- package/src/components/Solution/RuleComponent/RenderCompItem.tsx +2 -1
- package/src/components/Solution/RuleComponent/index.js +74 -4
- package/src/components/Solution/RuleComponent/ruleFiled.js +1 -1
- package/src/index.ts +1 -0
- package/src/plugin/TableColumnSetting/index.less +5 -3
- package/src/plugin/TableColumnSetting/index.tsx +79 -12
- package/src/styles/bsDefault.less +9 -3
- package/src/utils/TableUtils.less +1 -1
- package/src/utils/request.ts +8 -4
- package/src/utils/utils.ts +11 -15
|
@@ -14,28 +14,39 @@ export default class ColumnSettingTable extends React.Component {
|
|
|
14
14
|
super(props);
|
|
15
15
|
this.state = {
|
|
16
16
|
showColumns: [],
|
|
17
|
+
selectedRowKeys: [], // 新增状态,用于跟踪选中的行的键
|
|
18
|
+
selectedRows: [],
|
|
19
|
+
showSummary: null
|
|
17
20
|
}
|
|
18
21
|
}
|
|
19
22
|
|
|
20
23
|
componentDidMount() {
|
|
21
|
-
const { columns }: any = this.props;
|
|
22
|
-
this.setInitialShowColumn(columns || [])
|
|
24
|
+
const { columns, updateSummary }: any = this.props;
|
|
25
|
+
this.setInitialShowColumn(columns || [], () => {
|
|
26
|
+
// 首次加载时调用 recalculateSummary 方法
|
|
27
|
+
this.recalculateSummary(updateSummary || '');
|
|
28
|
+
});
|
|
23
29
|
}
|
|
24
30
|
|
|
25
31
|
|
|
26
32
|
componentWillReceiveProps(nextProps: any) {
|
|
27
33
|
// if (JSON.stringify(this.props.columns) !== JSON.stringify(nextProps.columns)) {
|
|
28
34
|
// }
|
|
29
|
-
this.setInitialShowColumn(nextProps.columns || [])
|
|
30
|
-
|
|
35
|
+
this.setInitialShowColumn(nextProps.columns || [], () => {
|
|
36
|
+
this.recalculateSummary(nextProps.updateSummary);
|
|
37
|
+
});
|
|
38
|
+
if(nextProps.newUpdateSummary){
|
|
39
|
+
this.recalculateSummary(nextProps.newUpdateSummary);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
31
42
|
|
|
32
|
-
setInitialShowColumn = (columns: any[]) => {
|
|
43
|
+
setInitialShowColumn = (columns: any[], callback?: () => void) => {
|
|
33
44
|
// 获取当前列表定义数据
|
|
34
45
|
let columnConfig = this.getConfigFromlocalstorage();
|
|
35
46
|
let showColumns = getShowColumns(columns, columnConfig);
|
|
36
47
|
this.setState({
|
|
37
|
-
showColumns
|
|
38
|
-
})
|
|
48
|
+
showColumns
|
|
49
|
+
}, callback);
|
|
39
50
|
}
|
|
40
51
|
|
|
41
52
|
reSetInitialShowColumn = () => {
|
|
@@ -68,32 +79,97 @@ export default class ColumnSettingTable extends React.Component {
|
|
|
68
79
|
return [];
|
|
69
80
|
};
|
|
70
81
|
|
|
82
|
+
/**
|
|
83
|
+
* 新增函数,用于根据传入的小数位数进行四舍五入
|
|
84
|
+
* @param number
|
|
85
|
+
* @param decimalPlaces
|
|
86
|
+
* @returns
|
|
87
|
+
*/
|
|
88
|
+
roundToDecimalPlaces = (number: any, decimalPlaces: number) => {
|
|
89
|
+
const factor = Math.pow(10, (decimalPlaces || 2));
|
|
90
|
+
return Math.round(Number(number || 0) * factor) / factor;
|
|
91
|
+
};
|
|
92
|
+
|
|
93
|
+
/**
|
|
94
|
+
* 合计行逻辑
|
|
95
|
+
* @returns
|
|
96
|
+
*/
|
|
71
97
|
getTableSummaryInfo = () => {
|
|
72
|
-
const { summary = undefined, rowSelection, expandable }: any = this.props;
|
|
73
|
-
const { showColumns }
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
98
|
+
const { summary = undefined, rowSelection, expandable, modeType, dataSource, isSpecial = false, }: any = this.props;
|
|
99
|
+
const { showColumns } = this.state;
|
|
100
|
+
|
|
101
|
+
// 封装生成 summaryRow 的逻辑
|
|
102
|
+
const generateSummaryRow = () => {
|
|
103
|
+
if (rowSelection && expandable) {
|
|
104
|
+
return [{}, {}, ...showColumns];
|
|
105
|
+
} else if (rowSelection || expandable || isSpecial) {
|
|
106
|
+
return [{}, ...showColumns];
|
|
107
|
+
}
|
|
108
|
+
return [...showColumns];
|
|
109
|
+
};
|
|
110
|
+
|
|
111
|
+
const summaryRow = generateSummaryRow();
|
|
112
|
+
|
|
113
|
+
let summaryInitial: any = [];
|
|
114
|
+
// 完善判断逻辑
|
|
115
|
+
if (typeof summary === 'function') {
|
|
116
|
+
const summaryResult = summary();
|
|
117
|
+
if (summaryResult.diy && !Array.isArray(summaryResult)) {
|
|
118
|
+
summaryInitial = summaryResult.cont;
|
|
119
|
+
}
|
|
120
|
+
} else if (typeof summary === 'object' && summary !== null && summary.diy && !Array.isArray(summary)) {
|
|
121
|
+
summaryInitial = summary.cont;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
// let offset = 0;
|
|
125
|
+
let validSummaryRow = summaryRow;
|
|
126
|
+
// if(summaryInitial && summaryInitial.length > 0){
|
|
127
|
+
// summaryRow.filter((item) => {
|
|
128
|
+
// if (Object.keys(item).length === 0) {
|
|
129
|
+
// offset++;
|
|
130
|
+
// return false;
|
|
131
|
+
// }
|
|
132
|
+
// return true;
|
|
133
|
+
// });
|
|
134
|
+
// }
|
|
135
|
+
|
|
136
|
+
const summaryDom = (
|
|
137
|
+
<Table.Summary fixed>
|
|
138
|
+
<Table.Summary.Row>
|
|
139
|
+
{validSummaryRow.map((item, index) => {
|
|
140
|
+
const actualIndex = index;
|
|
141
|
+
let cellContent;
|
|
142
|
+
|
|
143
|
+
if (item.showTotal) {
|
|
144
|
+
cellContent = <Text type="danger">合计</Text>;
|
|
145
|
+
} else if (summaryInitial && summaryInitial.length > 0) {
|
|
146
|
+
const matchedItem = summaryInitial.find((inner: any) => inner.key === item.dataIndex || inner.key === item.key);
|
|
147
|
+
cellContent = <Text type="danger">{matchedItem ? matchedItem.value : ''}</Text>;
|
|
148
|
+
} else {
|
|
149
|
+
if (item.showSummary) {
|
|
150
|
+
const sum = dataSource.reduce((acc: any, record: any) => {
|
|
151
|
+
const value = record[item.dataIndex];
|
|
152
|
+
return acc + Number(value || 0);
|
|
153
|
+
}, 0);
|
|
154
|
+
const decimalPlaces = item.showDigit || 2;
|
|
155
|
+
const roundedSum = this.roundToDecimalPlaces(sum, decimalPlaces);
|
|
156
|
+
cellContent = <Text type="danger">{roundedSum}</Text>;
|
|
157
|
+
} else {
|
|
158
|
+
cellContent = <Text type="danger"></Text>;
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
|
|
81
162
|
return (
|
|
82
|
-
<Table.Summary.Cell index={
|
|
83
|
-
|
|
84
|
-
{
|
|
85
|
-
summaryInitial.filter((inner: any) => inner.key === item.dataIndex || inner.key === item.key).length ?
|
|
86
|
-
`${item.title}: ${summaryInitial.filter((inner: any) => inner.key === item.dataIndex || inner.key === item.key)[0].value}` : ''
|
|
87
|
-
|
|
88
|
-
}
|
|
89
|
-
</Text>
|
|
163
|
+
<Table.Summary.Cell index={item.showTotal ? actualIndex + 1 : actualIndex}>
|
|
164
|
+
{cellContent}
|
|
90
165
|
</Table.Summary.Cell>
|
|
91
|
-
)
|
|
92
|
-
})
|
|
93
|
-
|
|
94
|
-
</Table.Summary
|
|
95
|
-
|
|
96
|
-
|
|
166
|
+
);
|
|
167
|
+
})}
|
|
168
|
+
</Table.Summary.Row>
|
|
169
|
+
</Table.Summary>
|
|
170
|
+
);
|
|
171
|
+
|
|
172
|
+
return () => summaryDom;
|
|
97
173
|
};
|
|
98
174
|
|
|
99
175
|
handledynamicColumns = (col: any[]) => {
|
|
@@ -154,19 +230,52 @@ export default class ColumnSettingTable extends React.Component {
|
|
|
154
230
|
}
|
|
155
231
|
};
|
|
156
232
|
|
|
233
|
+
/**
|
|
234
|
+
* 处理行点击事件
|
|
235
|
+
* @param record
|
|
236
|
+
*/
|
|
237
|
+
handleRowClick = (record: any) => {
|
|
238
|
+
const { selectedRowKeys, selectedRows, } = this.state;
|
|
239
|
+
const { rowKey }: any = this.props;
|
|
240
|
+
let newSelectedRowKeys = [...selectedRowKeys];
|
|
241
|
+
let newSelectedRows = [...selectedRows];
|
|
242
|
+
|
|
243
|
+
const keyIndex = newSelectedRowKeys.indexOf(record[rowKey]);
|
|
244
|
+
if (keyIndex > -1) {
|
|
245
|
+
// 如果已经选中,则取消选中
|
|
246
|
+
newSelectedRowKeys.splice(keyIndex, 1);
|
|
247
|
+
newSelectedRows.splice(keyIndex, 1);
|
|
248
|
+
} else {
|
|
249
|
+
// 如果未选中,则添加到选中列表
|
|
250
|
+
newSelectedRowKeys.push(record[rowKey]);
|
|
251
|
+
newSelectedRows.push(record);
|
|
252
|
+
}
|
|
253
|
+
this.setState({
|
|
254
|
+
selectedRowKeys: newSelectedRowKeys,
|
|
255
|
+
selectedRows: newSelectedRows,
|
|
256
|
+
});
|
|
257
|
+
|
|
258
|
+
// 手动调用外部传入的 onChange 函数
|
|
259
|
+
const { rowSelection }: any = this.props;
|
|
260
|
+
if (rowSelection && typeof rowSelection.onChange === 'function') {
|
|
261
|
+
// 直接将 record 作为数组元素传递
|
|
262
|
+
rowSelection.onChange(newSelectedRowKeys, newSelectedRows);
|
|
263
|
+
}
|
|
264
|
+
};
|
|
265
|
+
|
|
266
|
+
recalculateSummary = (nextProps: any) => {
|
|
267
|
+
if (this.state.showColumns.length) {
|
|
268
|
+
const showSummary = this.getTableSummaryInfo();
|
|
269
|
+
this.setState({ showSummary });
|
|
270
|
+
}
|
|
271
|
+
};
|
|
272
|
+
|
|
157
273
|
render() {
|
|
158
|
-
const { columns, tableCode, appRequestConfig, summary = undefined, dynamicColumns = [], scroll={}, ...restProps }: any = this.props;
|
|
274
|
+
const { columns, tableCode, appRequestConfig, summary = undefined, dynamicColumns = [], scroll={}, rowSelection: propRowSelection, ...restProps }: any = this.props;
|
|
159
275
|
let otherTableInfo = {
|
|
160
276
|
...restProps,
|
|
161
277
|
};
|
|
162
|
-
|
|
163
|
-
if (this.state.showColumns.length && !Array.isArray(summary)) {
|
|
164
|
-
if (summary && summary().diy) {
|
|
165
|
-
showSummary = this.getTableSummaryInfo();
|
|
166
|
-
} else {
|
|
167
|
-
showSummary = summary;
|
|
168
|
-
}
|
|
169
|
-
};
|
|
278
|
+
const { showSummary } = this.state;
|
|
170
279
|
|
|
171
280
|
const handleColumns = (arr: any, indexArr: any[]) => {
|
|
172
281
|
arr.forEach((item: any, index: any) => {
|
|
@@ -195,6 +304,7 @@ export default class ColumnSettingTable extends React.Component {
|
|
|
195
304
|
showCol = this.handledynamicColumns(showCol);
|
|
196
305
|
}
|
|
197
306
|
|
|
307
|
+
|
|
198
308
|
otherTableInfo = {
|
|
199
309
|
...otherTableInfo,
|
|
200
310
|
scroll: {
|
|
@@ -202,6 +312,24 @@ export default class ColumnSettingTable extends React.Component {
|
|
|
202
312
|
...scroll,
|
|
203
313
|
x: restProps.overScrollX || this.getTableScrollXWidth(showCol)
|
|
204
314
|
},
|
|
315
|
+
rowSelection: propRowSelection ? {
|
|
316
|
+
...propRowSelection,
|
|
317
|
+
selectedRowKeys: this.state.selectedRowKeys,
|
|
318
|
+
onChange: (selectedRowKeys: any, selectedRows: any) => {
|
|
319
|
+
this.setState({
|
|
320
|
+
selectedRowKeys,
|
|
321
|
+
selectedRows
|
|
322
|
+
});
|
|
323
|
+
if (propRowSelection && propRowSelection.onChange) {
|
|
324
|
+
propRowSelection.onChange(selectedRowKeys, selectedRows);
|
|
325
|
+
}
|
|
326
|
+
},
|
|
327
|
+
} : false,
|
|
328
|
+
onRow: (record: any) => {
|
|
329
|
+
return {
|
|
330
|
+
onClick: () => this.handleRowClick(record), // 绑定行点击事件
|
|
331
|
+
};
|
|
332
|
+
},
|
|
205
333
|
...(
|
|
206
334
|
showSummary ? { summary: showSummary } : {}
|
|
207
335
|
)
|
|
@@ -14,35 +14,46 @@ import TableSumComponent from './components/TableSumComponent';
|
|
|
14
14
|
const { Text } = Typography;
|
|
15
15
|
|
|
16
16
|
export default class ColumnSettingSulaTable extends React.Component {
|
|
17
|
-
sulaTableRef: React.RefObject<
|
|
17
|
+
sulaTableRef: React.RefObject<any>;
|
|
18
18
|
state: any;
|
|
19
19
|
constructor(props: any) {
|
|
20
20
|
super(props);
|
|
21
21
|
this.state = {
|
|
22
22
|
showColumns: [],
|
|
23
|
+
selectedRowKeys: [], // 新增状态,用于跟踪选中的行的键
|
|
24
|
+
selectedRows: [],
|
|
25
|
+
showSummary: null
|
|
23
26
|
}
|
|
24
|
-
this.sulaTableRef = React.createRef();
|
|
27
|
+
this.sulaTableRef = React.createRef<any>();
|
|
25
28
|
}
|
|
26
29
|
|
|
27
30
|
componentDidMount() {
|
|
28
|
-
const { columns }: any = this.props;
|
|
29
|
-
this.setInitialShowColumn(columns || [])
|
|
31
|
+
const { columns, updateSummary }: any = this.props;
|
|
32
|
+
this.setInitialShowColumn(columns || [], () => {
|
|
33
|
+
// 首次加载时调用 recalculateSummary 方法
|
|
34
|
+
this.recalculateSummary(updateSummary || '');
|
|
35
|
+
});
|
|
30
36
|
}
|
|
31
37
|
|
|
32
38
|
componentWillReceiveProps(nextProps: any) {
|
|
33
39
|
// if (JSON.stringify(this.props.columns) !== JSON.stringify(nextProps.columns)) {
|
|
34
40
|
// }
|
|
35
|
-
this.setInitialShowColumn(nextProps.columns || [])
|
|
36
|
-
}
|
|
37
41
|
|
|
38
|
-
|
|
42
|
+
this.setInitialShowColumn(nextProps.columns || [], () => {
|
|
43
|
+
this.recalculateSummary(nextProps.updateSummary);
|
|
44
|
+
});
|
|
45
|
+
if(nextProps.newUpdateSummary){
|
|
46
|
+
this.recalculateSummary(nextProps.newUpdateSummary);
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
|
|
50
|
+
setInitialShowColumn = (columns: any[], callback?: () => void) => {
|
|
39
51
|
// 获取当前列表定义数据
|
|
40
52
|
let columnConfig = this.getConfigFromlocalstorage();
|
|
41
53
|
let showColumns = getShowColumns(columns, columnConfig);
|
|
42
54
|
this.setState({
|
|
43
|
-
|
|
44
|
-
})
|
|
45
|
-
|
|
55
|
+
showColumns
|
|
56
|
+
}, callback);
|
|
46
57
|
}
|
|
47
58
|
|
|
48
59
|
setShowColumns = (newColumns: Array<any>) => {
|
|
@@ -66,34 +77,100 @@ export default class ColumnSettingSulaTable extends React.Component {
|
|
|
66
77
|
return [];
|
|
67
78
|
};
|
|
68
79
|
|
|
80
|
+
/**
|
|
81
|
+
* 新增函数,用于根据传入的小数位数进行四舍五入
|
|
82
|
+
* @param number
|
|
83
|
+
* @param decimalPlaces
|
|
84
|
+
* @returns
|
|
85
|
+
*/
|
|
86
|
+
roundToDecimalPlaces = (number: any, decimalPlaces: number) => {
|
|
87
|
+
const factor = Math.pow(10, (decimalPlaces || 2));
|
|
88
|
+
return Math.round(Number(number || 0) * factor) / factor;
|
|
89
|
+
};
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* 合计行逻辑
|
|
93
|
+
* @returns
|
|
94
|
+
*/
|
|
69
95
|
getTableSummaryInfo = () => {
|
|
70
|
-
const { summary = undefined, rowSelection, expandable }: any = this.props;
|
|
71
|
-
const { showColumns }
|
|
72
|
-
// let summaryRow = rowSelection ? [{}, ...showColumns] : [...showColumns];
|
|
73
|
-
let summaryRow = rowSelection && expandable ? [{}, {}, ...showColumns] : rowSelection || expandable ? [{}, ...showColumns] : [...showColumns]; //兼容table配置展开expandable属性导致汇总列位置不对的问题
|
|
74
|
-
let summaryInitial = summary().cont;
|
|
75
|
-
let summaryDom: any = <Table.Summary fixed>
|
|
76
|
-
<Table.Summary.Row>
|
|
77
|
-
{
|
|
78
|
-
[...summaryRow].map((item: any, index: number) => {
|
|
79
|
-
return (
|
|
80
|
-
<Table.Summary.Cell index={index}>
|
|
81
|
-
<Text type="danger">
|
|
82
|
-
{
|
|
83
|
-
summaryInitial.filter((inner: any) => inner.key === item.dataIndex || inner.key === item.key).length ?
|
|
84
|
-
`${item.title}: ${summaryInitial.filter((inner: any) => inner.key === item.dataIndex || inner.key === item.key)[0].value}` : ''
|
|
96
|
+
const { summary = undefined, rowSelection, expandable, isSpecial = false, modeType }: any = this.props;
|
|
97
|
+
const { showColumns } = this.state;
|
|
85
98
|
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
99
|
+
const generateSummaryRow = () => {
|
|
100
|
+
if (rowSelection && expandable) {
|
|
101
|
+
return [{}, {}, ...showColumns];
|
|
102
|
+
} else if (rowSelection || expandable || isSpecial) {
|
|
103
|
+
return [{}, ...showColumns];
|
|
104
|
+
}
|
|
105
|
+
return [...showColumns];
|
|
106
|
+
};
|
|
107
|
+
|
|
108
|
+
const summaryRow = generateSummaryRow();
|
|
109
|
+
|
|
110
|
+
let summaryInitial: any = [];
|
|
111
|
+
// 完善判断逻辑
|
|
112
|
+
if (typeof summary === 'function') {
|
|
113
|
+
const summaryResult = summary();
|
|
114
|
+
if (summaryResult.diy && !Array.isArray(summaryResult)) {
|
|
115
|
+
summaryInitial = summaryResult.cont;
|
|
116
|
+
}
|
|
117
|
+
} else if (typeof summary === 'object' && summary !== null && summary.diy && !Array.isArray(summary)) {
|
|
118
|
+
summaryInitial = summary.cont;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
//let offset = 0;
|
|
122
|
+
let validSummaryRow = summaryRow;
|
|
123
|
+
// if (summaryInitial && summaryInitial.length > 0) {
|
|
124
|
+
// summaryRow.filter((item) => {
|
|
125
|
+
// if (Object.keys(item).length === 0) {
|
|
126
|
+
// offset++;
|
|
127
|
+
// return false;
|
|
128
|
+
// }
|
|
129
|
+
// return true;
|
|
130
|
+
// });
|
|
131
|
+
// }
|
|
132
|
+
|
|
133
|
+
const dataSource = this.sulaTableRef?.current?.getDataSource() || [];
|
|
134
|
+
|
|
135
|
+
const summaryDom = (
|
|
136
|
+
<Table.Summary fixed>
|
|
137
|
+
<Table.Summary.Row>
|
|
138
|
+
{validSummaryRow.map((item, index) => {
|
|
139
|
+
const actualIndex = index;
|
|
140
|
+
let cellContent;
|
|
96
141
|
|
|
142
|
+
if (item.showTotal) {
|
|
143
|
+
cellContent = <Text type="danger">合计</Text>;
|
|
144
|
+
} else if (summaryInitial && summaryInitial.length > 0) {
|
|
145
|
+
const matchedItem = summaryInitial.find((inner: any) => inner.key === item.dataIndex || inner.key === item.key);
|
|
146
|
+
cellContent = <Text type="danger">{matchedItem ? matchedItem.value : ''}</Text>;
|
|
147
|
+
} else {
|
|
148
|
+
if (item.showSummary) {
|
|
149
|
+
const sum = dataSource.reduce((acc: any, record: any) => {
|
|
150
|
+
const value = record[item.dataIndex];
|
|
151
|
+
return acc + Number(value || 0);
|
|
152
|
+
}, 0);
|
|
153
|
+
const decimalPlaces = item.showDigit || 2;
|
|
154
|
+
const roundedSum = this.roundToDecimalPlaces(sum, decimalPlaces);
|
|
155
|
+
cellContent = <Text type="danger">{roundedSum}</Text>;
|
|
156
|
+
} else {
|
|
157
|
+
cellContent = <Text type="danger"></Text>;
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
return (
|
|
162
|
+
<Table.Summary.Cell index={item.showTotal ? actualIndex + 1 : actualIndex}>
|
|
163
|
+
{cellContent}
|
|
164
|
+
</Table.Summary.Cell>
|
|
165
|
+
);
|
|
166
|
+
})}
|
|
167
|
+
</Table.Summary.Row>
|
|
168
|
+
</Table.Summary>
|
|
169
|
+
);
|
|
170
|
+
|
|
171
|
+
return () => summaryDom;
|
|
172
|
+
};
|
|
173
|
+
|
|
97
174
|
handledynamicColumns = (col: any[]) => {
|
|
98
175
|
let { dynamicColumns, modeType }: any = this.props;
|
|
99
176
|
col = col.map((item: any) => {
|
|
@@ -181,7 +258,7 @@ export default class ColumnSettingSulaTable extends React.Component {
|
|
|
181
258
|
onResize(e, data);
|
|
182
259
|
}
|
|
183
260
|
};
|
|
184
|
-
|
|
261
|
+
|
|
185
262
|
useEffect(() => {
|
|
186
263
|
if (width !== prevWidthRef.current) {
|
|
187
264
|
prevWidthRef.current = width;
|
|
@@ -254,19 +331,53 @@ export default class ColumnSettingSulaTable extends React.Component {
|
|
|
254
331
|
}
|
|
255
332
|
};
|
|
256
333
|
|
|
334
|
+
/**
|
|
335
|
+
* 处理行点击事件
|
|
336
|
+
* @param record
|
|
337
|
+
*/
|
|
338
|
+
handleRowClick = (record: any) => {
|
|
339
|
+
const { selectedRowKeys, selectedRows, } = this.state;
|
|
340
|
+
const { rowKey }: any = this.props;
|
|
341
|
+
let newSelectedRowKeys = [...selectedRowKeys];
|
|
342
|
+
let newSelectedRows = [...selectedRows];
|
|
343
|
+
|
|
344
|
+
const keyIndex = newSelectedRowKeys.indexOf(record[rowKey]);
|
|
345
|
+
if (keyIndex > -1) {
|
|
346
|
+
// 如果已经选中,则取消选中
|
|
347
|
+
newSelectedRowKeys.splice(keyIndex, 1);
|
|
348
|
+
newSelectedRows.splice(keyIndex, 1);
|
|
349
|
+
} else {
|
|
350
|
+
// 如果未选中,则添加到选中列表
|
|
351
|
+
newSelectedRowKeys.push(record[rowKey]);
|
|
352
|
+
newSelectedRows.push(record);
|
|
353
|
+
}
|
|
354
|
+
this.setState({
|
|
355
|
+
selectedRowKeys: newSelectedRowKeys,
|
|
356
|
+
selectedRows: newSelectedRows,
|
|
357
|
+
});
|
|
358
|
+
|
|
359
|
+
// 手动调用外部传入的 onChange 函数
|
|
360
|
+
const { rowSelection }: any = this.props;
|
|
361
|
+
if (rowSelection && typeof rowSelection.onChange === 'function') {
|
|
362
|
+
// 直接将 record 作为数组元素传递
|
|
363
|
+
rowSelection.onChange(newSelectedRowKeys, newSelectedRows);
|
|
364
|
+
}
|
|
365
|
+
};
|
|
366
|
+
|
|
367
|
+
recalculateSummary = (nextProps: any) => {
|
|
368
|
+
if (this.state.showColumns.length) {
|
|
369
|
+
const showSummary = this.getTableSummaryInfo();
|
|
370
|
+
this.setState({ showSummary });
|
|
371
|
+
}
|
|
372
|
+
};
|
|
373
|
+
|
|
257
374
|
render() {
|
|
258
|
-
const { style=null, columns, tableCode, appRequestConfig, summary = undefined, dynamicColumns = [], scroll={}, ...restProps }: any = this.props;
|
|
375
|
+
const { style=null, columns, tableCode, appRequestConfig, summary = undefined, dynamicColumns = [], scroll={}, rowSelection: propRowSelection, ...restProps }: any = this.props;
|
|
259
376
|
let otherTableInfo = {
|
|
260
377
|
...restProps,
|
|
261
378
|
};
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
if (summary && summary().diy) {
|
|
265
|
-
showSummary = this.getTableSummaryInfo();
|
|
266
|
-
} else {
|
|
267
|
-
showSummary = summary;
|
|
268
|
-
}
|
|
269
|
-
};
|
|
379
|
+
|
|
380
|
+
const { showSummary } = this.state;
|
|
270
381
|
|
|
271
382
|
const handleColumns = (arr: any, indexArr: any[]) => {
|
|
272
383
|
arr.forEach((item: any, index: any) => {
|
|
@@ -292,7 +403,7 @@ export default class ColumnSettingSulaTable extends React.Component {
|
|
|
292
403
|
handleColumns(showCol, []);
|
|
293
404
|
if (dynamicColumns.length) {
|
|
294
405
|
showCol = this.handledynamicColumns(showCol);
|
|
295
|
-
}
|
|
406
|
+
};
|
|
296
407
|
|
|
297
408
|
otherTableInfo = {
|
|
298
409
|
...otherTableInfo,
|
|
@@ -304,8 +415,28 @@ export default class ColumnSettingSulaTable extends React.Component {
|
|
|
304
415
|
sticky: true,
|
|
305
416
|
...(
|
|
306
417
|
showSummary ? { summary: showSummary } : {}
|
|
307
|
-
)
|
|
418
|
+
),
|
|
419
|
+
rowSelection: propRowSelection ? {
|
|
420
|
+
...propRowSelection,
|
|
421
|
+
selectedRowKeys: this.state.selectedRowKeys,
|
|
422
|
+
onChange: (selectedRowKeys: any, selectedRows: any) => {
|
|
423
|
+
this.setState({
|
|
424
|
+
selectedRowKeys,
|
|
425
|
+
selectedRows
|
|
426
|
+
});
|
|
427
|
+
if (propRowSelection && propRowSelection.onChange) {
|
|
428
|
+
propRowSelection.onChange(selectedRowKeys, selectedRows);
|
|
429
|
+
}
|
|
430
|
+
},
|
|
431
|
+
} : false,
|
|
432
|
+
onRow: (record: any) => {
|
|
433
|
+
return {
|
|
434
|
+
onClick: () => this.handleRowClick(record), // 绑定行点击事件
|
|
435
|
+
//onDoubleClick: () => this.handleRowDoubleClick(record), // 绑定行点击事件
|
|
436
|
+
};
|
|
437
|
+
},
|
|
308
438
|
}
|
|
439
|
+
|
|
309
440
|
return (
|
|
310
441
|
<div style={{ position: 'relative' }}>
|
|
311
442
|
<span style={{ position: 'absolute', zIndex: '10', right: '8px', top: '10px' }} className="ant-dropdown-link">
|
|
@@ -87,16 +87,18 @@ const AddSelect = (props: any) => {
|
|
|
87
87
|
tableCodeList = [], // 非必填 默认取组件定义code,如需自定义----数组第一位为供选择商品的table的code,第二位为已选择商品的table的code
|
|
88
88
|
businessType = 'sku',
|
|
89
89
|
isAllowRepeatedSelect = false,
|
|
90
|
-
clearTitle
|
|
90
|
+
clearTitle,
|
|
91
|
+
batchFormatCallback,
|
|
92
|
+
batchFormatBtnTitle,
|
|
91
93
|
} = props;
|
|
92
|
-
const { url, otherParams, isMap, mappingValueField = 'code' } = requestConfig || {};
|
|
94
|
+
const { url, method = 'get', sourceKey, otherParams, isMap, mappingValueField = 'code', extralHeaders = {} } = requestConfig || {};
|
|
93
95
|
const realButtonProps = {type: "primary", ...buttonProps};
|
|
94
96
|
const selectRowKey = isAllowRepeatedSelect ? 'uuid' : mappingValueField
|
|
95
97
|
|
|
96
98
|
const selectMode = selectProps?.mode // 设定当前选择器 为单选或者多选模式 无设定为单选模式(默认)
|
|
97
99
|
const initVal = value || (selectMode ? [] : null);
|
|
98
100
|
const pageSize = 100 // 下拉框默认分页 条数
|
|
99
|
-
const tableInitPageSize = 10 // 弹框默认分页 条数
|
|
101
|
+
const tableInitPageSize = modalTableProps?.topTablePagination?.pageSize || 10 // 弹框默认分页 条数
|
|
100
102
|
const currentPage = 1
|
|
101
103
|
|
|
102
104
|
const [fetching, setFetching] = useState(false);
|
|
@@ -108,7 +110,7 @@ const AddSelect = (props: any) => {
|
|
|
108
110
|
const [tableSearchForm, setTableSearchForm] = useState<Array<SearchFormItem>>(modalTableProps?.tableSearchForm)
|
|
109
111
|
const [caretLeftFlag, setCaretLeftFlag] = useState(true);
|
|
110
112
|
const [tableData, setTableData] = useState([]);
|
|
111
|
-
const [tablePagination, setTablePagination] = useState({ total: 0, size: "small", current: 1, pageSize: tableInitPageSize })
|
|
113
|
+
const [tablePagination, setTablePagination] = useState({ total: 0, size: "small", current: 1, pageSize: tableInitPageSize, ...(modalTableProps?.topTablePagination) })
|
|
112
114
|
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
|
|
113
115
|
const [tableFormParams, setTableFormParams] = useState({});
|
|
114
116
|
const [confirmLoading, setConfirmLoading] = useState(false);
|
|
@@ -214,9 +216,16 @@ const AddSelect = (props: any) => {
|
|
|
214
216
|
// precision: unitAccuracy
|
|
215
217
|
}
|
|
216
218
|
}
|
|
219
|
+
// 如果属性为函数时,则执行该函数
|
|
220
|
+
const inputProps = Object.keys(item?.inputProps || {})?.reduce((acc, key) => {
|
|
221
|
+
const value = item?.inputProps?.[key];
|
|
222
|
+
acc[key] = typeof value === 'function' ? value?.(record) : value;
|
|
223
|
+
return acc;
|
|
224
|
+
}, {});
|
|
225
|
+
|
|
217
226
|
return (
|
|
218
227
|
<InputNumber
|
|
219
|
-
{...
|
|
228
|
+
{...inputProps}
|
|
220
229
|
value={text || ''}
|
|
221
230
|
min={0}
|
|
222
231
|
autoFocus={record.needFocus}
|
|
@@ -518,9 +527,18 @@ const AddSelect = (props: any) => {
|
|
|
518
527
|
}
|
|
519
528
|
})
|
|
520
529
|
}
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
530
|
+
|
|
531
|
+
let getRequest;
|
|
532
|
+
const methodName = method?.toLocaleLowerCase?.();
|
|
533
|
+
if(['post','patch','put'].includes(methodName)) {
|
|
534
|
+
getRequest = request[methodName](`${url}`,queryParams, { headers: { ...extralHeaders }})
|
|
535
|
+
} else {
|
|
536
|
+
getRequest = request.get( `${url}${url.includes("?")?"&":"?"}${stringify(queryParams)}`,{headers: { ...extralHeaders }})
|
|
537
|
+
}
|
|
538
|
+
|
|
539
|
+
if (!url || !getRequest) return;
|
|
540
|
+
|
|
541
|
+
getRequest.then((result: any) => {
|
|
524
542
|
setFetching(false)
|
|
525
543
|
result = result.data;
|
|
526
544
|
if (judgeIsRequestError(result)) {
|
|
@@ -537,7 +555,7 @@ const AddSelect = (props: any) => {
|
|
|
537
555
|
};
|
|
538
556
|
});
|
|
539
557
|
} else {
|
|
540
|
-
const keys = res.list ? 'list' : 'items';
|
|
558
|
+
const keys = sourceKey ? sourceKey :res.list ? 'list' : 'items';
|
|
541
559
|
source = res
|
|
542
560
|
? res[keys]
|
|
543
561
|
? res[keys].map((item: any) => {
|
|
@@ -557,7 +575,8 @@ const AddSelect = (props: any) => {
|
|
|
557
575
|
})
|
|
558
576
|
: [];
|
|
559
577
|
}
|
|
560
|
-
|
|
578
|
+
// 数据源 不可以有重复key
|
|
579
|
+
source = Array.isArray(source) ? _.uniqBy(source, 'value') : [];
|
|
561
580
|
|
|
562
581
|
setTableData(source)
|
|
563
582
|
setTablePagination({ ...tablePagination, total: Number(res?.total || res?.totalCount || source.length), pageSize: Number(res?.size || res?.pageSize || (params?.pageSize || pageSize)), current: Number(res?.page || res?.currentPage || (params?.currentPage || currentPage)) })
|
|
@@ -605,6 +624,11 @@ const AddSelect = (props: any) => {
|
|
|
605
624
|
}, 50)
|
|
606
625
|
};
|
|
607
626
|
|
|
627
|
+
// 将格式化完的数据回显到 表格中
|
|
628
|
+
const batchFormatCallbackHandler = () => {
|
|
629
|
+
setPopValue([...batchFormatCallback?.(popvalue)]);
|
|
630
|
+
}
|
|
631
|
+
|
|
608
632
|
const handleShowModal = () => {
|
|
609
633
|
if(beforeShowModal) {
|
|
610
634
|
beforeShowModal(popvalue).then(res => {
|
|
@@ -940,7 +964,7 @@ const AddSelect = (props: any) => {
|
|
|
940
964
|
</div>
|
|
941
965
|
{isModalVisible && (
|
|
942
966
|
<Modal
|
|
943
|
-
width=
|
|
967
|
+
width={`calc(100% - 320px)`}
|
|
944
968
|
style={{ top: 20 }}
|
|
945
969
|
bodyStyle={{ padding: '0px' }}
|
|
946
970
|
visible={isModalVisible}
|
|
@@ -1039,7 +1063,10 @@ const AddSelect = (props: any) => {
|
|
|
1039
1063
|
settingImgAttribute={{ width: 20, style: { marginTop: -2 } }}
|
|
1040
1064
|
/>
|
|
1041
1065
|
</span>
|
|
1042
|
-
<div style={{ marginRight: 8
|
|
1066
|
+
<div style={{ marginRight: 8, display: 'flex', gap: '5px' }}>
|
|
1067
|
+
<span hidden={!batchFormatCallback} onClick={batchFormatCallbackHandler} style={{ cursor: 'pointer' }}>{batchFormatBtnTitle ?? '一键填充'}</span>
|
|
1068
|
+
<span onClick={deleteSelectRows} style={{ ...themeColor, cursor: 'pointer' }}>{clearTitle ?? '清空所选商品'}</span>
|
|
1069
|
+
</div>
|
|
1043
1070
|
</div>
|
|
1044
1071
|
</div>
|
|
1045
1072
|
<Table
|