2023-03-10 16:15:26 +01:00
< div class = "uk-position-relative" style = "min-height: 60vh" >
2022-07-04 20:45:20 +02:00
< div * ngIf = "loading" class = "uk-position-center" >
< loading > < / loading >
< / div >
< ng-container * ngIf = "!loading" >
2023-03-10 16:15:26 +01:00
< div class = "criteria uk-overflow-auto uk-position-relative" [ ngStyle ] = " { ' height . px ' : criteriaHeight ? criteriaHeight:null } " >
< div * ngIf = "criteria.length == 0" class = "uk-text-center uk-position-center" >
< ng-content select = "[no-criteria]" > < / ng-content >
2021-05-19 13:40:29 +02:00
< / div >
2023-03-08 23:26:06 +01:00
< form * ngIf = "criteria.length > 0" [ formGroup ] = " selectionCriteriaForm " >
< div formArrayName = "criteria" class = "uk-margin-bottom" >
< ul class = "uk-list uk-list-xlarge uk-margin-top uk-margin-bottom" >
< li * ngFor = "let criterion of criteria.controls; let i=index" >
< div [ id ] = " ' criterion- ' + i . toString ( ) " [ formGroupName ] = " i . toString ( ) " class = "uk-flex" >
< h3 class = "uk-padding uk-margin-remove-bottom uk-margin-top" >
{{i + 1}}
< / h3 >
2023-03-10 16:15:26 +01:00
< div class = "uk-width-expand uk-padding-small uk-border uk-border-rounded" formArrayName = "constraint" >
2023-03-08 23:26:06 +01:00
< div class = "uk-flex-middle uk-grid uk-margin-small-bottom uk-visible@l" uk-grid >
< div class = "uk-width-1-4" >
< label class = "uk-text-uppercase uk-text-bold" > Field< / label >
2021-05-19 13:40:29 +02:00
< / div >
2023-03-08 23:26:06 +01:00
< div class = "uk-width-1-4" >
< label class = "uk-text-uppercase uk-text-bold" > Operator< / label >
2021-05-19 13:40:29 +02:00
< / div >
2023-03-08 23:26:06 +01:00
< div class = "uk-width-1-4" >
< label class = "uk-text-uppercase uk-text-bold" > Term< / label >
2021-05-19 13:40:29 +02:00
< / div >
2023-03-08 23:26:06 +01:00
< div class = "uk-width-expand uk-text-truncate" >
< label class = "uk-text-bold uk-text-uppercase" > Match Case< / label >
2021-05-19 13:40:29 +02:00
< / div >
2023-03-08 23:26:06 +01:00
< / div >
< div * ngFor = "let constraint of getConstraint(i).controls; let j=index" [ formGroupName ] = " j . toString ( ) "
class="uk-margin-bottom uk-hidden@l">
< div class = "uk-flex-middle uk-grid-small uk-margin-medium-bottom" uk-grid >
< div class = "uk-flex uk-flex-right uk-width-1-1" >
< button class = "uk-close uk-icon" ( click ) = " removeConstraint ( i , j ) " >
< icon name = "close" ratio = "1.5" [ flex ] = " true "
2023-03-10 16:15:26 +01:00
[attr.uk-tooltip]="(getConstraint(i).length === 1?'By removing this constraint, the ' + entityType + ' will be removed too':null)">< / icon >
2023-03-08 23:26:06 +01:00
< / button >
< / div >
< div class = "uk-width-1-1" input type = "select" inputClass = "border-bottom" [ placeholder ] = " { static: true , label: ' Choose a field ' } "
2024-02-14 10:27:00 +01:00
[options]="criteriaUtils.fields" [formInput]="constraint.get('field')" (valueChange)="resetFieldWhenValueChange(constraint)">
2023-03-08 23:26:06 +01:00
< label class = "uk-text-uppercase uk-text-bold uk-width-1-3 uk-text-truncate" > Field:< / label >
< / div >
2024-02-14 10:27:00 +01:00
< div * ngIf = "criteriaUtils.numericFields.indexOf(constraint.get('field').value) == -1" class = "uk-width-1-1" input type = "select" inputClass = "border-bottom"
2023-03-10 16:15:26 +01:00
[options]="criteriaUtils.verbs" [formInput]="constraint.get('verb')">
2023-03-08 23:26:06 +01:00
< label class = "uk-text-uppercase uk-text-bold uk-width-1-3 uk-text-truncate" > Operator:< / label >
< / div >
2024-02-14 10:27:00 +01:00
< div * ngIf = "criteriaUtils.numericFields.indexOf(constraint.get('field').value) != -1" class = "uk-width-1-1" input type = "select" inputClass = "border-bottom"
[options]="criteriaUtils.verbsForNumbers" [formInput]="constraint.get('verb')">
< label class = "uk-text-uppercase uk-text-bold uk-width-1-3 uk-text-truncate" > Operator:< / label >
< / div >
2023-03-08 23:26:06 +01:00
< div class = "uk-width-1-1" input [ placeholder ] = " { static: true , label: ' Type a keyword ' } "
[formInput]="constraint.get('value')">
< label class = "uk-text-uppercase uk-text-bold uk-width-1-3 uk-text-truncate" > Term:< / label >
< / div >
< div class = "uk-width-1-1" >
< div class = "uk-grid" uk-grid >
< label class = "uk-text-uppercase uk-text-bold uk-width-1-3 uk-text-truncate" > Match Case< / label >
< div class = "uk-width-expand" >
< mat-slide-toggle [ checked ] = " constraint . get ( ' verb_suffix ' ) . value = == ' ' "
[attr.uk-tooltip]="(constraint.get('verb_suffix').value === ''?('Only \'\'' + constraint.get('value').value + '\'\' matches'):
2022-07-04 20:45:20 +02:00
('Both \'\'' + constraint.get('value').value.toUpperCase() + '\'\' and \'\'' + constraint.get('value').value.toLowerCase() + '\'\' match'))"
2023-03-08 23:26:06 +01:00
(change)="caseSensitive($event, constraint)">< / mat-slide-toggle >
< / div >
2021-05-19 13:40:29 +02:00
< / div >
< / div >
< / div >
< / div >
2023-03-08 23:26:06 +01:00
< div * ngFor = "let constraint of getConstraint(i).controls; let j=index"
[formGroupName]="j.toString()" class="uk-margin-bottom uk-visible@l">
< div class = "uk-flex uk-flex-middle uk-grid" uk-grid >
< div class = "uk-width-1-4" input type = "select" inputClass = "border-bottom" [ placeholder ] = " { static: true , label: ' Choose a field ' } "
2023-03-10 16:15:26 +01:00
[options]="criteriaUtils.fields" [formInput]="constraint.get('field')">< / div >
2024-02-14 10:27:00 +01:00
< div * ngIf = "criteriaUtils.numericFields.indexOf(constraint.get('field').value) == -1" class = "uk-width-1-4" input type = "select" inputClass = "border-bottom"
2023-03-10 16:15:26 +01:00
[options]="criteriaUtils.verbs" [formInput]="constraint.get('verb')">< / div >
2024-02-14 10:27:00 +01:00
< div * ngIf = "criteriaUtils.numericFields.indexOf(constraint.get('field').value) != -1" class = "uk-width-1-4" input type = "select" inputClass = "border-bottom"
[options]="criteriaUtils.verbsForNumbers" [formInput]="constraint.get('verb')">< / div >
2023-03-10 16:15:26 +01:00
< div * ngIf = "constraint.get('field').value !== 'fos' && constraint.get('field').value !== 'sdg'" class = "uk-width-1-4" inputClass = "flat small" input [ placeholder ] = " { static: true , label: ' Type a keyword ' } "
2023-03-08 23:26:06 +01:00
[formInput]="constraint.get('value')">< / div >
< div * ngIf = "constraint.get('field').value === 'fos'" class = "uk-width-1-4" inputClass = "flat small" input [ placeholder ] = " { static: true , label: ' Choose a FoS ' } "
[formInput]="constraint.get('value')" type="select" [options]="fos">< / div >
2023-03-10 16:15:26 +01:00
< div * ngIf = "constraint.get('field').value === 'sdg'" class = "uk-width-1-4" inputClass = "flat small" input [ placeholder ] = " { static: true , label: ' Choose a FoS ' } "
[formInput]="constraint.get('value')" type="select" [options]="sdg">< / div >
2023-03-08 23:26:06 +01:00
< div class = "uk-width-expand" >
< mat-slide-toggle [ checked ] = " constraint . get ( ' verb_suffix ' ) . value = == ' ' " class = "uk-margin-left"
[attr.uk-tooltip]="(constraint.get('verb_suffix').value === ''?('Only \'\'' + constraint.get('value').value + '\'\' matches'):
2022-07-04 20:45:20 +02:00
('Both \'\'' + constraint.get('value').value.toUpperCase() + '\'\' and \'\'' + constraint.get('value').value.toLowerCase() + '\'\' match'))"
2023-03-08 23:26:06 +01:00
(change)="caseSensitive($event, constraint)">< / mat-slide-toggle >
< / div >
< div class = "uk-flex uk-flex-center" >
< button class = "uk-close uk-icon" ( click ) = " removeConstraint ( i , j ) " >
< icon name = "close" ratio = "1.5" [ flex ] = " true "
2023-03-10 16:15:26 +01:00
[attr.uk-tooltip]="(getConstraint(i).length === 1?'By removing this constraint, the ' + entityType + ' will be removed too':null)">< / icon >
2023-03-08 23:26:06 +01:00
< / button >
< / div >
2021-05-19 13:40:29 +02:00
< / div >
< / div >
2023-03-08 23:26:06 +01:00
< div class = "uk-margin-top uk-width-1-1 uk-flex uk-flex-center uk-flex-left@l" >
< a ( click ) = " addConstraint ( i ) " class = "uk-flex uk-flex-middle uk-button uk-button-link" >
< icon name = "add" [ flex ] = " true " > < / icon >
< span class = "uk-margin-small-left" > Add Constraint< / span >
< / a >
< / div >
2021-05-19 13:40:29 +02:00
< / div >
< / div >
2023-03-08 23:26:06 +01:00
< / li >
< / ul >
2021-05-19 13:40:29 +02:00
< / div >
2023-03-08 23:26:06 +01:00
< / form >
< / div >
< div class = "uk-flex uk-flex-center uk-margin-top" >
< a ( click ) = " addCriteria ( ) " class = "uk-flex uk-flex-middle uk-button uk-button-primary"
2023-03-10 16:15:26 +01:00
[attr.uk-tooltip]="'< div > Add a ' + entityType + ' to limit research results.< br > Results which satisfy any of the selected ' + entityTypePlural + ' will be included in your ' + openaireEntities.COMMUNITY + '.< / div > '">
2023-03-08 23:26:06 +01:00
< icon name = "add" [ flex ] = " true " > < / icon >
2023-03-10 16:15:26 +01:00
< span class = "uk-margin-small-left" > Add {{entityType}}< / span >
2023-03-08 23:26:06 +01:00
< / a >
< / div >
2022-07-04 20:45:20 +02:00
< / ng-container >
2021-05-19 13:40:29 +02:00
< / div >