MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Explore Datasets Fix 

Search Css Fix
This commit is contained in:
Diamantis Tziotzios 2019-02-08 18:35:35 +02:00
parent 6620c6625a
commit 35d85f5f6e
6 changed files with 45 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
dmp-frontend/src/app/ui/explore-dataset/explore-dataset-listing.component.ts
View File

@ -23,7 +23,7 @@ export class ExploreDatasetListingComponent extends BaseComponent implements OnI
@ViewChild(MatPaginator) _paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
criteria: ExploreDatasetCriteriaModel;
criteria: ExploreDatasetCriteriaModel = new ExploreDatasetCriteriaModel();
dataSource: DatasetDataSource | null;
displayedColumns: String[] = ['label', 'project', 'profile', 'description', 'created'];
@ -59,7 +59,7 @@ export class ExploreDatasetListingComponent extends BaseComponent implements OnI
}
onCriteriaChange(event: ExploreDatasetCriteriaModel) {
//console.log(event)
console.log(event)
this.criteria = event;
this.refresh();
}
@ -118,7 +118,7 @@ export class DatasetDataSource extends DataSource<DatasetListingModel> {
let fields: Array<string> = new Array();
if (this._sort.active) { fields = this._sort.direction === 'asc' ? ['+' + this._sort.active] : ['-' + this._sort.active]; }
const request = new DataTableRequest<ExploreDatasetCriteriaModel>(startIndex, this._paginator.pageSize, { fields: fields });
request.criteria = new ExploreDatasetCriteriaModel();
request.criteria = this._criteria;
//if (this.dmpId) request.criteria.allVersions = true;
return this._service.getPublicPaged(request);
})
@ -130,10 +130,10 @@ export class DatasetDataSource extends DataSource<DatasetListingModel> {
});
//this._criteria.criteria.onCallbackError(error);
return Observable.of(null);
})*/
})
.map(result => {
return result;
})
})*/
.map(result => {
if (!result) { return []; }
if (this._paginator.pageIndex === 0) { this.totalCount = result.totalCount; }

6
dmp-frontend/src/app/ui/explore-dataset/filters/explore-dataset-filter-item/explore-dataset-filter-item.component.html
View File

@ -3,14 +3,18 @@
<input type="text" placeholder="{{ 'FACET-SEARCH.FILTER' | translate }}" matInput [formControl]="optionSearchControl">
</mat-form-field>
</div>
<mat-chip-list *ngIf="searchEnabled">
<mat-chip [removable]="true" (removed)="removeOption(option)" *ngFor="let option of selectedOptions">{{
displayLabel(option) }}
<mat-icon matChipRemove>cancel</mat-icon>
</mat-chip>
</mat-chip-list>
<div class="data-expand-panel">
<mat-selection-list #optionsList (selectionChange)="selectionChanged($event)">
<mat-list-option class="facet-option-item" *ngFor="let option of (options | async) | slice:0:10" [value]="option" [selected]="isOptionSelected(option)">
<mat-list-option class="facet-option-item" *ngFor="let option of (options | async)" [value]="option" [selected]="isOptionSelected(option)">
<p>{{ displayLabel(option) }}</p>
</mat-list-option>
</mat-selection-list>
</div>

8
dmp-frontend/src/app/ui/explore-dataset/filters/explore-dataset-filter-item/explore-dataset-filter-item.component.scss
View File

@ -1,10 +1,14 @@
.facet-option-item {
height: auto !important;
min-height: 48px;
padding: 0.5em;
.mat-list-item-content {
min-height: inherit;
}
}
.data-expand-panel{
max-height: 20em;
overflow-x: hidden;
overflow-y: auto;
}

24
dmp-frontend/src/app/ui/explore-dataset/filters/explore-dataset-filters.component.html
View File

@ -7,12 +7,14 @@
</mat-expansion-panel-header>
<div>
<mat-form-field>
<input matInput placeholder="{{'CRITERIA.PROJECTS.LIKE'| translate}}" name="datasetCriteriaName" [(ngModel)]="facetCriteria.like" (ngModelChange)="controlModified()">
<input matInput placeholder="{{'CRITERIA.PROJECTS.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 [(ngModel)]="facetCriteria.tags" (ngModelChange)="controlModified()" placeholder="{{'CRITERIA.DATA-SETS.TAGS' | translate}}"
[configuration]="tagsAutoCompleteConfiguration">
</app-multiple-auto-complete>
</mat-form-field>
</div>
@ -23,8 +25,8 @@
{{ 'FACET-SEARCH.PROJECT-STATUS.TITLE' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<app-explore-dataset-filter-item-component [multipleSelect]="false" [options]="this.projectStateOptions" (selectedChanged)="projectStatusChanged($event)" [displayTitleFunc]="displayProjectStateLabel" [displayValueFunc]="displayProjectStateValue">
<app-explore-dataset-filter-item-component [multipleSelect]="false" [options]="this.projectStateOptions"
(selectedChanged)="projectStatusChanged($event)" [displayTitleFunc]="displayProjectStateLabel" [displayValueFunc]="displayProjectStateValue">
</app-explore-dataset-filter-item-component>
</mat-expansion-panel>
<mat-expansion-panel *ngIf="this.facetCriteria.projectStatus == ProjectStateType.OnGoing || this.facetCriteria.projectStatus == ProjectStateType.Finished">
@ -33,8 +35,9 @@
{{ 'FACET-SEARCH.PROJECT.TITLE' | translate }}
</mat-panel-title>
</mat-expansion-panel-header>
<app-explore-dataset-filter-item-component [options]="this.projects" (selectedChanged)="projectChanged($event)" [filterOptions]="projectSearch.bind(this)" [searchEnabled]="true" (optionRemoved)="removeProject($event)" [displayTitleFunc]="displayProjectLabel" [displayValueFunc]="displayProjectValue">
<app-explore-dataset-filter-item-component [options]="this.projects" (selectedChanged)="projectChanged($event)"
[filterOptions]="projectSearch.bind(this)" [searchEnabled]="true" (optionRemoved)="removeProject($event)"
[displayTitleFunc]="displayProjectLabel" [displayValueFunc]="displayProjectValue">
</app-explore-dataset-filter-item-component>
</mat-expansion-panel>
<mat-expansion-panel>
@ -43,7 +46,9 @@
{{ '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 [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>
@ -52,8 +57,9 @@
{{ '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 [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>

6
dmp-frontend/src/app/ui/misc/navigation/navigation.component.html
View File

@ -24,8 +24,10 @@
<input type="text" placeholder="{{'DASHBOARD.SEARCH' | translate}}" matInput [formControl]="searchControl"
[matAutocomplete]="auto">
<mat-autocomplete autoActiveFirstOption #auto="matAutocomplete" (optionSelected)="onOptionSelected($event)">
<mat-option *ngFor="let option of filteredOptions | async" [value]="option" class="transformation-value-mat-option">
<small>{{transformType(option.type)}} : {{option.label}}</small>
<mat-option *ngFor="let option of filteredOptions | async" [value]="option" class="transformation-value-mat-option two-line-mat-option">
<span>{{option.label}}</span>
<br>
<small>{{transformType(option.type)}}</small>
</mat-option>
</mat-autocomplete>
</mat-form-field>

5
dmp-frontend/src/app/ui/misc/navigation/navigation.component.scss
View File

@ -21,6 +21,7 @@
margin-right: 30px;
margin-left: 20px;
}
}
.progress-bar {
@ -32,6 +33,10 @@
}
}
.two-line-mat-option {
height: 3.5em;
line-height: 1.2em;
}
.buttonNav:hover {
color: aliceblue;