summaryrefslogtreecommitdiffstats
path: root/sdnr/wt/odlux
diff options
context:
space:
mode:
authorAijana Schumann <aijana.schumann@highstreet-technologies.com>2020-03-16 09:15:00 +0100
committerAijana S <aijana.schumann@highstreet-technologies.com>2020-03-18 15:19:40 +0000
commit284da45ec47cb85c6547eb3ae06acaf0578be894 (patch)
tree8d96cadcd21a0bb3ebfbd5fede6ece86a8d9569e /sdnr/wt/odlux
parentce78a6683ab8648ed90e944cd23ed7c01205fce6 (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
Diffstat (limited to 'sdnr/wt/odlux')
-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);
}
}