mirror of https://github.com/goharbor/harbor.git
96 lines
3.9 KiB
HTML
96 lines
3.9 KiB
HTML
<div #filterArea id="filterArea" class="clr-row">
|
|
<clr-icon
|
|
id="{{ searchId }}"
|
|
*ngIf="!opened"
|
|
shape="search"
|
|
size="20"
|
|
class="search-btn"
|
|
(click)="opened = true; dropdownOpened = true"></clr-icon>
|
|
|
|
<ng-container *ngIf="opened">
|
|
<div class="clr-control-container m-r-10px">
|
|
<div class="clr-select-wrapper">
|
|
<select
|
|
id="{{ typeSelectId }}"
|
|
class="clr-select"
|
|
[(ngModel)]="filterByType"
|
|
(change)="selectFilterType()">
|
|
<option
|
|
*ngFor="let filter of multipleFilter"
|
|
value="{{ filter.filterBy }}">
|
|
{{ filter.filterByShowText | translate }}
|
|
</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="dropdown" [class.open]="dropdownOpened">
|
|
<div
|
|
class="dropdown-toggle border-bottom-color"
|
|
(click)="dropdownOpened = !dropdownOpened">
|
|
<clr-icon
|
|
class="search-dropdown-toggle"
|
|
shape="search"
|
|
size="20"
|
|
(click)="opened = false"></clr-icon>
|
|
|
|
<div class="clr-control-container" *ngIf="!selectedValue">
|
|
<div class="clr-input-wrapper">
|
|
<input
|
|
[readonly]="filterByType !== 'tags'"
|
|
placeholder="{{
|
|
'ARTIFACT.FILTER_FOR_ARTIFACTS' | translate
|
|
}}"
|
|
[(ngModel)]="inputTag"
|
|
(keyup)="searchByInputTag()"
|
|
class="clr-input no-outline" />
|
|
</div>
|
|
</div>
|
|
<span *ngIf="selectedValue">
|
|
<span *ngIf="filterByType === 'labels'"
|
|
><hbr-label-piece
|
|
[label]="selectedValue"></hbr-label-piece
|
|
></span>
|
|
<span *ngIf="filterByType !== 'labels'">{{
|
|
selectedValue
|
|
}}</span>
|
|
</span>
|
|
</div>
|
|
<div class="dropdown-menu">
|
|
<ng-container
|
|
*ngIf="filterByType === multipleFilter[0].filterBy">
|
|
<div
|
|
(click)="selectValue(item)"
|
|
class="dropdown-item"
|
|
*ngFor="let item of multipleFilter[0].listItem">
|
|
{{ item.showItem | translate }}
|
|
</div>
|
|
</ng-container>
|
|
<ng-container
|
|
*ngIf="filterByType === multipleFilter[1].filterBy">
|
|
<div
|
|
(click)="selectValue(item)"
|
|
class="dropdown-item"
|
|
*ngFor="let item of multipleFilter[1].listItem">
|
|
{{ item.showItem | translate }}
|
|
</div>
|
|
</ng-container>
|
|
<ng-container
|
|
*ngIf="filterByType === multipleFilter[2].filterBy">
|
|
<label class="clr-control-label">{{
|
|
'REPOSITORY.FILTER_ARTIFACT_BY_LABEL' | translate
|
|
}}</label>
|
|
<app-label-selector
|
|
(clickLabel)="selectValue($event)"
|
|
[scope]="'p'"
|
|
[projectId]="projectId"
|
|
[dropdownOpened]="dropdownOpened"
|
|
[width]="200"
|
|
[ownedLabels]="getSelectLabel()">
|
|
</app-label-selector>
|
|
</ng-container>
|
|
</div>
|
|
</div>
|
|
</ng-container>
|
|
<span class="filter-divider" *ngIf="withDivider"></span>
|
|
</div>
|