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 3d475f26b9af174486743a46d28b892beeb83108..8cc9ba4e6ac2bd892d0b6862b7c579b26c4eac13 100644 --- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage.js +++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage.js @@ -15,6 +15,7 @@ import { setPeriod, setStationGroup, setErrorsOnly } from "../redux/actions/main import 'react-grid-layout/css/styles.css'; import 'react-resizable/css/styles.css'; import '../themes/lofar-styles.css'; +import { composeQueryString } from '../utils/utils.js' const ResponsiveGridLayout = WidthProvider(Responsive); @@ -101,22 +102,68 @@ function createGridPanel(props) { class LandingPageC extends Component { getStationOverviewURL() { - return `/api/view/ctrl_stationoverview?format=json&station_group=${this.props.selectedStationGroup}&errors_only=${this.props.errorsOnly}&n_station_tests=4&n_rtsm=4`; + const url = '/api/view/ctrl_stationoverview?format=json' + + const parametersString = + composeQueryString({ station_group: this.props.selectedStationGroup, + errors_only: this.props.errorsOnly, + n_station_tests: 4, + n_rtsm: 4 + }) + return `${url}&${parametersString}`; } + getStationTestSummaryURL() { - return `/api/view/ctrl_stationtestsummary?format=json&station_group=${this.props.selectedStationGroup}&errors_only=${this.props.errorsOnly}&lookback_time=${this.props.period}`; + const url = '/api/view/ctrl_stationtestsummary?format=json' + + const parameters = {} + // ---- Mandatory parameters + parameters.lookback_time = this.props.period + // ---- Optional parameters + parameters.station_group = this.props.selectedStationGroup + parameters.errors_only = this.props.errorsOnly + + const parametersString = composeQueryString(parameters) + return `${url}&${parametersString}`; } + getLatestObservationURL() { - var nDaysAgo = moment().add(-this.props.period, 'days'); - var nDaysAgo_String = nDaysAgo.format('YYYY-MM-DD'); - return `/api/view/ctrl_latest_observation?format=json&station_group=${this.props.selectedStationGroup}&from_date=${nDaysAgo_String}&errors_only=${this.props.errorsOnly}`; + let nDaysAgo = moment().add(-this.props.period, 'days'); + let nDaysAgo_String = nDaysAgo.format('YYYY-MM-DD'); + const url = '/api/view/ctrl_latest_observation?format=json' + const parameters = {} + // ---- Mandatory parameters + parameters.from_date = nDaysAgo_String + // ---- Optional parameters + parameters.station_group = this.props.selectedStationGroup + parameters.errors_only = this.props.errorsOnly + const parametersString = composeQueryString(parameters) + + return `${url}&${parametersString}`; } + getStationStatisticsURL() { - var nDaysAgo = moment().add(-this.props.period, 'days').format('YYYY-MM-DD'); - var now = moment().format('YYYY-MM-DD'); - var averaging_interval = this.props.station_statistics.averaging_window - var test_type = this.props.station_statistics.test_type - return `/api/view/ctrl_stationtest_statistics?format=json&from_date=${nDaysAgo}&to_date=${now}&averaging_interval=${averaging_interval}&test_type=${test_type}`; + let nDaysAgo = moment().add(-this.props.period, 'days').format('YYYY-MM-DD'); + let now = moment().format('YYYY-MM-DD'); + let averaging_interval = this.props.station_statistics.averaging_window + let test_type = this.props.station_statistics.test_type + let url = '/api/view/ctrl_stationtest_statistics?format=json' + + const parameters = {} + // ---- Mandatory parameters + // select from + parameters.from_date = nDaysAgo + // select to + parameters.to_date = now + // select averaging interval + parameters.averaging_interval = averaging_interval + // ---- Optional parameters + parameters.errors_only = this.props.errorsOnly + parameters.station_group = this.props.selectedStationGroup + parameters.test_type = test_type + const parametersString = composeQueryString(parameters) + + return `${url}&${parametersString}`; } render() { return (<div> diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/utils/utils.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/utils/utils.js index f6080b07b67d028ddb07a73c5bf6d9a10b4d77fb..638bec56e69ad61d97d0158f77363f1846408730 100644 --- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/utils/utils.js +++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/utils/utils.js @@ -5,10 +5,16 @@ function unique_id(prefix='id_') { return `${prefix}${lastId}`; } - function capitalize(s) { if (typeof s !== 'string') return '' return s.charAt(0).toUpperCase() + s.slice(1).toLowerCase() } +export function composeQueryString(params) { + const parametersString = Object.keys(params).map((key) => { + return encodeURIComponent(key) + '=' + encodeURIComponent(params[key]) + }).join('&'); + return `${parametersString}`; +} + export { unique_id, capitalize };