diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.js index 6eb2da008f8463a0e3dbfe0fa70fa4abd5c58ecc..86aa03012572b8e9a6520abc2c579f277480ce65 100644 --- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.js +++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationOverview.js @@ -24,7 +24,7 @@ class Badge extends Component { render() { let props = this.props; - return (<div id={props.myid} className={"so-badge " + props.className} onMouseOver={props.togglePopOver} onMouseOut={props.togglePopOver}> + return (<div id={props.myid} className={"so-badge"} onMouseOver={props.togglePopOver} onMouseOut={props.togglePopOver}> {props.label} <span className={this.getClass()}>{props.count}</span> </div>); diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage.js index 741fcbd77f6a79a5e62223a24d19a0c4b83c0d65..aa0cf629449896dea9e5340d8d3eac7c3fcdd553 100644 --- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage.js +++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage.js @@ -82,25 +82,26 @@ const mapDispatchToPropsToolBar = { const ToolBar = connect(mapStateToPropsToolBar, mapDispatchToPropsToolBar)(ToolBarC); -/* Boiler plate for a Grid panel. - Looks like a React component but is ordinary function! */ -function createGridPanel(props) { - let body = props.body; - if (props.renderHeader) { - body = <React.Fragment> - <h5 className="react-grid-item-header">{props.title}</h5> - <div className="react-grid-item-body"> - {props.body} - </div> - </React.Fragment>; - } - return (<div key={props.key}> - {body} - </div>); -} class LandingPageC extends Component { + /* Boiler plate for a Grid panel. + Looks like a React component but is ordinary function! */ + createGridPanel(props) { + let body = props.body; + if (props.renderHeader) { + body = <React.Fragment> + <h5 className="react-grid-item-header">{props.title}</h5> + <div className="react-grid-item-body"> + {props.body} + </div> + </React.Fragment>; + } + return (<div key={props.key}> + {body} + </div>); + } + getStationOverviewURL() { const url = '/api/view/ctrl_stationoverview?format=json' @@ -170,10 +171,10 @@ class LandingPageC extends Component { <Header active_page={this.props.location}/> <ToolBar/> <ResponsiveGridLayout className="layout" layouts={this.props.layout.panels} measureBeforeMount={true} breakpoints={this.props.layout.breakpoints} cols={this.props.layout.cols} onResizeStop={e => this.props.setNewLayout(e)}> - {createGridPanel({key: "ul", renderHeader: true, title: "Station overview", body: <StationOverview url={this.getStationOverviewURL()}/>})} - {createGridPanel({key: "ur", renderHeader: true, title: "Latest observations", body: <LatestObservations url={this.getLatestObservationURL()}/>})} - {createGridPanel({key: "bl", renderHeader: false, body: <StationTestSummary url={this.getStationTestSummaryURL()}/>})} - {createGridPanel({key: "br", renderHeader: false, body: <StationStatistics url={this.getStationStatisticsURL()}/>})} + {this.createGridPanel({key: "ul", renderHeader: true, title: "Station overview", body: <StationOverview url={this.getStationOverviewURL()}/>})} + {this.createGridPanel({key: "ur", renderHeader: true, title: "Latest observations", body: <LatestObservations url={this.getLatestObservationURL()}/>})} + {this.createGridPanel({key: "bl", renderHeader: false, body: <StationTestSummary url={this.getStationTestSummaryURL()}/>})} + {this.createGridPanel({key: "br", renderHeader: false, body: <StationStatistics url={this.getStationStatisticsURL()}/>})} </ResponsiveGridLayout> </div>); }