mirror of
https://github.com/goharbor/harbor.git
synced 2024-09-27 13:02:59 +02:00
Avoid menu closure when filtering labels (#19561)
1. Fixes #19554 Signed-off-by: AllForNothing <sshijun@vmware.com>
This commit is contained in:
parent
30730c6716
commit
da9e263ca7
@ -80,12 +80,13 @@
|
|||||||
</button>
|
</button>
|
||||||
<clr-dropdown-menu
|
<clr-dropdown-menu
|
||||||
[hidden]="!selectedRow.length">
|
[hidden]="!selectedRow.length">
|
||||||
<div class="filter-grid" clrDropdownItem>
|
<div class="filter-grid">
|
||||||
<label class="dropdown-header">{{
|
<label class="dropdown-header">{{
|
||||||
'REPOSITORY.ADD_LABEL_TO_IMAGE'
|
'REPOSITORY.ADD_LABEL_TO_IMAGE'
|
||||||
| translate
|
| translate
|
||||||
}}</label>
|
}}</label>
|
||||||
<app-label-selector
|
<app-label-selector
|
||||||
|
[usedInDropdown]="true"
|
||||||
[width]="200"
|
[width]="200"
|
||||||
[ownedLabels]="
|
[ownedLabels]="
|
||||||
selectedRow[0]?.labels
|
selectedRow[0]?.labels
|
||||||
|
@ -18,6 +18,27 @@
|
|||||||
(click)="goToLabelPage()">
|
(click)="goToLabelPage()">
|
||||||
{{ 'LABEL.NO_LABELS' | translate }}
|
{{ 'LABEL.NO_LABELS' | translate }}
|
||||||
</div>
|
</div>
|
||||||
|
<ng-container *ngIf="usedInDropdown; else notUsedInDropdown">
|
||||||
|
<div [hidden]="!candidateLabels.length" class="has-label">
|
||||||
|
<button
|
||||||
|
clrDropdownItem
|
||||||
|
type="button"
|
||||||
|
class="dropdown-item"
|
||||||
|
*ngFor="let label of candidateLabels"
|
||||||
|
(click)="selectLabel(label)">
|
||||||
|
<clr-icon
|
||||||
|
shape="check"
|
||||||
|
class="check-icon"
|
||||||
|
[style.visibility]="
|
||||||
|
isSelect(label) ? 'visible' : 'hidden'
|
||||||
|
">
|
||||||
|
</clr-icon>
|
||||||
|
<hbr-label-piece [label]="label" [labelWidth]="130">
|
||||||
|
</hbr-label-piece>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</ng-container>
|
||||||
|
<ng-template #notUsedInDropdown>
|
||||||
<div [hidden]="!candidateLabels.length" class="has-label">
|
<div [hidden]="!candidateLabels.length" class="has-label">
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
@ -27,11 +48,14 @@
|
|||||||
<clr-icon
|
<clr-icon
|
||||||
shape="check"
|
shape="check"
|
||||||
class="check-icon"
|
class="check-icon"
|
||||||
[style.visibility]="isSelect(label) ? 'visible' : 'hidden'">
|
[style.visibility]="
|
||||||
|
isSelect(label) ? 'visible' : 'hidden'
|
||||||
|
">
|
||||||
</clr-icon>
|
</clr-icon>
|
||||||
<hbr-label-piece [label]="label" [labelWidth]="130">
|
<hbr-label-piece [label]="label" [labelWidth]="130">
|
||||||
</hbr-label-piece>
|
</hbr-label-piece>
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</ng-template>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -31,6 +31,8 @@ const PAGE_SIZE: number = 50;
|
|||||||
styleUrls: ['./label-selector.component.scss'],
|
styleUrls: ['./label-selector.component.scss'],
|
||||||
})
|
})
|
||||||
export class LabelSelectorComponent implements OnInit, OnChanges, OnDestroy {
|
export class LabelSelectorComponent implements OnInit, OnChanges, OnDestroy {
|
||||||
|
@Input()
|
||||||
|
usedInDropdown: boolean = false;
|
||||||
@Input()
|
@Input()
|
||||||
ownedLabels: Label[] = [];
|
ownedLabels: Label[] = [];
|
||||||
@Input()
|
@Input()
|
||||||
|
Loading…
Reference in New Issue
Block a user