Adding wavlength tuning via GUI

Change-Id: Ic82330ebb337aa8ce0b26ecdabff6d4211ac4a5e
(cherry picked from commit 6ac13ff484c70a9da6633e21dcb585c682b41c2f)
diff --git a/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.html b/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.html
index 26420ca..0385b03 100644
--- a/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.html
+++ b/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.html
@@ -97,7 +97,12 @@
                     <td [ngClass]="(isDelta() ? 'delta' : '')">{{port.type=='OCH'?port.minFreq:""}}</td>
                     <td [ngClass]="(isDelta() ? 'delta' : '')">{{port.type=='OCH'?port.maxFreq:""}}</td>
                     <td [ngClass]="(isDelta() ? 'delta' : '')">{{port.type=='OCH'?port.grid:""}}</td>
-                    <td [ngClass]="(isDelta() ? 'delta' : '')">{{port.type=='OCH'?port.currFreq:""}}</td>
+                    <td [ngClass]="(isDelta() ? 'delta' : '')">
+                        <form [formGroup]="freqForm" (ngSubmit)="submitFrequency(devId, port.id)" *ngIf="port.type=='OCH'">
+                            <input type="text" style="width:50px" value="{{port.type=='OCH'?port.currFreq:''}}" formControlName="newFreq" required>
+                            <button type="submit">Submit</button>
+                        </form>
+                    </td>
                     <td [ngClass]="(isDelta() ? 'delta' : '')">
                         <form [formGroup]="modulationForm" (ngSubmit)="submitModulation(devId, port.id)" *ngIf="port.type=='OCH'">
                             <select [(ngModel)]="port.modulation" formControlName="newModulation">
diff --git a/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.ts b/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.ts
index 56bd85c..9af7bf7 100644
--- a/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.ts
+++ b/apps/roadm/web/roadm-gui/projects/roadm-gui-lib/src/lib/port/port.component.ts
@@ -81,9 +81,11 @@
 
     powerForm: FormGroup;
     modulationForm: FormGroup;
+    freqForm: FormGroup;
     SET_POWER_REQ = 'roadmSetTargetPowerRequest';
     SET_POWER_RESP = 'roadmSetTargetPowerResponse';
     SET_MODULATION = 'roadmSetModulationRequest';
+    SET_FREQUENCY = 'roadmSetFrequencyRequest';
 
     restorePrefsConfig; // Function
 
@@ -135,6 +137,9 @@
         this.modulationForm = new FormGroup({
             newModulation: new FormControl(''),
         });
+        this.freqForm = new FormGroup({
+            newFreq: new FormControl(''),
+        });
         this.log.debug('Create Forms');
     }
 
@@ -223,6 +228,15 @@
         });
     }
 
+    submitFrequency(devId, port) {
+        this.log.debug('Set Frequency of port ', port, 'in device ', devId, 'as value ', this.freqForm.value['newFreq']);
+        this.wss.sendEvent(this.SET_FREQUENCY, {
+            'currFreq': this.freqForm.value['newFreq'],
+            'devId': devId,
+            'id': port,
+        });
+    }
+
     powerConfigCb(data) {
         if (!data.valid) {
             const info = 'The power config operation is failed. The reason is: \n' + data.message;