TMSS-146: Working basic JSON-enabled TaskDraft CRUD page for UC1

SAS/TMSS/frontend/frontend_poc/src/UC1.js

@@ -383,7 +383,36 @@ class EditTaskDraft extends Component {
             name: "my_name",
             tags: ["test"],
             description: 'my_description',
-            specifications_doc: `{}`,
+            specifications_doc: {
+                  "stations": [
+                    {
+                      "group": "ALL",
+                      "min_stations": 1
+                    }
+                  ],
+                  "antenna_set": "HBA_DUAL",
+                  "filter": "HBA_110_190",
+                  "analog_pointing": {
+                    "direction_type": "J2000",
+                    "angle1": 42,
+                    "angle2": 42
+                  },
+                  "beams": [
+                    {
+                      "name": "calibrator",
+                      "digital_pointing": {
+                        "direction_type": "J2000",
+                        "angle1": 24,
+                        "angle2": 24
+                      },
+                      "subbands": [
+                        1,
+                        2,
+                        3
+                      ]
+                    }
+                  ]
+                  },
             copies: null,
             copy_reason: null,
             scheduling_unit_draft: api_url + "scheduling_unit_draft/1/",
@@ -407,6 +436,7 @@ class EditTaskDraft extends Component {
     }
 
     onChangeDescription(e) {
+        e.preventDefault()
         this.setState({
             description: e.target.value
         });
@@ -414,7 +444,7 @@ class EditTaskDraft extends Component {
 
     onChangeSpecificationsDoc(e) {
         this.setState({
-            specifications_doc: e.target.value
+            specifications_doc: e.formData
         });
     }
 
@@ -443,6 +473,8 @@ class EditTaskDraft extends Component {
     }
 
     onSubmit(e) {
+        console.log('onSubmit');
+        console.log(e);
         e.preventDefault();
         const data = {
             name: this.state.name,
@@ -465,8 +497,12 @@ class EditTaskDraft extends Component {
         }
     }
 
-    onSpecSubmit = ({formData}) => {console.log(formData);
-                                    this.state.specifications_doc = formData;}
+    updateSpec(formData) {
+        console.log('updateSpec');
+        console.log(formData);
+        // do not use setState to prevent infinite loop
+        this.state.specifications_doc = formData;
+        }
 
     render() {
         return (
@@ -495,7 +531,7 @@ class EditTaskDraft extends Component {
                                 type="text"
                                 className="form-control"
                                 value={this.state.copies}
-                                onChange={this.onChangeCycle}
+                                onChange={this.onChangeCopies}
                                 />
                     </div>
                     <div className="form-group">
@@ -504,7 +540,7 @@ class EditTaskDraft extends Component {
                                 type="text"
                                 className="form-control"
                                 value={this.state.copy_reason}
-                                onChange={this.onChangeCycle}
+                                onChange={this.onChangeCopyReason}
                                 />
                     </div>
                     <div className="form-group">
@@ -513,7 +549,7 @@ class EditTaskDraft extends Component {
                                 type="text"
                                 className="form-control"
                                 value={this.state.scheduling_unit_draft}
-                                onChange={this.onChangeCycle}
+                                onChange={this.onChangeSchedulingUnitDraft}
                                 />
                     </div>
                     <div className="form-group">
@@ -522,17 +558,17 @@ class EditTaskDraft extends Component {
                                 type="text"
                                 className="form-control"
                                 value={this.state.specifications_template}
-                                onChange={this.onChangeCycle}
+                                onChange={this.onChangeSpecificationsTemplate}
                                 />
                     </div>
                     <div className="form-group">
                         <label>SpecificationsDoc: </label>
                           <Form schema={schema}
-                            className="form-control"
                             additionalMetaSchemas={[additionalMetaSchemas]}
                             liveValidate={true}
+                            show_opt_in={true}
                             formData={this.state.specifications_doc}
-                            onSubmit={this.onSpecSubmit} />
+                            onChange={this.onChangeSpecificationsDoc} />
                     </div>
                     <br />