udp-react-enterprise-component-library 26.6.0-beta.0 → 26.6.0-beta.2
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/dist/.tsbuildinfo +1 -1
- package/dist/UI/inputs/fieldArrayCard/DateRangeField.d.ts +1 -0
- package/dist/UI/inputs/fieldArrayCard/DateRangeField.d.ts.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/DateRangeField.js +5 -4
- package/dist/UI/inputs/fieldArrayCard/DateRangeField.js.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/DateRangeField.mjs +78 -70
- package/dist/UI/inputs/fieldArrayCard/DateRangeField.mjs.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/FieldArrayCard.d.ts.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/FieldArrayCard.js +38 -47
- package/dist/UI/inputs/fieldArrayCard/FieldArrayCard.js.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/FieldArrayCard.mjs +149 -136
- package/dist/UI/inputs/fieldArrayCard/FieldArrayCard.mjs.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/SearchSideSheet.d.ts.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/SearchSideSheet.js +102 -63
- package/dist/UI/inputs/fieldArrayCard/SearchSideSheet.js.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/SearchSideSheet.mjs +120 -190
- package/dist/UI/inputs/fieldArrayCard/SearchSideSheet.mjs.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/fieldArrayCardEnum.d.ts +2 -1
- package/dist/UI/inputs/fieldArrayCard/fieldArrayCardEnum.d.ts.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/fieldArrayCardEnum.js +1 -0
- package/dist/UI/inputs/fieldArrayCard/fieldArrayCardEnum.js.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/fieldArrayCardEnum.mjs +1 -0
- package/dist/UI/inputs/fieldArrayCard/fieldArrayCardEnum.mjs.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/index.d.ts +0 -1
- package/dist/UI/inputs/fieldArrayCard/index.d.ts.map +1 -1
- package/dist/UI/inputs/fieldArrayCard/index.js +0 -1
- package/dist/UI/inputs/fieldArrayCard/index.js.map +1 -1
- package/package.json +1 -5
- package/dist/UI/inputs/fieldArrayCard/AutocompleteFinalField.d.ts +0 -5
- package/dist/UI/inputs/fieldArrayCard/AutocompleteFinalField.d.ts.map +0 -1
- package/dist/UI/inputs/fieldArrayCard/AutocompleteFinalField.js +0 -26
- package/dist/UI/inputs/fieldArrayCard/AutocompleteFinalField.js.map +0 -1
- package/dist/UI/inputs/fieldArrayCard/AutocompleteFinalField.mjs +0 -59
- package/dist/UI/inputs/fieldArrayCard/AutocompleteFinalField.mjs.map +0 -1
|
@@ -1,35 +1,34 @@
|
|
|
1
|
-
import React, { useCallback, useMemo,
|
|
1
|
+
import React, { useCallback, useMemo, useRef } from 'react';
|
|
2
2
|
import { useTranslation } from 'react-i18next';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
3
|
+
import { ServerSideUdpGrid } from '../../templates/newGrid/ServerSideUdpGrid';
|
|
4
|
+
import { useApiMutation } from '../../../utilities/useApiMutation';
|
|
5
5
|
import { FilterOperators } from '../../../models/SearchOperator';
|
|
6
|
-
import {
|
|
7
|
-
|
|
8
|
-
const SearchSideSheet = props => {
|
|
9
|
-
const { open, handleClose, exclude, title, productApiBase, searchApi, colDefs = [], gridTitle, idField, formIdField, handleSearch, width = '800px', height = '
|
|
10
|
-
const [selectedData, setSelectedData] = useState([]);
|
|
6
|
+
import { UdpDrawer, UdpButton } from '../../fluent-web-components';
|
|
7
|
+
const EMPTY_FILTERS = [];
|
|
8
|
+
const SearchSideSheet = (props) => {
|
|
9
|
+
const { open, handleClose, exclude, title, productApiBase, searchApi, colDefs = [], gridTitle, idField, formIdField, handleSearch, searchBarFieldName, defaultFilters = EMPTY_FILTERS, width = '800px', height = '70vh' } = props;
|
|
11
10
|
const { t } = useTranslation();
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
const onSelectionChanged = useCallback(() => {
|
|
11
|
+
const gridApiRef = useRef(null);
|
|
12
|
+
const { mutateAsync: searchData } = useApiMutation(productApiBase, searchApi, { method: 'POST' });
|
|
13
|
+
const handleGridApiCallback = useCallback((api) => {
|
|
14
|
+
gridApiRef.current = api;
|
|
15
|
+
}, []);
|
|
16
|
+
const handleCloseSideSheet = useCallback((save = false) => {
|
|
19
17
|
var _a;
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
18
|
+
var _b;
|
|
19
|
+
let data = [];
|
|
20
|
+
if (save) {
|
|
21
|
+
data = (_b = (_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.getSelectedRows()) !== null && _b !== void 0 ? _b : [];
|
|
22
|
+
}
|
|
24
23
|
handleClose(data);
|
|
25
|
-
setSelectedData([]);
|
|
26
24
|
}, [handleClose]);
|
|
27
25
|
const dataSource = useMemo(() => ({
|
|
28
|
-
getRows: async ({ request, success, fail }) => {
|
|
26
|
+
getRows: async ({ request, success, fail, api }) => {
|
|
29
27
|
var _a, _b;
|
|
30
28
|
var _c;
|
|
29
|
+
const pageSize = api.getGridOption('paginationPageSize');
|
|
31
30
|
if (handleSearch) {
|
|
32
|
-
handleSearch(
|
|
31
|
+
handleSearch(pageSize, request, success, fail);
|
|
33
32
|
return;
|
|
34
33
|
}
|
|
35
34
|
const filterElements = (request === null || request === void 0 ? void 0 : request.filterModel)
|
|
@@ -37,16 +36,19 @@ const SearchSideSheet = props => {
|
|
|
37
36
|
return {
|
|
38
37
|
searchField: key,
|
|
39
38
|
searchOperator: FilterOperators[value === null || value === void 0 ? void 0 : value.type],
|
|
40
|
-
searchValue: value === null || value === void 0 ? void 0 : value.filter
|
|
39
|
+
searchValue: value === null || value === void 0 ? void 0 : value.filter
|
|
41
40
|
};
|
|
42
41
|
})
|
|
43
42
|
: [];
|
|
43
|
+
if ((defaultFilters === null || defaultFilters === void 0 ? void 0 : defaultFilters.length) > 0) {
|
|
44
|
+
filterElements.push(...defaultFilters);
|
|
45
|
+
}
|
|
44
46
|
const orderElements = (request === null || request === void 0 ? void 0 : request.sortModel)
|
|
45
|
-
? (_b = request.sortModel) === null || _b === void 0 ? void 0 : _b.map(sortObj => {
|
|
47
|
+
? (_b = request.sortModel) === null || _b === void 0 ? void 0 : _b.map((sortObj) => {
|
|
46
48
|
var _a;
|
|
47
49
|
return {
|
|
48
50
|
sortColumn: sortObj === null || sortObj === void 0 ? void 0 : sortObj.colId,
|
|
49
|
-
sortDirection: (_a = sortObj === null || sortObj === void 0 ? void 0 : sortObj.sort) === null || _a === void 0 ? void 0 : _a.toUpperCase()
|
|
51
|
+
sortDirection: (_a = sortObj === null || sortObj === void 0 ? void 0 : sortObj.sort) === null || _a === void 0 ? void 0 : _a.toUpperCase()
|
|
50
52
|
};
|
|
51
53
|
})
|
|
52
54
|
: [];
|
|
@@ -54,51 +56,88 @@ const SearchSideSheet = props => {
|
|
|
54
56
|
data: {
|
|
55
57
|
filterElements: filterElements,
|
|
56
58
|
orderElements: orderElements,
|
|
57
|
-
pagesize:
|
|
58
|
-
pageNumber: ((_c = request === null || request === void 0 ? void 0 : request.startRow) !== null && _c !== void 0 ? _c : 0) /
|
|
59
|
-
}
|
|
59
|
+
pagesize: pageSize,
|
|
60
|
+
pageNumber: ((_c = request === null || request === void 0 ? void 0 : request.startRow) !== null && _c !== void 0 ? _c : 0) / pageSize + 1
|
|
61
|
+
}
|
|
60
62
|
})
|
|
61
|
-
.then(response => {
|
|
62
|
-
var _a, _b;
|
|
63
|
+
.then((response) => {
|
|
63
64
|
success({
|
|
64
|
-
rowData:
|
|
65
|
-
rowCount:
|
|
65
|
+
rowData: response === null || response === void 0 ? void 0 : response.pageList,
|
|
66
|
+
rowCount: response === null || response === void 0 ? void 0 : response.total
|
|
66
67
|
});
|
|
67
68
|
})
|
|
68
|
-
.catch(error => {
|
|
69
|
+
.catch((error) => {
|
|
69
70
|
fail();
|
|
70
71
|
});
|
|
72
|
+
}
|
|
73
|
+
}), [searchData, handleSearch, defaultFilters]);
|
|
74
|
+
const gridHeaderConfig = useMemo(() => ({
|
|
75
|
+
title: gridTitle
|
|
76
|
+
}), [gridTitle]);
|
|
77
|
+
const columnDefs = useMemo(() => colDefs, [colDefs]);
|
|
78
|
+
const gridOptions = useMemo(() => ({
|
|
79
|
+
getRowId: (params) => {
|
|
80
|
+
var _a, _b;
|
|
81
|
+
return (_b = (_a = params.data) === null || _a === void 0 ? void 0 : _a[idField]) === null || _b === void 0 ? void 0 : _b.toString();
|
|
82
|
+
},
|
|
83
|
+
rowSelection: {
|
|
84
|
+
mode: 'multiRow',
|
|
85
|
+
enableClickSelection: false,
|
|
86
|
+
headerCheckbox: false,
|
|
87
|
+
checkboxes: (params) => params.data &&
|
|
88
|
+
!(exclude === null || exclude === void 0 ? void 0 : exclude.find((selectedItem) => {
|
|
89
|
+
var _a;
|
|
90
|
+
return selectedItem[formIdField] === ((_a = params.data) === null || _a === void 0 ? void 0 : _a[idField]);
|
|
91
|
+
}))
|
|
71
92
|
},
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
93
|
+
onModelUpdated: (params) => {
|
|
94
|
+
params.api.forEachNode((node) => {
|
|
95
|
+
if (node.data &&
|
|
96
|
+
(exclude === null || exclude === void 0 ? void 0 : exclude.find((selectedItem) => {
|
|
97
|
+
var _a;
|
|
98
|
+
return selectedItem[formIdField] === ((_a = node.data) === null || _a === void 0 ? void 0 : _a[idField]);
|
|
99
|
+
}))) {
|
|
100
|
+
node.setSelected(true);
|
|
101
|
+
}
|
|
102
|
+
});
|
|
103
|
+
},
|
|
104
|
+
pagination: true
|
|
105
|
+
}), [exclude, formIdField, idField]);
|
|
106
|
+
const gridFunctions = useMemo(() => {
|
|
107
|
+
const functions = [
|
|
108
|
+
{ name: 'agGridSizeColumnsToFit' },
|
|
109
|
+
{ name: 'agGridAutoSizeColumns' },
|
|
110
|
+
{ name: 'agGridResetColumns' },
|
|
111
|
+
{ name: 'agGridHideShowColumns' },
|
|
112
|
+
{ name: 'agGridRefreshData' }
|
|
113
|
+
];
|
|
114
|
+
if (searchBarFieldName) {
|
|
115
|
+
// eslint-disable-next-line react-hooks/refs
|
|
116
|
+
functions.push({
|
|
117
|
+
name: 'quickFilter',
|
|
118
|
+
params: {
|
|
119
|
+
callback: (value) => {
|
|
120
|
+
var _a, _b;
|
|
121
|
+
if (!value) {
|
|
122
|
+
(_a = gridApiRef.current) === null || _a === void 0 ? void 0 : _a.setFilterModel(null);
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
const textFilterPayload = {
|
|
126
|
+
[searchBarFieldName]: {
|
|
127
|
+
filterType: 'text',
|
|
128
|
+
type: 'contains',
|
|
129
|
+
filter: value
|
|
130
|
+
}
|
|
131
|
+
};
|
|
132
|
+
(_b = gridApiRef.current) === null || _b === void 0 ? void 0 : _b.setFilterModel(textFilterPayload);
|
|
133
|
+
},
|
|
134
|
+
debounce: 300
|
|
135
|
+
}
|
|
136
|
+
});
|
|
137
|
+
}
|
|
138
|
+
return functions;
|
|
139
|
+
}, [searchBarFieldName]);
|
|
140
|
+
return (React.createElement(UdpDrawer, { open: open, onDrawerClose: () => handleCloseSideSheet(), drawerTitle: title, drawerWidth: width, buttonLabel: t('Choose'), onSubmit: () => handleCloseSideSheet(true) }, React.createElement(ServerSideUdpGrid, { dataSource: dataSource, columnDefs: columnDefs, gridHeaderConfig: gridHeaderConfig, gridOptions: gridOptions, gridHeight: height, gridApiCallback: handleGridApiCallback, gridFunctions: gridFunctions }), React.createElement(UdpButton, { slot: "footer", appearance: "primary", onClick: () => handleCloseSideSheet(true) }, t('Choose'))));
|
|
102
141
|
};
|
|
103
142
|
export default SearchSideSheet;
|
|
104
143
|
//# sourceMappingURL=SearchSideSheet.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchSideSheet.js","sourceRoot":"","sources":["../../../../src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"SearchSideSheet.js","sourceRoot":"","sources":["../../../../src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx"],"names":[],"mappings":"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"}
|
|
@@ -1,202 +1,132 @@
|
|
|
1
|
-
import { c } from "../../../reactCompilerRuntime.mjs";
|
|
2
|
-
import { apiMutate } from "../../../utilities/useAxiosMutate.mjs";
|
|
3
|
-
import { SideSheet } from "../../surfaces/SideSheet.mjs";
|
|
4
|
-
import { useAgGridApi } from "../../../utilities/aggrid/AgTable.mjs";
|
|
5
1
|
import { FilterOperators } from "../../../models/SearchOperator.mjs";
|
|
6
|
-
import {
|
|
7
|
-
import
|
|
2
|
+
import { useApiMutation } from "../../../utilities/useApiMutation.mjs";
|
|
3
|
+
import { UdpButton } from "../../fluent-web-components/UdpButton.mjs";
|
|
4
|
+
import { UdpDrawer } from "../../fluent-web-components/UdpDrawer.mjs";
|
|
5
|
+
import { ServerSideUdpGrid } from "../../templates/newGrid/ServerSideUdpGrid.mjs";
|
|
6
|
+
import React, { useCallback, useMemo, useRef } from "react";
|
|
8
7
|
import { useTranslation } from "react-i18next";
|
|
9
8
|
//#region src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx
|
|
9
|
+
const EMPTY_FILTERS = [];
|
|
10
10
|
const SearchSideSheet = (props) => {
|
|
11
|
-
const
|
|
12
|
-
const { open, handleClose, exclude, title, productApiBase, searchApi, colDefs: t0, gridTitle, idField, formIdField, handleSearch, width: t1, height: t2 } = props;
|
|
13
|
-
let t3;
|
|
14
|
-
if ($[0] !== t0) {
|
|
15
|
-
t3 = t0 === void 0 ? [] : t0;
|
|
16
|
-
$[0] = t0;
|
|
17
|
-
$[1] = t3;
|
|
18
|
-
} else t3 = $[1];
|
|
19
|
-
const colDefs = t3;
|
|
20
|
-
const width = t1 === void 0 ? "800px" : t1;
|
|
21
|
-
const height = t2 === void 0 ? "58vh" : t2;
|
|
22
|
-
let t4;
|
|
23
|
-
if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
|
|
24
|
-
t4 = [];
|
|
25
|
-
$[2] = t4;
|
|
26
|
-
} else t4 = $[2];
|
|
27
|
-
const [selectedData, setSelectedData] = useState(t4);
|
|
11
|
+
const { open, handleClose, exclude, title, productApiBase, searchApi, colDefs = [], gridTitle, idField, formIdField, handleSearch, searchBarFieldName, defaultFilters = EMPTY_FILTERS, width = "800px", height = "70vh" } = props;
|
|
28
12
|
const { t } = useTranslation();
|
|
29
|
-
const
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
13
|
+
const gridApiRef = useRef(null);
|
|
14
|
+
const { mutateAsync: searchData } = useApiMutation(productApiBase, searchApi, { method: "POST" });
|
|
15
|
+
const handleGridApiCallback = useCallback((api) => {
|
|
16
|
+
gridApiRef.current = api;
|
|
17
|
+
}, []);
|
|
18
|
+
const handleCloseSideSheet = useCallback((save = false) => {
|
|
19
|
+
let data = [];
|
|
20
|
+
if (save) data = gridApiRef.current?.getSelectedRows() ?? [];
|
|
21
|
+
handleClose(data);
|
|
22
|
+
}, [handleClose]);
|
|
23
|
+
const dataSource = useMemo(() => ({ getRows: async ({ request, success, fail, api: api_0 }) => {
|
|
24
|
+
const pageSize = api_0.getGridOption("paginationPageSize");
|
|
25
|
+
if (handleSearch) {
|
|
26
|
+
handleSearch(pageSize, request, success, fail);
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
const filterElements = request?.filterModel ? Object.entries(request.filterModel)?.map(([key, value]) => {
|
|
30
|
+
return {
|
|
31
|
+
searchField: key,
|
|
32
|
+
searchOperator: FilterOperators[value?.type],
|
|
33
|
+
searchValue: value?.filter
|
|
34
|
+
};
|
|
35
|
+
}) : [];
|
|
36
|
+
if (defaultFilters?.length > 0) filterElements.push(...defaultFilters);
|
|
37
|
+
await searchData({ data: {
|
|
38
|
+
filterElements,
|
|
39
|
+
orderElements: request?.sortModel ? request.sortModel?.map((sortObj) => {
|
|
40
|
+
return {
|
|
41
|
+
sortColumn: sortObj?.colId,
|
|
42
|
+
sortDirection: sortObj?.sort?.toUpperCase()
|
|
43
|
+
};
|
|
44
|
+
}) : [],
|
|
45
|
+
pagesize: pageSize,
|
|
46
|
+
pageNumber: (request?.startRow ?? 0) / pageSize + 1
|
|
47
|
+
} }).then((response) => {
|
|
48
|
+
success({
|
|
49
|
+
rowData: response?.pageList,
|
|
50
|
+
rowCount: response?.total
|
|
51
|
+
});
|
|
52
|
+
}).catch((error) => {
|
|
53
|
+
fail();
|
|
54
|
+
});
|
|
55
|
+
} }), [
|
|
56
|
+
searchData,
|
|
57
|
+
handleSearch,
|
|
58
|
+
defaultFilters
|
|
59
|
+
]);
|
|
60
|
+
const gridHeaderConfig = useMemo(() => ({ title: gridTitle }), [gridTitle]);
|
|
61
|
+
const columnDefs = useMemo(() => colDefs, [colDefs]);
|
|
62
|
+
const gridOptions = useMemo(() => ({
|
|
63
|
+
getRowId: (params) => params.data?.[idField]?.toString(),
|
|
64
|
+
rowSelection: {
|
|
65
|
+
mode: "multiRow",
|
|
66
|
+
enableClickSelection: false,
|
|
67
|
+
headerCheckbox: false,
|
|
68
|
+
checkboxes: (params_0) => params_0.data && !exclude?.find((selectedItem) => selectedItem[formIdField] === params_0.data?.[idField])
|
|
69
|
+
},
|
|
70
|
+
onModelUpdated: (params_1) => {
|
|
71
|
+
params_1.api.forEachNode((node) => {
|
|
72
|
+
if (node.data && exclude?.find((selectedItem_0) => selectedItem_0[formIdField] === node.data?.[idField])) node.setSelected(true);
|
|
77
73
|
});
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
checkboxSelection: true,
|
|
110
|
-
maxWidth: 60,
|
|
111
|
-
minWidth: 60,
|
|
112
|
-
cellRenderer: (params) => {
|
|
113
|
-
console.log({
|
|
114
|
-
exclude,
|
|
115
|
-
formIdField,
|
|
116
|
-
idField,
|
|
117
|
-
bool: exclude?.find((selectedItem) => selectedItem[formIdField] === params.data?.[idField])
|
|
118
|
-
});
|
|
119
|
-
if (params?.data && !!exclude?.find((selectedItem_0) => selectedItem_0[formIdField] === params.data?.[idField])) params.node.setSelected(true);
|
|
74
|
+
},
|
|
75
|
+
pagination: true
|
|
76
|
+
}), [
|
|
77
|
+
exclude,
|
|
78
|
+
formIdField,
|
|
79
|
+
idField
|
|
80
|
+
]);
|
|
81
|
+
const gridFunctions = useMemo(() => {
|
|
82
|
+
const functions = [
|
|
83
|
+
{ name: "agGridSizeColumnsToFit" },
|
|
84
|
+
{ name: "agGridAutoSizeColumns" },
|
|
85
|
+
{ name: "agGridResetColumns" },
|
|
86
|
+
{ name: "agGridHideShowColumns" },
|
|
87
|
+
{ name: "agGridRefreshData" }
|
|
88
|
+
];
|
|
89
|
+
if (searchBarFieldName) functions.push({
|
|
90
|
+
name: "quickFilter",
|
|
91
|
+
params: {
|
|
92
|
+
callback: (value_0) => {
|
|
93
|
+
if (!value_0) {
|
|
94
|
+
gridApiRef.current?.setFilterModel(null);
|
|
95
|
+
return;
|
|
96
|
+
}
|
|
97
|
+
const textFilterPayload = { [searchBarFieldName]: {
|
|
98
|
+
filterType: "text",
|
|
99
|
+
type: "contains",
|
|
100
|
+
filter: value_0
|
|
101
|
+
} };
|
|
102
|
+
gridApiRef.current?.setFilterModel(textFilterPayload);
|
|
103
|
+
},
|
|
104
|
+
debounce: 300
|
|
120
105
|
}
|
|
121
|
-
};
|
|
122
|
-
$[20] = exclude;
|
|
123
|
-
$[21] = formIdField;
|
|
124
|
-
$[22] = idField;
|
|
125
|
-
$[23] = t12;
|
|
126
|
-
} else t12 = $[23];
|
|
127
|
-
let t13;
|
|
128
|
-
if ($[24] !== colDefs || $[25] !== t12) {
|
|
129
|
-
t13 = [t12, ...colDefs];
|
|
130
|
-
$[24] = colDefs;
|
|
131
|
-
$[25] = t12;
|
|
132
|
-
$[26] = t13;
|
|
133
|
-
} else t13 = $[26];
|
|
134
|
-
let t14;
|
|
135
|
-
if ($[27] !== dataSource || $[28] !== gridApi || $[29] !== gridColumnApi || $[30] !== gridTitle || $[31] !== height || $[32] !== onGridReady || $[33] !== onSelectionChanged || $[34] !== t13) {
|
|
136
|
-
t14 = /* @__PURE__ */ React.createElement(AmbientGridTemplate, {
|
|
137
|
-
title: gridTitle,
|
|
138
|
-
rowModelType: "serverSide",
|
|
139
|
-
serverSideDatasource: dataSource,
|
|
140
|
-
cacheBlockSize: 20,
|
|
141
|
-
serverSideStoreType: "partial",
|
|
142
|
-
paginationPageSize: 20,
|
|
143
|
-
columnDefs: t13,
|
|
144
|
-
hideGroupTab: true,
|
|
145
|
-
hideColumnTab: true,
|
|
146
|
-
suppressRowClickSelection: true,
|
|
147
|
-
onSelectionChanged,
|
|
148
|
-
rowSelection: "multiple",
|
|
149
|
-
api: gridApi,
|
|
150
|
-
gridReady: onGridReady,
|
|
151
|
-
columnApi: gridColumnApi,
|
|
152
|
-
dynamicSizing: true,
|
|
153
|
-
height
|
|
154
106
|
});
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
$[38] = t11;
|
|
178
|
-
$[39] = t14;
|
|
179
|
-
$[40] = t9;
|
|
180
|
-
$[41] = title;
|
|
181
|
-
$[42] = width;
|
|
182
|
-
$[43] = t15;
|
|
183
|
-
} else t15 = $[43];
|
|
184
|
-
return t15;
|
|
107
|
+
return functions;
|
|
108
|
+
}, [searchBarFieldName]);
|
|
109
|
+
return /* @__PURE__ */ React.createElement(UdpDrawer, {
|
|
110
|
+
open,
|
|
111
|
+
onDrawerClose: () => handleCloseSideSheet(),
|
|
112
|
+
drawerTitle: title,
|
|
113
|
+
drawerWidth: width,
|
|
114
|
+
buttonLabel: t("Choose"),
|
|
115
|
+
onSubmit: () => handleCloseSideSheet(true)
|
|
116
|
+
}, /* @__PURE__ */ React.createElement(ServerSideUdpGrid, {
|
|
117
|
+
dataSource,
|
|
118
|
+
columnDefs,
|
|
119
|
+
gridHeaderConfig,
|
|
120
|
+
gridOptions,
|
|
121
|
+
gridHeight: height,
|
|
122
|
+
gridApiCallback: handleGridApiCallback,
|
|
123
|
+
gridFunctions
|
|
124
|
+
}), /* @__PURE__ */ React.createElement(UdpButton, {
|
|
125
|
+
slot: "footer",
|
|
126
|
+
appearance: "primary",
|
|
127
|
+
onClick: () => handleCloseSideSheet(true)
|
|
128
|
+
}, t("Choose")));
|
|
185
129
|
};
|
|
186
|
-
function _temp(t0) {
|
|
187
|
-
const [key, value] = t0;
|
|
188
|
-
return {
|
|
189
|
-
searchField: key,
|
|
190
|
-
searchOperator: FilterOperators[value?.type],
|
|
191
|
-
searchValue: value?.filter
|
|
192
|
-
};
|
|
193
|
-
}
|
|
194
|
-
function _temp2(sortObj) {
|
|
195
|
-
return {
|
|
196
|
-
sortColumn: sortObj?.colId,
|
|
197
|
-
sortDirection: sortObj?.sort?.toUpperCase()
|
|
198
|
-
};
|
|
199
|
-
}
|
|
200
130
|
//#endregion
|
|
201
131
|
export { SearchSideSheet as default };
|
|
202
132
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchSideSheet.mjs","names":["React","useCallback","useMemo","useState","useTranslation","AmbientGridTemplate","apiMutate","FilterOperators","SideSheet","useAgGridApi","SearchSideSheet","props","$","_c","open","handleClose","exclude","title","productApiBase","searchApi","colDefs","t0","gridTitle","idField","formIdField","handleSearch","width","t1","height","t2","t3","undefined","t4","Symbol","for","selectedData","setSelectedData","t","gridApi","onGridReady","gridColumnApi","t5","data","method","searchData","t6","selectedRows","getSelectedRows","onSelectionChanged","t7","data_0","handleCloseSideSheet","t8","getRows","t9","request","success","fail","filterElements","filterModel","Object","entries","map","_temp","orderElements","sortModel","_temp2","pagesize","pageNumber","startRow","then","response","rowData","pageList","rowCount","total","catch","error","dataSource","t10","t11","t12","field","checkboxSelection","maxWidth","minWidth","cellRenderer","params","console","log","bool","find","selectedItem","selectedItem_0","node","setSelected","t13","t14","paginationPageSize","t15","key","value","searchField","searchOperator","type","searchValue","filter","sortObj","sortColumn","colId","sortDirection","sort","toUpperCase"],"sources":["../../../../src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { AmbientGridTemplate } from '../../templates/deprecated/AmbientGridTemplate/AmbientGridTemplate';\nimport { apiMutate } from '../../../utilities/useAxiosMutate';\nimport { FilterOperators } from '../../../models/SearchOperator';\nimport { SideSheet } from '../../surfaces/SideSheet';\nimport { useAgGridApi } from '../../../utilities/aggrid/AgTable';\n\nconst SearchSideSheet = props => {\n const {\n open,\n handleClose,\n exclude,\n title,\n productApiBase,\n searchApi,\n colDefs = [],\n gridTitle,\n idField,\n formIdField,\n handleSearch,\n width = '800px',\n height='58vh'\n } = props;\n const [selectedData, setSelectedData] = useState([]);\n const { t } = useTranslation();\n const { gridApi, onGridReady, gridColumnApi } = useAgGridApi();\n const paginationPageSize = 20;\n\n // TODO: use queryId or new data grid from stencil\n const searchData = useCallback(\n async data =>\n apiMutate(\n productApiBase,\n searchApi,\n {\n method: 'post',\n },\n data\n ),\n [productApiBase, searchApi]\n );\n\n const onSelectionChanged = useCallback(() => {\n const selectedRows = gridApi?.getSelectedRows() ?? [];\n setSelectedData(selectedRows);\n }, [gridApi]);\n\n const handleCloseSideSheet = useCallback(\n data => {\n handleClose(data);\n setSelectedData([]);\n },\n [handleClose]\n );\n\n const dataSource = useMemo(\n () => ({\n getRows: async ({ request, success, fail }) => {\n if (handleSearch) {\n handleSearch(paginationPageSize, request, success, fail);\n return;\n }\n const filterElements = request?.filterModel\n ? Object.entries(request.filterModel)?.map(([key, value]) => {\n return {\n searchField: key,\n searchOperator: FilterOperators[value?.type],\n searchValue: value?.filter,\n };\n })\n : [];\n\n const orderElements = request?.sortModel\n ? request.sortModel?.map(sortObj => {\n return {\n sortColumn: sortObj?.colId,\n sortDirection: sortObj?.sort?.toUpperCase(),\n };\n })\n : [];\n await searchData({\n data: {\n filterElements: filterElements,\n orderElements: orderElements,\n pagesize: paginationPageSize,\n pageNumber: (request?.startRow ?? 0) / paginationPageSize + 1,\n },\n })\n .then(response => {\n success({\n rowData: response.data?.pageList,\n rowCount: response.data?.total,\n });\n })\n .catch(error => {\n fail();\n });\n\n },\n }),\n [searchData, handleSearch]\n );\n return (\n <SideSheet\n open={open}\n onClose={() => handleCloseSideSheet()}\n title={title}\n width={width}\n buttonLabel={t('Choose')}\n onSubmit={() => {\n handleCloseSideSheet(selectedData);\n }}\n >\n <AmbientGridTemplate\n title={gridTitle}\n rowModelType=\"serverSide\"\n serverSideDatasource={dataSource}\n cacheBlockSize={paginationPageSize}\n serverSideStoreType=\"partial\"\n paginationPageSize={paginationPageSize}\n columnDefs={[\n {\n field: '',\n checkboxSelection: true,\n maxWidth: 60,\n minWidth: 60,\n cellRenderer: params => {\n console.log({\n exclude,\n formIdField,\n idField,\n bool: exclude?.find(\n selectedItem =>\n selectedItem[formIdField] === params.data?.[idField]\n ),\n });\n if (\n params?.data &&\n !!exclude?.find(\n selectedItem =>\n selectedItem[formIdField] === params.data?.[idField]\n )\n ) {\n params.node.setSelected(true);\n }\n },\n },\n ...colDefs,\n ]}\n hideGroupTab\n hideColumnTab\n suppressRowClickSelection={true}\n onSelectionChanged={onSelectionChanged}\n rowSelection=\"multiple\"\n api={gridApi}\n gridReady={onGridReady}\n columnApi={gridColumnApi}\n dynamicSizing={true}\n height={height}\n />\n </SideSheet>\n );\n};\n\nexport default SearchSideSheet;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SearchSideSheet.mjs","names":["React","useCallback","useMemo","useRef","useTranslation","ServerSideUdpGrid","useApiMutation","FilterOperators","UdpDrawer","UdpButton","EMPTY_FILTERS","SearchSideSheet","props","open","handleClose","exclude","title","productApiBase","searchApi","colDefs","gridTitle","idField","formIdField","handleSearch","searchBarFieldName","defaultFilters","width","height","t","gridApiRef","mutateAsync","searchData","method","handleGridApiCallback","api","current","handleCloseSideSheet","save","data","getSelectedRows","dataSource","getRows","request","success","fail","pageSize","getGridOption","filterElements","filterModel","Object","entries","map","key","value","searchField","searchOperator","type","searchValue","filter","length","push","orderElements","sortModel","sortObj","sortColumn","colId","sortDirection","sort","toUpperCase","pagesize","pageNumber","startRow","then","response","rowData","pageList","rowCount","total","catch","error","gridHeaderConfig","columnDefs","gridOptions","getRowId","params","toString","rowSelection","mode","enableClickSelection","headerCheckbox","checkboxes","find","selectedItem","onModelUpdated","forEachNode","node","setSelected","pagination","gridFunctions","functions","name","callback","setFilterModel","textFilterPayload","filterType","debounce"],"sources":["../../../../src/UI/inputs/fieldArrayCard/SearchSideSheet.jsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { ServerSideUdpGrid } from '../../templates/newGrid/ServerSideUdpGrid';\nimport { useApiMutation } from '../../../utilities/useApiMutation';\nimport { FilterOperators } from '../../../models/SearchOperator';\nimport { UdpDrawer, UdpButton } from '../../fluent-web-components';\n\nconst EMPTY_FILTERS = [];\n\nconst SearchSideSheet = (props) => {\n const {\n open,\n handleClose,\n exclude,\n title,\n productApiBase,\n searchApi,\n colDefs = [],\n gridTitle,\n idField,\n formIdField,\n handleSearch,\n searchBarFieldName,\n defaultFilters = EMPTY_FILTERS,\n width = '800px',\n height = '70vh'\n } = props;\n const { t } = useTranslation();\n const gridApiRef = useRef(null);\n\n const { mutateAsync: searchData } = useApiMutation(\n productApiBase,\n searchApi,\n { method: 'POST' }\n );\n\n const handleGridApiCallback = useCallback((api) => {\n gridApiRef.current = api;\n }, []);\n\n const handleCloseSideSheet = useCallback(\n (save = false) => {\n let data = [];\n if (save) {\n data = gridApiRef.current?.getSelectedRows() ?? [];\n }\n handleClose(data);\n },\n [handleClose]\n );\n\n const dataSource = useMemo(\n () => ({\n getRows: async ({ request, success, fail, api }) => {\n const pageSize = api.getGridOption('paginationPageSize');\n\n if (handleSearch) {\n handleSearch(pageSize, request, success, fail);\n return;\n }\n const filterElements = request?.filterModel\n ? Object.entries(request.filterModel)?.map(([key, value]) => {\n return {\n searchField: key,\n searchOperator: FilterOperators[value?.type],\n searchValue: value?.filter\n };\n })\n : [];\n\n if (defaultFilters?.length > 0) {\n filterElements.push(...defaultFilters);\n }\n\n const orderElements = request?.sortModel\n ? request.sortModel?.map((sortObj) => {\n return {\n sortColumn: sortObj?.colId,\n sortDirection: sortObj?.sort?.toUpperCase()\n };\n })\n : [];\n await searchData({\n data: {\n filterElements: filterElements,\n orderElements: orderElements,\n pagesize: pageSize,\n pageNumber: (request?.startRow ?? 0) / pageSize + 1\n }\n })\n .then((response) => {\n success({\n rowData: response?.pageList,\n rowCount: response?.total\n });\n })\n .catch((error) => {\n fail();\n });\n }\n }),\n [searchData, handleSearch, defaultFilters]\n );\n\n const gridHeaderConfig = useMemo(\n () => ({\n title: gridTitle\n }),\n [gridTitle]\n );\n\n const columnDefs = useMemo(() => colDefs, [colDefs]);\n\n const gridOptions = useMemo(\n () => ({\n getRowId: (params) => params.data?.[idField]?.toString(),\n rowSelection: {\n mode: 'multiRow',\n enableClickSelection: false,\n headerCheckbox: false,\n checkboxes: (params) =>\n params.data &&\n !exclude?.find(\n (selectedItem) =>\n selectedItem[formIdField] === params.data?.[idField]\n )\n },\n onModelUpdated: (params) => {\n params.api.forEachNode((node) => {\n if (\n node.data &&\n exclude?.find(\n (selectedItem) =>\n selectedItem[formIdField] === node.data?.[idField]\n )\n ) {\n node.setSelected(true);\n }\n });\n },\n pagination: true\n }),\n [exclude, formIdField, idField]\n );\n\n const gridFunctions = useMemo(() => {\n const functions = [\n { name: 'agGridSizeColumnsToFit' },\n { name: 'agGridAutoSizeColumns' },\n { name: 'agGridResetColumns' },\n { name: 'agGridHideShowColumns' },\n { name: 'agGridRefreshData' }\n ];\n\n if (searchBarFieldName) {\n // eslint-disable-next-line react-hooks/refs\n functions.push({\n name: 'quickFilter',\n params: {\n callback: (value) => {\n if (!value) {\n gridApiRef.current?.setFilterModel(null);\n return;\n }\n\n const textFilterPayload = {\n [searchBarFieldName]: {\n filterType: 'text',\n type: 'contains',\n filter: value\n }\n };\n gridApiRef.current?.setFilterModel(textFilterPayload);\n },\n debounce: 300\n }\n });\n }\n\n return functions;\n }, [searchBarFieldName]);\n\n return (\n <UdpDrawer\n open={open}\n onDrawerClose={() => handleCloseSideSheet()}\n drawerTitle={title}\n drawerWidth={width}\n buttonLabel={t('Choose')}\n onSubmit={() => handleCloseSideSheet(true)}\n >\n <ServerSideUdpGrid\n dataSource={dataSource}\n columnDefs={columnDefs}\n gridHeaderConfig={gridHeaderConfig}\n gridOptions={gridOptions}\n gridHeight={height}\n gridApiCallback={handleGridApiCallback}\n gridFunctions={gridFunctions}\n />\n <UdpButton\n slot='footer'\n appearance='primary'\n onClick={() => handleCloseSideSheet(true)}\n >\n {t('Choose')}\n </UdpButton>\n </UdpDrawer>\n );\n};\n\nexport default SearchSideSheet;\n"],"mappings":"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"}
|