UX and CSS improvements
testing/ogGui-multibranch/pipeline/head There was a failure building this commit Details

pull/13/head
Manuel Aranda Rosales 2025-03-05 17:33:11 +01:00
parent 2b69ef3bd6
commit 754dc8ed15
5 changed files with 62 additions and 49 deletions

View File

@ -31,6 +31,10 @@ table {
gap: 10px; gap: 10px;
} }
.options-container {
padding: 10px;
}
.select-container { .select-container {
margin-top: 20px; margin-top: 20px;
align-items: center; align-items: center;

View File

@ -89,12 +89,13 @@
</table> </table>
<mat-divider></mat-divider> <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')" class="input-group">Opciones multicast</h3>
<h3 *ngIf="isMethod('p2p')" class="input-group">Opciones torrent</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')" class="input-group">
<mat-form-field appearance="fill" class="input-field"> <mat-form-field appearance="fill" class="input-field">
<mat-label>Puerto</mat-label> <mat-label>Puerto</mat-label>
<input matInput [(ngModel)]="mcastPort" name="mcastPort"> <input matInput [(ngModel)]="mcastPort" name="mcastPort" type="number">
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" class="input-field"> <mat-form-field appearance="fill" class="input-field">
@ -113,7 +114,7 @@
<mat-form-field appearance="fill" class="input-field"> <mat-form-field appearance="fill" class="input-field">
<mat-label>Velocidad</mat-label> <mat-label>Velocidad</mat-label>
<input matInput [(ngModel)]="mcastSpeed" name="mcastSpeed"> <input matInput [(ngModel)]="mcastSpeed" name="mcastSpeed" type="number">
</mat-form-field> </mat-form-field>
<mat-form-field appearance="fill" class="input-field"> <mat-form-field appearance="fill" class="input-field">
@ -142,3 +143,5 @@
<input matInput [(ngModel)]="p2pTime" name="p2pTime" type="number"> <input matInput [(ngModel)]="p2pTime" name="p2pTime" type="number">
</mat-form-field> </mat-form-field>
</div> </div>
</div>

View File

@ -24,7 +24,7 @@ export class DeployImageComponent {
selectedMethod: string | null = null; selectedMethod: string | null = null;
selectedPartition: any = null; selectedPartition: any = null;
mcastIp: string = ''; mcastIp: string = '';
mcastPort: string = ''; mcastPort: Number = 0;
mcastMode: string = ''; mcastMode: string = '';
mcastSpeed: Number = 0; mcastSpeed: Number = 0;
mcastMaxClients: Number = 0; mcastMaxClients: Number = 0;

View File

@ -45,7 +45,7 @@
{{ option.name }} {{ option.name }}
</mat-option> </mat-option>
</mat-select> </mat-select>
<button *ngIf="filters['status']" mat-icon-button matSuffix aria-label="Clear tree search" (click)="filters['status'] = ''; loadData()"> <button *ngIf="filters['status']" mat-icon-button matSuffix aria-label="Clear tree search" (click)="clearStatusFilter($event)">
<mat-icon>close</mat-icon> <mat-icon>close</mat-icon>
</button> </button>
</mat-form-field> </mat-form-field>

View File

@ -96,6 +96,12 @@ export class ShowClientsComponent implements OnInit {
this.dialogRef.close(); this.dialogRef.close();
} }
clearStatusFilter(event: Event) {
event.stopPropagation();
delete this.filters['status'];
this.loadData();
}
onPageChange(event: any) { onPageChange(event: any) {
this.page = event.pageIndex; this.page = event.pageIndex;
this.itemsPerPage = event.pageSize; this.itemsPerPage = event.pageSize;