aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorAijana Schumann <aijana.schumann@highstreet-technologies.com>2020-03-16 09:15:00 +0100
committerAijana Schumann <aijana.schumann@highstreet-technologies.com>2020-03-16 09:15:00 +0100
commitbc9425a00d19b75b149fbbf0c4ea7345de8721d5 (patch)
treeaeadec5017c40d40f3325ac782150a2f8bd28b8e
parent05da65b2d01a75404059d7526b4cbb868f631dd7 (diff)
Bugfixes for PerformanceApp
Fix filter in table not always showing Fix suspectInterval filter not linked between chart and table Fix data not loaded problem Issue-ID: SDNC-1118 Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com> Change-Id: I7d1b71f094dfdd7cd16ed6f7fb5c597a7b209b69
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/actions/reloadAction.ts25
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/chartFilter.tsx28
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/toggleContainer.tsx12
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx8
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/handlers/performanceHistoryRootHandler.ts13
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/pluginPerformance.tsx71
-rw-r--r--sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx24
13 files changed, 173 insertions, 56 deletions
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/actions/reloadAction.ts b/sdnr/wt/odlux/apps/performanceHistoryApp/src/actions/reloadAction.ts
new file mode 100644
index 000000000..7d6ecfe84
--- /dev/null
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/actions/reloadAction.ts
@@ -0,0 +1,25 @@
+/**
+ * ============LICENSE_START========================================================================
+ * ONAP : ccsdk feature sdnr wt odlux
+ * =================================================================================================
+ * Copyright (C) 2020 highstreet technologies GmbH Intellectual Property. All rights reserved.
+ * =================================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ * ============LICENSE_END==========================================================================
+ */
+
+import { Action } from "../../../../framework/src/flux/action";
+
+export class ReloadAction extends Action {
+ constructor(public show: boolean) {
+ super();
+ }
+} \ No newline at end of file
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx
index ca00d8214..f0a93f565 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx
@@ -63,6 +63,12 @@ class AdaptiveModulationComponent extends React.Component<AdaptiveModulationComp
this.props.setSubView(value);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.adaptiveModulationActions.onFilterChanged(property, filterTerm);
+ if (!this.props.adaptiveModulationProperties.showFilter)
+ this.props.adaptiveModulationActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.adaptiveModulationProperties;
const actions = this.props.adaptiveModulationActions;
@@ -82,7 +88,7 @@ class AdaptiveModulationComponent extends React.Component<AdaptiveModulationComp
return (
<>
- <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.adaptiveModulationProperties.filter} onFilterChanged={this.props.adaptiveModulationActions.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
+ <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.adaptiveModulationProperties.filter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
{lineChart(chartPagedData)}
<AdaptiveModulationTable stickyHeader idProperty={"_id"} columns={adaptiveModulationColumns} {...properties} {...actions} />
</ToggleContainer>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/chartFilter.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/chartFilter.tsx
index 280a1dac8..e5f540e19 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/chartFilter.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/chartFilter.tsx
@@ -1,3 +1,22 @@
+/**
+ * ============LICENSE_START========================================================================
+ * ONAP : ccsdk feature sdnr wt odlux
+ * =================================================================================================
+ * Copyright (C) 2020 highstreet technologies GmbH Intellectual Property. All rights reserved.
+ * =================================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied. See the License for the specific language governing permissions and limitations under
+ * the License.
+ * ============LICENSE_END==========================================================================
+ */
+
+
import * as React from 'react';
import { makeStyles, TextField, Typography, Select, MenuItem, FormControl, InputLabel } from '@material-ui/core';
@@ -11,12 +30,15 @@ const styles = makeStyles({
});
type filterProps = { isVisible: boolean, onFilterChanged: (property: string, filterTerm: string) => void, filters: any };
-//put chart visibility into redux
+
const ChartFilter: React.FunctionComponent<filterProps> = (props) => {
- //get filter from redux state (just pass da object?), onfilterchange
+
const classes = styles();
+ // make sure suspectIntervalFlag is a string to show the correct value in the select element
+
+ const suspectIntervalFlag = props.filters.suspectIntervalFlag === undefined ? undefined : props.filters.suspectIntervalFlag.toString();
return (
<>
{
@@ -34,7 +56,7 @@ const ChartFilter: React.FunctionComponent<filterProps> = (props) => {
<FormControl>
<InputLabel id="suspect-interval-label" shrink>Suspect Interval</InputLabel>
- <Select labelId="suspect-interval-label" value={props.filters.suspectIntervalFlag || ''} onChange={(event) => props.onFilterChanged("suspectIntervalFlag", event.target.value as string)}>
+ <Select labelId="suspect-interval-label" value={suspectIntervalFlag || ''} onChange={(event) => props.onFilterChanged("suspectIntervalFlag", event.target.value as string)}>
<MenuItem value={undefined}>None</MenuItem>
<MenuItem value={"true"}>true</MenuItem>
<MenuItem value={"false"}>false</MenuItem>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx
index a8c6ed78d..60051d03e 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx
@@ -65,6 +65,12 @@ class CrossPolarDiscriminationComponent extends React.Component<CrossPolarDiscri
this.props.setSubView(value);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.crossPolarDiscriminationActions.onFilterChanged(property, filterTerm);
+ if (!this.props.crossPolarDiscriminationProperties.showFilter)
+ this.props.crossPolarDiscriminationActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.crossPolarDiscriminationProperties;
const actions = this.props.crossPolarDiscriminationActions;
@@ -85,7 +91,7 @@ class CrossPolarDiscriminationComponent extends React.Component<CrossPolarDiscri
});
return (
<>
- <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.crossPolarDiscriminationProperties.filter} onFilterChanged={this.props.crossPolarDiscriminationActions.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
+ <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.crossPolarDiscriminationProperties.filter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
{lineChart(chartPagedData)}
<CrossPolarDiscriminationTable stickyHeader idProperty={"_id"} columns={cpdColumns} {...properties} {...actions} />
</ToggleContainer>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx
index 0a4f03273..28352cd31 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx
@@ -58,6 +58,12 @@ class PerformanceDataComponent extends React.Component<PerformanceDataComponentP
this.props.toggleFilterButton(!this.props.isFilterVisible);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.performanceDataActions.onFilterChanged(property, filterTerm);
+ if (!this.props.performanceDataProperties.showFilter)
+ this.props.performanceDataActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.performanceDataProperties;
const actions = this.props.performanceDataActions;
@@ -77,7 +83,7 @@ class PerformanceDataComponent extends React.Component<PerformanceDataComponentP
});
return (
<>
- <ToggleContainer onToggleFilterButton={() => this.props.toggleFilterButton(!this.props.isFilterVisible)} existingFilter={this.props.existingFilter} onFilterChanged={this.props.performanceDataActions.onFilterChanged} selectedValue={this.props.currentView} showFilter={this.props.isFilterVisible} onChange={this.props.setSubView}>
+ <ToggleContainer onToggleFilterButton={() => this.props.toggleFilterButton(!this.props.isFilterVisible)} existingFilter={this.props.existingFilter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} showFilter={this.props.isFilterVisible} onChange={this.props.setSubView}>
{lineChart(chartPagedData)}
<PerformanceDataTable stickyHeader idProperty={"_id"} columns={performanceColumns} {...properties} {...actions} />
</ToggleContainer>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx
index ae729306b..720fb946e 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx
@@ -64,6 +64,12 @@ class ReceiveLevelComponent extends React.Component<ReceiveLevelComponentProps>{
this.props.setSubView(value);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.receiveLevelActions.onFilterChanged(property, filterTerm);
+ if (!this.props.receiveLevelProperties.showFilter)
+ this.props.receiveLevelActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.receiveLevelProperties;
const actions = this.props.receiveLevelActions;
@@ -84,7 +90,7 @@ class ReceiveLevelComponent extends React.Component<ReceiveLevelComponentProps>{
return (
<>
- <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.receiveLevelProperties.filter} onFilterChanged={this.props.receiveLevelActions.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
+ <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.receiveLevelProperties.filter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
{lineChart(chartPagedData)}
<ReceiveLevelTable stickyHeader idProperty={"_id"} columns={receiveLevelColumns} {...properties} {...actions} />
</ToggleContainer>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx
index 00eba5fe3..4b34019ae 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx
@@ -63,6 +63,12 @@ class SignalToInterferenceComponent extends React.Component<SignalToInterference
this.props.setSubView(value);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.signalToInterferenceActions.onFilterChanged(property, filterTerm);
+ if (!this.props.signalToInterferenceProperties.showFilter)
+ this.props.signalToInterferenceActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.signalToInterferenceProperties;
const actions = this.props.signalToInterferenceActions;
@@ -83,7 +89,7 @@ class SignalToInterferenceComponent extends React.Component<SignalToInterference
});
return (
<>
- <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.signalToInterferenceProperties.filter} onFilterChanged={this.props.signalToInterferenceActions.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
+ <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.signalToInterferenceProperties.filter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
{lineChart(chartPagedData)}
<SignalToInterferenceTable stickyHeader idProperty={"_id"} columns={sinrColumns} {...properties} {...actions}
/>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx
index c0d12ee47..2484a8cfb 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx
@@ -65,6 +65,12 @@ class TemperatureComponent extends React.Component<TemperatureComponentProps>{
this.props.setSubView(value);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.temperatureActions.onFilterChanged(property, filterTerm);
+ if (!this.props.temperatureProperties.showFilter)
+ this.props.temperatureActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.temperatureProperties;
const actions = this.props.temperatureActions;
@@ -85,7 +91,7 @@ class TemperatureComponent extends React.Component<TemperatureComponentProps>{
return (
<>
- <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.temperatureProperties.filter} onFilterChanged={this.props.temperatureActions.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
+ <ToggleContainer onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.temperatureProperties.filter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} onChange={this.onChange}>
{lineChart(chartPagedData)}
<TemperatureTable stickyHeader idProperty={"_id"} columns={temperatureColumns} {...properties} {...actions} />
</ToggleContainer>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/toggleContainer.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/toggleContainer.tsx
index 618dddfc8..6014b22e4 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/toggleContainer.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/toggleContainer.tsx
@@ -41,15 +41,6 @@ const styles = makeStyles({
}
});
-type filterType = {
- onRefresh: () => void;
- onHandleRequestSort: (orderBy: string) => void;
- onToggleFilter: () => void;
- onFilterChanged: (property: string, filterTerm: string) => void;
- onHandleChangePage: (page: number) => void;
- onHandleChangeRowsPerPage: (rowsPerPage: number | null) => void;
-};
-
type toggleProps = { selectedValue: string, onChange(value: string): void, showFilter: boolean, onToggleFilterButton(): void, onFilterChanged: (property: string, filterTerm: string) => void, existingFilter: any };
const ToggleContainer: React.FunctionComponent<toggleProps> = (props) => {
@@ -68,9 +59,6 @@ const ToggleContainer: React.FunctionComponent<toggleProps> = (props) => {
const children = React.Children.toArray(props.children);
- //hide filter if visible + table
- //put current name into state, let container handle stuff itelf, register for togglestate, get right via set name
-
return (
<>
<div className={classes.toggleButtonContainer} >
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx
index d89aca052..e44ffe077 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx
@@ -65,6 +65,12 @@ class TransmissionPowerComponent extends React.Component<TransmissionPowerCompon
this.props.setSubView(value);
}
+ onFilterChanged = (property: string, filterTerm: string) => {
+ this.props.transmissionPowerActions.onFilterChanged(property, filterTerm);
+ if (!this.props.transmissionPowerProperties.showFilter)
+ this.props.transmissionPowerActions.onToggleFilter(false);
+ }
+
render(): JSX.Element {
const properties = this.props.transmissionPowerProperties
const actions = this.props.transmissionPowerActions
@@ -86,7 +92,7 @@ class TransmissionPowerComponent extends React.Component<TransmissionPowerCompon
return (
<>
- <ToggleContainer onChange={this.onChange} onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.transmissionPowerProperties.filter} onFilterChanged={this.props.transmissionPowerActions.onFilterChanged} selectedValue={this.props.currentView} >
+ <ToggleContainer onChange={this.onChange} onToggleFilterButton={this.onToggleFilterButton} showFilter={this.props.isFilterVisible} existingFilter={this.props.transmissionPowerProperties.filter} onFilterChanged={this.onFilterChanged} selectedValue={this.props.currentView} >
{lineChart(chartPagedData)}
<TransmissionPowerTable stickyHeader idProperty={"_id"} columns={transmissionColumns} {...properties} {...actions} />
</ToggleContainer>
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/handlers/performanceHistoryRootHandler.ts b/sdnr/wt/odlux/apps/performanceHistoryApp/src/handlers/performanceHistoryRootHandler.ts
index 6b9081502..a05ff3787 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/handlers/performanceHistoryRootHandler.ts
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/handlers/performanceHistoryRootHandler.ts
@@ -39,6 +39,7 @@ import { TimeChangeAction } from '../actions/timeChangeAction';
import { UpdateMountId } from '../actions/deviceListActions';
import { SetSubViewAction, ResetAllSubViewsAction, SetFilterVisibility } from '../actions/toggleActions';
import { SubTabType, currentViewType } from '../models/toggleDataType';
+import { ReloadAction } from '../actions/reloadAction';
export interface IPerformanceHistoryStoreState {
nodeId: string;
@@ -54,6 +55,7 @@ export interface IPerformanceHistoryStoreState {
currentOpenPanel: string | null;
pmDataIntervalType: PmDataInterval;
subViews: toggleViewDataType;
+ isReloadSchedueled: boolean;
}
const mountIdHandler: IActionHandler<string> = (state = "", action) => {
@@ -66,6 +68,14 @@ const mountIdHandler: IActionHandler<string> = (state = "", action) => {
return state;
}
+const reloadHandler: IActionHandler<boolean> = (state = false, action) => {
+
+ if (action instanceof ReloadAction) {
+ state = action.show;
+ }
+ return state;
+}
+
const currentOpenPanelHandler: IActionHandler<string | null> = (state = null, action) => {
if (action instanceof SetPanelAction) {
@@ -146,7 +156,8 @@ const actionHandlers = {
crossPolarDiscrimination: crossPolarDiscriminationActionHandler,
currentOpenPanel: currentOpenPanelHandler,
pmDataIntervalType: currentPMDataIntervalHandler,
- subViews: toogleViewDataHandler
+ subViews: toogleViewDataHandler,
+ isReloadSchedueled: reloadHandler
};
const performanceHistoryRootHandler = combineActionHandler<IPerformanceHistoryStoreState>(actionHandlers);
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/pluginPerformance.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/pluginPerformance.tsx
index df3ffd90a..a8aaca22f 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/pluginPerformance.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/pluginPerformance.tsx
@@ -30,6 +30,9 @@ import { ApplicationStore } from '../../../framework/src/store/applicationStore'
import connect, { Connect, IDispatcher } from '../../../framework/src/flux/connect';
import { IApplicationStoreState } from "../../../framework/src/store/applicationStore";
import { updateMountIdActionCreator } from "./actions/deviceListActions";
+import { ResetAllSubViewsAction } from "./actions/toggleActions";
+import { ResetLtpsAction } from "./actions/ltpAction";
+import { ReloadAction } from "./actions/reloadAction";
let api: {
readonly applicationStore: ApplicationStore | null;
@@ -40,31 +43,63 @@ const mapProps = (state: IApplicationStoreState) => ({
});
const mapDisp = (dispatcher: IDispatcher) => ({
- updateMountId: (mountId: string) => dispatcher.dispatch(updateMountIdActionCreator(mountId))
+ updateMountId: (mountId: string) => dispatcher.dispatch(updateMountIdActionCreator(mountId)),
+ resetLtps: () => dispatcher.dispatch(new ResetLtpsAction()),
+ resetSubViews: () => dispatcher.dispatch(new ResetAllSubViewsAction()),
+ setScheduleReload: (show: boolean) => dispatcher.dispatch(new ReloadAction(show))
});
let currentMountId: string | null = null;
let lastUrl: string = "/performanceHistory";
-const PerformanceHistoryApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ mountId?: string}> & Connect<typeof mapProps, typeof mapDisp>) => {
+const PerformanceHistoryApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ mountId?: string }> & Connect<typeof mapProps, typeof mapDisp>) => {
let mountId: string = "";
- if (props.location.pathname !== lastUrl) {
- // ensure the asynchronus update will only be called once per path
+
+ // called when component finshed mounting
+ React.useEffect(() => {
+
+ lastUrl = props.location.pathname;
+ mountId = getMountId(lastUrl);
+
+ if (currentMountId !== mountId) { // new element is loaded
+ currentMountId = mountId;
+ schedueleReload(currentMountId);
+ } else
+ if (currentMountId !== "") { // same element is loaded again
+ schedueleReload(currentMountId);
+ }
+ }, []);
+
+ // called when component gets updated
+ React.useEffect(() => {
+
lastUrl = props.location.pathname;
+ mountId = getMountId(lastUrl);
+
+ if (currentMountId !== mountId) {
+ currentMountId = mountId;
+ schedueleReload(currentMountId);
+ }
+
+ });
+
+ const getMountId = (lastUrl: string) => {
let index = lastUrl.lastIndexOf("performanceHistory/");
- if(index >= 0) {
- mountId = lastUrl.substr(index+19);
+ if (index >= 0) {
+ mountId = lastUrl.substr(index + 19);
} else {
mountId = "";
}
- window.setTimeout(async () => {
- // check if the mountId has changed
- if (currentMountId !== mountId) {
- currentMountId = mountId;
- await props.updateMountId(currentMountId);
- }
- });
+ return mountId;
+ }
+
+ const schedueleReload = (currentMountId: string) => {
+ props.updateMountId(currentMountId);
+ props.resetLtps();
+ props.resetSubViews();
+ props.setScheduleReload(true);
}
+
return (
<PerformanceHistoryApplication />
);
@@ -73,11 +108,11 @@ const PerformanceHistoryApplicationRouteAdapter = connect(mapProps, mapDisp)((pr
const PerformanceHistoryRouterApp = withRouter((props: RouteComponentProps) => {
props.history.action = "POP";
return (
- <Switch>
- <Route path={`${props.match.path}/:mountId`} component={PerformanceHistoryApplicationRouteAdapter} />
- <Route path={`${props.match.path}`} component={PerformanceHistoryApplicationRouteAdapter} />
- <Redirect to={`${props.match.path}`} />
- </Switch>
+ <Switch>
+ <Route path={`${props.match.path}/:mountId`} component={PerformanceHistoryApplicationRouteAdapter} />
+ <Route path={`${props.match.path}`} component={PerformanceHistoryApplicationRouteAdapter} />
+ <Redirect to={`${props.match.path}`} />
+ </Switch>
)
});
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx
index 4a1c654fb..f19058cf2 100644
--- a/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx
+++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/views/performanceHistoryApplication.tsx
@@ -53,6 +53,7 @@ import { MaterialTable, MaterialTableCtorType } from '../../../../framework/src/
import { AppBar, Tabs, Tab } from '@material-ui/core';
import LtpSelection from '../components/ltpSelection';
import { ResetAllSubViewsAction } from '../actions/toggleActions';
+import { ReloadAction } from '../actions/reloadAction';
const PerformanceHistoryComponentStyles = (theme: Theme) => createStyles({
root: {
@@ -70,7 +71,8 @@ const mapProps = (state: IApplicationStoreState) => ({
availableLtps: state.performanceHistory.ltps.distinctLtps,
networkElements: state.performanceHistory.networkElements.deviceList,
initialLoaded: state.performanceHistory.ltps.loadedOnce,
- error: state.performanceHistory.ltps.error
+ error: state.performanceHistory.ltps.error,
+ shouldReload: state.performanceHistory.isReloadSchedueled
});
const mapDispatcher = (dispatcher: IDispatcher) => ({
@@ -105,7 +107,8 @@ const mapDispatcher = (dispatcher: IDispatcher) => ({
dispatch(new NavigateToApplication("performanceHistory", nodeId));
}),
resetLtps: () => dispatcher.dispatch((dispatch: Dispatch) => { dispatch(new ResetLtpsAction()); }),
- resetSubViews: () => dispatcher.dispatch(new ResetAllSubViewsAction())
+ resetSubViews: () => dispatcher.dispatch(new ResetAllSubViewsAction()),
+ setShouldReload: (show: boolean) => dispatcher.dispatch(new ReloadAction(show))
});
export type NetworkElementType = {
@@ -220,7 +223,7 @@ class PerformanceHistoryComponent extends React.Component<PerformanceHistoryComp
if (nodeId === "") {
return (
<>
- <NetworkElementTable stickyHeader title={"Please select the network element!"} idProperty={"nodeId"} rows={this.props.networkElements} asynchronus
+ <NetworkElementTable defaultSortColumn={"nodeId"} defaultSortOrder="asc" stickyHeader title={"Please select the network element!"} idProperty={"nodeId"} rows={this.props.networkElements} asynchronus
onHandleClick={(event, rowData) => { this.handleNetworkElementSelect(rowData.nodeId) }} columns={
[{ property: "nodeId", title: "Node Name" }]
} />
@@ -294,17 +297,8 @@ class PerformanceHistoryComponent extends React.Component<PerformanceHistoryComp
public componentDidMount() {
- this.props.resetSubViews();
- this.props.resetLtps();
this.props.setCurrentPanel(null);
this.props.getAllDevicesPMdata();
- this.props.enableFilterPerformanceData.onToggleFilter();
- this.props.enableFilterReceiveLevel.onToggleFilter();
- this.props.enableFilterTransmissionPower.onToggleFilter();
- this.props.enableFilterTemperature.onToggleFilter();
- this.props.enableFilterAdaptiveModulation.onToggleFilter();
- this.props.enableFilterSinr.onToggleFilter();
- this.props.enableFilterCpd.onToggleFilter();
}
/**
@@ -388,9 +382,8 @@ class PerformanceHistoryComponent extends React.Component<PerformanceHistoryComp
private handleURLChange = (selectedNetworkElement: string) => {
- if (selectedNetworkElement !== this.state.selectedNetworkElement) {
- // gets called if page is reloaded / opened with a networkname in the url,
- // not if the selected networkelement is changed
+ if (this.props.shouldReload) {
+
this.setState({
showLtps: true,
selectedNetworkElement: selectedNetworkElement,
@@ -398,6 +391,7 @@ class PerformanceHistoryComponent extends React.Component<PerformanceHistoryComp
selectedLtp: "-1"
});
this.props.getDistinctLtpsIds(selectedNetworkElement, this.state.selectedTimePeriod, "-1", this.selectFirstLtp);
+ this.props.setShouldReload(false);
}
}