diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationTestView.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationTestView.js
index 1c35b9c902e8b3fa8ac101e518b029e8cc2e3679..603805366f4a5e85a84552e1479874c45076536d 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationTestView.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationTestView.js
@@ -11,11 +11,11 @@ import {
TabContent,
Nav
} from 'reactstrap';
-import { IoMdArrowDropdown as DropDownIcon} from 'react-icons/io';
+import {IoMdArrowDropdown as DropDownIcon} from 'react-icons/io';
import AutoLoadWrapper from '../utils/autoLoader.js'
import * as LOFARDefinitions from '../utils/LOFARDefinitions'
-import { datetime_format } from '../utils/constants'
-import { renderDateRange } from '../utils/utils'
+import {datetime_format} from '../utils/constants'
+import {renderDateRange} from '../utils/utils'
import ReactTableContainer from "react-table-container";
import moment from 'moment';
import {withRouter} from "react-router";
@@ -25,47 +25,12 @@ import '../themes/lofar-styles.css';
import './StationOverview.css';
import './StationTestView.css';
-function antennaNumberFromRCUID(rcuID, componentType) {
- if (componentType === 'HBA' || componentType === 'LBH') {
- const result = {};
- result.polarization = rcuID % 2 === 0
- ? 'X'
- : 'Y';
- result.id = Math.floor(rcuID / 2);
- return result;
- } else if (componentType === "LBL") {
- const result = {};
- result.polarization = rcuID % 2 === 1? 'X': 'Y';
- result.id = Math.floor(rcuID / 2) + 48;
- return result;
- } else {
- return {id: rcuID};
- }
-}
-
-function RCUIDFromAntennaNumberPolarization(antennaNumber, polarization, componentType) {
- if (componentType === "LBH" || componentType === "HBA") {
- const result = {}
- const polarization_id = polarization === 'X' ? 0 : 1;
- result.id = antennaNumber * 2 + polarization_id;
- return result;
- } else if (componentType === "LBL") {
- const result = {};
- const polarization_id = polarization === 'X' ? 1 : 0;
- result.id = (antennaNumber - 48) * 2 + polarization_id;
- return result
- } else {
- return {id: antennaNumber}
- }
-}
-
-
class GenericStatusC extends Component {
- getClass(){
+ getClass() {
let cls = 'stv-component-status';
if (this.props.doHighlight) {
- cls += " highlight";
+ cls += " highlight";
}
if (this.props.n_errors > 0) {
cls += ' so-serious'
@@ -78,9 +43,9 @@ class GenericStatusC extends Component {
onMouseOver = (e) => {
e.stopPropagation();
if (this.props.n_errors > 0) {
- this.props.onSelect(this.props.errors_per_polarization);
+ this.props.onSelect(this.props.errors);
}
- }
+ };
onMouseOut = (e) => {
e.stopPropagation();
@@ -88,7 +53,7 @@ class GenericStatusC extends Component {
this.props.onSelect(null);
}
- }
+ };
// left-click with mouse
onClick = () => {
@@ -100,20 +65,21 @@ class GenericStatusC extends Component {
onContextMenu = (e) => {
e.preventDefault();
if (this.props.n_errors > 0) {
- this.props.onSelect(this.props.errors_per_polarization, true);
+ this.props.onSelect(this.props.errors, true);
}
};
- render(){
+ render() {
return <td className={this.getClass()}
- onContextMenu={this.onContextMenu}
- onClick={this.onClick}
- onMouseOver={this.onMouseOver}
- onMouseOut={this.onMouseOut}>
- {this.props.n_errors === 0 ? ' ' : this.props.n_errors}
- </td>;
+ onContextMenu={this.onContextMenu}
+ onClick={this.onClick}
+ onMouseOver={this.onMouseOver}
+ onMouseOut={this.onMouseOut}>
+ {this.props.n_errors === 0 ? ' ' : this.props.n_errors}
+ </td>;
}
}
+
const GenericStatus = withRouter(GenericStatusC);
/**
@@ -123,23 +89,23 @@ class TestLineC extends Component {
doHighlight = false;
- static formatDate(date){
+ static formatDate(date) {
return moment(date).format(datetime_format);
}
shouldHighlight() {
const props = this.props,
- data = props.highlightData;
+ data = props.highlightData;
return data !== null &&
- data.component_type === props.component_type &&
- data.test_type === props.test_type &&
- data.datetime === TestLineC.formatDate(props.data.end_date);
+ data.component_type === props.component_type &&
+ data.test_type === props.test_type &&
+ data.datetime === TestLineC.formatDate(props.data.end_date);
}
shouldComponentUpdate(nextProps, nextState, nextContext) {
// this.doHighlight will only be true for the previously and currently selected row
- if (nextProps.highlightData !== this.props.highlightData && ! this.doHighlight) {
+ if (nextProps.highlightData !== this.props.highlightData && !this.doHighlight) {
return false;
}
return true;
@@ -154,37 +120,28 @@ class TestLineC extends Component {
renderComponentErrors() {
const componentErrors = this.props.data.component_errors;
- const componentType = this.props.component_type;
- const renderedComponentErrors = this.props.ordered_component_ids.map((item, key) => {
- let component_errors_count = 0;
- const errorsPerPolarization = {
- X: [],
- Y: [],
- // add some items for the child panel
- X_rcu_id: RCUIDFromAntennaNumberPolarization(item, 'X', componentType).id,
- Y_rcu_id: RCUIDFromAntennaNumberPolarization(item, 'Y', componentType).id,
- test_type: this.props.test_type,
- component_type: componentType,
- component_id: item,
- datetime: TestLineC.formatDate(this.props.data.end_date)
- };
- for (let polarization of['X', 'Y']) {
- let rcu_id = RCUIDFromAntennaNumberPolarization(item, polarization, componentType).id;
- if (componentErrors.hasOwnProperty(rcu_id)) {
- component_errors_count += componentErrors[rcu_id].length;
- errorsPerPolarization[polarization].push(...componentErrors[rcu_id])
- }
+ const renderedComponentErrors = this.props.ordered_component_ids.map((component_id, key) => {
+ let nErrors = 0;
+ let errors = [];
+ let errorDetails = {};
+ if (componentErrors.hasOwnProperty(component_id)) {
+ nErrors = Object.keys(componentErrors[component_id]).length;
+ errors = componentErrors[component_id];
+ errorDetails.errors = errors;
+ errorDetails.datetime= this.props.data.start_date;
+ errorDetails.component_id = component_id;
+ errorDetails.component_type = this.props.component_type;
}
return <GenericStatus
- doHighlight={this.doHighlight && item === this.props.highlightData.component_id}
- key={key}
- errors_per_polarization={errorsPerPolarization}
- antenna_id={item}
- antenna_type={this.props.component_type}
- n_errors={component_errors_count}
- onSelect={this.onSelect}
- />
+ doHighlight={this.doHighlight && component_id === this.props.highlightData.component_id}
+ key={key}
+ errors={errorDetails}
+ antenna_id={component_id}
+ antenna_type={this.props.component_type}
+ n_errors={nErrors}
+ onSelect={this.onSelect}
+ />
});
return renderedComponentErrors;
}
@@ -197,10 +154,10 @@ class TestLineC extends Component {
const cls = this.doHighlight ? "stv-testline highlight" : "stv-testline";
- return <tr className={cls}>
- <td className="stv-testline-header">{this.props.test_type} {date}</td>
- {this.renderComponentErrors()}
- </tr>
+ return <tr className={cls}>
+ <td className="stv-testline-header">{this.props.test_type} {date}</td>
+ {this.renderComponentErrors()}
+ </tr>
}
}
@@ -213,16 +170,14 @@ const TestLine = connect(state => {
setChildPanelData
})(TestLineC);
-
-
class RTSMSummaryLine extends Component {
- constructor(props){
+ constructor(props) {
super(props);
this.state = {displaySingleTests: false}
}
- renderTestLine(key, data, component_id_list){
+ renderTestLine(key, data, component_id_list) {
return (<TestLine className="collapse open"
key={key}
ordered_component_ids={component_id_list}
@@ -231,11 +186,11 @@ class RTSMSummaryLine extends Component {
station_type={this.props.station_type} data={data}/>)
}
- renderTestSummaryLine(data, component_id_list){
+ renderTestSummaryLine(data, component_id_list) {
const result = component_id_list.map((item, key) => {
- if(data[item] > 0){
+ if (data[item] > 0) {
let perc = Math.ceil(data[item]);
- return (<td key={key} className={'stv-rtsm-summary-badge'}>{perc + '%'} </td> );
+ return (<td key={key} className={'stv-rtsm-summary-badge'}>{perc + '%'} </td>);
} else {
return <td key={key}></td>;
}
@@ -243,56 +198,53 @@ class RTSMSummaryLine extends Component {
return result
}
- computeSummary(){
- let summary = {}
+ computeSummary() {
+ let summary = {};
let n_tests = this.props.data.length;
- const component_id_list = this.props.ordered_component_ids
- component_id_list.forEach(component_id => summary[component_id] = 0)
+ const component_id_list = this.props.ordered_component_ids;
+ component_id_list.forEach(component_id => summary[component_id] = 0);
this.props.data.forEach((item, key) => {
- Object.keys(item.component_errors).forEach((item) =>
- {
- const id = antennaNumberFromRCUID(item, this.props.component_type).id
- summary[id] += 1
- })
- })
-
- Object.keys(summary).forEach(item => summary[item] /= n_tests/50. )
+ Object.keys(item.component_errors).forEach((component_id) => {
+ summary[component_id] += 1
+ })
+ });
+
+ Object.keys(summary).forEach(item => summary[item] /= n_tests / 100.);
return summary
}
-
toggleDisplaySingleTests = (e) => {
this.setState({
- displaySingleTests:!this.state.displaySingleTests
+ displaySingleTests: !this.state.displaySingleTests
});
- }
+ };
- render(){
+ render() {
let summary = this.computeSummary()
const component_id_list = this.props.ordered_component_ids
const summaryLine = this.renderTestSummaryLine(summary, component_id_list)
let jsx;
let all_rtsm;
- if (this.state.displaySingleTests){
+ if (this.state.displaySingleTests) {
all_rtsm = this.props.data.map((item, key) => this.renderTestLine(key, item, component_id_list))
}
let dropdownAdditionStyles = "";
- if(this.state.displaySingleTests) dropdownAdditionStyles += "row-header-dropdownbutton-up";
+ if (this.state.displaySingleTests) dropdownAdditionStyles += "row-header-dropdownbutton-up";
jsx = (
- <React.Fragment>
- <tr className='stv-rtsm-summary-row'>
- <td className="row-header" onClick={this.toggleDisplaySingleTests}>
- RT {renderDateRange(this.props.data)}
- <DropDownIcon className={"row-header-dropdownbutton " + dropdownAdditionStyles} color="black" />
- </td>
- {summaryLine}
- </tr>
- {all_rtsm}
- </React.Fragment>
- )
+ <React.Fragment>
+ <tr className='stv-rtsm-summary-row'>
+ <td className="row-header" onClick={this.toggleDisplaySingleTests}>
+ RT {renderDateRange(this.props.data)}
+ <DropDownIcon className={"row-header-dropdownbutton " + dropdownAdditionStyles} color="black"/>
+ </td>
+ {summaryLine}
+ </tr>
+ {all_rtsm}
+ </React.Fragment>
+ );
return jsx;
@@ -309,57 +261,61 @@ class RTSMSummaryLine extends Component {
*/
class ComponentClass extends Component {
- computeComponentIDList(componentType){
+ computeComponentIDList(componentType) {
let componentIDSet = new Set();
- let toComponentID = item => {return antennaNumberFromRCUID(item, componentType).id}
-
- this.props.data.forEach(test => {Object.keys(test.component_errors).forEach(item => componentIDSet.add(toComponentID(item)))})
+ this.props.data.forEach(test => {
+ Object.keys(test.component_errors).forEach(item => componentIDSet.add(item))
+ });
// Javascript only sorts strings :/
// a comparing function is therefore needed
return Array.from(componentIDSet).sort((a, b) => a - b);
}
- renderHeader(){
- const components_id = this.computeComponentIDList(this.props.type)
+ renderHeader() {
+ const components_id = this.computeComponentIDList(this.props.type);
const result = components_id.map((item, key) => <th scope="col" key={key}>{item}</th>);
const jsx = (
<thead className="stv-tableheader">
- <tr><th style={{textAlign:"left"}} scope="col"><Badge color="info">{this.props.type}</Badge></th>{result}</tr>
+ <tr>
+ <th style={{textAlign: "left"}} scope="col"><Badge color="info">{this.props.type}</Badge></th>
+ {result}</tr>
</thead>
)
return jsx
}
- renderStationTestLine(key, data, component_id_list){
- return (<TestLine key={key} ordered_component_ids={component_id_list} test_type="ST" component_type={this.props.type} station_type={this.props.station_type} data={data}/>)
+ renderStationTestLine(key, data, component_id_list) {
+ return (<TestLine key={key} ordered_component_ids={component_id_list} test_type="ST"
+ component_type={this.props.type} station_type={this.props.station_type} data={data}/>)
}
- renderRTSMSummaryLine(key, data, component_id_list){
- return (<RTSMSummaryLine key={key} ordered_component_ids={component_id_list} component_type={this.props.type} station_type={this.props.station_type} data={data}/>)
+ renderRTSMSummaryLine(key, data, component_id_list) {
+ return (<RTSMSummaryLine key={key} ordered_component_ids={component_id_list} component_type={this.props.type}
+ station_type={this.props.station_type} data={data}/>)
}
- renderTestLines(data){
- const component_id_list = this.computeComponentIDList(this.props.type)
- const rows = []
- var tmp_rtsm_set = []
+ renderTestLines(data) {
+ const component_id_list = this.computeComponentIDList(this.props.type);
+ const rows = [];
+ var tmp_rtsm_set = [];
- for (let i=0; i<data.length - 1; i++){
+ for (let i = 0; i < data.length - 1; i++) {
const next_item = data[i + 1]
const current_item = data[i]
- if (current_item.test_type === 'R' ){
- tmp_rtsm_set.push(current_item)
+ if (current_item.test_type === 'R') {
+ tmp_rtsm_set.push(current_item)
}
- if (current_item.test_type === 'R' && next_item.test_type === 'S'){
+ if (current_item.test_type === 'R' && next_item.test_type === 'S') {
rows.push(this.renderRTSMSummaryLine(rows.length, tmp_rtsm_set, component_id_list))
tmp_rtsm_set = []
- } else if (current_item.test_type === 'S'){
+ } else if (current_item.test_type === 'S') {
rows.push(this.renderStationTestLine(rows.length, current_item, component_id_list));
}
}
const lastTest = data[data.length - 1]
- if (lastTest.test_type === 'R'){
+ if (lastTest.test_type === 'R') {
tmp_rtsm_set.push(lastTest)
} else {
rows.push(this.renderStationTestLine(rows.length, lastTest, component_id_list));
@@ -377,16 +333,17 @@ class ComponentClass extends Component {
const jsx = (
<ReactTableContainer width="100%" height="79vh">
<table className="stv-table table-sm table-hover table-bordered">
- {this.renderHeader()}
- <tbody>
- {rows}
- </tbody>
+ {this.renderHeader()}
+ <tbody>
+ {rows}
+ </tbody>
</table>
</ReactTableContainer>
)
return jsx;
}
}
+
/**
* StationTestView class.
*/
@@ -408,13 +365,13 @@ class StationTestViewC extends Component {
}
}
- componentDidUpdate(){
+ componentDidUpdate() {
this.setDefaultTabIfUndefined()
}
- setDefaultTabIfUndefined(){
+ setDefaultTabIfUndefined() {
const firstComponent = Object.keys(this.props.data)[0]
- if(this.state !== undefined && this.state.activeTab === undefined && firstComponent !== undefined){
+ if (this.state !== undefined && this.state.activeTab === undefined && firstComponent !== undefined) {
this.setState({
activeTab: firstComponent
})
@@ -446,10 +403,11 @@ class StationTestViewC extends Component {
);
const componentListTabs = Object.keys(this.props.data).map((componentType, key) =>
- <TabPane key={key} tabId={componentType}>
- <ComponentClass key={componentType} station_type={stationType} type={componentType} data={this.props.data[componentType]}/>
- </TabPane>
- );
+ <TabPane key={key} tabId={componentType}>
+ <ComponentClass key={componentType} station_type={stationType} type={componentType}
+ data={this.props.data[componentType]}/>
+ </TabPane>
+ );
return (
<div>