You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
argos/dmp-frontend/src/app/ui/explore-dataset/filters/explore-dataset-filters.com...

130 lines
6.9 KiB
HTML

<div class="filters">
<h6 class="filters-title">{{'CRITERIA.FILTERS'| translate}}</h6>
<div class="row" style="justify-content: center;">
<mat-form-field class="col-11 search">
<input matInput placeholder="{{'CRITERIA.GRANTS.LIKE'| translate}}" name="dmpCriteriaName" [(ngModel)]="facetCriteria.like" (ngModelChange)="controlModified()">
<mat-icon matSuffix class="style-icon">search</mat-icon>
<app-multiple-auto-complete [(ngModel)]="facetCriteria.tags" (ngModelChange)="controlModified()" placeholder="{{'CRITERIA.DATA-SETS.TAGS' | translate}}" [configuration]="tagsAutoCompleteConfiguration">
</app-multiple-auto-complete>
</mat-form-field>
<div class="col-10 gray-container">
<h6 class="category-title">{{ 'FACET-SEARCH.GRANT-STATUS.TITLE' | translate }}</h6>
<mat-radio-group>
<mat-list-item><mat-radio-button value="null" checked (change)="grantStatusChanged($event)">{{ 'FACET-SEARCH.GRANT-STATUS.OPTIONS.ANY' | translate }}</mat-radio-button></mat-list-item>
<mat-list-item><mat-radio-button value="0" (change)="grantStatusChanged($event)">{{ 'FACET-SEARCH.GRANT-STATUS.OPTIONS.ACTIVE' | translate }}</mat-radio-button></mat-list-item>
<mat-list-item><mat-radio-button value="1" (change)="grantStatusChanged($event)">{{ 'FACET-SEARCH.GRANT-STATUS.OPTIONS.INACTIVE' | translate }}</mat-radio-button></mat-list-item>
</mat-radio-group>
</div>
<div class="col-10 gray-container">
<h6 class="category-title">{{'CRITERIA.DATA-SETS.RELATED-DMP' | translate}}</h6>
<mat-form-field>
<app-multiple-auto-complete placeholder="{{'CRITERIA.DATA-SETS.SELECT-DMP' | translate }}" [configuration]="dmpAutoCompleteConfiguration" (optionSelected)="onDmpOptionSelected($event)" (optionRemoved)="onDmpOptionRemoved($event)">
</app-multiple-auto-complete>
</mat-form-field>
</div>
<div class="col-10 gray-container">
<h6 class="category-title">{{ 'FACET-SEARCH.GRANT.TITLE' | translate }}</h6>
<mat-form-field>
<app-multiple-auto-complete placeholder="{{ 'CRITERIA.DATA-SETS.SELECT-GRANTS' | translate }}" [configuration]="grantAutoCompleteConfiguration" (optionSelected)="onGrantOptionSelected($event)" (optionRemoved)="onGrantOptionRemoved($event)">
</app-multiple-auto-complete>
</mat-form-field>
</div>
<div class="col-10 gray-container">
<h6 class="category-title">{{ 'FACET-SEARCH.PROFILES.TITLE' | translate }}</h6>
<mat-form-field>
<app-multiple-auto-complete placeholder="{{ 'CRITERIA.DATA-SETS.SELECT-SPEC' | translate }}" [configuration]="profileAutoCompleteConfiguration" (optionSelected)="onProfileOptionSelected($event)" (optionRemoved)="onProfileOptionRemoved($event)">
</app-multiple-auto-complete>
</mat-form-field>
</div>
<div *ngIf="isAuthenticated()" class="col-10 gray-container">
<h6 class="category-title">{{ 'FACET-SEARCH.ROLE.TITLE' | translate }}</h6>
<mat-radio-group>
<mat-list-item><mat-radio-button value="null" checked (change)="roleChanged($event)">{{ 'FACET-SEARCH.ROLE.ANY' | translate }}</mat-radio-button></mat-list-item>
<mat-list-item><mat-radio-button value="0" (change)="roleChanged($event)">{{ 'FACET-SEARCH.ROLE.OWNER' | translate }}</mat-radio-button></mat-list-item>
<mat-list-item><mat-radio-button value="1" (change)="roleChanged($event)">{{ 'FACET-SEARCH.ROLE.MEMBER' | translate }}</mat-radio-button></mat-list-item>
</mat-radio-group>
</div>
<div class="col-10 gray-container">
<h6 class="category-title">{{ 'FACET-SEARCH.DMP-ORGANISATIONS.TITLE' | translate }}</h6>
<mat-form-field>
<app-multiple-auto-complete placeholder="{{ 'CRITERIA.DATA-SETS.SELECT-ORGANIZATIONS' | translate }}" [configuration]="organizationAutoCompleteConfiguration" (optionSelected)="onOrganizationOptionSelected($event)" (optionRemoved)="onOrganizationOptionRemoved($event)">
</app-multiple-auto-complete>
</mat-form-field>
</div>
</div>
</div>
<!-- <mat-accordion #facetAccordion="matAccordion" [multi]="true" class="facet-search-component">
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
{{ 'FACET-SEARCH.FILTER' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<div>
<mat-form-field>
<input matInput placeholder="{{'CRITERIA.GRANTS.LIKE'| translate}}" name="datasetCriteriaName" [(ngModel)]="facetCriteria.like"
(ngModelChange)="controlModified()">
</mat-form-field>
</div>
<div>
<mat-form-field>
<app-multiple-auto-complete [(ngModel)]="facetCriteria.tags" (ngModelChange)="controlModified()" placeholder="{{'CRITERIA.DATA-SETS.TAGS' | translate}}"
[configuration]="tagsAutoCompleteConfiguration">
</app-multiple-auto-complete>
</mat-form-field>
</div>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
{{ 'FACET-SEARCH.GRANT-STATUS.TITLE' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<app-explore-dataset-filter-item-component [multipleSelect]="false" [options]="this.grantStateOptions"
(selectedChanged)="grantStatusChanged($event)" [displayTitleFunc]="displayGrantStateLabel" [displayValueFunc]="displayGrantStateValue">
</app-explore-dataset-filter-item-component>
</mat-expansion-panel>
<mat-expansion-panel *ngIf="this.facetCriteria.grantStatus == GrantStateType.OnGoing || this.facetCriteria.grantStatus == GrantStateType.Finished">
<mat-expansion-panel-header>
<mat-panel-title>
{{ 'FACET-SEARCH.GRANT.TITLE' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<app-explore-dataset-filter-item-component [options]="this.grants" (selectedChanged)="grantChanged($event)"
[filterOptions]="grantSearch.bind(this)" [searchEnabled]="true" (optionRemoved)="removeGrant($event)"
[displayTitleFunc]="displayGrantLabel" [displayValueFunc]="displayGrantValue">
</app-explore-dataset-filter-item-component>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
{{ 'FACET-SEARCH.PROFILES.TITLE' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<app-explore-dataset-filter-item-component [options]="this.profiles" (selectedChanged)="profileChanged($event)"
[filterOptions]="profileSearch.bind(this)" (optionRemoved)="removeProfile($event)" [displayTitleFunc]="displayProfileLabel"
[displayValueFunc]="displayProfileValue">
</app-explore-dataset-filter-item-component>
</mat-expansion-panel>
<mat-expansion-panel>
<mat-expansion-panel-header>
<mat-panel-title>
{{ 'FACET-SEARCH.DMP-ORGANISATIONS.TITLE' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<app-explore-dataset-filter-item-component [options]="this.dmpOrganisations" (selectedChanged)="dmpOrganisationChanged($event)"
[filterOptions]="dmpOrganisationSearch.bind(this)" (optionRemoved)="removeOrganisation($event)" [searchEnabled]="true"
[displayTitleFunc]="displayDmpOrganisationsLabel" [displayValueFunc]="displayDmpOrganisationsValue">
</app-explore-dataset-filter-item-component>
</mat-expansion-panel>
</mat-accordion> -->