Add search field on dataset descriptions tab and fixes language

This commit is contained in:
apapachristou 2020-07-10 17:07:03 +03:00
parent b605a35cd4
commit 872e80d4b7
10 changed files with 66 additions and 17 deletions

View File

@ -2,7 +2,7 @@
<!-- Search Filter--> <!-- Search Filter-->
<mat-form-field appearance="outline" class="search-form ml-auto col-auto pr-0" floatLabel="never"> <mat-form-field appearance="outline" class="search-form ml-auto col-auto pr-0" floatLabel="never">
<mat-icon matSuffix>search</mat-icon> <mat-icon matSuffix>search</mat-icon>
<input matInput placeholder="{{'CRITERIA.DMP.LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')"> <input matInput placeholder="{{'CRITERIA.DATA-SETS.DRAFT-LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')">
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error>
</mat-form-field> </mat-form-field>
<!-- End of Search Filter --> <!-- End of Search Filter -->

View File

@ -175,6 +175,7 @@ input[type="text"] {
.pointer { .pointer {
cursor: pointer; cursor: pointer;
} }
.search-form { .search-form {
text-align: left; text-align: left;
width: 20rem; width: 20rem;

View File

@ -2,7 +2,7 @@
<!-- Search Filter--> <!-- Search Filter-->
<mat-form-field appearance="outline" class="search-form ml-auto col-auto pr-0" floatLabel="never"> <mat-form-field appearance="outline" class="search-form ml-auto col-auto pr-0" floatLabel="never">
<mat-icon matSuffix>search</mat-icon> <mat-icon matSuffix>search</mat-icon>
<input matInput placeholder="{{'CRITERIA.DMP.LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')"> <input matInput placeholder="{{'CRITERIA.LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')">
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error>
</mat-form-field> </mat-form-field>
<!-- End of Search Filter --> <!-- End of Search Filter -->

View File

@ -384,7 +384,7 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
refresh(): void { refresh(): void {
const fields: Array<string> = ["-modified"]; const fields: Array<string> = ["-modified"];
this.startIndex = 0; this.startIndex = 0;
const allDataTableRequest: DataTableRequest<RecentActivityCriteria> = new DataTableRequest(0, 5, { fields: fields }); const allDataTableRequest: DataTableRequest<RecentActivityCriteria> = new DataTableRequest(0, this.pageSize, { fields: fields });
allDataTableRequest.criteria = new RecentActivityCriteria(); allDataTableRequest.criteria = new RecentActivityCriteria();
allDataTableRequest.criteria.like = this.formGroup.get("like").value; allDataTableRequest.criteria.like = this.formGroup.get("like").value;
this.dashboardService this.dashboardService

View File

@ -1,5 +1,11 @@
<div *ngIf="datasetActivities != null"> <div *ngIf="datasetActivities != null">
<!-- Search Filter-->
<mat-form-field appearance="outline" class="search-form ml-auto col-auto pr-0" floatLabel="never">
<mat-icon matSuffix>search</mat-icon>
<input matInput placeholder="{{'CRITERIA.DATA-SETS.LIKE'| translate}}" name="likeCriteria" [formControl]="formGroup.get('like')">
<mat-error *ngIf="formGroup.get('like').hasError('backendError')">{{formGroup.get('like').getError('backendError').message}}</mat-error>
</mat-form-field>
<!-- End of Search Filter -->
<div *ngFor="let activity of datasetActivities"> <div *ngFor="let activity of datasetActivities">
<div class="dataset-card"> <div class="dataset-card">
<div [routerLink]="['../datasets/overview/' + activity.id]" class="pointer"> <div [routerLink]="['../datasets/overview/' + activity.id]" class="pointer">
@ -60,8 +66,7 @@
</mat-menu> </mat-menu>
</div> </div>
</div> </div>
<div *ngIf="datasetActivities && datasetActivities.length > 0" class="d-flex justify-content-center"> <div *ngIf="datasetActivities && datasetActivities.length > 0 && datasetActivities.length >= startIndex + pageSize" class="d-flex justify-content-center">
<button type="button" class="btn-load-more" (click)="loadMore()">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button> <button type="button" class="btn-load-more" (click)="loadMore()">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button>
</div> </div>
</div> </div>

View File

@ -175,3 +175,21 @@ input[type="text"] {
.pointer { .pointer {
cursor: pointer; cursor: pointer;
} }
.search-form {
text-align: left;
width: 20rem;
}
.search-form mat-icon {
color: #129d99;
}
::ng-deep .search-form .mat-form-field-wrapper {
background-color: white !important;
padding-bottom: 0 !important;
}
::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix {
padding: 0.3rem 0rem 0.6rem 0rem !important;
}

View File

@ -8,7 +8,7 @@ import { BaseComponent } from '@common/base/base.component';
import { Principal } from '@app/core/model/auth/principal'; import { Principal } from '@app/core/model/auth/principal';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service'; import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
import { FormControl } from '@angular/forms'; import { FormControl, FormBuilder } from '@angular/forms';
import { DatasetCopyDialogueComponent } from '@app/ui/dataset/dataset-wizard/dataset-copy-dialogue/dataset-copy-dialogue.component'; import { DatasetCopyDialogueComponent } from '@app/ui/dataset/dataset-wizard/dataset-copy-dialogue/dataset-copy-dialogue.component';
import { MatDialog } from '@angular/material'; import { MatDialog } from '@angular/material';
import { takeUntil } from 'rxjs/operators'; import { takeUntil } from 'rxjs/operators';
@ -33,8 +33,11 @@ export class RecentEditedDatasetActivityComponent extends BaseComponent implemen
datasetActivities: DatasetListingModel[]; datasetActivities: DatasetListingModel[];
totalCount: number; totalCount: number;
startIndex: number = 4; startIndex: number = 0;
pageSize: number = 5; pageSize: number = 5;
public formGroup = new FormBuilder().group({
like: new FormControl()
});
// publicMode = false; // publicMode = false;
constructor( constructor(
@ -61,26 +64,42 @@ export class RecentEditedDatasetActivityComponent extends BaseComponent implemen
.subscribe(response => { .subscribe(response => {
this.datasetActivities = response.data; this.datasetActivities = response.data;
this.totalCount = response.totalCount; this.totalCount = response.totalCount;
this.totalCountDatasets.emit(this.pageSize); this.totalCountDatasets.emit(this.datasetActivities.length);
// this.totalCountDatasets.emit(this.totalCount);
}); });
this.formGroup.get('like').valueChanges
.pipe(takeUntil(this._destroyed))
.subscribe(x => this.refresh());
} }
} }
refresh(): void {
const fields: Array<string> = ["-modified"];
this.startIndex = 0;
const datasetDataTableRequest: DataTableRequest<DatasetCriteria> = new DataTableRequest(0, this.pageSize, { fields: fields });
datasetDataTableRequest.criteria = new DatasetCriteria();
datasetDataTableRequest.criteria.like = this.formGroup.get("like").value;
this.datasetService
.getPaged(datasetDataTableRequest)
.subscribe(response => {
this.datasetActivities = response.data;
this.totalCount = response.totalCount;
this.totalCountDatasets.emit(this.datasetActivities.length);
});
}
public loadMore() { public loadMore() {
this.startIndex = this.startIndex + this.pageSize;
const fields: Array<string> = ["-modified"]; const fields: Array<string> = ["-modified"];
const request = new DataTableRequest<DatasetCriteria>(this.startIndex, this.pageSize, { fields: fields }); const request = new DataTableRequest<DatasetCriteria>(this.startIndex, this.pageSize, { fields: fields });
request.criteria = new DatasetCriteria(); request.criteria = new DatasetCriteria();
request.criteria.like = ""; request.criteria.like = this.formGroup.get("like").value ? this.formGroup.get("like").value : "";
this.datasetService.getPaged(request).pipe(takeUntil(this._destroyed)).subscribe(result => { this.datasetService.getPaged(request).pipe(takeUntil(this._destroyed)).subscribe(result => {
if (!result) { return []; } if (!result) { return []; }
this.datasetActivities = this.datasetActivities.concat(result.data); this.datasetActivities = this.datasetActivities.concat(result.data);
this.totalCountDatasets.emit(this.datasetActivities.length);
}); });
this.startIndex = this.startIndex + this.pageSize;
this.totalCountDatasets.emit(this.startIndex + 1);
} }
public isAuthenticated(): boolean { public isAuthenticated(): boolean {

View File

@ -849,6 +849,7 @@
"TAGS": "Tags", "TAGS": "Tags",
"SELECT-TAGS": "Select Tags", "SELECT-TAGS": "Select Tags",
"LIKE": "Search Dataset Descriptions", "LIKE": "Search Dataset Descriptions",
"DRAFT-LIKE": "Search Draft Dataset Descriptions",
"SELECT-GRANTS": "Select Grants", "SELECT-GRANTS": "Select Grants",
"ROLE": "Role", "ROLE": "Role",
"ORGANIZATION": "Organization", "ORGANIZATION": "Organization",
@ -876,7 +877,8 @@
"LABEL": "Search", "LABEL": "Search",
"ROLE": "Role" "ROLE": "Role"
}, },
"SELECT": "Select an option" "SELECT": "Select an option",
"LIKE": "Search"
}, },
"DATASET-EDITOR": { "DATASET-EDITOR": {
"TITLE": { "TITLE": {

View File

@ -844,6 +844,7 @@
"TAGS": "Etiquetas", "TAGS": "Etiquetas",
"SELECT-TAGS": "Etiquetas seleccionadas", "SELECT-TAGS": "Etiquetas seleccionadas",
"LIKE": "Busdar descripciones del Dataset", "LIKE": "Busdar descripciones del Dataset",
"DRAFT-LIKE": "Search Draft Dataset Descriptions",
"SELECT-GRANTS": "Seleccionar subvención", "SELECT-GRANTS": "Seleccionar subvención",
"ROLE": "Función", "ROLE": "Función",
"ORGANIZATION": "Organización", "ORGANIZATION": "Organización",
@ -871,7 +872,8 @@
"LABEL": "Búsqueda", "LABEL": "Búsqueda",
"ROLE": "Función" "ROLE": "Función"
}, },
"SELECT": "Seleccionar una opción" "SELECT": "Seleccionar una opción",
"LIKE": "Search"
}, },
"DATASET-EDITOR": { "DATASET-EDITOR": {
"TITLE": { "TITLE": {

View File

@ -845,6 +845,7 @@
"TAGS": "Ετικέτες", "TAGS": "Ετικέτες",
"SELECT-TAGS": "Επιλογή Ετικέτας", "SELECT-TAGS": "Επιλογή Ετικέτας",
"LIKE": "Αναζήτηση Περιγραφών Συνόλου Δεδομένων", "LIKE": "Αναζήτηση Περιγραφών Συνόλου Δεδομένων",
"DRAFT-LIKE": "Αναζήτηση Προσχέδιων Περιγραφών Συνόλου Δεδομένων",
"SELECT-GRANTS": "Επιλογή Επιχορηγήσεων", "SELECT-GRANTS": "Επιλογή Επιχορηγήσεων",
"ROLE": "Ρόλος", "ROLE": "Ρόλος",
"ORGANIZATION": "Οργανισμός", "ORGANIZATION": "Οργανισμός",
@ -872,7 +873,8 @@
"LABEL": "Αναζήτηση", "LABEL": "Αναζήτηση",
"ROLE": "Ρόλος" "ROLE": "Ρόλος"
}, },
"SELECT": "Επιλογή" "SELECT": "Επιλογή",
"LIKE": "Search"
}, },
"DATASET-EDITOR": { "DATASET-EDITOR": {
"TITLE": { "TITLE": {