mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2025-07-31 17:38:28 +00:00
[ACA-19] Search libraries improvements (#792)
* [ACA-19][ACA-1967] set Libraries columns according to updated requirement * [ACA-19] search term length hint & singular result translation fixes also [ACA-1933]
This commit is contained in:
committed by
Denys Vuika
parent
4a420cc9f9
commit
aeb8ddd1f2
@@ -13,9 +13,9 @@
|
||||
[(ngModel)]="searchTerm"
|
||||
(ngModelChange)="inputChange($event)"
|
||||
(keyup.enter)="searchSubmit($event)">
|
||||
<mat-placeholder class="placeholder" *ngIf="!searchTerm.length">{{ 'SEARCH.INPUT.PLACEHOLDER' | translate }}</mat-placeholder>
|
||||
<mat-placeholder class="placeholder" *ngIf="!searchTerm.length">{{ 'SEARCH.INPUT.PLACEHOLDER' | translate }}</mat-placeholder>
|
||||
|
||||
<div matSuffix class="app-suffix-search-icon-wrapper">
|
||||
<div matSuffix class="app-suffix-search-icon-wrapper">
|
||||
<mat-icon>arrow_drop_down</mat-icon>
|
||||
</div>
|
||||
</mat-form-field>
|
||||
|
@@ -85,4 +85,10 @@ export class SearchInputControlComponent implements OnDestroy {
|
||||
this.searchTerm = '';
|
||||
this.searchChange.emit('');
|
||||
}
|
||||
|
||||
isTermTooShort() {
|
||||
const alphanumericTerm = this.searchTerm.replace(/[^0-9a-z]/gi, '');
|
||||
|
||||
return this.searchTerm.length && alphanumericTerm.length < 2;
|
||||
}
|
||||
}
|
||||
|
@@ -2,7 +2,7 @@
|
||||
<button mat-icon-button
|
||||
class="app-search-button"
|
||||
[title]="'SEARCH.BUTTON.TOOLTIP' | translate">
|
||||
<mat-icon [attr.aria-label]="'SEARCH.BUTTON.ARIA-LABEL' | translate">search</mat-icon>
|
||||
<mat-icon [attr.aria-label]="'SEARCH.BUTTON.ARIA-LABEL' | translate">search</mat-icon>
|
||||
</button>
|
||||
<mat-form-field class="app-input-form-field">
|
||||
<input matInput
|
||||
@@ -10,11 +10,11 @@
|
||||
[type]="'text'"
|
||||
[disabled]="true"
|
||||
[value]="searchedWord">
|
||||
<mat-placeholder class="placeholder" *ngIf="!searchedWord.length">{{ 'SEARCH.INPUT.PLACEHOLDER' | translate }}</mat-placeholder>
|
||||
<mat-placeholder class="placeholder" *ngIf="!searchedWord.length">{{ 'SEARCH.INPUT.PLACEHOLDER' | translate }}</mat-placeholder>
|
||||
|
||||
<div matSuffix class="app-suffix-search-icon-wrapper">
|
||||
<mat-icon>arrow_drop_down</mat-icon>
|
||||
</div>
|
||||
<div matSuffix class="app-suffix-search-icon-wrapper">
|
||||
<mat-icon>arrow_drop_down</mat-icon>
|
||||
</div>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
@@ -24,14 +24,16 @@
|
||||
(submit)="onSearchSubmit($event)"
|
||||
(searchChange)="onSearchChange($event)">
|
||||
</app-search-input-control>
|
||||
<mat-hint *ngIf="hasLibraryConstraint()" class="app-search-hint">{{ 'SEARCH.INPUT.HINT' | translate }}</mat-hint>
|
||||
|
||||
<div id="search-options">
|
||||
<mat-checkbox *ngFor="let option of searchOptions"
|
||||
<mat-checkbox *ngFor="let option of searchOptions"
|
||||
id="{{ option.id }}"
|
||||
[(ngModel)]="option.value"
|
||||
[disabled]="option.shouldDisable()"
|
||||
(change)="onOptionChange()"
|
||||
(click)="$event.stopPropagation()">
|
||||
{{ option.key | translate }}
|
||||
</mat-checkbox>
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
@@ -88,3 +88,9 @@ $top-margin: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.app-search-hint {
|
||||
position: absolute;
|
||||
font-size: 12px;
|
||||
padding-left: 17px;
|
||||
}
|
||||
|
@@ -210,4 +210,11 @@ export class SearchInputComponent implements OnInit {
|
||||
isContentChecked(): boolean {
|
||||
return this.isFilesChecked() || this.isFoldersChecked();
|
||||
}
|
||||
|
||||
hasLibraryConstraint(): boolean {
|
||||
if (this.isLibrariesChecked()) {
|
||||
return this.searchInputControl.isTermTooShort();
|
||||
}
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
@@ -21,7 +21,10 @@
|
||||
</mat-progress-bar>
|
||||
<div class="adf-search-results__content-header content" *ngIf="data?.list.entries.length">
|
||||
<div class="content__side--left">
|
||||
<div class="adf-search-results--info-text">{{ 'APP.BROWSE.SEARCH_LIBRARIES.FOUND_RESULTS' | translate: { number: totalResults } }}</div>
|
||||
<div class="adf-search-results--info-text"
|
||||
*ngIf="totalResults !== 1">{{ 'APP.BROWSE.SEARCH_LIBRARIES.FOUND_RESULTS' | translate: { number: totalResults } }}</div>
|
||||
<div class="adf-search-results--info-text"
|
||||
*ngIf="totalResults === 1">{{ 'APP.BROWSE.SEARCH_LIBRARIES.FOUND_ONE_RESULT' | translate: { number: totalResults } }}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@@ -24,7 +24,10 @@
|
||||
</mat-progress-bar>
|
||||
<div class="adf-search-results__content-header content" *ngIf="data?.list.entries.length">
|
||||
<div class="content__side--left">
|
||||
<div class="adf-search-results--info-text">{{ 'APP.BROWSE.SEARCH.FOUND_RESULTS' | translate: { number: totalResults } }}</div>
|
||||
<div class="adf-search-results--info-text"
|
||||
*ngIf="totalResults !== 1">{{ 'APP.BROWSE.SEARCH.FOUND_RESULTS' | translate: { number: totalResults } }}</div>
|
||||
<div class="adf-search-results--info-text"
|
||||
*ngIf="totalResults === 1">{{ 'APP.BROWSE.SEARCH.FOUND_ONE_RESULT' | translate: { number: totalResults } }}</div>
|
||||
|
||||
<div class="adf-search-results__facets">
|
||||
<adf-search-chip-list [searchFilter]="searchFilter"></adf-search-chip-list>
|
||||
|
Reference in New Issue
Block a user