Add AC and ANR services

[portal/ric-dashboard.git] / webapp-frontend / src / app / signal / signal.component.ranconnect-dialog.html

diff --git a/webapp-frontend/src/app/signal/signal.component.ranconnect-dialog.html b/webapp-frontend/src/app/signal/signal.component.ranconnect-dialog.html
index 25b1a28..a8e17ce 100644 (file)
--- a/webapp-frontend/src/app/signal/signal.component.ranconnect-dialog.html
+++ b/webapp-frontend/src/app/signal/signal.component.ranconnect-dialog.html
@@ -22,35 +22,34 @@
     Setup RAN Connection
 </div>
 
-<form [formGroup]="ranDialogForm" novalidate autocomplete="off">
+<form [formGroup]="ranDialogForm" novalidate autocomplete="off" (ngSubmit)="setupConnection(ranDialogForm.value)">
   <div mat-dialog-content>
+    <div name="rantype">
+      <label id="request-type-radio-group-label">Select the RAN type:</label>
+      <mat-radio-group aria-label="RAN type" formControlName="ranType">
+        <mat-radio-button value="endc">EN-DC</mat-radio-button>
+        <mat-radio-button value="x2">X2</mat-radio-button>
+      </mat-radio-group>
+    </div>
     <mat-form-field class="input-display-block">
-      <input matInput type="text" placeholder="eNB/gNB Name" [(ngModel)]="data.ranName" formControlName="ranName">
-      <mat-hint align="end">Not more then 50 characters long.</mat-hint>
+      <input matInput type="text" placeholder="eNB/gNB Name" formControlName="ranName">
+      <mat-hint align="end">Example: ABCD123456</mat-hint>
       <mat-error *ngIf="validateControl('ranName') && hasError('ranName', 'required')">Name is required</mat-error>
       <mat-error *ngIf="hasError('ranName', 'length')">Valid name is required</mat-error>
     </mat-form-field>
     <mat-form-field class="input-display-block">
-      <input matInput type="text" placeholder="IP" [(ngModel)]="data.ranIp" formControlName="ranIp">
+      <input matInput type="text" placeholder="IP" formControlName="ranIp">
       <mat-error *ngIf="validateControl('ranIp') && hasError('ranIp', 'required')">IP is required</mat-error>
       <mat-error *ngIf="hasError('ranIp', 'pattern')">Valid IP is required</mat-error>
     </mat-form-field>
     <mat-form-field class="input-display-block">
-      <input matInput type="text" placeholder="Port" [(ngModel)]="data.ranPort" formControlName="ranPort">
+      <input matInput type="text" placeholder="Port" formControlName="ranPort">
       <mat-error *ngIf="validateControl('ranPort') && hasError('ranPort', 'required')">Port is required</mat-error>
       <mat-error *ngIf="hasError('ranPort', 'pattern')">Valid port number is required</mat-error>
     </mat-form-field>
   </div>
   <div mat-dialog-actions class="modal-footer justify-content-center">
-    <button class="mat-raised-button" (click)="close()">Cancel</button>
-    <button class="mat-raised-button mat-primary"
-      [disabled]="(validateControl('ranName') && hasError('ranName', 'required'))
-      || (validateControl('ranIp') && hasError('ranIp', 'required'))
-      || (validateControl('ranPort') && hasError('ranPort', 'required'))
-      || hasError('ranName', 'maxlength')
-      || hasError('ranIp', 'pattern')
-      || hasError('ranPort', 'pattern')
-      || (!data.ranName || !data.ranIp || !data.ranPort)"
-       (click)="connectRAN()">Connect</button>
+    <button class="mat-raised-button" (click)="onCancel()">Cancel</button>
+    <button class="mat-raised-button mat-primary" [disabled]="!ranDialogForm.valid">Connect</button>
   </div>
 </form>