From d9b4be9a5c4dda8150e1880b6ffc449a1327358c Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Thu, 9 Mar 2023 00:26:06 +0200 Subject: [PATCH] Criteria: Change criteria in order to be a generic component. --- src/app/openaireLibrary | 2 +- .../pages/content-providers/criteria-utils.ts | 6 +- .../criteria/criteria.component.html | 210 +++++++++--------- .../criteria/criteria.component.less | 7 +- .../criteria/criteria.component.ts | 172 +++++++------- .../manage-content-providers.component.ts | 38 +++- 6 files changed, 224 insertions(+), 211 deletions(-) diff --git a/src/app/openaireLibrary b/src/app/openaireLibrary index 799a62a..1d2a0ef 160000 --- a/src/app/openaireLibrary +++ b/src/app/openaireLibrary @@ -1 +1 @@ -Subproject commit 799a62afc5c3c752d6b4e3f9e2c6d87433d6a4ad +Subproject commit 1d2a0effa840836cbb26334eabd9e1ea3752b455 diff --git a/src/app/pages/content-providers/criteria-utils.ts b/src/app/pages/content-providers/criteria-utils.ts index 4d7b0b9..ff010a6 100644 --- a/src/app/pages/content-providers/criteria-utils.ts +++ b/src/app/pages/content-providers/criteria-utils.ts @@ -2,11 +2,13 @@ import {Option} from "../../openaireLibrary/sharedComponents/input/input.compone export class CriteriaUtils { public static readonly fields: Option[] = [ - {value: 'title', label: 'Title'}, {value: 'author', label: 'Author\'s name'}, + {value: 'title', label: 'Title'}, {value: 'orcid', label: 'Author\'s ORCID'}, {value: 'contributor', label: 'Contributor'}, - {value: 'description', label: 'Description'} + {value: 'description', label: 'Description'}, + {value: 'subject', label: 'Subject'}, + {value: 'fos', label: 'Field of Science'} ] public static readonly verbs: Option[] = [ diff --git a/src/app/pages/content-providers/criteria/criteria.component.html b/src/app/pages/content-providers/criteria/criteria.component.html index 67e837c..65a9fd7 100644 --- a/src/app/pages/content-providers/criteria/criteria.component.html +++ b/src/app/pages/content-providers/criteria/criteria.component.html @@ -3,118 +3,114 @@ -
+
+
+
No filters for {{dataProvider}}.
+
If no filters are specified, all {{openaireEntities.RESULTS | lowercase}} of this {{openaireEntities.DATASOURCE | lowercase}} will be included in your + {{openaireEntities.COMMUNITY | lowercase}}. +
+
+
+
+
    +
  • +
    +

    + {{i + 1}} +

    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    + +
    + +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    + +
    +
    + +
    +
    +
    +
    + + + Add Constraint + +
    +
    +
    +
    • +
+
+
+
+
Add filter
-
-
No filters for {{dataProvider.officialname}}.
-
If no filters are specified, all {{openaireEntities.RESULTS | lowercase}} of this {{openaireEntities.DATASOURCE | lowercase}} will be included in your - {{openaireEntities.COMMUNITY | lowercase}}. -
-
-
-
- - -
    -
  • -
    -

    - {{getIndex(i) + 1}} -

    -
    -
    -
    - -
    -
    - -
    -
    - -
    -
    - -
    -
    -
    -
    -
    - -
    -
    - -
    -
    - -
    -
    - -
    -
    -
    - -
    - -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    -
    - -
    -
    - -
    -
    -
    -
    - - - Add Constraint - -
    -
    -
    -
    • -
