JSON form component improvements. Fix timewindow panel

ui-ngx/src/app/shared/components/json-form/json-form.component.ts

@@ -104,6 +104,7 @@ export class JsonFormComponent implements OnInit, ControlValueAccessor, Validato
   fullscreenFinishFn: () => void;
 
   private propagateChange = null;
+  private propagateChangePending = false;
 
   constructor(public elementRef: ElementRef,
               private translate: TranslateService,
@@ -120,6 +121,12 @@ export class JsonFormComponent implements OnInit, ControlValueAccessor, Validato
 
   registerOnChange(fn: any): void {
     this.propagateChange = fn;
+    if (this.propagateChangePending) {
+      this.propagateChangePending = false;
+      setTimeout(() => {
+        this.propagateChange(this.data);
+      }, 0);
+    }
   }
 
   registerOnTouched(fn: any): void {
@@ -154,7 +161,11 @@ export class JsonFormComponent implements OnInit, ControlValueAccessor, Validato
   updateView() {
     if (this.data) {
       this.data.model = this.model;
-      this.propagateChange(this.data);
+      if (this.propagateChange) {
+        this.propagateChange(this.data);
+      } else {
+        this.propagateChangePending = true;
+      }
     }
   }
 

ui-ngx/src/app/shared/components/json-form/react/json-form-base-component.tsx

@@ -33,9 +33,9 @@ export default ThingsboardBaseComponent => class<P extends JsonFormFieldProps>
     }
 
     componentDidMount() {
-        /* if (typeof this.state.value !== 'undefined') {
+        if (typeof this.state.value !== 'undefined') {
             this.props.onChange(this.props.form.key, this.state.value);
-        }*/
+        }
     }
 
     onChangeValidate(e, forceUpdate?: boolean) {

ui-ngx/src/app/shared/components/json-form/react/json-form-checkbox.tsx

@@ -28,7 +28,7 @@ class ThingsboardCheckbox extends React.Component<JsonFormFieldProps, JsonFormFi
               <Checkbox
                 name={this.props.form.key.slice(-1)[0] + ''}
                 value={this.props.form.key.slice(-1)[0]}
-                defaultChecked={this.props.value || false}
+                checked={this.props.value || false}
                 disabled={this.props.form.readonly}
                 onChange={(e, checked) => {
                   this.props.onChangeValidate(e);

ui-ngx/src/app/shared/components/json-form/react/json-form.scss

@@ -134,11 +134,6 @@ $previewSize: 100px !default;
     display: none;
   }
 
-  span.tb-toggle-icon {
-    padding-top: 12px;
-    padding-bottom: 12px;
-  }
-
   .tb-button-toggle .tb-toggle-icon {
     display: inline-block;
     width: 15px;

ui-ngx/src/app/shared/components/time/timewindow-panel.component.html

@@ -103,7 +103,6 @@
           predefinedName="aggregation.group-interval">
         </tb-timeinterval>
       </div>
-      <span fxFlex></span>
       <div fxLayout="row" class="tb-panel-actions">
         <span fxFlex></span>
         <button type="submit"