Update odlux

Update performance app: fix scrolling bug, reduce loading times, update ui to use tabs instead of panels, change the view to toggle between chart and table to better visualize data, minior bugfixes for other apps

Issue-ID: SDNC-1080
Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com>
Change-Id: I2b5cf3a5f580f4193421bc047e5256d8e9497e6b
Signed-off-by: Aijana Schumann <aijana.schumann@highstreet-technologies.com>

1 files changed, 23 insertions, 13 deletions

diff --git a/sdnr/wt/odlux/apps/maintenanceApp/src/components/editMaintenenceEntryDialog.tsx b/sdnr/wt/odlux/apps/maintenanceApp/src/components/editMaintenenceEntryDialog.tsx
index e0cd51493..5ffd98799 100644
--- a/sdnr/wt/odlux/apps/maintenanceApp/src/components/editMaintenenceEntryDialog.tsx
+++ b/sdnr/wt/odlux/apps/maintenanceApp/src/components/editMaintenenceEntryDialog.tsx
@@ -33,7 +33,7 @@ import {
 } from '../actions/maintenenceActions';
 
 import { MaintenenceEntry } from '../models/maintenenceEntryType';
-import { FormControl, InputLabel, Select, MenuItem } from '@material-ui/core';
+import { FormControl, InputLabel, Select, MenuItem, Typography } from '@material-ui/core';
 
 export enum EditMaintenenceEntryDialogMode {
   None = "none",
@@ -101,14 +101,15 @@ type EditMaintenenceEntryDIalogComponentProps = Connect<undefined, typeof mapDis
   onClose: () => void;
 };
 
-type EditMaintenenceEntryDIalogComponentState = MaintenenceEntry;
+type EditMaintenenceEntryDIalogComponentState = MaintenenceEntry & { isErrorVisible: boolean };
 
 class EditMaintenenceEntryDIalogComponent extends React.Component<EditMaintenenceEntryDIalogComponentProps, EditMaintenenceEntryDIalogComponentState> {
-  constructor (props: EditMaintenenceEntryDIalogComponentProps) {
+  constructor(props: EditMaintenenceEntryDIalogComponentProps) {
     super(props);
 
     this.state = {
-      ...this.props.initialMaintenenceEntry
+      ...this.props.initialMaintenenceEntry,
+      isErrorVisible: false
     };
   }
 
@@ -122,11 +123,12 @@ class EditMaintenenceEntryDIalogComponent extends React.Component<EditMaintenenc
             {setting.dialogDescription}
           </DialogContentText>
           <TextField disabled={!setting.enableMountIdEditor} spellCheck={false} autoFocus margin="dense" id="name" label="Name" type="text" fullWidth value={this.state.nodeId} onChange={(event) => { this.setState({ nodeId: event.target.value }); }} />
+          {this.state.isErrorVisible && <Typography variant="body1" color="error" >Name must not be empty.</Typography>}
           <TextField disabled={!setting.enableTimeEditor} spellCheck={false} autoFocus margin="dense" id="start" label="Start (Local DateTime)" type="datetime-local" fullWidth value={this.state.start} onChange={(event) => { this.setState({ start: event.target.value }); }} />
           <TextField disabled={!setting.enableTimeEditor} spellCheck={false} autoFocus margin="dense" id="end" label="End (Local DateTime)" type="datetime-local" fullWidth value={this.state.end} onChange={(event) => { this.setState({ end: event.target.value }); }} />
           <FormControl fullWidth disabled={!setting.enableTimeEditor}>
             <InputLabel htmlFor="active">Active</InputLabel>
-            <Select value={ this.state.active || false } onChange={(event) => {
+            <Select value={this.state.active || false} onChange={(event) => {
               this.setState({ active: event.target.value as any as boolean });
             }} inputProps={{ name: 'active', id: 'active' }} fullWidth >
               <MenuItem value={true as any as string}>active</MenuItem>
@@ -136,14 +138,21 @@ class EditMaintenenceEntryDIalogComponent extends React.Component<EditMaintenenc
         </DialogContent>
         <DialogActions>
           <Button onClick={(event) => {
-            this.onApply({
-              _id: this.state._id || this.state.nodeId,
-              nodeId: this.state.nodeId,
-              description: this.state.description,
-              start: this.state.start,
-              end: this.state.end,
-              active: this.state.active
-            });
+
+            if (this.props.mode === EditMaintenenceEntryDialogMode.AddMaintenenceEntry && this.state.nodeId.trim().length === 0) {
+              this.setState({ isErrorVisible: true });
+            } else {
+              this.onApply({
+                _id: this.state._id || this.state.nodeId,
+                nodeId: this.state.nodeId,
+                description: this.state.description,
+                start: this.state.start,
+                end: this.state.end,
+                active: this.state.active
+              });
+              this.setState({ isErrorVisible: false });
+            }
+
             event.preventDefault();
             event.stopPropagation();
           }} > {setting.applyButtonText} </Button>
@@ -151,6 +160,7 @@ class EditMaintenenceEntryDIalogComponent extends React.Component<EditMaintenenc
             this.onCancel();
             event.preventDefault();
             event.stopPropagation();
+            this.setState({ isErrorVisible: false });
           }} color="secondary"> {setting.cancelButtonText} </Button>
         </DialogActions>
       </Dialog>