From 7152b77370d1989e4429ce37ec25b1e1baace0da Mon Sep 17 00:00:00 2001 From: Aijana Schumann Date: Tue, 6 Jul 2021 16:01:10 +0200 Subject: Add dashboard to odlux Add connected element and fault info to home page Issue-ID: CCSDK-3238 Signed-off-by: Aijana Schumann Change-Id: Ia47442fd0877b721d25d9f97e3a19088df193439 --- .../src/actions/commonNetworkElementsActions.ts | 2 +- .../src/actions/connectionStatusCountActions.ts | 52 +++++++++++++++++ .../src/handlers/connectAppRootHandler.ts | 5 +- .../src/handlers/connectionStatusCountHandler.ts | 58 +++++++++++++++++++ .../connectApp/src/models/connectionStatusCount.ts | 43 ++++++++++++++ .../wt/odlux/apps/connectApp/src/pluginConnect.tsx | 65 +++++++++++++++++++++- .../src/services/connectionStatusCountService.ts | 54 ++++++++++++++++++ 7 files changed, 275 insertions(+), 4 deletions(-) create mode 100644 sdnr/wt/odlux/apps/connectApp/src/actions/connectionStatusCountActions.ts create mode 100644 sdnr/wt/odlux/apps/connectApp/src/handlers/connectionStatusCountHandler.ts create mode 100644 sdnr/wt/odlux/apps/connectApp/src/models/connectionStatusCount.ts create mode 100644 sdnr/wt/odlux/apps/connectApp/src/services/connectionStatusCountService.ts (limited to 'sdnr/wt/odlux/apps/connectApp/src') diff --git a/sdnr/wt/odlux/apps/connectApp/src/actions/commonNetworkElementsActions.ts b/sdnr/wt/odlux/apps/connectApp/src/actions/commonNetworkElementsActions.ts index a83e00239..0c3266216 100644 --- a/sdnr/wt/odlux/apps/connectApp/src/actions/commonNetworkElementsActions.ts +++ b/sdnr/wt/odlux/apps/connectApp/src/actions/commonNetworkElementsActions.ts @@ -28,7 +28,7 @@ import { connectionStatusLogReloadAction } from '../handlers/connectionStatusLog import { PanelId } from '../models/panelId'; import { guiCutThrough } from '../models/guiCutTrough'; -import { connectService} from '../services/connectService'; +import { connectService} from '../services/connectService'; export class SetPanelAction extends Action { diff --git a/sdnr/wt/odlux/apps/connectApp/src/actions/connectionStatusCountActions.ts b/sdnr/wt/odlux/apps/connectApp/src/actions/connectionStatusCountActions.ts new file mode 100644 index 000000000..e1e16b704 --- /dev/null +++ b/sdnr/wt/odlux/apps/connectApp/src/actions/connectionStatusCountActions.ts @@ -0,0 +1,52 @@ +/** + * ============LICENSE_START======================================================================== + * ONAP : ccsdk feature sdnr wt odlux + * ================================================================================================= + * Copyright (C) 2019 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 { getConnectionStatusCountStateFromDatabase } from '../services/connectionStatusCountService'; +import { Dispatch } from '../../../../framework/src/flux/store'; + +import { Action } from '../../../../framework/src/flux/action'; + + +export class ConnectionStatusCountBaseAction extends Action { } + + +export class SetConnectionStatusCountAction extends ConnectionStatusCountBaseAction { + constructor(public ConnectedCount: number, public ConnectingCount: number, public DisconnectedCount: number, + public MountedCount: number, public UnableToConnectCount: number, public UndefinedCount: number, public UnmountedCount: number, public totalCount: number) { + super(); + } +} + + +export const refreshConnectionStatusCountAsyncAction = async (dispatch: Dispatch) => { + const result = await getConnectionStatusCountStateFromDatabase().catch(_ => null); + if (result) { + const statusAction = new SetConnectionStatusCountAction( + result["Connected"] || 0, + result["Connecting"] || 0, + result["Disconnected"] || 0, + result["Mounted"] || 0, + result["UnableToConnect"] || 0, + result["Undefined"] || 0, + result["Unmounted"] || 0, + result["total"] || 0 + ); + dispatch(statusAction); + return; + } + dispatch(new SetConnectionStatusCountAction(0, 0, 0, 0, 0, 0, 0, 0)); +} diff --git a/sdnr/wt/odlux/apps/connectApp/src/handlers/connectAppRootHandler.ts b/sdnr/wt/odlux/apps/connectApp/src/handlers/connectAppRootHandler.ts index c23e43924..70b64c976 100644 --- a/sdnr/wt/odlux/apps/connectApp/src/handlers/connectAppRootHandler.ts +++ b/sdnr/wt/odlux/apps/connectApp/src/handlers/connectAppRootHandler.ts @@ -24,6 +24,7 @@ import { IInfoNetworkElementsState, infoNetworkElementsActionHandler } from './i import { SetPanelAction, AddWebUriList, RemoveWebUri, SetWeburiSearchBusy } from '../actions/commonNetworkElementsActions'; import { PanelId } from '../models/panelId'; import { guiCutThrough } from '../models/guiCutTrough'; +import { connectionStatusCountHandler, IConnectionStatusCount } from './connectionStatusCountHandler'; export interface IConnectAppStoreState { networkElements: INetworkElementsState; @@ -31,6 +32,7 @@ export interface IConnectAppStoreState { currentOpenPanel: PanelId; elementInfo: IInfoNetworkElementsState; guiCutThrough: guiCutThroughState; + connectionStatusCount: IConnectionStatusCount; } const currentOpenPanelHandler: IActionHandler = (state = null, action) => { @@ -87,7 +89,8 @@ const actionHandlers = { connectionStatusLog: connectionStatusLogActionHandler, currentOpenPanel: currentOpenPanelHandler, elementInfo: infoNetworkElementsActionHandler, - guiCutThrough: guiCutThroughHandler + guiCutThrough: guiCutThroughHandler, + connectionStatusCount: connectionStatusCountHandler }; export const connectAppRootHandler = combineActionHandler(actionHandlers); diff --git a/sdnr/wt/odlux/apps/connectApp/src/handlers/connectionStatusCountHandler.ts b/sdnr/wt/odlux/apps/connectApp/src/handlers/connectionStatusCountHandler.ts new file mode 100644 index 000000000..611786520 --- /dev/null +++ b/sdnr/wt/odlux/apps/connectApp/src/handlers/connectionStatusCountHandler.ts @@ -0,0 +1,58 @@ +/** + * ============LICENSE_START======================================================================== + * ONAP : ccsdk feature sdnr wt odlux + * ================================================================================================= + * Copyright (C) 2019 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 { IActionHandler } from "../../../../framework/src/flux/action"; +import { SetConnectionStatusCountAction } from "../actions/connectionStatusCountActions"; + +export interface IConnectionStatusCount { + Connected: number, + Connecting: number, + Disconnected: number, + Mounted: number, + UnableToConnect: number, + Undefined: number, + Unmounted: number, + total: number +} + +const connectionStatusCountInit: IConnectionStatusCount = { + Connected: 0, + Connecting: 0, + Disconnected: 0, + Mounted: 0, + UnableToConnect: 0, + Undefined: 0, + Unmounted: 0, + total: 0 +}; + +export const connectionStatusCountHandler: IActionHandler = (state = connectionStatusCountInit, action) => { + if (action instanceof SetConnectionStatusCountAction) { + state = { + Connected: action.ConnectedCount, + Connecting: action.ConnectingCount, + Disconnected: action.DisconnectedCount, + Mounted: action.MountedCount, + UnableToConnect: action.UnableToConnectCount, + Undefined: action.UndefinedCount, + Unmounted: action.UnmountedCount, + total: action.totalCount + } + } + + return state; +} \ No newline at end of file diff --git a/sdnr/wt/odlux/apps/connectApp/src/models/connectionStatusCount.ts b/sdnr/wt/odlux/apps/connectApp/src/models/connectionStatusCount.ts new file mode 100644 index 000000000..125a6e369 --- /dev/null +++ b/sdnr/wt/odlux/apps/connectApp/src/models/connectionStatusCount.ts @@ -0,0 +1,43 @@ +/** + * ============LICENSE_START======================================================================== + * ONAP : ccsdk feature sdnr wt odlux + * ================================================================================================= + * Copyright (C) 2019 highstreet technologies GmbH Intellectual Property. All rights reserved. + * ================================================================================================= + * Licensed under the Apache License, Version 2.number (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.number + * + * 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========================================================================== + */ + +export type ConnectionStatusCountReturnType = { + Connected: number, + Connecting: number, + Disconnected: number, + Mounted: number, + UnableToConnect: number, + Undefined: number, + Unmounted: number, + total: number +}; + +export type ConnectionStatusCountType = { + Connected: number, + Connecting: number, + Disconnected: number, + Mounted: number, + UnableToConnect: number, + Undefined: number, + Unmounted: number, + total: number +}; + +export type ConnectionStatusCount = { + 'network-element-connections': ConnectionStatusCountReturnType +}; diff --git a/sdnr/wt/odlux/apps/connectApp/src/pluginConnect.tsx b/sdnr/wt/odlux/apps/connectApp/src/pluginConnect.tsx index 93bed1aad..461e14023 100644 --- a/sdnr/wt/odlux/apps/connectApp/src/pluginConnect.tsx +++ b/sdnr/wt/odlux/apps/connectApp/src/pluginConnect.tsx @@ -16,22 +16,70 @@ * ============LICENSE_END========================================================================== */ +import * as React from "react"; +import { withRouter, RouteComponentProps, Route, Switch, Redirect } from 'react-router-dom'; import { faPlug } from '@fortawesome/free-solid-svg-icons'; import applicationManager from '../../../framework/src/services/applicationManager'; import { subscribe, IFormatedMessage } from '../../../framework/src/services/notificationService'; import { AddSnackbarNotification } from '../../../framework/src/actions/snackbarActions'; +import { IApplicationStoreState } from "../../../framework/src/store/applicationStore"; +import connect, { Connect, IDispatcher } from '../../../framework/src/flux/connect'; +import { findWebUrisForGuiCutThroughAsyncAction, updateCurrentViewAsyncAction, SetPanelAction } from './actions/commonNetworkElementsActions'; +import { refreshConnectionStatusCountAsyncAction } from './actions/connectionStatusCountActions'; +import { createNetworkElementsActions, createNetworkElementsProperties, networkElementsReloadAction } from './handlers/networkElementsHandler'; import connectAppRootHandler from './handlers/connectAppRootHandler'; import ConnectApplication from './views/connectView'; +import { PanelId } from "./models/panelId"; +import { NetworkElementsList } from './components/networkElements' -import { findWebUrisForGuiCutThroughAsyncAction, updateCurrentViewAsyncAction } from './actions/commonNetworkElementsActions'; +let currentStatus: string | undefined = undefined; + +const mapProps = (state: IApplicationStoreState) => ({ + currentProblemsProperties: createNetworkElementsProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + currentProblemsActions: createNetworkElementsActions(dispatcher.dispatch, true), + setCurrentPanel: (panelId: PanelId) => dispatcher.dispatch(new SetPanelAction(panelId)), +}); + +const ConnectApplicationRouteAdapter = connect(mapProps, mapDisp)((props: RouteComponentProps<{ status?: string }> & Connect) => { + if (currentStatus !== props.match.params.status) { + currentStatus = props.match.params.status || undefined; + window.setTimeout(() => { + if (currentStatus) { + props.setCurrentPanel("NetworkElements"); + props.currentProblemsActions.onFilterChanged("status", currentStatus); + if (!props.currentProblemsProperties.showFilter) { + props.currentProblemsActions.onToggleFilter(false); + props.currentProblemsActions.onRefresh(); + } + else + props.currentProblemsActions.onRefresh(); + } + }); + } + return ( + + ) +}); + + +const App = withRouter((props: RouteComponentProps) => ( + + + + + +)); export function register() { const applicationApi = applicationManager.registerApplication({ name: "connect", icon: faPlug, - rootComponent: ConnectApplication, + rootComponent: App, rootActionHandler: connectAppRootHandler, menuEntry: "Connect" }); @@ -52,4 +100,17 @@ export function register() { }); } })); + + applicationApi.applicationStoreInitialized.then(store => { + store.dispatch(networkElementsReloadAction); + }); + + applicationApi.applicationStoreInitialized.then(store => { + store.dispatch(refreshConnectionStatusCountAsyncAction); + }); + window.setInterval(() => { + applicationApi.applicationStoreInitialized.then(store => { + store.dispatch(refreshConnectionStatusCountAsyncAction); + }); + }, 15000); } \ No newline at end of file diff --git a/sdnr/wt/odlux/apps/connectApp/src/services/connectionStatusCountService.ts b/sdnr/wt/odlux/apps/connectApp/src/services/connectionStatusCountService.ts new file mode 100644 index 000000000..519c965c4 --- /dev/null +++ b/sdnr/wt/odlux/apps/connectApp/src/services/connectionStatusCountService.ts @@ -0,0 +1,54 @@ +/** + * ============LICENSE_START======================================================================== + * ONAP : ccsdk feature sdnr wt odlux + * ================================================================================================= + * Copyright (C) 2019 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 { requestRest } from "../../../../framework/src/services/restService"; +import { Result } from "../../../../framework/src/models/elasticSearch"; +import { ConnectionStatusCountType, ConnectionStatusCount } from "../models/connectionStatusCount"; + + + +export const getConnectionStatusCountStateFromDatabase = async (): Promise => { + const path = 'rests/operations/data-provider:read-status'; + const result = await requestRest>(path, { method: "POST" }); + let connectionStatusCountType: ConnectionStatusCountType = { + Connected: 0, + Connecting: 0, + Disconnected: 0, + Mounted: 0, + UnableToConnect: 0, + Undefined: 0, + Unmounted: 0, + total: 0 + } + let connectionStatusCount: ConnectionStatusCount[] | null = null; + + if (result && result["data-provider:output"] && result["data-provider:output"].data) { + connectionStatusCount = result["data-provider:output"].data; + connectionStatusCountType = { + Connected: connectionStatusCount[0]["network-element-connections"].Connected, + Connecting: connectionStatusCount[0]["network-element-connections"].Connecting, + Disconnected: connectionStatusCount[0]["network-element-connections"].Disconnected, + Mounted: connectionStatusCount[0]["network-element-connections"].Mounted, + UnableToConnect: connectionStatusCount[0]["network-element-connections"].UnableToConnect, + Undefined: connectionStatusCount[0]["network-element-connections"].Undefined, + Unmounted: connectionStatusCount[0]["network-element-connections"].Unmounted, + total: connectionStatusCount[0]["network-element-connections"].total, + } + } + return connectionStatusCountType; +} -- cgit 1.2.3-korg