@iobroker/adapter-react-v5 8.0.3 → 8.0.5
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/README.md +248 -242
- package/build/Components/ObjectBrowser.d.ts +1 -4
- package/build/Components/ObjectBrowser.js +255 -155
- package/build/Components/ObjectBrowser.js.map +1 -1
- package/package.json +1 -1
|
@@ -408,9 +408,7 @@ interface ObjectBrowserState {
|
|
|
408
408
|
export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, ObjectBrowserState> {
|
|
409
409
|
private info;
|
|
410
410
|
private localStorage;
|
|
411
|
-
private lastAppliedFilter;
|
|
412
411
|
private readonly tableRef;
|
|
413
|
-
private readonly filterRefs;
|
|
414
412
|
private pausedSubscribes;
|
|
415
413
|
private selectFirst;
|
|
416
414
|
private root;
|
|
@@ -419,7 +417,6 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
|
|
|
419
417
|
private unsubscribeTimer;
|
|
420
418
|
private statesUpdateTimer;
|
|
421
419
|
private objectsUpdateTimer;
|
|
422
|
-
private filterTimer;
|
|
423
420
|
private readonly visibleCols;
|
|
424
421
|
private readonly texts;
|
|
425
422
|
private readonly possibleCols;
|
|
@@ -541,7 +538,6 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
|
|
|
541
538
|
private subscribe;
|
|
542
539
|
private unsubscribe;
|
|
543
540
|
private pauseSubscribe;
|
|
544
|
-
private onFilter;
|
|
545
541
|
clearFilter(): void;
|
|
546
542
|
isFilterEmpty(): boolean;
|
|
547
543
|
private getFilterInput;
|
|
@@ -656,6 +652,7 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
|
|
|
656
652
|
*/
|
|
657
653
|
private renderContextMenu;
|
|
658
654
|
private renderEditValueDialog;
|
|
655
|
+
doFilter(doNotStore?: boolean): void;
|
|
659
656
|
/**
|
|
660
657
|
* The rendering method of this component.
|
|
661
658
|
*/
|
|
@@ -789,12 +789,13 @@ excludeTranslations) {
|
|
|
789
789
|
result[key] = isObject ? filterObject(value, filterKeys, excludeTranslations) : value;
|
|
790
790
|
});
|
|
791
791
|
}
|
|
792
|
+
// It is an export function and used somewhere else
|
|
792
793
|
export function filterRoles(roleArray, type, defaultRoles) {
|
|
793
794
|
const bigRoleArray = [];
|
|
794
795
|
roleArray.forEach(role => (role.type === 'mixed' || role.type) === type &&
|
|
795
796
|
!bigRoleArray.includes(role.role) &&
|
|
796
797
|
bigRoleArray.push(role.role));
|
|
797
|
-
defaultRoles
|
|
798
|
+
defaultRoles?.forEach(role => (role.type === 'mixed' || role.type) === type &&
|
|
798
799
|
!bigRoleArray.includes(role.role) &&
|
|
799
800
|
bigRoleArray.push(role.role));
|
|
800
801
|
bigRoleArray.sort();
|
|
@@ -826,6 +827,158 @@ options) {
|
|
|
826
827
|
el.click();
|
|
827
828
|
document.body.removeChild(el);
|
|
828
829
|
}
|
|
830
|
+
class CustomFilterSelect extends Component {
|
|
831
|
+
hasIcons;
|
|
832
|
+
timer = null;
|
|
833
|
+
constructor(props) {
|
|
834
|
+
super(props);
|
|
835
|
+
this.state = {
|
|
836
|
+
value: props.initialValue || [],
|
|
837
|
+
};
|
|
838
|
+
this.hasIcons = !!props.values?.find(item => item.icon);
|
|
839
|
+
}
|
|
840
|
+
componentWillUnmount() {
|
|
841
|
+
if (this.timer) {
|
|
842
|
+
clearTimeout(this.timer);
|
|
843
|
+
}
|
|
844
|
+
}
|
|
845
|
+
render() {
|
|
846
|
+
return (React.createElement("div", { style: { position: 'relative' } },
|
|
847
|
+
React.createElement(Select, { variant: "standard", key: this.props.name, sx: styles.headerCellInput, className: "no-underline", multiple: true, renderValue: value => {
|
|
848
|
+
if (!value?.length) {
|
|
849
|
+
return this.props.name === 'custom'
|
|
850
|
+
? this.props.texts.showAll
|
|
851
|
+
: this.props.texts[`filter_${this.props.name}`];
|
|
852
|
+
}
|
|
853
|
+
return value.map(val => {
|
|
854
|
+
const item = this.props.values.find(i => typeof i === 'object' ? i.value === val : i === val);
|
|
855
|
+
let id;
|
|
856
|
+
let _name;
|
|
857
|
+
let icon;
|
|
858
|
+
if (typeof item === 'object') {
|
|
859
|
+
id = item.value;
|
|
860
|
+
_name = item.name;
|
|
861
|
+
icon = item.icon;
|
|
862
|
+
}
|
|
863
|
+
else {
|
|
864
|
+
id = item;
|
|
865
|
+
_name = item;
|
|
866
|
+
}
|
|
867
|
+
return (React.createElement(Box, { component: "span", sx: styles.headerCellSelectItem, key: id },
|
|
868
|
+
icon || (this.hasIcons ? React.createElement("div", { className: "itemIcon" }) : null),
|
|
869
|
+
_name));
|
|
870
|
+
});
|
|
871
|
+
}, value: this.state.value, onChange: event => {
|
|
872
|
+
let selectedValues = event.target.value;
|
|
873
|
+
// '_' may be selected only alone
|
|
874
|
+
if (this.state.value[0] === '_' && selectedValues.includes('_') && selectedValues.length > 1) {
|
|
875
|
+
const pos = selectedValues.indexOf('_');
|
|
876
|
+
if (pos !== -1) {
|
|
877
|
+
selectedValues.splice(pos, 1);
|
|
878
|
+
}
|
|
879
|
+
}
|
|
880
|
+
else if (this.state.value[0] !== '_' && selectedValues.includes('_')) {
|
|
881
|
+
selectedValues = ['_'];
|
|
882
|
+
}
|
|
883
|
+
// '_' may be selected only alone
|
|
884
|
+
if (selectedValues.includes('')) {
|
|
885
|
+
selectedValues = [];
|
|
886
|
+
}
|
|
887
|
+
this.setState({ value: selectedValues }, () => {
|
|
888
|
+
if (this.timer) {
|
|
889
|
+
clearTimeout(this.timer);
|
|
890
|
+
}
|
|
891
|
+
this.timer = setTimeout(() => {
|
|
892
|
+
this.timer = null;
|
|
893
|
+
this.props.onChange(this.props.name, selectedValues);
|
|
894
|
+
}, 400);
|
|
895
|
+
});
|
|
896
|
+
}, onClose: () => {
|
|
897
|
+
if (this.timer) {
|
|
898
|
+
clearTimeout(this.timer);
|
|
899
|
+
this.timer = null;
|
|
900
|
+
this.props.onChange(this.props.name, this.state.value);
|
|
901
|
+
}
|
|
902
|
+
}, inputProps: { name: this.props.name, id: this.props.name }, displayEmpty: true },
|
|
903
|
+
React.createElement(MenuItem, { key: "empty", value: "" },
|
|
904
|
+
React.createElement("span", { style: styles.selectNone }, this.props.name === 'custom'
|
|
905
|
+
? this.props.texts.showAll
|
|
906
|
+
: this.props.texts[`filter_${this.props.name}`])),
|
|
907
|
+
this.props.values?.map(item => {
|
|
908
|
+
let id;
|
|
909
|
+
let _name;
|
|
910
|
+
let icon;
|
|
911
|
+
if (typeof item === 'object') {
|
|
912
|
+
id = item.value;
|
|
913
|
+
_name = item.name;
|
|
914
|
+
icon = item.icon;
|
|
915
|
+
}
|
|
916
|
+
else {
|
|
917
|
+
id = item;
|
|
918
|
+
_name = item;
|
|
919
|
+
}
|
|
920
|
+
return (React.createElement(MenuItem, { sx: styles.headerCellSelectItem, key: id, value: id },
|
|
921
|
+
icon || (this.hasIcons ? React.createElement("div", { className: "itemIcon" }) : null),
|
|
922
|
+
_name));
|
|
923
|
+
})),
|
|
924
|
+
this.state.value.length ? (React.createElement(Box, { component: "div", sx: styles.selectClearButton },
|
|
925
|
+
React.createElement(IconButton, { size: "small", onClick: () => {
|
|
926
|
+
if (this.timer) {
|
|
927
|
+
clearTimeout(this.timer);
|
|
928
|
+
this.timer = null;
|
|
929
|
+
}
|
|
930
|
+
this.setState({ value: [] }, () => this.props.onChange(this.props.name, undefined));
|
|
931
|
+
} },
|
|
932
|
+
React.createElement(IconClose, null)))) : null));
|
|
933
|
+
}
|
|
934
|
+
}
|
|
935
|
+
class CustomFilterInput extends Component {
|
|
936
|
+
timer = null;
|
|
937
|
+
constructor(props) {
|
|
938
|
+
super(props);
|
|
939
|
+
this.state = {
|
|
940
|
+
value: props.initialValue || '',
|
|
941
|
+
};
|
|
942
|
+
}
|
|
943
|
+
componentWillUnmount() {
|
|
944
|
+
if (this.timer) {
|
|
945
|
+
clearTimeout(this.timer);
|
|
946
|
+
}
|
|
947
|
+
}
|
|
948
|
+
render() {
|
|
949
|
+
return (React.createElement(FormControl, { sx: this.props.styles, key: this.props.name, title: this.props.t('ra_You can use * as wildcard'), margin: "dense" },
|
|
950
|
+
React.createElement(Input, { classes: { underline: 'no-underline' }, id: this.props.name, placeholder: this.props.texts[`filter_${this.props.name}`], value: this.state.value, onChange: event => {
|
|
951
|
+
const selectedValues = event.target.value;
|
|
952
|
+
this.setState({ value: selectedValues }, () => {
|
|
953
|
+
if (this.timer) {
|
|
954
|
+
clearTimeout(this.timer);
|
|
955
|
+
}
|
|
956
|
+
this.timer = setTimeout(() => {
|
|
957
|
+
this.timer = null;
|
|
958
|
+
this.props.onChange(this.props.name, selectedValues);
|
|
959
|
+
}, 400);
|
|
960
|
+
});
|
|
961
|
+
}, onBlur: () => {
|
|
962
|
+
if (this.timer) {
|
|
963
|
+
clearTimeout(this.timer);
|
|
964
|
+
this.timer = null;
|
|
965
|
+
this.props.onChange(this.props.name, this.state.value);
|
|
966
|
+
}
|
|
967
|
+
}, autoComplete: "off" }),
|
|
968
|
+
this.state.value ? (React.createElement("div", { style: {
|
|
969
|
+
position: 'absolute',
|
|
970
|
+
right: 0,
|
|
971
|
+
} },
|
|
972
|
+
React.createElement(IconButton, { size: "small", onClick: () => {
|
|
973
|
+
if (this.timer) {
|
|
974
|
+
clearTimeout(this.timer);
|
|
975
|
+
this.timer = null;
|
|
976
|
+
}
|
|
977
|
+
this.setState({ value: '' }, () => this.props.onChange(this.props.name, undefined));
|
|
978
|
+
} },
|
|
979
|
+
React.createElement(IconClose, null)))) : null));
|
|
980
|
+
}
|
|
981
|
+
}
|
|
829
982
|
// d=data, t=target, s=start, e=end, m=middle
|
|
830
983
|
function binarySearch(list, find, _start, _end) {
|
|
831
984
|
_start ||= 0;
|
|
@@ -1123,15 +1276,18 @@ function applyFilter(item, filters, lang, objects, context, counter, customFilte
|
|
|
1123
1276
|
}
|
|
1124
1277
|
if (!filteredOut && context.custom?.length) {
|
|
1125
1278
|
if (common) {
|
|
1126
|
-
if (context.custom
|
|
1279
|
+
if (context.custom[0] === '_') {
|
|
1127
1280
|
filteredOut = !!common.custom;
|
|
1128
1281
|
}
|
|
1129
1282
|
else if (common.custom) {
|
|
1130
1283
|
filteredOut = !context.custom.find(custom => common.custom[custom]);
|
|
1131
1284
|
}
|
|
1285
|
+
else {
|
|
1286
|
+
filteredOut = true;
|
|
1287
|
+
}
|
|
1132
1288
|
}
|
|
1133
1289
|
else {
|
|
1134
|
-
filteredOut =
|
|
1290
|
+
filteredOut = context.custom[0] !== '_';
|
|
1135
1291
|
}
|
|
1136
1292
|
}
|
|
1137
1293
|
}
|
|
@@ -1882,9 +2038,7 @@ export class ObjectBrowserClass extends Component {
|
|
|
1882
2038
|
aliasesMap: {},
|
|
1883
2039
|
};
|
|
1884
2040
|
localStorage = window._localStorage || window.localStorage;
|
|
1885
|
-
lastAppliedFilter = null;
|
|
1886
2041
|
tableRef;
|
|
1887
|
-
filterRefs;
|
|
1888
2042
|
pausedSubscribes = false;
|
|
1889
2043
|
selectFirst;
|
|
1890
2044
|
root = null;
|
|
@@ -1893,7 +2047,6 @@ export class ObjectBrowserClass extends Component {
|
|
|
1893
2047
|
unsubscribeTimer = null;
|
|
1894
2048
|
statesUpdateTimer = null;
|
|
1895
2049
|
objectsUpdateTimer = null;
|
|
1896
|
-
filterTimer = null;
|
|
1897
2050
|
visibleCols;
|
|
1898
2051
|
texts;
|
|
1899
2052
|
possibleCols;
|
|
@@ -1976,20 +2129,35 @@ export class ObjectBrowserClass extends Component {
|
|
|
1976
2129
|
filter = { ...DEFAULT_FILTER };
|
|
1977
2130
|
}
|
|
1978
2131
|
// Migrate old filters to new one
|
|
1979
|
-
if (typeof filter.room === 'string') {
|
|
1980
|
-
filter.room = [filter.room];
|
|
2132
|
+
if (typeof filter.room === 'string' && filter.room) {
|
|
2133
|
+
filter.room = [filter.room].filter(s => s);
|
|
2134
|
+
if (!filter.room.length) {
|
|
2135
|
+
delete filter.room;
|
|
2136
|
+
}
|
|
1981
2137
|
}
|
|
1982
|
-
if (typeof filter.func === 'string') {
|
|
1983
|
-
filter.func = [filter.func];
|
|
2138
|
+
if (typeof filter.func === 'string' && filter.func) {
|
|
2139
|
+
filter.func = [filter.func].filter(s => s);
|
|
2140
|
+
if (!filter.func.length) {
|
|
2141
|
+
delete filter.func;
|
|
2142
|
+
}
|
|
1984
2143
|
}
|
|
1985
|
-
if (typeof filter.role === 'string') {
|
|
1986
|
-
filter.role = [filter.role];
|
|
2144
|
+
if (typeof filter.role === 'string' && filter.role) {
|
|
2145
|
+
filter.role = [filter.role].filter(s => s);
|
|
2146
|
+
if (!filter.role.length) {
|
|
2147
|
+
delete filter.role;
|
|
2148
|
+
}
|
|
1987
2149
|
}
|
|
1988
2150
|
if (typeof filter.type === 'string') {
|
|
1989
|
-
filter.type = [filter.type];
|
|
2151
|
+
filter.type = [filter.type].filter(s => s);
|
|
2152
|
+
if (!filter.type.length) {
|
|
2153
|
+
delete filter.type;
|
|
2154
|
+
}
|
|
1990
2155
|
}
|
|
1991
2156
|
if (typeof filter.custom === 'string') {
|
|
1992
|
-
filter.custom = [filter.custom];
|
|
2157
|
+
filter.custom = [filter.custom].filter(s => s);
|
|
2158
|
+
if (!filter.custom.length) {
|
|
2159
|
+
delete filter.custom;
|
|
2160
|
+
}
|
|
1993
2161
|
}
|
|
1994
2162
|
filter.expertMode =
|
|
1995
2163
|
props.expertMode !== undefined
|
|
@@ -1997,8 +2165,6 @@ export class ObjectBrowserClass extends Component {
|
|
|
1997
2165
|
: (window._sessionStorage || window.sessionStorage).getItem('App.expertMode') ===
|
|
1998
2166
|
'true';
|
|
1999
2167
|
this.tableRef = createRef();
|
|
2000
|
-
this.filterRefs = {};
|
|
2001
|
-
Object.keys(DEFAULT_FILTER).forEach(name => (this.filterRefs[name] = createRef()));
|
|
2002
2168
|
this.visibleCols = props.columns || SCREEN_WIDTHS[props.width || 'lg'].fields;
|
|
2003
2169
|
// remove type column if only one type must be selected
|
|
2004
2170
|
if (props.types && props.types.length === 1) {
|
|
@@ -2308,16 +2474,17 @@ export class ObjectBrowserClass extends Component {
|
|
|
2308
2474
|
this.info = info;
|
|
2309
2475
|
// Show first selected item
|
|
2310
2476
|
const node = this.state.selected?.length && findNode(this.root, this.state.selected[0]);
|
|
2311
|
-
this.lastAppliedFilter = null;
|
|
2312
2477
|
// If the selected ID is not visible, reset filter
|
|
2313
2478
|
if (node &&
|
|
2314
2479
|
!applyFilter(node, this.state.filter, props.lang, this.objects, undefined, undefined, props.customFilter, props.types)) {
|
|
2315
2480
|
// reset filter
|
|
2316
2481
|
this.setState({ filter: { ...DEFAULT_FILTER }, columnsForAdmin }, () => {
|
|
2482
|
+
this.doFilter();
|
|
2317
2483
|
this.setState({ loaded: true, updating: false }, () => this.expandAllSelected(() => this.onAfterSelect()));
|
|
2318
2484
|
});
|
|
2319
2485
|
}
|
|
2320
2486
|
else {
|
|
2487
|
+
this.doFilter();
|
|
2321
2488
|
this.setState({ loaded: true, updating: false, columnsForAdmin }, () => this.expandAllSelected(() => this.onAfterSelect()));
|
|
2322
2489
|
}
|
|
2323
2490
|
}
|
|
@@ -2471,10 +2638,6 @@ export class ObjectBrowserClass extends Component {
|
|
|
2471
2638
|
* Called when component is unmounted.
|
|
2472
2639
|
*/
|
|
2473
2640
|
componentWillUnmount() {
|
|
2474
|
-
if (this.filterTimer) {
|
|
2475
|
-
clearTimeout(this.filterTimer);
|
|
2476
|
-
this.filterTimer = null;
|
|
2477
|
-
}
|
|
2478
2641
|
window.removeEventListener('contextmenu', this.onContextMenu, true);
|
|
2479
2642
|
window.removeEventListener('keydown', this.onKeyPress, true);
|
|
2480
2643
|
window.removeEventListener('keyup', this.onKeyPress, true);
|
|
@@ -2906,9 +3069,8 @@ export class ObjectBrowserClass extends Component {
|
|
|
2906
3069
|
});
|
|
2907
3070
|
this.root = root;
|
|
2908
3071
|
this.info = info;
|
|
2909
|
-
this.lastAppliedFilter = null; // apply filter anew
|
|
2910
3072
|
if (!this.pausedSubscribes) {
|
|
2911
|
-
this.
|
|
3073
|
+
this.doFilter();
|
|
2912
3074
|
}
|
|
2913
3075
|
// else it will be re-rendered when the dialog will be closed
|
|
2914
3076
|
}, 500);
|
|
@@ -3032,129 +3194,52 @@ export class ObjectBrowserClass extends Component {
|
|
|
3032
3194
|
this.subscribes.forEach(id => this.props.socket.subscribeState(id, this.onStateChange));
|
|
3033
3195
|
}
|
|
3034
3196
|
}
|
|
3035
|
-
onFilter(name, value) {
|
|
3036
|
-
this.filterTimer = null;
|
|
3037
|
-
const filter = { ...this.state.filter };
|
|
3038
|
-
Object.keys(this.filterRefs).forEach((_name) => {
|
|
3039
|
-
if (this.filterRefs[_name]?.current) {
|
|
3040
|
-
const filterRef = this.filterRefs[_name].current;
|
|
3041
|
-
for (let i = 0; i < filterRef.children.length; i++) {
|
|
3042
|
-
if (filterRef.children[i].tagName === 'INPUT') {
|
|
3043
|
-
if (_name === 'role' ||
|
|
3044
|
-
_name === 'type' ||
|
|
3045
|
-
_name === 'func' ||
|
|
3046
|
-
_name === 'custom' ||
|
|
3047
|
-
_name === 'room') {
|
|
3048
|
-
const value = filterRef.children[i].value;
|
|
3049
|
-
if (value) {
|
|
3050
|
-
filter[_name] = value.split(',');
|
|
3051
|
-
}
|
|
3052
|
-
else {
|
|
3053
|
-
filter[_name] = undefined;
|
|
3054
|
-
}
|
|
3055
|
-
}
|
|
3056
|
-
else {
|
|
3057
|
-
filter[_name] = filterRef.children[i].value;
|
|
3058
|
-
}
|
|
3059
|
-
break;
|
|
3060
|
-
}
|
|
3061
|
-
}
|
|
3062
|
-
}
|
|
3063
|
-
});
|
|
3064
|
-
if (name) {
|
|
3065
|
-
filter[name] = value;
|
|
3066
|
-
if (name === 'expertMode') {
|
|
3067
|
-
(window._sessionStorage || window.sessionStorage).setItem('App.expertMode', value ? 'true' : 'false');
|
|
3068
|
-
}
|
|
3069
|
-
}
|
|
3070
|
-
if (JSON.stringify(this.state.filter) !== JSON.stringify(filter)) {
|
|
3071
|
-
this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectFilter`, JSON.stringify(filter));
|
|
3072
|
-
this.setState({ filter }, () => this.props.onFilterChanged && this.props.onFilterChanged(filter));
|
|
3073
|
-
}
|
|
3074
|
-
}
|
|
3075
3197
|
clearFilter() {
|
|
3076
|
-
|
|
3077
|
-
|
|
3078
|
-
|
|
3079
|
-
|
|
3080
|
-
|
|
3081
|
-
const item = filterRef.childNodes[i];
|
|
3082
|
-
if (item.tagName === 'INPUT') {
|
|
3083
|
-
filter[name] = '';
|
|
3084
|
-
item.value = '';
|
|
3085
|
-
break;
|
|
3086
|
-
}
|
|
3087
|
-
}
|
|
3088
|
-
}
|
|
3089
|
-
});
|
|
3090
|
-
if (JSON.stringify(this.state.filter) !== JSON.stringify(filter)) {
|
|
3091
|
-
this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectFilter`, JSON.stringify(filter));
|
|
3092
|
-
this.setState({ filter, filterKey: this.state.filterKey + 1 }, () => this.props.onFilterChanged?.(filter));
|
|
3198
|
+
if (JSON.stringify(this.state.filter) !== JSON.stringify(DEFAULT_FILTER)) {
|
|
3199
|
+
this.setState({ filter: { ...DEFAULT_FILTER }, filterKey: this.state.filterKey + 1 }, () => {
|
|
3200
|
+
this.doFilter();
|
|
3201
|
+
this.props.onFilterChanged?.({ ...DEFAULT_FILTER });
|
|
3202
|
+
});
|
|
3093
3203
|
}
|
|
3094
3204
|
}
|
|
3095
3205
|
isFilterEmpty() {
|
|
3096
|
-
|
|
3097
|
-
|
|
3098
|
-
|
|
3099
|
-
|
|
3100
|
-
|
|
3101
|
-
|
|
3102
|
-
|
|
3103
|
-
|
|
3104
|
-
|
|
3105
|
-
|
|
3106
|
-
|
|
3107
|
-
|
|
3108
|
-
|
|
3109
|
-
|
|
3110
|
-
|
|
3111
|
-
|
|
3112
|
-
|
|
3113
|
-
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
} },
|
|
3119
|
-
React.createElement(IconClose, null)))) : null));
|
|
3206
|
+
return (!!this.state.filter.id ||
|
|
3207
|
+
!!this.state.filter.name ||
|
|
3208
|
+
!!this.state.filter.room?.length ||
|
|
3209
|
+
!!this.state.filter.func?.length ||
|
|
3210
|
+
!!this.state.filter.role?.length ||
|
|
3211
|
+
!!this.state.filter.type?.length ||
|
|
3212
|
+
!!this.state.filter.custom?.length);
|
|
3213
|
+
}
|
|
3214
|
+
getFilterInput(name) {
|
|
3215
|
+
return (React.createElement(CustomFilterInput, { key: `${name}_${this.state.filterKey}`, styles: this.styles.filterInput, name: name, texts: this.texts, t: this.props.t, initialValue: this.state.filter[name], onChange: (name, value) => {
|
|
3216
|
+
const filter = { ...this.state.filter };
|
|
3217
|
+
if (value === undefined) {
|
|
3218
|
+
delete filter[name];
|
|
3219
|
+
}
|
|
3220
|
+
else {
|
|
3221
|
+
filter[name] = value;
|
|
3222
|
+
}
|
|
3223
|
+
this.setState({ filter }, () => {
|
|
3224
|
+
this.doFilter();
|
|
3225
|
+
this.props.onFilterChanged?.(filter);
|
|
3226
|
+
});
|
|
3227
|
+
} }));
|
|
3120
3228
|
}
|
|
3121
3229
|
getFilterSelect(name, values) {
|
|
3122
|
-
|
|
3123
|
-
|
|
3124
|
-
|
|
3125
|
-
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
}
|
|
3130
|
-
|
|
3131
|
-
|
|
3132
|
-
|
|
3133
|
-
|
|
3134
|
-
|
|
3135
|
-
let icon;
|
|
3136
|
-
if (typeof item === 'object') {
|
|
3137
|
-
id = item.value;
|
|
3138
|
-
_name = item.name;
|
|
3139
|
-
icon = item.icon;
|
|
3140
|
-
}
|
|
3141
|
-
else {
|
|
3142
|
-
id = item;
|
|
3143
|
-
_name = item;
|
|
3144
|
-
}
|
|
3145
|
-
return (React.createElement(MenuItem, { sx: styles.headerCellSelectItem, key: id, value: id },
|
|
3146
|
-
icon || (hasIcons ? React.createElement("div", { className: "itemIcon" }) : null),
|
|
3147
|
-
_name));
|
|
3148
|
-
})),
|
|
3149
|
-
this.filterRefs[name]?.current?.childNodes[1]?.value ? (React.createElement(Box, { component: "div", sx: styles.selectClearButton },
|
|
3150
|
-
React.createElement(IconButton, { size: "small", onClick: () => {
|
|
3151
|
-
const newFilter = { ...this.state.filter };
|
|
3152
|
-
delete newFilter[name];
|
|
3153
|
-
(this.filterRefs[name].current?.childNodes[1]).value = '';
|
|
3154
|
-
this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectFilter`, JSON.stringify(newFilter));
|
|
3155
|
-
this.setState({ filter: newFilter, filterKey: this.state.filterKey + 1 }, () => this.props.onFilterChanged && this.props.onFilterChanged(newFilter));
|
|
3156
|
-
} },
|
|
3157
|
-
React.createElement(IconClose, null)))) : null));
|
|
3230
|
+
return (React.createElement(CustomFilterSelect, { key: `${name}_${this.state.filterKey}`, name: name, texts: this.texts, initialValue: this.state.filter[name] || [], values: values, onChange: (name, value) => {
|
|
3231
|
+
const filter = { ...this.state.filter };
|
|
3232
|
+
if (value === undefined) {
|
|
3233
|
+
delete filter[name];
|
|
3234
|
+
}
|
|
3235
|
+
else {
|
|
3236
|
+
filter[name] = value;
|
|
3237
|
+
}
|
|
3238
|
+
this.setState({ filter }, () => {
|
|
3239
|
+
this.doFilter();
|
|
3240
|
+
this.props.onFilterChanged?.(filter);
|
|
3241
|
+
});
|
|
3242
|
+
} }));
|
|
3158
3243
|
}
|
|
3159
3244
|
getFilterSelectRole() {
|
|
3160
3245
|
return this.getFilterSelect('role', this.info.roles.map(it => it.role));
|
|
@@ -3674,7 +3759,14 @@ export class ObjectBrowserClass extends Component {
|
|
|
3674
3759
|
React.createElement(IconButton, { onClick: () => this.refreshComponent(), disabled: this.state.updating, size: "large" },
|
|
3675
3760
|
React.createElement(RefreshIcon, null)))),
|
|
3676
3761
|
this.props.showExpertButton && !this.props.expertMode && (React.createElement(Tooltip, { title: this.props.t('ra_expertMode'), slotProps: { popper: { sx: styles.tooltip } } },
|
|
3677
|
-
React.createElement(IconButton, { key: "expertMode", color: this.state.filter.expertMode ? 'secondary' : 'default', onClick: () =>
|
|
3762
|
+
React.createElement(IconButton, { key: "expertMode", color: this.state.filter.expertMode ? 'secondary' : 'default', onClick: () => {
|
|
3763
|
+
const filter = { ...this.state.filter };
|
|
3764
|
+
filter.expertMode = !filter.expertMode;
|
|
3765
|
+
this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectFilter`, JSON.stringify(filter));
|
|
3766
|
+
this.setState({
|
|
3767
|
+
filter,
|
|
3768
|
+
});
|
|
3769
|
+
}, size: "large" },
|
|
3678
3770
|
React.createElement(IconExpert, null)))),
|
|
3679
3771
|
!this.props.disableColumnSelector && this.props.width !== 'xs' && (React.createElement(Tooltip, { title: this.props.t('ra_Configure'), slotProps: { popper: { sx: styles.tooltip } } },
|
|
3680
3772
|
React.createElement(IconButton, { key: "columnSelector", color: this.state.columnsAuto ? 'primary' : 'default', onClick: () => this.setState({ columnsSelectorShow: true }), size: "large" },
|
|
@@ -4250,7 +4342,9 @@ export class ObjectBrowserClass extends Component {
|
|
|
4250
4342
|
this.setState({ enumDialogEnums });
|
|
4251
4343
|
}, secondaryAction: icon },
|
|
4252
4344
|
React.createElement(ListItemIcon, { sx: { '&.MuiListItemIcon-root': styles.enumCheckbox } },
|
|
4253
|
-
React.createElement(Checkbox, { edge: "start", checked: itemEnums.includes(id), tabIndex: -1, disableRipple: true,
|
|
4345
|
+
React.createElement(Checkbox, { edge: "start", checked: itemEnums.includes(id), tabIndex: -1, disableRipple: true, slotProps: {
|
|
4346
|
+
input: { 'aria-labelledby': labelId },
|
|
4347
|
+
} })),
|
|
4254
4348
|
React.createElement(ListItemText, { id: labelId }, name)));
|
|
4255
4349
|
}))));
|
|
4256
4350
|
}
|
|
@@ -6126,6 +6220,25 @@ export class ObjectBrowserClass extends Component {
|
|
|
6126
6220
|
}
|
|
6127
6221
|
}, width: this.props.width }));
|
|
6128
6222
|
}
|
|
6223
|
+
doFilter(doNotStore) {
|
|
6224
|
+
if (!this.objects || !this.root) {
|
|
6225
|
+
return;
|
|
6226
|
+
}
|
|
6227
|
+
if (!doNotStore) {
|
|
6228
|
+
this.localStorage.setItem(`${this.props.dialogName || 'App'}.objectFilter`, JSON.stringify(this.state.filter));
|
|
6229
|
+
}
|
|
6230
|
+
const counter = { count: 0 };
|
|
6231
|
+
applyFilter(this.root, this.state.filter, this.props.lang, this.objects, undefined, counter, this.props.customFilter, this.props.types);
|
|
6232
|
+
if (counter.count < 500 && !this.state.expandAllVisible) {
|
|
6233
|
+
setTimeout(() => this.setState({ expandAllVisible: true }));
|
|
6234
|
+
}
|
|
6235
|
+
else if (counter.count >= 500 && this.state.expandAllVisible) {
|
|
6236
|
+
setTimeout(() => this.setState({ expandAllVisible: false }));
|
|
6237
|
+
}
|
|
6238
|
+
else {
|
|
6239
|
+
this.forceUpdate();
|
|
6240
|
+
}
|
|
6241
|
+
}
|
|
6129
6242
|
/**
|
|
6130
6243
|
* The rendering method of this component.
|
|
6131
6244
|
*/
|
|
@@ -6159,19 +6272,6 @@ export class ObjectBrowserClass extends Component {
|
|
|
6159
6272
|
};
|
|
6160
6273
|
this.styleTheme = this.props.themeType;
|
|
6161
6274
|
}
|
|
6162
|
-
// apply filter if changed
|
|
6163
|
-
const jsonFilter = JSON.stringify(this.state.filter);
|
|
6164
|
-
if (this.lastAppliedFilter !== jsonFilter && this.objects && this.root) {
|
|
6165
|
-
const counter = { count: 0 };
|
|
6166
|
-
applyFilter(this.root, this.state.filter, this.props.lang, this.objects, undefined, counter, this.props.customFilter, this.props.types);
|
|
6167
|
-
if (counter.count < 500 && !this.state.expandAllVisible) {
|
|
6168
|
-
setTimeout(() => this.setState({ expandAllVisible: true }));
|
|
6169
|
-
}
|
|
6170
|
-
else if (counter.count >= 500 && this.state.expandAllVisible) {
|
|
6171
|
-
setTimeout(() => this.setState({ expandAllVisible: false }));
|
|
6172
|
-
}
|
|
6173
|
-
this.lastAppliedFilter = jsonFilter;
|
|
6174
|
-
}
|
|
6175
6275
|
this.unsubscribeTimer = setTimeout(() => {
|
|
6176
6276
|
this.unsubscribeTimer = null;
|
|
6177
6277
|
this.checkUnsubscribes();
|