refs #1671. Udpated deploy method type. Added udpcast-direct'

ogWebconsole/src/app/components/groups/components/client-main-view/create-image/create-image.component.css

@@ -43,8 +43,8 @@ table {
   box-sizing: border-box;
 }
 
-.full-width {
+.custom-width {
-  width: 100%;
+  width: 50%;
   margin-bottom: 16px;
 }
 
@@ -62,7 +62,8 @@ table {
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 10px;
+  padding: 10px 10px;
+  border-bottom: 1px solid #ddd;
 }
 
 .mat-elevation-z8 {
@@ -74,3 +75,15 @@ table {
   justify-content: end;
   margin-bottom: 30px;
 }
+
+.header-container-title {
+  flex-grow: 1;
+  text-align: left;
+  padding-left: 1em;
+}
+
+.button-row {
+  display: flex;
+  padding-right: 1em;
+}
+

ogWebconsole/src/app/components/groups/components/client-main-view/create-image/create-image.component.html

@@ -6,14 +6,14 @@
       Crear imagen desde {{ clientName }}
     </h2>
   </div>
-  <div class="subnets-button-row">
+  <div class="button-row">
     <button class="action-button" (click)="save()">Ejecutar</button>
   </div>
 </div>
 <mat-divider></mat-divider>
 
 <div class="select-container">
-  <mat-form-field appearance="fill" class="full-width">
+  <mat-form-field appearance="fill" class="custom-width">
     <mat-label>Nombre canónico</mat-label>
     <input matInput [(ngModel)]="name" placeholder="Nombre canónico. En minúscula y sin espacios" required>
   </mat-form-field>

ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.css

@@ -75,6 +75,8 @@ table {
   display: flex;
   justify-content: space-between;
   align-items: center;
+  padding: 10px 10px;
+  border-bottom: 1px solid #ddd;
 }
 
 .mat-elevation-z8 {
@@ -130,3 +132,8 @@ table {
   text-align: left;
   padding-left: 1em;
 }
+
+.button-row {
+  display: flex;
+  padding-right: 1em;
+}

ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.html

@@ -6,7 +6,7 @@
       {{ 'deployImage' | translate }}
     </h2>
   </div>
-  <div class="subnets-button-row">
+  <div class="button-row">
     <button class="action-button" (click)="save()">Ejecutar</button>
   </div>
 </div>
@@ -41,13 +41,6 @@
 <mat-divider style="margin-top: 20px;"></mat-divider>
 
 <div class="select-container">
-  <div class="option-container">
-    <mat-radio-group [(ngModel)]="selectedOption" name="selectedOption" aria-label="Selecciona una opcion">
-      <mat-radio-button value="update-cache">Actualizar cache</mat-radio-button>
-      <mat-radio-button value="deploy-image">Desplegar imagen</mat-radio-button>
-    </mat-radio-group>
-  </div>
-
   <div class="deploy-container">
     <mat-form-field appearance="fill" class="full-width">
       <mat-label>Seleccione imagen</mat-label>
@@ -60,7 +53,7 @@
     <mat-form-field appearance="fill" class="full-width">
       <mat-label>Seleccione método de deploy</mat-label>
       <mat-select [(ngModel)]="selectedMethod" name="selectedMethod">
-        <mat-option *ngFor="let method of deployMethods" [value]="method">{{ method }}</mat-option>
+        <mat-option *ngFor="let method of allMethods" [value]="method">{{ method }}</mat-option>
       </mat-select>
     </mat-form-field>
   </div>
@@ -90,9 +83,9 @@
 
 <mat-divider></mat-divider>
 <div class="options-container">
-  <h3 *ngIf="isMethod('udpcast') || isMethod('uftp')" class="input-group">Opciones multicast</h3>
+  <h3 *ngIf="isMethod('udpcast') || isMethod('uftp') || isMethod('udpcast-direct')" class="input-group">Opciones multicast</h3>
   <h3 *ngIf="isMethod('p2p')" class="input-group">Opciones torrent</h3>
-  <div *ngIf="isMethod('udpcast') || isMethod('uftp')" class="input-group">
+  <div *ngIf="isMethod('udpcast') || isMethod('uftp') || isMethod('udpcast-direct')" class="input-group">
     <mat-form-field appearance="fill" class="input-field">
       <mat-label>Puerto</mat-label>
       <input matInput [(ngModel)]="mcastPort" name="mcastPort" type="number">

ogWebconsole/src/app/components/groups/components/client-main-view/deploy-image/deploy-image.component.ts

@@ -21,7 +21,6 @@ export class DeployImageComponent {
   images: any[] = [];
   clientName: string = '';
   selectedImage: any = null;
-  selectedOption: string | null = 'deploy-image';
   selectedMethod: string | null = null;
   selectedPartition: any = null;
   mcastIp: string = '';
@@ -50,18 +49,12 @@ export class DeployImageComponent {
   allMethods = [
     'uftp',
     'udpcast',
+    'udpcast-direct',
     'unicast',
     'unicast-direct',
     'p2p'
   ];
 
-  updateCacheMethods = [
-    'uftp',
-    'udpcast',
-    'unicast',
-    'p2p'
-  ];
-
   dataSource = new MatTableDataSource<any>();
   columns = [
     {
@@ -108,10 +101,6 @@ export class DeployImageComponent {
     this.loadPartitions()
   }
 
-  get deployMethods() {
-    return this.selectedOption === 'update-cache' ? this.updateCacheMethods : this.allMethods;
-  }
-
   isMethod(method: string): boolean {
     return this.selectedMethod === method;
   }