TRIX-22 fixed illegible memory/disk filters

This commit is contained in:
Dragos 2021-05-31 17:19:33 +03:00
parent 386b3593eb
commit d131f092a0
2 changed files with 28 additions and 48 deletions

View File

@ -142,7 +142,8 @@
<!-- Volumes and disks --> <!-- Volumes and disks -->
<div class="mt-3 d-flex flex-column"> <div class="mt-3 d-flex flex-column">
<button class="btn btn-outline-info text-start mb-2" (click)="showVolumes = !showVolumes"> <button class="btn text-start mb-2" [class.btn-outline-info]="!showVolumes" [class.btn-info]="showVolumes"
(click)="showVolumes = !showVolumes">
Volumes Volumes
<fa-icon icon="angle-right" [fixedWidth]="true" [rotate]="showVolumes ? 90 : 0" class="float-end"></fa-icon> <fa-icon icon="angle-right" [fixedWidth]="true" [rotate]="showVolumes ? 90 : 0" class="float-end"></fa-icon>
</button> </button>
@ -192,60 +193,37 @@
<!-- Affinity settings --> <!-- Affinity settings -->
<div class="mt-3 d-flex flex-column" *ngIf="instances && instances.length"> <div class="mt-3 d-flex flex-column" *ngIf="instances && instances.length">
<button class="btn btn-outline-info text-start w-100 mb-2" (click)="showAffinity = !showAffinity"> <button class="btn text-start w-100 mb-2" [class.btn-outline-info]="!showAffinity" [class.btn-info]="showAffinity"
Affinity (click)="showAffinity = !showAffinity">
Affinity rules
<fa-icon icon="angle-right" [fixedWidth]="true" [rotate]="showAffinity ? 90 : 0" class="float-end"></fa-icon> <fa-icon icon="angle-right" [fixedWidth]="true" [rotate]="showAffinity ? 90 : 0" class="float-end"></fa-icon>
</button> </button>
<div [collapse]="!showAffinity"> <div [collapse]="!showAffinity">
<div class="row"> <div class="row">
<div class="col-sm-6" formGroupName="affinity"> <div class="col-sm-4">
<h5>Place close to</h5> <select class="form-select" name="operator">
<option></option>
<div class="select-list" tabindex="0"> <option value="==">Must be close to instances</option>
<div class="form-check"> <option value="==~">Should be close to instances</option>
<input class="form-check-input" type="radio" id="closeTo" [value]="null" formControlName="closeTo"> <option value="!=">Must be far from instances</option>
<label class="form-check-label" for="closeTo"> <option value="!=~">Should be far from instances</option>
(no preference) </select>
</label>
</div>
<div class="form-check" *ngFor="let instance of instances">
<input class="form-check-input" type="radio" id="closeTo-{{ instance.id }}" [value]="instance.id" formControlName="closeTo">
<label class="form-check-label" for="closeTo-{{ instance.id }}">
{{ instance.name }}
</label>
</div>
</div>
</div> </div>
<div class="col-sm-3">
<div class="col-sm-6" formGroupName="affinity"> <select class="form-select" name="target">
<h5>Place far from</h5> <option></option>
<option value="instance">Named like</option>
<div class="select-list" tabindex="0"> <option value="tagName">Tagged with</option>
<div class="form-check"> </select>
<input class="form-check-input" type="radio" id="farFrom" [value]="null" formControlName="farFrom">
<label class="form-check-label" for="farFrom">
(no preference)
</label>
</div>
<div class="form-check" *ngFor="let instance of instances">
<input class="form-check-input" type="radio" id="farFrom-{{ instance.id }}" [value]="instance.id" formControlName="farFrom">
<label class="form-check-label" for="farFrom-{{ instance.id }}">
{{ instance.name }}
</label>
</div>
</div>
</div> </div>
<div class="col-sm-4">
<div class="col-sm" formGroupName="affinity"> <input type="text" class="form-control" placeholder="Value">
<div class="form-check ms-0"> </div>
<input class="form-check-input" type="checkbox" id="strict" formControlName="strict"> <div class="col-sm-1">
<label class="form-check-label" for="strict"> <button class="btn btn-outline-info">
Provision only when the affinity criteria are met <fa-icon icon="plus"></fa-icon>
</label> </button>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -372,6 +372,8 @@ export class InstanceWizardComponent implements OnInit, OnDestroy
mountpoint: volume.mountpoint mountpoint: volume.mountpoint
})); }));
console.log(this.editorForm.get('affinity'));
this.instancesService.add(instance) this.instancesService.add(instance)
.subscribe(x => .subscribe(x =>
{ {