-
- - -
-
-
diff --git a/src/app/pages/content-providers/criteria/criteria.component.less b/src/app/pages/content-providers/criteria/criteria.component.less index 6bec815..1d3f7ca 100644 --- a/src/app/pages/content-providers/criteria/criteria.component.less +++ b/src/app/pages/content-providers/criteria/criteria.component.less @@ -1,8 +1,7 @@ -@import (reference) "~src/assets/openaire-theme/less/_import-variables.less"; +.criteria { + padding-right: 20px; +} .criterion { - border: @global-border solid @global-border-width; - border-radius: @global-border-radius; max-height: 400px; - overflow: auto; } diff --git a/src/app/pages/content-providers/criteria/criteria.component.ts b/src/app/pages/content-providers/criteria/criteria.component.ts index 8ae1e24..88ae678 100644 --- a/src/app/pages/content-providers/criteria/criteria.component.ts +++ b/src/app/pages/content-providers/criteria/criteria.component.ts @@ -1,13 +1,16 @@ -import {ChangeDetectorRef, Component, Input, OnInit} from '@angular/core'; -import {EnvProperties} from '../../../openaireLibrary/utils/properties/env-properties'; import { - Constraint, - ContentProvider, - Criteria, - SelectionCriteria -} from '../../../openaireLibrary/utils/entities/contentProvider'; + AfterViewInit, + ChangeDetectorRef, + Component, + Input, + OnChanges, + OnDestroy, + OnInit, + SimpleChanges +} from '@angular/core'; +import {EnvProperties} from '../../../openaireLibrary/utils/properties/env-properties'; +import {Constraint, Criteria, SelectionCriteria} from '../../../openaireLibrary/utils/entities/contentProvider'; import {AbstractControl, UntypedFormArray, UntypedFormBuilder, UntypedFormGroup, Validators} from '@angular/forms'; -import {ManageCommunityContentProvidersService} from '../../../services/manageContentProviders.service'; import {properties} from "../../../../environments/environment"; import {Option} from "../../../openaireLibrary/sharedComponents/input/input.component"; import {MatSlideToggleChange} from "@angular/material/slide-toggle"; @@ -15,79 +18,97 @@ import {HelperFunctions} from "../../../openaireLibrary/utils/HelperFunctions.cl import {CriteriaUtils} from "../criteria-utils"; import {NotificationHandler} from "../../../openaireLibrary/utils/notification-handler"; import {OpenaireEntities} from "../../../openaireLibrary/utils/properties/searchFields"; +import {ISVocabulariesService} from "../../../openaireLibrary/utils/staticAutoComplete/ISVocabularies.service"; +import {Subscription} from "rxjs"; @Component({ selector: 'criteria', templateUrl: 'criteria.component.html', styleUrls: ['criteria.component.less'] }) -export class CriteriaComponent implements OnInit { +export class CriteriaComponent implements OnInit, OnChanges, AfterViewInit, OnDestroy { @Input() - public dataProvider: ContentProvider; - public selectionCriteria: UntypedFormGroup; + public dataProvider: string; + @Input() + public selectionCriteria: SelectionCriteria; + @Input() + public height: number = 0; + public maxHeight: number = 0; + public selectionCriteriaForm: UntypedFormGroup; public properties: EnvProperties = properties; public fields: Option[] = CriteriaUtils.fields; public verbs: Option[] = CriteriaUtils.verbs; + public fos: string[] = []; public loading = true; - /** Paging */ - public page: number = 1; - public pageSize: number = 5; public openaireEntities = OpenaireEntities; + private subscriptions: any[] = []; - constructor(private manageCommunityContentProvidersService: ManageCommunityContentProvidersService, - private cdr: ChangeDetectorRef, + constructor(private cdr: ChangeDetectorRef, private vocabulariesService: ISVocabulariesService, private fb: UntypedFormBuilder) { } ngOnInit() { this.reset(); this.loading = false; + this.subscriptions.push(this.vocabulariesService.getVocabularyByType('fos', null, properties).subscribe((fos: any[]) => { + this.fos = fos.map(element => element.id); + })); } - reset() { - this.page = 1; - if (this.dataProvider) { - this.selectionCriteria = this.fb.group({ - criteria: this.fb.array([]) - }); - let selectionCriteria = this.dataProvider.selectioncriteria; - if (selectionCriteria) { - selectionCriteria.criteria.forEach(criterion => { - let constraintArray: UntypedFormArray = this.fb.array([]); - criterion.constraint.forEach(constraint => { - constraintArray.push(this.fb.group({ - field: this.fb.control(constraint.field, Validators.required), - verb: this.fb.control(this.removeSuffix(constraint.verb), Validators.required), - value: this.fb.control(constraint.value, Validators.required), - verb_suffix: this.fb.control(this.getSuffix(constraint.verb)) - })); - }); - this.criteria.push(this.fb.group({ - constraint: constraintArray - })); - }); + ngOnChanges(changes: SimpleChanges) { + this.calculateMaxHeight(); + } + + ngAfterViewInit() { + this.calculateMaxHeight(); + } + + ngOnDestroy() { + this.subscriptions.forEach(subscription => { + if (subscription instanceof Subscription) { + subscription.unsubscribe(); + } + }); + } + + calculateMaxHeight() { + if(this.height) { + if(this.height > 0) { + /* Element height - section (70 + 70) - margins(20 + 20) - button height(42) */ + this.maxHeight = this.height - 140 - 40 - 42; + this.cdr.detectChanges(); } } } - get disabled() { - return this.loading || !this.dirty || this.selectionCriteria.invalid; - } - - get currentPage(): AbstractControl[] { - if (this.criteria) { - return this.criteria.controls.slice((this.page - 1) * this.pageSize, this.page * this.pageSize); - } else { - return []; + reset() { + if (this.selectionCriteria?.criteria) { + this.selectionCriteriaForm = this.fb.group({ + criteria: this.fb.array([]) + }); + this.selectionCriteria.criteria.forEach(criterion => { + let constraintArray: UntypedFormArray = this.fb.array([]); + criterion.constraint.forEach(constraint => { + constraintArray.push(this.fb.group({ + field: this.fb.control(constraint.field, Validators.required), + verb: this.fb.control(this.removeSuffix(constraint.verb), Validators.required), + value: this.fb.control(constraint.value, Validators.required), + verb_suffix: this.fb.control(this.getSuffix(constraint.verb)) + })); + }); + this.criteria.push(this.fb.group({ + constraint: constraintArray + })); + }); } } - getIndex(index: number): number { - return (this.page - 1)*this.pageSize + index; + get disabled() { + return this.loading || !this.dirty || this.selectionCriteriaForm.invalid; } public get criteria(): UntypedFormArray { - return this.selectionCriteria.get('criteria') as UntypedFormArray; + return this.selectionCriteriaForm.get('criteria') as UntypedFormArray; } public getConstraint(i: number): UntypedFormArray { @@ -103,11 +124,9 @@ export class CriteriaComponent implements OnInit { verb_suffix: this.fb.control('_caseinsensitive') }) ]); - this.criteria.insert(0, this.fb.group({ - constraint: constraintArray - })); - this.page = 1; + this.criteria.push(this.fb.group({constraint: constraintArray})); this.cdr.detectChanges(); + document.getElementById('criterion-' + (this.criteria.length - 1).toString()).scrollIntoView({behavior: 'smooth'}); } public addConstraint(i: number) { @@ -126,25 +145,22 @@ export class CriteriaComponent implements OnInit { constraintArray.removeAt(j); if (constraintArray.length === 0) { this.criteria.removeAt(i); - while(this.currentPage.length === 0 && this.page > 0) { - this.page--; - } } this.cdr.detectChanges(); } - get dataProviderCriteria(): Criteria[] { - return (this.dataProvider && this.dataProvider.selectioncriteria && this.dataProvider.selectioncriteria.criteria)?this.dataProvider.selectioncriteria.criteria:[]; + get criteriaArray(): Criteria[] { + return (this.selectionCriteria?.criteria) ? this.selectionCriteria?.criteria : []; } - + get dirty() { - if(!this.dataProvider || !this.criteria) { + if (!this.dataProvider || !this.criteria) { return false; - } else if(this.criteria.length !== this.dataProviderCriteria.length) { + } else if (this.criteria.length !== this.criteriaArray.length) { return true; } else { - return this.dataProviderCriteria.filter((criterion, i) => { - if(criterion.constraint.length !== this.getConstraint(i).length) { + return this.criteriaArray.filter((criterion, i) => { + if (criterion.constraint.length !== this.getConstraint(i).length) { return true; } else { let temp = this.getConstraint(i).value; @@ -156,23 +172,10 @@ export class CriteriaComponent implements OnInit { } } - save(callback: Function = null) { - if (this.selectionCriteria.valid) { + save(callback: (selectionCriteria) => void = null) { + if (this.selectionCriteriaForm.valid) { this.loading = true; - this.dataProvider.selectioncriteria = this.parseForm(this.selectionCriteria.value); - this.manageCommunityContentProvidersService.saveContentProvider(this.properties, this.dataProvider).subscribe(() => { - this.reset(); - if(callback) { - callback(); - } - this.loading = false; - NotificationHandler.rise('Filters have been successfully updated'); - }, error => { - this.loading = false; - this.handeError('An error has been occurred. Try again later!', error); - }); - } else { - this.handeError('An error has been occurred. Try again later!'); + callback(this.parseForm(this.selectionCriteriaForm.value)); } } @@ -182,7 +185,7 @@ export class CriteriaComponent implements OnInit { } caseSensitive(event: MatSlideToggleChange, constraint: AbstractControl) { - if(event.checked) { + if (event.checked) { constraint.get('verb_suffix').setValue(''); } else { constraint.get('verb_suffix').setValue('_caseinsensitive'); @@ -194,7 +197,7 @@ export class CriteriaComponent implements OnInit { } getSuffix(verb: string) { - if(verb.includes('_caseinsensitive')) { + if (verb.includes('_caseinsensitive')) { return '_caseinsensitive'; } else { return ''; @@ -215,9 +218,4 @@ export class CriteriaComponent implements OnInit { }) return selectionCriteria; } - - public updatePage(event) { - this.page = event.value; - HelperFunctions.scroll(); - } } diff --git a/src/app/pages/content-providers/manage-content-providers.component.ts b/src/app/pages/content-providers/manage-content-providers.component.ts index 263e1f6..4d3a4d6 100644 --- a/src/app/pages/content-providers/manage-content-providers.component.ts +++ b/src/app/pages/content-providers/manage-content-providers.component.ts @@ -1,4 +1,4 @@ -import {Component, OnInit, ViewChild} from '@angular/core'; +import {ChangeDetectorRef, Component, OnInit, ViewChild} from '@angular/core'; import {RemoveContentProvidersComponent} from './remove-content-providers.component'; import {Title} from '@angular/platform-browser'; import { @@ -13,6 +13,8 @@ import {CommunityService} from "../../openaireLibrary/connect/community/communit import {ContentProvider} from "../../openaireLibrary/utils/entities/contentProvider"; import {OpenaireEntities} from "../../openaireLibrary/utils/properties/searchFields"; import {CriteriaComponent} from "./criteria/criteria.component"; +import {NotificationHandler} from "../../openaireLibrary/utils/notification-handler"; +import {ManageCommunityContentProvidersService} from "../../services/manageContentProviders.service"; @Component({ selector: 'manage-content-providers', @@ -24,12 +26,16 @@ import {CriteriaComponent} from "./criteria/criteria.component"; (communityContentProvidersChanged)="communityContentProvidersChanged($event)"> - - -
- + +
+
` @@ -46,10 +52,12 @@ export class ManageContentProvidersComponent implements OnInit { public body: string = "Send from page"; public properties: EnvProperties = properties; public community: CommunityInfo; - public contentProvider: ContentProvider; + public dataProvider: ContentProvider; constructor(private title: Title, - private communityService: CommunityService) { + private cdr: ChangeDetectorRef, + private communityService: CommunityService, + private manageCommunityContentProvidersService: ManageCommunityContentProvidersService) { } ngOnInit() { @@ -80,17 +88,27 @@ export class ManageContentProvidersComponent implements OnInit { } public openCriteria(contentProvider: ContentProvider) { - this.contentProvider = contentProvider; + this.dataProvider = contentProvider; this.filtersModal.title = 'Filters'; this.filtersModal.okButtonText = "Save"; this.filtersModal.back = true; this.filtersModal.okButton = true; this.filtersModal.open(); + this.cdr.detectChanges(); } public saveCriteria() { - let callback: Function = () => { - this.removeContentProvidersComponent.getCommunityContentProviders(); + let callback = (selectionCriteria): void => { + this.dataProvider.selectioncriteria = selectionCriteria; + this.manageCommunityContentProvidersService.saveContentProvider(this.properties, this.dataProvider).subscribe(() => { + this.criteria.reset(); + this.removeContentProvidersComponent.getCommunityContentProviders(); + this.criteria.loading = false; + NotificationHandler.rise('Filters have been successfully updated'); + }, error => { + this.criteria.loading = false; + this.criteria.handeError('An error has been occurred. Try again later!', error); + }); } this.removeContentProvidersComponent.loading = true; this.criteria.save(callback);