diff options
Diffstat (limited to 'sdnr/wt/odlux/apps/performanceHistoryApp/src/components')
7 files changed, 586 insertions, 0 deletions
diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx new file mode 100644 index 000000000..024315c3a --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/adaptiveModulation.tsx @@ -0,0 +1,140 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { AdaptiveModulationDataType } from '../models/adaptiveModulationDataType'; +import { createAdaptiveModulation15minProperties, createAdaptiveModulation15minActions, adaptiveModulation15minReloadAction } from '../handlers/adaptiveModulation15minHandler'; +import { createAdaptiveModulation24hoursProperties, createAdaptiveModulation24hoursActions, adaptiveModulation24hoursReloadAction } from '../handlers/adaptiveModulation24hoursHandler'; + + +const mapProps = (state: IApplicationStoreState) => ({ + adaptiveModulation15minProperties: createAdaptiveModulation15minProperties(state), + adaptiveModulation24hoursProperties: createAdaptiveModulation24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + adaptiveModulation15minActions: createAdaptiveModulation15minActions(dispatcher.dispatch), + adaptiveModulation24hoursActions: createAdaptiveModulation24hoursActions(dispatcher.dispatch), +}); + +type AdaptiveModulationComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +}; + +const AdaptiveModulationTable = MaterialTable as MaterialTableCtorType<AdaptiveModulationDataType>; + +/** + * The Component which gets the adaptiveModulation data from the database based on the selected time period. + */ +class AdaptiveModulationComponent extends React.Component<AdaptiveModulationComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <AdaptiveModulationTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "time2-states-s", title: "QAM2S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2-states", title: "QAM2", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2-states-l", title: "QAM2L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4-states-s", title: "QAM4S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4-states", title: "QAM4", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4-states-l", title: "QAM4L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time16-states-s", title: "QAM16S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time16-states", title: "QAM16", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time16-states-l", title: "QAM16L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time32-states-s", title: "QAM32S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time32-states", title: "QAM32", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time32-states-l", title: "QAM32L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time64-states-s", title: "QAM64S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time64-states", title: "QAM64", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time64-states-l", title: "QAM64L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time128-states-s", title: "QAM128S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time128-states", title: "QAM128", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time128-states-l", title: "QAM128L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time256-states-s", title: "QAM256S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time256-states", title: "QAM256", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time256-states-l", title: "QAM256L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time512-states-s", title: "QAM512S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time512-states", title: "QAM512", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time512-states-l", title: "QAM512L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time1024-states-s", title: "QAM1024S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time1024-states", title: "QAM1024", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time1024-states-l", title: "QAM1024L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2048-states-s", title: "QAM2048S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2048-states", title: "QAM2048", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2048-states-l", title: "QAM2048L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4096-states-s", title: "QAM4096S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4096-states", title: "QAM4096", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4096-states-l", title: "QAM4096L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time8192-states-s", title: "QAM8192S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time8192-states", title: "QAM8192", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time8192-states-l", title: "QAM8192L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.adaptiveModulation15minProperties} {...this.props.adaptiveModulation15minActions} /> + ); + } else { + return ( + <AdaptiveModulationTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "time2-states-s", title: "QAM2S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2-states", title: "QAM2", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2-states-l", title: "QAM2L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4-states-s", title: "QAM4S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4-states", title: "QAM4", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4-states-l", title: "QAM4L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time16-states-s", title: "QAM16S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time16-states", title: "QAM16", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time16-states-l", title: "QAM16L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time32-states-s", title: "QAM32S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time32-states", title: "QAM32", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time32-states-l", title: "QAM32L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time64-states-s", title: "QAM64S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time64-states", title: "QAM64", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time64-states-l", title: "QAM64L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time128-states-s", title: "QAM128S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time128-states", title: "QAM128", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time128-states-l", title: "QAM128L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time256-states-s", title: "QAM256S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time256-states", title: "QAM256", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time256-states-l", title: "QAM256L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time512-states-s", title: "QAM512S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time512-states", title: "QAM512", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time512-states-l", title: "QAM512L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time1024-states-s", title: "QAM1024S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time1024-states", title: "QAM1024", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time1024-states-l", title: "QAM1024L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2048-states-s", title: "QAM2048S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2048-states", title: "QAM2048", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time2048-states-l", title: "QAM2048L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4096-states-s", title: "QAM4096S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4096-states", title: "QAM4096", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time4096-states-l", title: "QAM4096L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time8192-states-s", title: "QAM8192S", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time8192-states", title: "QAM8192", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "time8192-states-l", title: "QAM8192L", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.adaptiveModulation24hoursProperties} {...this.props.adaptiveModulation24hoursActions} /> + ); + } + }; +} + +export const AdaptiveModulation = withRouter(connect(mapProps, mapDisp)(AdaptiveModulationComponent)); +export default AdaptiveModulation; diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx new file mode 100644 index 000000000..bbed8abfe --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/crossPolarDiscrimination.tsx @@ -0,0 +1,74 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { CrossPolarDiscriminationDataType } from '../models/crossPolarDiscriminationDataType'; +import { createCrossPolarDiscrimination15minProperties, createCrossPolarDiscrimination15minActions, crossPolarDiscrimination15minReloadAction } from '../handlers/crossPolarDiscrimination15minHandler'; +import { createCrossPolarDiscrimination24hoursProperties, createCrossPolarDiscrimination24hoursActions, crossPolarDiscrimination24hoursReloadAction } from '../handlers/crossPolarDiscrimination24hoursHandler'; + + +const mapProps = (state: IApplicationStoreState) => ({ + crossPolarDiscrimination15minProperties: createCrossPolarDiscrimination15minProperties(state), + crossPolarDiscrimination24hoursProperties: createCrossPolarDiscrimination24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + crossPolarDiscrimination15minActions: createCrossPolarDiscrimination15minActions(dispatcher.dispatch), + crossPolarDiscrimination24hoursActions: createCrossPolarDiscrimination24hoursActions(dispatcher.dispatch), +}); + +type CrossPolarDiscriminationComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +}; + +const CrossPolarDiscriminationTable = MaterialTable as MaterialTableCtorType<CrossPolarDiscriminationDataType>; + +/** + * The Component which gets the crossPolarDiscrimination data from the database based on the selected time period. + */ +class CrossPolarDiscriminationComponent extends React.Component<CrossPolarDiscriminationComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <CrossPolarDiscriminationTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "xpd-min", title: "CPD (min)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "xpd-avg", title: "CPD (avg)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "xpd-max", title: "CPD (max)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.crossPolarDiscrimination15minProperties} {...this.props.crossPolarDiscrimination15minActions} /> + ); + } else { + return ( + <CrossPolarDiscriminationTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "xpd-min", title: "CPD (min)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "xpd-avg", title: "CPD (avg)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "xpd-max", title: "CPD (max)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.crossPolarDiscrimination24hoursProperties} {...this.props.crossPolarDiscrimination24hoursActions} /> + ); + } + }; +} + +export const CrossPolarDiscrimination = withRouter(connect(mapProps, mapDisp)(CrossPolarDiscriminationComponent)); +export default CrossPolarDiscrimination; diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx new file mode 100644 index 000000000..e9a373b11 --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/performanceData.tsx @@ -0,0 +1,75 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { PerformanceDataType } from '../models/performanceDataType'; +import { createPerformanceData15minProperties, createPerformanceData15minActions } from '../handlers/performanceData15minHandler'; +import { createPerformanceData24hoursProperties, createPerformanceData24hoursActions } from '../handlers/performanceData24hoursHandler'; + +const mapProps = (state: IApplicationStoreState) => ({ + performanceData15minProperties: createPerformanceData15minProperties(state), + performanceData24hoursProperties: createPerformanceData24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + performanceData15minActions: createPerformanceData15minActions(dispatcher.dispatch), + performanceData24hoursActions: createPerformanceData24hoursActions(dispatcher.dispatch), +}); + +type PerformanceDataComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +}; + +const PerformanceDataTable = MaterialTable as MaterialTableCtorType<PerformanceDataType>; + +/** + * The Component which gets the performance data from the database based on the selected time period. + */ +class PerformanceDataComponent extends React.Component<PerformanceDataComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <PerformanceDataTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "es", title: "ES", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "ses", title: "SES", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "unavailability", title: "UAS", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.performanceData15minProperties} {...this.props.performanceData15minActions} + /> + ); + } else { + return ( + <PerformanceDataTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "es", title: "ES", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "ses", title: "SES", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "unavailability", title: "UAS", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.performanceData24hoursProperties} {...this.props.performanceData24hoursActions} + /> + ); + } + }; +} + +export const PerformanceData = withRouter(connect(mapProps, mapDisp)(PerformanceDataComponent)); +export default PerformanceData; diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx new file mode 100644 index 000000000..5f62e585a --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/receiveLevel.tsx @@ -0,0 +1,74 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { ReceiveLevelDataType } from '../models/receiveLevelDataType'; +import { createReceiveLevel15minProperties, createReceiveLevel15minActions, receiveLevel15minReloadAction } from '../handlers/receiveLevel15minHandler'; +import { createReceiveLevel24hoursProperties, createReceiveLevel24hoursActions, receiveLevel24hoursReloadAction } from '../handlers/receiveLevel24hoursHandler'; + + +const mapProps = (state: IApplicationStoreState) => ({ + receiveLevel15minProperties: createReceiveLevel15minProperties(state), + receiveLevel24hoursProperties: createReceiveLevel24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + receiveLevel15minActions: createReceiveLevel15minActions(dispatcher.dispatch), + receiveLevel24hoursActions: createReceiveLevel24hoursActions(dispatcher.dispatch), +}); + +type ReceiveLevelComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +}; + +const ReceiveLevelTable = MaterialTable as MaterialTableCtorType<ReceiveLevelDataType>; + +/** + * The Component which gets the receiveLevel data from the database based on the selected time period. + */ +class ReceiveLevelComponent extends React.Component<ReceiveLevelComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <ReceiveLevelTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "rx-level-min", title: "Rx min", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rx-level-avg", title: "Rx avg", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rx-level-max", title: "Rx max", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.receiveLevel15minProperties} {...this.props.receiveLevel15minActions} /> + ); + } else { + return ( + <ReceiveLevelTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "rx-level-min", title: "Rx min", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rx-level-avg", title: "Rx avg", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rx-level-max", title: "Rx max", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.receiveLevel24hoursProperties} {...this.props.receiveLevel24hoursActions} /> + ); + } + }; +} + +export const ReceiveLevel = withRouter(connect(mapProps, mapDisp)(ReceiveLevelComponent)); +export default ReceiveLevel; diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx new file mode 100644 index 000000000..bd612822e --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/signalToInterference.tsx @@ -0,0 +1,75 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { SignalToInterferenceDataType } from '../models/signalToInteferenceDataType'; +import { createSignalToInterference15minProperties, createSignalToInterference15minActions } from '../handlers/signalToInterference15minHandler'; +import { createSignalToInterference24hoursProperties, createSignalToInterference24hoursActions } from '../handlers/signalToInterference24hoursHandler'; + +const mapProps = (state: IApplicationStoreState) => ({ + signalToInterference15minProperties: createSignalToInterference15minProperties(state), + signalToInterference24hoursProperties: createSignalToInterference24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + signalToInterference15minActions: createSignalToInterference15minActions(dispatcher.dispatch), + signalToInterference24hoursActions: createSignalToInterference24hoursActions(dispatcher.dispatch), +}); + +type SignalToInterferenceComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +}; + +const SignalToInterferenceTable = MaterialTable as MaterialTableCtorType<SignalToInterferenceDataType>; + +/** + * The Component which gets the signal to interference data from the database based on the selected time period. + */ +class SignalToInterferenceComponent extends React.Component<SignalToInterferenceComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <SignalToInterferenceTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "snir-min", title: "SINR (min)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "snir-avg", title: "SINR (avg)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "snir-max", title: "SINR (max)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.signalToInterference15minProperties} {...this.props.signalToInterference15minActions} + /> + ); + } else { + return ( + <SignalToInterferenceTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "snir-min", title: "SINR (min)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "snir-avg", title: "SINR (avg)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "snir-max", title: "SINR (max)[db]", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.signalToInterference24hoursProperties} {...this.props.signalToInterference24hoursActions} + /> + ); + } + }; +} + +export const SignalToInterference = withRouter(connect(mapProps, mapDisp)(SignalToInterferenceComponent)); +export default SignalToInterference; diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx new file mode 100644 index 000000000..1496396aa --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/temperature.tsx @@ -0,0 +1,74 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { TemperatureDataType } from '../models/temperatureDataType'; +import { createTemperature15minProperties, createTemperature15minActions, temperature15minReloadAction } from '../handlers/temperature15minHandler'; +import { createTemperature24hoursProperties, createTemperature24hoursActions, temperature24hoursReloadAction } from '../handlers/temperature24hoursHandler'; + + +const mapProps = (state: IApplicationStoreState) => ({ + temperature15minProperties: createTemperature15minProperties(state), + temperature24hoursProperties: createTemperature24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + temperature15minActions: createTemperature15minActions(dispatcher.dispatch), + temperature24hoursActions: createTemperature24hoursActions(dispatcher.dispatch), +}); + +type TemperatureComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +}; + +const TemperatureTable = MaterialTable as MaterialTableCtorType<TemperatureDataType>; + +/** + * The Component which gets the temperature data from the database based on the selected time period. + */ +class TemperatureComponent extends React.Component<TemperatureComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <TemperatureTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "rf-temp-min", title: "Rx min", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rf-temp-avg", title: "Rx avg", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rf-temp-max", title: "Rx max", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.temperature15minProperties} {...this.props.temperature15minActions} /> + ); + } else { + return ( + <TemperatureTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "rf-temp-min", title: "Rx min", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rf-temp-avg", title: "Rx avg", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "rf-temp-max", title: "Rx max", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.temperature24hoursProperties} {...this.props.temperature24hoursActions} /> + ); + } + }; +} + +export const Temperature = withRouter(connect(mapProps, mapDisp)(TemperatureComponent)); +export default Temperature; diff --git a/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx new file mode 100644 index 000000000..10c25874a --- /dev/null +++ b/sdnr/wt/odlux/apps/performanceHistoryApp/src/components/transmissionPower.tsx @@ -0,0 +1,74 @@ +import * as React from 'react'; + +import { withRouter, RouteComponentProps } from 'react-router-dom'; + +import { MaterialTable, ColumnType, MaterialTableCtorType } from '../../../../framework/src/components/material-table'; +import { IApplicationStoreState } from '../../../../framework/src/store/applicationStore'; +import connect, { Connect, IDispatcher } from '../../../../framework/src/flux/connect'; + +import { TransmissionPowerDataType } from '../models/transmissionPowerDataType'; +import { createTransmissionPower15minProperties, createTransmissionPower15minActions } from '../handlers/transmissionPower15minHandler'; +import { createTransmissionPower24hoursProperties, createTransmissionPower24hoursActions } from '../handlers/transmissionPower24hoursHandler'; + + +const mapProps = (state: IApplicationStoreState) => ({ + transmissionPower15minProperties: createTransmissionPower15minProperties(state), + transmissionPower24hoursProperties: createTransmissionPower24hoursProperties(state), +}); + +const mapDisp = (dispatcher: IDispatcher) => ({ + transmissionPower15minActions: createTransmissionPower15minActions(dispatcher.dispatch), + transmissionPower24hoursActions: createTransmissionPower24hoursActions(dispatcher.dispatch), +}); + +type TransmissionPowerComponentProps = RouteComponentProps & Connect<typeof mapProps, typeof mapDisp> & { + selectedTimePeriod: string +} + +const TransmissionPowerTable = MaterialTable as MaterialTableCtorType<TransmissionPowerDataType>; + +/** + * The Component which gets the transmission power data from the database based on the selected time period. + */ +class TransmissionPowerComponent extends React.Component<TransmissionPowerComponentProps>{ + render(): JSX.Element { + if (this.props.selectedTimePeriod == "15min") { + return ( + <TransmissionPowerTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "tx-level-min", title: "Tx min", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "tx-level-avg", title: "Tx avg", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "tx-level-max", title: "Tx max", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.transmissionPower15minProperties} {...this.props.transmissionPower15minActions} /> + ); + } else { + return ( + <TransmissionPowerTable idProperty={"_id"} columns={[ + { property: "radio-signal-id", title: "Radio signal", type: ColumnType.text }, + { property: "scanner-id", title: "Scanner ID", type: ColumnType.text }, + { property: "time-stamp", title: "End Time", type: ColumnType.text, disableFilter: true }, + { + property: "suspect-interval-flag", title: "Suspect Interval", type: ColumnType.custom, customControl: ({ rowData }) => { + const suspectIntervalFlag = rowData["suspect-interval-flag"].toString(); + return <div >{suspectIntervalFlag} </div> + } + }, + { property: "tx-level-min", title: "Tx min", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "tx-level-avg", title: "Tx avg", type: ColumnType.text, disableFilter: true, disableSorting: true }, + { property: "tx-level-max", title: "Tx max", type: ColumnType.text, disableFilter: true, disableSorting: true }, + ]} {...this.props.transmissionPower24hoursProperties} {...this.props.transmissionPower24hoursActions} /> + ); + } + }; +} + +export const TransmissionPower = withRouter(connect(mapProps, mapDisp)(TransmissionPowerComponent)); +export default TransmissionPower; |