diff --git a/dmp-frontend/angular.json b/dmp-frontend/angular.json index e2dba7c01..7b6d198f6 100644 --- a/dmp-frontend/angular.json +++ b/dmp-frontend/angular.json @@ -23,7 +23,6 @@ ], "styles": [ "src/styles.scss", - "src/assets/scss/material-dashboard.scss", "src/assets/css/demo.css", "node_modules/cookieconsent/build/cookieconsent.min.css" ], diff --git a/dmp-frontend/package.json b/dmp-frontend/package.json index 46e88aaea..8d826a0ef 100644 --- a/dmp-frontend/package.json +++ b/dmp-frontend/package.json @@ -12,60 +12,62 @@ }, "private": true, "dependencies": { - "@angular/animations": "^15.2.10", - "@angular/common": "^15.2.10", - "@angular/compiler": "^15.2.10", - "@angular/core": "^15.2.10", - "@angular/forms": "^15.2.10", - "@angular/material-moment-adapter": "^15.2.9", - "@angular/platform-browser": "^15.2.10", - "@kolkov/angular-editor": "^1.2.0", - "@ngx-translate/core": "^13.0.0", - "@ngx-translate/http-loader": "^6.0.0", - "@swimlane/ngx-datatable": "^20.0.0", - "@tinymce/tinymce-angular": "^4.2.4", - "@w11k/angular-sticky-things": "^1.3.2", - "bootstrap": "^4.3.1", + "@angular/animations": "^16.2.8", + "@angular/common": "^16.2.8", + "@angular/compiler": "^16.2.8", + "@angular/core": "^16.2.8", + "@angular/forms": "^16.2.8", + "@angular/material-moment-adapter": "^16.2.7", + "@angular/platform-browser": "^16.2.8", + "@kolkov/angular-editor": "^2.1.0", + "@ngx-translate/core": "^15.0.0", + "@ngx-translate/http-loader": "^8.0.0", + "@swimlane/ngx-datatable": "^20.1.0", + "@tinymce/tinymce-angular": "^7.0.0", + "@w11k/angular-sticky-things": "^1.5.2", + "bootstrap": "^4.6.0", "cookieconsent": "^3.1.1", - "core-js": "^2.5.5", + "core-js": "^3.33.0", + "dragula": "^3.7.3", "file-saver": "^2.0.5", - "moment": "^2.29.1", - "moment-timezone": "^0.5.33", + "moment": "^2.29.4", + "moment-timezone": "^0.5.43", "ng-dialog-animation": "^9.0.4", - "ng2-dragula": "^2.1.1", - "ngx-cookie-service": "^12.0.3", - "ngx-cookieconsent": "^2.2.3", + "ng2-dragula": "^5.0.1", + "ngx-cookie-service": "^16.0.1", + "ngx-cookieconsent": "^4.0.2", "ngx-dropzone": "^3.0.0", - "ngx-guided-tour": "^1.1.11", - "ngx-matomo": "^0.1.4", + "ngx-guided-tour": "^2.0.1", + "ngx-matomo-client": "^5.0.4", "pako": "^1.0.11", "rxjs": "^6.3.2", - "tinymce": "^5.9.2", + "tinymce": "^6.7.0", "ts-simple-nameof": "^1.3.1", - "tslib": "^2.0.0", - "zone.js": "~0.11.4" + "tslib": "^2.6.2", + "zone.js": "~0.13.0" }, "devDependencies": { - "@angular-devkit/build-angular": "^15.2.9", - "@angular/cdk": "^15.2.9", - "@angular/cli": "15.2.9", - "@angular/compiler-cli": "^15.2.10", - "@angular/language-service": "^15.2.10", - "@angular/material": "^15.2.9", - "@angular/platform-browser-dynamic": "^15.2.10", - "@angular/router": "^15.2.10", - "@types/facebook-js-sdk": "^3.3.5", - "@types/file-saver": "^2.0.3", - "@types/gapi": "^0.0.41", - "@types/gapi.auth2": "^0.0.55", - "@types/jasmine": "~3.9.1", - "@types/jasminewd2": "~2.0.10", + "@angular-devkit/build-angular": "^16.2.5", + "@angular/cdk": "^16.2.7", + "@angular/cli": "16.2.5", + "@angular/compiler-cli": "^16.2.8", + "@angular/language-service": "^16.2.8", + "@angular/material": "^16.2.7", + "@angular/platform-browser-dynamic": "^16.2.8", + "@angular/router": "^16.2.8", + "@types/dragula": "^3.7.2", + "@types/facebook-js-sdk": "^3.3.7", + "@types/file-saver": "^2.0.5", + "@types/gapi": "^0.0.45", + "@types/gapi.auth2": "^0.0.58", + "@types/jasmine": "~5.1.0", + "@types/jasminewd2": "~2.0.11", "@types/moment-timezone": "^0.5.13", - "@types/node": "^12.11.1", + "@types/node": "^20.8.2", "@types/pako": "^1.0.3", - "codelyzer": "^6.0.2", - "ts-node": "~10.2.1", + "codelyzer": "^0.0.28", + "ts-node": "~10.9.1", "tslint": "~6.1.0", - "typescript": "^4.8" + "typescript": "^4.9.3" } -} \ No newline at end of file +} diff --git a/dmp-frontend/src/app/app.component.ts b/dmp-frontend/src/app/app.component.ts index 8eb8b023f..8f447f72f 100644 --- a/dmp-frontend/src/app/app.component.ts +++ b/dmp-frontend/src/app/app.component.ts @@ -16,7 +16,6 @@ import { LanguageService } from './core/services/language/language.service'; import { ConfigurationService } from './core/services/configuration/configuration.service'; import { Location } from '@angular/common'; -import { MatomoInjector } from 'ngx-matomo'; import { MatomoService } from './core/services/matomo/matomo-service'; import { SideNavService } from './core/services/sidenav/side-nav.sevice'; import { MatSidenav } from '@angular/material/sidenav'; diff --git a/dmp-frontend/src/app/app.module.ts b/dmp-frontend/src/app/app.module.ts index 18b7a6b51..67616a71b 100644 --- a/dmp-frontend/src/app/app.module.ts +++ b/dmp-frontend/src/app/app.module.ts @@ -2,9 +2,9 @@ import { OverlayModule } from '@angular/cdk/overlay'; import { HttpClient, HttpClientModule } from '@angular/common/http'; import { LOCALE_ID, NgModule } from '@angular/core'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; -import { MatMomentDateModule, MAT_MOMENT_DATE_FORMATS } from '@angular/material-moment-adapter'; +import { MAT_MOMENT_DATE_FORMATS, MatMomentDateModule } from '@angular/material-moment-adapter'; import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core'; -import { MatLegacyFormFieldDefaultOptions as MatFormFieldDefaultOptions, MAT_LEGACY_FORM_FIELD_DEFAULT_OPTIONS as MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/legacy-form-field'; +import { MAT_LEGACY_FORM_FIELD_DEFAULT_OPTIONS as MAT_FORM_FIELD_DEFAULT_OPTIONS, MatLegacyFormFieldDefaultOptions as MatFormFieldDefaultOptions } from '@angular/material/legacy-form-field'; import { BrowserModule, Title } from '@angular/platform-browser'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { AppRoutingModule } from '@app/app-routing.module'; @@ -26,14 +26,14 @@ import { TranslateCompiler, TranslateLoader, TranslateModule } from '@ngx-transl import { DragulaModule } from 'ng2-dragula'; import { CookieService } from 'ngx-cookie-service'; import { NgcCookieConsentConfig, NgcCookieConsentModule } from 'ngx-cookieconsent'; -import { MatomoModule } from 'ngx-matomo'; +import { MatomoInitializationMode, NgxMatomoModule } from 'ngx-matomo-client'; import { ConfigurationService } from './core/services/configuration/configuration.service'; import { CultureService } from './core/services/culture/culture-service'; import { TranslateServerLoader } from './core/services/language/server.loader'; import { MatomoService } from './core/services/matomo/matomo-service'; import { GuidedTourModule } from './library/guided-tour/guided-tour.module'; -import { OpenDMPCustomTranslationCompiler } from './utilities/translate/opendmp-custom-translation-compiler'; import { Oauth2DialogModule } from './ui/misc/oauth2-dialog/oauth2-dialog.module'; +import { OpenDMPCustomTranslationCompiler } from './utilities/translate/opendmp-custom-translation-compiler'; // AoT requires an exported function for factories export function HttpLoaderFactory(http: HttpClient, appConfig: ConfigurationService) { @@ -97,7 +97,6 @@ const appearance: MatFormFieldDefaultOptions = { CommonHttpModule, MatMomentDateModule, LoginModule, - MatomoModule, //Ui NotificationModule, NavigationModule, @@ -111,7 +110,10 @@ const appearance: MatFormFieldDefaultOptions = { NgcCookieConsentModule.forRoot(cookieConfig), Oauth2DialogModule, GuidedTourModule.forRoot(), - DragulaModule.forRoot() + DragulaModule.forRoot(), + NgxMatomoModule.forRoot({ + mode: MatomoInitializationMode.AUTO_DEFERRED, + }) ], declarations: [ AppComponent, diff --git a/dmp-frontend/src/app/core/services/culture/culture-service.ts b/dmp-frontend/src/app/core/services/culture/culture-service.ts index e2f77acdf..96d39241a 100644 --- a/dmp-frontend/src/app/core/services/culture/culture-service.ts +++ b/dmp-frontend/src/app/core/services/culture/culture-service.ts @@ -48,7 +48,7 @@ export class CultureService { const newCulture = this.cultureValues.get(newCultureName); if (!newCulture) { - console.error(`unsupported culture given: ${newCultureName}`); //TODO: throw error? + this.logger.error(`unsupported culture given: ${newCultureName}`); //TODO: throw error? return; } this.currentCulture = newCulture; @@ -58,19 +58,17 @@ export class CultureService { // This is a very hacky way to map cultures with angular cultures, since there is no mapping. We first try to // use the culture with the specialization (ex en-US), and if not exists we import the base culture (first part). let locale = newCulture.name; - import(`@angular/common/locales/${locale}.js`).catch(reason => { + import(`/node_modules/@angular/common/locales/${locale}.mjs`).catch(reason => { this.logger.error('Could not load locale: ' + locale); }).then(selectedLocale => { if (selectedLocale) { registerLocaleData(selectedLocale.default); } else { locale = newCulture.name.split('-')[0]; - import(`@angular/common/locales/${locale}.js`).catch(reason => { + import(`/node_modules/@angular/common/locales/${locale}.mjs`).catch(reason => { this.logger.error('Could not load locale: ' + locale); }).then(selectedDefaultLocale => { - if (selectedDefaultLocale !== undefined) { - registerLocaleData(selectedDefaultLocale.default); - } + registerLocaleData(selectedDefaultLocale.default); }); } }); diff --git a/dmp-frontend/src/app/core/services/culture/language-info-service.ts b/dmp-frontend/src/app/core/services/culture/language-info-service.ts index 8afa52182..c6ef06823 100644 --- a/dmp-frontend/src/app/core/services/culture/language-info-service.ts +++ b/dmp-frontend/src/app/core/services/culture/language-info-service.ts @@ -49,7 +49,7 @@ export class LanguageInfoService { const newLanguageInfo = this.languageInfoValues.get(newLanguageInfoName); if (!newLanguageInfo) { - console.error(`unsupported language given: ${newLanguageInfoName}`); //TODO: throw error? + this.logger.error(`unsupported culture given: ${newLanguageInfo}`); //TODO: throw error? return; } this.currentLanguageInfo = newLanguageInfo; @@ -59,14 +59,14 @@ export class LanguageInfoService { // This is a very hacky way to map cultures with angular cultures, since there is no mapping. We first try to // use the culture with the specialization (ex en-US), and if not exists we import the base culture (first part). let locale = newLanguageInfo.code; - import(`@angular/common/locales/${locale}.js`).catch(reason => { + import(`/node_modules/@angular/common/locales/${locale}.mjs`).catch(reason => { this.logger.error('Could not load locale: ' + locale); }).then(selectedLocale => { if (selectedLocale) { registerLocaleData(selectedLocale.default); } else { // locale = newCulture.code.split('-')[0]; - import(`@angular/common/locales/${locale}.js`).catch(reason => { + import(`/node_modules/@angular/common/locales/${locale}.mjs`).catch(reason => { this.logger.error('Could not load locale: ' + locale); }).then(selectedDefaultLocale => { if (selectedDefaultLocale !== undefined) { diff --git a/dmp-frontend/src/app/core/services/matomo/matomo-service.ts b/dmp-frontend/src/app/core/services/matomo/matomo-service.ts index 700535510..386e7c2fc 100644 --- a/dmp-frontend/src/app/core/services/matomo/matomo-service.ts +++ b/dmp-frontend/src/app/core/services/matomo/matomo-service.ts @@ -1,5 +1,5 @@ import { Injectable } from '@angular/core'; -import { MatomoInjector, MatomoTracker } from 'ngx-matomo'; +import { MatomoInitializerService, MatomoTracker } from 'ngx-matomo-client'; import { AuthService } from '../auth/auth.service'; import { ConfigurationService } from '../configuration/configuration.service'; @@ -8,7 +8,7 @@ export class MatomoService { constructor( private configurationService: ConfigurationService, - private matomoInjector: MatomoInjector, + private matomoInitializerService: MatomoInitializerService, private matomoTracker: MatomoTracker, private authService: AuthService ) { @@ -17,7 +17,7 @@ export class MatomoService { init() { if (this.configurationService.matomoEnabled) { - this.matomoInjector.init(this.configurationService.matomoSiteUrl, this.configurationService.matomoSiteId); + this.matomoInitializerService.initializeTracker({ trackerUrl: this.configurationService.matomoSiteUrl, siteId: this.configurationService.matomoSiteId }); } } @@ -37,7 +37,7 @@ export class MatomoService { } } - trackDownload(category: "dmps"|"datasets", type: "docx"|"pdf"|"xml"|"json", id: string): void { + trackDownload(category: "dmps" | "datasets", type: "docx" | "pdf" | "xml" | "json", id: string): void { if (this.configurationService.matomoEnabled) { var principal = this.authService.current(); if (principal != null) { this.matomoTracker.setUserId(principal.id); } diff --git a/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.ts b/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.ts index 7b612997e..272f1bd44 100644 --- a/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.ts +++ b/dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.ts @@ -17,7 +17,7 @@ import { ViewChild } from '@angular/core'; import {ControlValueAccessor, FormGroupDirective, NgControl, NgForm} from '@angular/forms'; -import {MatLegacyChipInputEvent as MatChipInputEvent} from '@angular/material/legacy-chips'; +import { MatChipInputEvent } from '@angular/material/chips'; import {ErrorStateMatcher, mixinErrorState} from '@angular/material/core'; import {MatLegacyAutocomplete as MatAutocomplete, MatLegacyAutocompleteSelectedEvent as MatAutocompleteSelectedEvent, MatLegacyAutocompleteTrigger as MatAutocompleteTrigger} from '@angular/material/legacy-autocomplete'; import {MatLegacyFormFieldControl as MatFormFieldControl} from '@angular/material/legacy-form-field'; @@ -35,7 +35,8 @@ export class CustomComponentBase extends BaseComponent { public _defaultErrorStateMatcher: ErrorStateMatcher, public _parentForm: NgForm, public _parentFormGroup: FormGroupDirective, - public ngControl: NgControl + public ngControl: NgControl, + public stateChanges: Subject ) { super(); } @@ -166,7 +167,7 @@ export class MultipleAutoCompleteComponent extends _CustomComponentMixinBase imp @Optional() _parentFormGroup: FormGroupDirective, _defaultErrorStateMatcher: ErrorStateMatcher ) { - super(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl); + super(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl, new Subject()); fm.monitor(elRef.nativeElement, true).pipe(takeUntil(this._destroyed)).subscribe((origin) => { this.focused = !!origin; diff --git a/dmp-frontend/src/app/library/auto-complete/single/single-auto-complete.component.ts b/dmp-frontend/src/app/library/auto-complete/single/single-auto-complete.component.ts index 714d3e9ef..4c91fcaac 100644 --- a/dmp-frontend/src/app/library/auto-complete/single/single-auto-complete.component.ts +++ b/dmp-frontend/src/app/library/auto-complete/single/single-auto-complete.component.ts @@ -17,7 +17,8 @@ export class CustomComponentBase extends BaseComponent { public _defaultErrorStateMatcher: ErrorStateMatcher, public _parentForm: NgForm, public _parentFormGroup: FormGroupDirective, - public ngControl: NgControl + public ngControl: NgControl, + public stateChanges: Subject ) { super(); } } export const _CustomComponentMixinBase = mixinErrorState(CustomComponentBase); @@ -110,7 +111,7 @@ export class SingleAutoCompleteComponent extends _CustomComponentMixinBase imple @Optional() _parentFormGroup: FormGroupDirective, _defaultErrorStateMatcher: ErrorStateMatcher ) { - super(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl); + super(_defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl, new Subject()); fm.monitor(elRef.nativeElement, true).pipe(takeUntil(this._destroyed)).subscribe((origin) => { this.focused = !!origin; diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts index 2a9b9509e..f38a2b318 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts @@ -1,26 +1,14 @@ -import {Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from '@angular/core'; -import {AbstractControl, UntypedFormArray, UntypedFormControl, UntypedFormGroup} from '@angular/forms'; -import {FieldEditorModel} from '../../../admin/field-editor-model'; -import {Guid} from '@common/types/guid'; -import {RuleEditorModel} from '../../../admin/rule-editor-model'; -import {ValidationType} from '@app/core/common/enum/validation-type'; -import {MMatLegacyCheckboxChange as MatCheckboxChange from '@@angular/material/legacy-checkbox; -import { - DatasetDescriptionCompositeFieldEditorModel, - DatasetDescriptionFieldEditorModel, - DatasetDescriptionSectionEditorModel -} from '@app/ui/misc/dataset-description-form/dataset-description-form.model'; -import {DatasetProfileFieldViewStyle} from '@app/core/common/enum/dataset-profile-field-view-style'; -import {MMatLegacyDialog as MatDialog from '@@angular/material/legacy-dialog; -import {ConfirmationDialogComponent} from '@common/modules/confirmation-dialog/confirmation-dialog.component'; -import {TranslateService} from '@ngx-translate/core'; -import {ViewStyleType} from '../field/view-style-enum'; -import {EnumUtils} from '@app/core/services/utilities/enum-utils.service'; -import {DatasetProfileService} from '@app/core/services/dataset-profile/dataset-profile.service'; -import {EditorCustomValidators} from '../../custom-validators/editor-custom-validators'; -import {Field, FieldSet} from '@app/core/model/admin/dataset-profile/dataset-profile'; -import {DatasetProfileComboBoxType} from '@app/core/common/enum/dataset-profile-combo-box-type'; -import {DatasetProfileInternalDmpEntitiesType} from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type'; +import { Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core'; +import { AbstractControl, UntypedFormArray, UntypedFormControl, UntypedFormGroup } from '@angular/forms'; +import { MatLegacyCheckboxChange as MatCheckboxChange } from '@angular/material/legacy-checkbox'; +import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; +import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type'; +import { DatasetProfileFieldViewStyle } from '@app/core/common/enum/dataset-profile-field-view-style'; +import { DatasetProfileInternalDmpEntitiesType } from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type'; +import { ValidationType } from '@app/core/common/enum/validation-type'; +import { Field, FieldSet } from '@app/core/model/admin/dataset-profile/dataset-profile'; +import { CompositeField } from '@app/core/model/dataset-profile-definition/composite-field'; +import { Field as FieldDefinition } from '@app/core/model/dataset-profile-definition/field'; import { AutoCompleteFieldData, BooleanDecisionFieldData, @@ -33,35 +21,47 @@ import { ExternalDatasetsFieldData, FieldDataOption, FreeTextFieldData, + LicensesFieldData, OrganizationsFieldData, + PublicationsFieldData, RadioBoxFieldData, RegistriesFieldData, ResearchersAutoCompleteFieldData, + RichTextAreaFieldData, ServicesFieldData, TagsFieldData, + TaxonomiesFieldData, TextAreaFieldData, - RichTextAreaFieldData, UploadFieldData, ValidationFieldData, - WordListFieldData, - TaxonomiesFieldData, - LicensesFieldData, - PublicationsFieldData + WordListFieldData } from '@app/core/model/dataset-profile-definition/field-data/field-data'; -import {CompositeField} from '@app/core/model/dataset-profile-definition/composite-field'; -import {Field as FieldDefinition} from '@app/core/model/dataset-profile-definition/field'; -import {Subject} from 'rxjs'; -import {debounceTime, delay, map, takeUntil, tap} from 'rxjs/operators'; -import {GENERAL_ANIMATIONS} from '../../animations/animations'; -import {BaseComponent} from '@common/base/base.component'; -import {TransitionGroupComponent} from "@app/ui/transition-group/transition-group.component"; -import {ConfigurationService} from "@app/core/services/configuration/configuration.service"; +import { ConfigurationService } from "@app/core/services/configuration/configuration.service"; +import { DatasetProfileService } from '@app/core/services/dataset-profile/dataset-profile.service'; +import { EnumUtils } from '@app/core/services/utilities/enum-utils.service'; +import { + DatasetDescriptionCompositeFieldEditorModel, + DatasetDescriptionFieldEditorModel, + DatasetDescriptionSectionEditorModel +} from '@app/ui/misc/dataset-description-form/dataset-description-form.model'; +import { TransitionGroupComponent } from "@app/ui/transition-group/transition-group.component"; +import { BaseComponent } from '@common/base/base.component'; +import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component'; +import { Guid } from '@common/types/guid'; +import { TranslateService } from '@ngx-translate/core'; +import { Subject } from 'rxjs'; +import { debounceTime, delay, map, takeUntil, tap } from 'rxjs/operators'; +import { FieldEditorModel } from '../../../admin/field-editor-model'; +import { RuleEditorModel } from '../../../admin/rule-editor-model'; +import { GENERAL_ANIMATIONS } from '../../animations/animations'; +import { EditorCustomValidators } from '../../custom-validators/editor-custom-validators'; +import { ViewStyleType } from '../field/view-style-enum'; @Component({ selector: 'app-dataset-profile-editor-composite-field-component', templateUrl: './dataset-profile-editor-composite-field.component.html', styleUrls: ['./dataset-profile-editor-composite-field.component.scss'], - animations:[GENERAL_ANIMATIONS] + animations: [GENERAL_ANIMATIONS] }) export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent implements OnInit, OnChanges { @@ -75,7 +75,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i @Input() hasFocus: boolean = false; @ViewChild("inputs") inputs: TransitionGroupComponent; - showPreview: boolean = true; + showPreview: boolean = true; previewDirty: boolean = false; @@ -88,9 +88,9 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // isMultiplicityEnabled = false; viewStyleEnum = DatasetProfileFieldViewStyle; - viewTypeEnum = ViewStyleType; + viewTypeEnum = ViewStyleType; - private myCustomValidators:EditorCustomValidators = new EditorCustomValidators(); + private myCustomValidators: EditorCustomValidators = new EditorCustomValidators(); isMultiplicityEnabled = false; constructor( @@ -100,30 +100,30 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i public datasetProfileService: DatasetProfileService, private configurationService: ConfigurationService ) { - super(); - } + super(); + } - ngOnChanges(changes: SimpleChanges){ + ngOnChanges(changes: SimpleChanges) { // this.setTargetField(null); // this.showExtendedDescription = !!this.form.get('extendedDescription').value; // this.showAdditionalInfo = !!this.form.get('additionalInformation').value; // console.log(this.form.get('fields')['controls']) - if( changes['form']){ + if (changes['form']) { - try{ + try { const multiplicity = this.form.get('multiplicity').value; - this.isMultiplicityEnabled = multiplicity.min > 0 || multiplicity.max >0; - } catch{ + this.isMultiplicityEnabled = multiplicity.min > 0 || multiplicity.max > 0; + } catch { this.isMultiplicityEnabled = false; } } } - get firstField(){ - try{ + get firstField() { + try { return (this.form.get('fields') as UntypedFormArray).at(0); - }catch{ + } catch { return null; } } @@ -153,73 +153,73 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i this.showExtendedDescription = !!this.form.get('extendedDescription').value; this.showAdditionalInfo = !!this.form.get('additionalInformation').value; - this.form.valueChanges.pipe(takeUntil(this._destroyed)).subscribe(changes=>{ + this.form.valueChanges.pipe(takeUntil(this._destroyed)).subscribe(changes => { // this.previewForm = null; this.previewDirty = true; this.generatePreviewForm(); }); this.previewSubject$ - .pipe(debounceTime(600)) - .pipe( - takeUntil(this._destroyed), - map(model => model.buildForm()), - map(updatedForm =>{ - const previewContainer = document.getElementById('preview_container'+ this.form.get('id').value); - // let clientHeight = -1; - if(previewContainer){ - // console.log(previewContainer); - const clientHeight = previewContainer.clientHeight; - // console.log(clientHeight); + .pipe(debounceTime(600)) + .pipe( + takeUntil(this._destroyed), + map(model => model.buildForm()), + map(updatedForm => { + const previewContainer = document.getElementById('preview_container' + this.form.get('id').value); + // let clientHeight = -1; + if (previewContainer) { + // console.log(previewContainer); + const clientHeight = previewContainer.clientHeight; + // console.log(clientHeight); - if(clientHeight){ - previewContainer.style.height = clientHeight.toString() + 'px'; + if (clientHeight) { + previewContainer.style.height = clientHeight.toString() + 'px'; - // console.log('height:' ,previewContainer.style.height); + // console.log('height:' ,previewContainer.style.height); + } } - } - this.showPreview = false; - this.previewDirty = true; - this.previewForm = updatedForm; - return previewContainer; + this.showPreview = false; + this.previewDirty = true; + this.previewForm = updatedForm; + return previewContainer; }), - delay(100), - tap( previewContainer =>{ - this.showPreview = true; - this.previewDirty = false; - }), - delay(100) - ) - .subscribe(previewContainer=>{ + delay(100), + tap(previewContainer => { + this.showPreview = true; + this.previewDirty = false; + }), + delay(100) + ) + .subscribe(previewContainer => { - if(previewContainer){ - previewContainer.style.height = 'auto'; - } + if (previewContainer) { + previewContainer.style.height = 'auto'; + } - // const updatedForm = model.buildForm(); - // this.reloadPreview(updatedForm) - }); + // const updatedForm = model.buildForm(); + // this.reloadPreview(updatedForm) + }); this.generatePreviewForm(); } - get updatedClass(){ - if(this.previewDirty) return ''; + get updatedClass() { + if (this.previewDirty) return ''; else return 'updated'; } - private reloadPreview(updatedForm: UntypedFormGroup){ + private reloadPreview(updatedForm: UntypedFormGroup) { setTimeout(() => { - const previewContainer = document.getElementById('preview_container'+ this.form.get('id').value); + const previewContainer = document.getElementById('preview_container' + this.form.get('id').value); // let clientHeight = -1; - if(previewContainer){ + if (previewContainer) { // console.log(previewContainer); const clientHeight = previewContainer.clientHeight; // console.log(clientHeight); - if(clientHeight){ + if (clientHeight) { previewContainer.style.height = clientHeight.toString() + 'px'; // console.log('height:' ,previewContainer.style.height); @@ -235,9 +235,9 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i this.showPreview = true; this.previewDirty = false; - if(previewContainer){ + if (previewContainer) { setTimeout(() => { - if(previewContainer){ + if (previewContainer) { previewContainer.style.height = 'auto'; } }); @@ -248,55 +248,57 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i previewSubject$: Subject = new Subject(); - private generatePreviewForm(){ - const formValue:FieldSet = this.form.getRawValue(); - const fields:FieldDefinition[] = formValue.fields.map(editorField=>this._fieldToFieldDefinition(editorField)); + private generatePreviewForm() { + const formValue: FieldSet = this.form.getRawValue(); + const fields: FieldDefinition[] = formValue.fields.map(editorField => this._fieldToFieldDefinition(editorField)); - const compositeField: CompositeField = { - id: formValue.id, - additionalInformation: formValue.additionalInformation, - extendedDescription: formValue.extendedDescription, - numbering:'', - title: formValue.title, - ordinal: formValue.ordinal, - description: formValue.description, - hasCommentField: formValue.hasCommentField, - commentFieldValue: '', - multiplicity: {max: formValue.multiplicity.max, min: formValue.multiplicity.min, - placeholder: formValue.multiplicity.placeholder, tableView: formValue.multiplicity.tableView}, - multiplicityItems:null, - fields: fields.map(editorField=>{ - const model = new DatasetDescriptionFieldEditorModel().fromModel(editorField); - if(model.viewStyle.renderStyle === this.viewStyleEnum.CheckBox){ - model.value = model.value?"true":"false";//patch - } - return model; - }) - } + const compositeField: CompositeField = { + id: formValue.id, + additionalInformation: formValue.additionalInformation, + extendedDescription: formValue.extendedDescription, + numbering: '', + title: formValue.title, + ordinal: formValue.ordinal, + description: formValue.description, + hasCommentField: formValue.hasCommentField, + commentFieldValue: '', + multiplicity: { + max: formValue.multiplicity.max, min: formValue.multiplicity.min, + placeholder: formValue.multiplicity.placeholder, tableView: formValue.multiplicity.tableView + }, + multiplicityItems: null, + fields: fields.map(editorField => { + const model = new DatasetDescriptionFieldEditorModel().fromModel(editorField); + if (model.viewStyle.renderStyle === this.viewStyleEnum.CheckBox) { + model.value = model.value ? "true" : "false";//patch + } + return model; + }) + } - const section = new DatasetDescriptionSectionEditorModel(); - section.title = ''; - section.numbering = ''; + const section = new DatasetDescriptionSectionEditorModel(); + section.title = ''; + section.numbering = ''; - const compositeForm = new DatasetDescriptionCompositeFieldEditorModel().fromModel(compositeField) - section.compositeFields = [compositeForm]; + const compositeForm = new DatasetDescriptionCompositeFieldEditorModel().fromModel(compositeField) + section.compositeFields = [compositeForm]; - this.previewSubject$.next(section); + this.previewSubject$.next(section); } - private _fieldToFieldDefinition(editorField: Field): FieldDefinition{ + private _fieldToFieldDefinition(editorField: Field): FieldDefinition { const field = { id: editorField.id, title: '', page: editorField.page, - numbering:'', - multiplicity:null, + numbering: '', + multiplicity: null, multiplicityItems: null, viewStyle: editorField.viewStyle, - defaultValue:editorField.defaultValue, + defaultValue: editorField.defaultValue, value: null, validations: editorField.validations, } as FieldDefinition; @@ -370,7 +372,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i maxControl.setValue(1); placeholder.setValue(''); tableView.setValue(false); - }else{ + } else { minControl.setValue(0); maxControl.setValue(0); placeholder.setValue(null); @@ -385,7 +387,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i addNewField() { const field: FieldEditorModel = new FieldEditorModel(); - field.id=Guid.create().toString(); + field.id = Guid.create().toString(); field.ordinal = (this.form.get('fields') as UntypedFormArray).length; @@ -406,7 +408,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i fieldsForm.removeAt(index); this.inputs.init(); // calculate ordinals - fieldsForm.controls.forEach((field, idx)=>{ + fieldsForm.controls.forEach((field, idx) => { field.get('ordinal').setValue(idx); field.updateValueAndValidity(); }); @@ -419,29 +421,29 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i } - targetField:UntypedFormGroup; + targetField: UntypedFormGroup; validationTypeEnum = ValidationType; - addVisibilityRule(targetField: UntypedFormGroup){ + addVisibilityRule(targetField: UntypedFormGroup) { const rule: RuleEditorModel = new RuleEditorModel(); (targetField.get('visible').get('rules')).push(rule.buildForm()); } - toggleRequired(targetField: UntypedFormGroup, event:MatCheckboxChange){ + toggleRequired(targetField: UntypedFormGroup, event: MatCheckboxChange) { let validationsControl = targetField.get('validations') as UntypedFormControl; let validations: Array = validationsControl.value; - if(event.checked){ - if(!validations.includes(ValidationType.Required)){//IS ALREADY REQUIRED + if (event.checked) { + if (!validations.includes(ValidationType.Required)) {//IS ALREADY REQUIRED // validationsControl.setValue(validations.filter(validator=> validator != ValidationType.Required)); // validationsControl.updateValueAndValidity(); validations.push(ValidationType.Required); // validationsControl.setValue(validations); validationsControl.updateValueAndValidity(); } - }else{ - validationsControl.setValue(validations.filter(validator=> validator != ValidationType.Required)); + } else { + validationsControl.setValue(validations.filter(validator => validator != ValidationType.Required)); validationsControl.updateValueAndValidity(); } @@ -457,12 +459,12 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // validationsControl.updateValueAndValidity(); // } } - setTargetField(field:AbstractControl){ + setTargetField(field: AbstractControl) { this.targetField = field; } - deleteTargetField(){ + deleteTargetField() { const dialogRef = this.dialog.open(ConfirmationDialogComponent, { restoreFocus: false, @@ -482,29 +484,29 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i } - private _deleteTargetField(){ - if(!this.targetField) return; + private _deleteTargetField() { + if (!this.targetField) return; let index = -1; const fields = this.form.get('fields') as UntypedFormArray; - for(let i=0;i< fields.length; i++){ + for (let i = 0; i < fields.length; i++) { let field = fields.at(i); - if(field.get('id').value === this.targetField.get('id').value){//index found + if (field.get('id').value === this.targetField.get('id').value) {//index found index = i; break; } } - if(index>=0){//target found in fields + if (index >= 0) {//target found in fields this.DeleteField(index); this.targetField = null; } } - deleteField(index: number){ + deleteField(index: number) { const dialogRef = this.dialog.open(ConfirmationDialogComponent, { restoreFocus: false, @@ -526,14 +528,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i - addNewInput(type: ViewStyleType){ + addNewInput(type: ViewStyleType) { const fieldsArray = this.form.get('fields') as UntypedFormArray; let targetOrdinal = fieldsArray.length; - try{ - targetOrdinal = fieldsArray.controls.map(control=> control.get('ordinal').value).reduce((a,b)=>Math.max(a,b)) +1; - }catch{ + try { + targetOrdinal = fieldsArray.controls.map(control => control.get('ordinal').value).reduce((a, b) => Math.max(a, b)) + 1; + } catch { } @@ -542,9 +544,9 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i const field = { id: Guid.create().toString(), ordinal: targetOrdinal, - visible:{rules:[],style:null}, - validations:[], - viewStyle:{}, + visible: { rules: [], style: null }, + validations: [], + viewStyle: {}, export: true } as Field; @@ -566,12 +568,12 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // } switch (type) { - case this.viewTypeEnum.BooleanDecision:{ + case this.viewTypeEnum.BooleanDecision: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.BooleanDecision) // fieldForm.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm()); const data: BooleanDecisionFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.BooleanDecision; @@ -579,13 +581,13 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.CheckBox:{ + case this.viewTypeEnum.CheckBox: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.CheckBox) // fieldForm.addControl('data', new CheckBoxFieldDataEditorModel().buildForm()); const data: CheckBoxFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.CheckBox; @@ -593,7 +595,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Select:{ + case this.viewTypeEnum.Select: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox) @@ -602,13 +604,13 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // fieldForm.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options')); // fieldForm.get('data').updateValueAndValidity(); - const firstOption = {label:'', value:''} as FieldDataOption; + const firstOption = { label: '', value: '' } as FieldDataOption; - const data:WordListFieldData = { - label:'', - multiList:false, - options:[firstOption], - type:DatasetProfileComboBoxType.WordList + const data: WordListFieldData = { + label: '', + multiList: false, + options: [firstOption], + type: DatasetProfileComboBoxType.WordList } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.ComboBox; @@ -616,7 +618,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Other:{ + case this.viewTypeEnum.Other: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox) @@ -626,9 +628,9 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // fieldForm.get('data').updateValueAndValidity(); const data: AutoCompleteFieldData = { - autoCompleteSingleDataList:[], + autoCompleteSingleDataList: [], multiAutoComplete: false, - label:'', + label: '', type: DatasetProfileComboBoxType.Autocomplete } @@ -636,14 +638,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i field.data = data; break; - }case this.viewTypeEnum.InternalDmpEntities:{ + } case this.viewTypeEnum.InternalDmpEntities: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.InternalDmpEntities) // fieldForm.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());//TODO TO SEE const data: DmpsAutoCompleteFieldData = { - label:'', + label: '', multiAutoComplete: false, type: DatasetProfileInternalDmpEntitiesType.Dmps } @@ -654,29 +656,29 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.FreeText:{ + case this.viewTypeEnum.FreeText: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.FreeText) // fieldForm.addControl('data', new FreeTextFieldDataEditorModel().buildForm()); const data: FreeTextFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.FreeText; field.data = data; break; } - case this.viewTypeEnum.RadioBox:{ + case this.viewTypeEnum.RadioBox: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.RadioBox) // fieldForm.addControl('data', new RadioBoxFieldDataEditorModel().buildForm()); // fieldForm.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options')); // fieldForm.get('data').updateValueAndValidity(); - const data: RadioBoxFieldData= { - label:'', + const data: RadioBoxFieldData = { + label: '', options: [] } @@ -685,14 +687,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.TextArea:{ + case this.viewTypeEnum.TextArea: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea) // fieldForm.addControl('data', new TextAreaFieldDataEditorModel().buildForm()); const data: TextAreaFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.TextArea; @@ -700,14 +702,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.RichTextArea:{ + case this.viewTypeEnum.RichTextArea: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea) // fieldForm.addControl('data', new TextAreaFieldDataEditorModel().buildForm()); const data: RichTextAreaFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.RichTextArea; @@ -715,14 +717,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Upload:{ + case this.viewTypeEnum.Upload: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea) // fieldForm.addControl('data', new TextAreaFieldDataEditorModel().buildForm()); const data: UploadFieldData = { - label:'', + label: '', types: [], maxFileSizeInMB: this.configurationService.maxFileSizeInMB } @@ -732,26 +734,26 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.DatePicker:{ + case this.viewTypeEnum.DatePicker: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatePicker) // fieldForm.addControl('data', new DatePickerDataEditorModel().buildForm()); const data: DatePickerFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatePicker; break; } - case this.viewTypeEnum.ExternalDatasets:{ + case this.viewTypeEnum.ExternalDatasets: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ExternalDatasets) // fieldForm.addControl('data', new ExternalDatasetsDataEditorModel().buildForm()); const data: ExternalDatasetsFieldData = { - label:'', + label: '', multiAutoComplete: false } @@ -759,7 +761,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i field.data = data; break; } - case this.viewTypeEnum.DataRepositories:{ + case this.viewTypeEnum.DataRepositories: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DataRepositories) @@ -775,7 +777,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.PubRepositories:{ + case this.viewTypeEnum.PubRepositories: { const data: DataRepositoriesFieldData = { @@ -788,7 +790,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.JournalRepositories:{ + case this.viewTypeEnum.JournalRepositories: { const data: DataRepositoriesFieldData = { label: '', @@ -800,7 +802,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Taxonomies:{ + case this.viewTypeEnum.Taxonomies: { const data: TaxonomiesFieldData = { label: '', @@ -812,7 +814,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Licenses:{ + case this.viewTypeEnum.Licenses: { const data: LicensesFieldData = { label: '', @@ -824,7 +826,7 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Publications:{ + case this.viewTypeEnum.Publications: { const data: PublicationsFieldData = { label: '', @@ -836,13 +838,13 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Registries:{ + case this.viewTypeEnum.Registries: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Registries) // fieldForm.addControl('data', new RegistriesDataEditorModel().buildForm()); - const data:RegistriesFieldData = { + const data: RegistriesFieldData = { label: '', multiAutoComplete: false } @@ -852,14 +854,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Services:{ + case this.viewTypeEnum.Services: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Services) // fieldForm.addControl('data', new ServicesDataEditorModel().buildForm()); - const data:ServicesFieldData = { - label:'', + const data: ServicesFieldData = { + label: '', multiAutoComplete: false } @@ -868,21 +870,21 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Tags:{ + case this.viewTypeEnum.Tags: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Tags) // fieldForm.addControl('data', new TagsDataEditorModel().buildForm()); const data: TagsFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Tags; field.data = data; break; } - case this.viewTypeEnum.Researchers:{ + case this.viewTypeEnum.Researchers: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Researchers) @@ -891,8 +893,8 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Researchers; - const data : ResearchersAutoCompleteFieldData = { - label:'', + const data: ResearchersAutoCompleteFieldData = { + label: '', multiAutoComplete: false, type: DatasetProfileInternalDmpEntitiesType.Researchers } @@ -901,14 +903,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // field.data = {label:''} field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Researchers; - field.data = data; + field.data = data; break; } - case this.viewTypeEnum.Organizations:{ + case this.viewTypeEnum.Organizations: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Organizations) @@ -917,8 +919,8 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // fieldForm.addControl('data', new DatasetsAutoCompleteFieldDataEditorModel().buildForm()); //TODO const data = { - autoCompleteSingleDataList:[], - label:'', + autoCompleteSingleDataList: [], + label: '', multiAutoComplete: false, } as OrganizationsFieldData; //TODO @@ -928,14 +930,14 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.DatasetIdentifier:{ + case this.viewTypeEnum.DatasetIdentifier: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatasetIdentifier) // fieldForm.addControl('data', new DatasetIdentifierDataEditorModel().buildForm()); - const data : DatasetIdentifierFieldData = { - label:'' + const data: DatasetIdentifierFieldData = { + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatasetIdentifier; @@ -943,28 +945,28 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i break; } - case this.viewTypeEnum.Currency:{ + case this.viewTypeEnum.Currency: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Currency) // fieldForm.addControl('data', new CurrencyDataEditorModel().buildForm()); const data: CurrencyFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Currency; field.data = data; break; } - case this.viewTypeEnum.Validation:{ + case this.viewTypeEnum.Validation: { // fieldForm.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Validation) // fieldForm.addControl('data', new ValidationDataEditorModel().buildForm()); - const data:ValidationFieldData = { - label:'' + const data: ValidationFieldData = { + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Validation; @@ -1043,16 +1045,16 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i // } - calculateLabelWidth(numbering: string){ + calculateLabelWidth(numbering: string) { - const width = numbering.split('.').reduce((acc,item)=> item+acc,'').length; + const width = numbering.split('.').reduce((acc, item) => item + acc, '').length; - return {'width':width+'em'} + return { 'width': width + 'em' } } get fieldsArray(): UntypedFormArray { - if(this.form && this.form.get('fields')) { + if (this.form && this.form.get('fields')) { return this.form.get('fields') as UntypedFormArray; } return null; @@ -1063,10 +1065,10 @@ export class DatasetProfileEditorCompositeFieldComponent extends BaseComponent i if (direction === "up" && this.canGoUp(index)) { let temp = this.fieldsArray.at(index); this.fieldsArray.removeAt(index); - this.fieldsArray.insert(index-1, temp); + this.fieldsArray.insert(index - 1, temp); } else if (direction === "down" && this.canGoDown(index)) { - let temp = this.fieldsArray.at(index+1); - this.fieldsArray.removeAt(index+1); + let temp = this.fieldsArray.at(index + 1); + this.fieldsArray.removeAt(index + 1); this.fieldsArray.insert(index, temp); } this.fieldsArray.controls.forEach((field, index) => { diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts index 1cefd7483..d2dc8e314 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts @@ -1,20 +1,14 @@ -import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core'; -import {UntypedFormArray, UntypedFormControl, UntypedFormGroup, FormGroupDirective, NgForm,} from '@angular/forms'; -import {DatasetProfileFieldViewStyle} from '@app/core/common/enum/dataset-profile-field-view-style'; -import {ValidationType} from '@app/core/common/enum/validation-type'; -import {DatasetProfileService} from '@app/core/services/dataset-profile/dataset-profile.service'; -import {EnumUtils} from '@app/core/services/utilities/enum-utils.service'; -import {RuleEditorModel} from '@app/ui/admin/dataset-profile/admin/rule-editor-model'; -import {BaseComponent} from '@common/base/base.component'; -import {Observable, Subscription} from 'rxjs'; -import {ViewStyleType} from './view-style-enum'; -import {DatasetProfileComboBoxType} from '@app/core/common/enum/dataset-profile-combo-box-type'; -iimport {ErrorStateMatcher} from '@angular/material/core'; -import {MMatLegacyDialog as MatDialog from '@@angular/material/legacy-dialog; -import {MMatLegacySlideToggleChange as MatSlideToggleChange from '@@angular/material/legacy-slide-toggle; -import {DefaultValue, Field} from '@app/core/model/admin/dataset-profile/dataset-profile'; -import {DatasetProfileInternalDmpEntitiesType} from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type'; -import {FieldEditorModel} from '../../../admin/field-editor-model'; +import { COMMA, ENTER } from '@angular/cdk/keycodes'; +import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'; +import { FormGroupDirective, NgForm, UntypedFormArray, UntypedFormControl, UntypedFormGroup, } from '@angular/forms'; +import { ErrorStateMatcher } from '@angular/material/core'; +import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; +import { MatLegacySlideToggleChange as MatSlideToggleChange } from '@angular/material/legacy-slide-toggle'; +import { DatasetProfileComboBoxType } from '@app/core/common/enum/dataset-profile-combo-box-type'; +import { DatasetProfileFieldViewStyle } from '@app/core/common/enum/dataset-profile-field-view-style'; +import { DatasetProfileInternalDmpEntitiesType } from '@app/core/common/enum/dataset-profile-internal-dmp-entities-type'; +import { ValidationType } from '@app/core/common/enum/validation-type'; +import { DefaultValue, Field } from '@app/core/model/admin/dataset-profile/dataset-profile'; import { AutoCompleteFieldData, BooleanDecisionFieldData, @@ -34,19 +28,25 @@ import { RegistriesFieldData, ResearchersAutoCompleteFieldData, RichTextAreaFieldData, - UploadFieldData, ServicesFieldData, // TableFieldData, TagsFieldData, TaxonomiesFieldData, TextAreaFieldData, + UploadFieldData, ValidationFieldData, WordListFieldData } from '@app/core/model/dataset-profile-definition/field-data/field-data'; -import {ConfigurationService} from "@app/core/services/configuration/configuration.service"; +import { ConfigurationService } from "@app/core/services/configuration/configuration.service"; +import { DatasetProfileService } from '@app/core/services/dataset-profile/dataset-profile.service'; +import { EnumUtils } from '@app/core/services/utilities/enum-utils.service'; import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration'; +import { RuleEditorModel } from '@app/ui/admin/dataset-profile/admin/rule-editor-model'; +import { BaseComponent } from '@common/base/base.component'; +import { Observable, Subscription } from 'rxjs'; import { map } from 'rxjs/operators'; -import { COMMA, ENTER } from '@angular/cdk/keycodes'; +import { FieldEditorModel } from '../../../admin/field-editor-model'; +import { ViewStyleType } from './view-style-enum'; @Component({ selector: 'app-dataset-profile-editor-field-component', @@ -63,13 +63,13 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // isFieldMultiplicityEnabled = false; viewType: ViewStyleType; - viewTypeEnum = ViewStyleType; + viewTypeEnum = ViewStyleType; // private subject$:Subject = new Subject(); @Input() expandView: boolean = true; - @Input() canBeDeleted:boolean = true; + @Input() canBeDeleted: boolean = true; @Output() delete = new EventEmitter(); @@ -85,20 +85,21 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements filterSemantics(value: string): Observable { return this.datasetProfileService.searchSemantics(value); } - + constructor( public enumUtils: EnumUtils, public datasetProfileService: DatasetProfileService, private dialog: MatDialog, private configurationService: ConfigurationService - ) { super(); + ) { + super(); } isErrorState(control: UntypedFormControl, form: FormGroupDirective | NgForm): boolean { - if(this.form.get('viewStyle').untouched) return false; + if (this.form.get('viewStyle').untouched) return false; return this.form.get('viewStyle').invalid; } @@ -118,12 +119,12 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // } const renderStyle = this.form.get('viewStyle').get('renderStyle').value; - if(renderStyle){ + if (renderStyle) { // this.matcher.setReference(this.form); const type = this.form.get('viewStyle').get('renderStyle').value; - switch(type){ + switch (type) { case DatasetProfileFieldViewStyle.BooleanDecision: this.viewType = this.viewTypeEnum.BooleanDecision; break; @@ -133,9 +134,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements case DatasetProfileFieldViewStyle.ComboBox: const comboType = this.form.get('data').get('type').value; - if(comboType === DatasetProfileComboBoxType.Autocomplete){ + if (comboType === DatasetProfileComboBoxType.Autocomplete) { this.viewType = this.viewTypeEnum.Other; - }else if(comboType === DatasetProfileComboBoxType.WordList){ + } else if (comboType === DatasetProfileComboBoxType.WordList) { this.viewType = this.viewTypeEnum.Select; } break; @@ -209,7 +210,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements this.viewType = this.viewTypeEnum.Validation; break; } - if(this.viewType !== this.viewTypeEnum.FreeText) { + if (this.viewType !== this.viewTypeEnum.FreeText) { this.setValidator(ValidationType.URL, false); } } @@ -340,7 +341,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements } - private _formChangesSubscription:Subscription; + private _formChangesSubscription: Subscription; private _showPreview: boolean = false; // get showPreview(): boolean{ @@ -426,10 +427,10 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // // }); // }; - get canApplyVisibility():boolean{ + get canApplyVisibility(): boolean { - switch(this.viewType){ + switch (this.viewType) { case this.viewTypeEnum.TextArea: case this.viewTypeEnum.RichTextArea: case this.viewTypeEnum.Upload: @@ -472,7 +473,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // } - onInputTypeChange(){ + onInputTypeChange() { const x = this.viewType; @@ -484,7 +485,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements const field: Field = this.form.getRawValue(); // field.defaultValue = {type:null, value: null}; field.defaultValue = undefined; - if(!this.canApplyVisibility){ + if (!this.canApplyVisibility) { field.visible.rules = []; } @@ -499,14 +500,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // this.form.addControl('defaultValue',defaultValueModel.buildForm()); switch (x) { - case this.viewTypeEnum.BooleanDecision:{ + case this.viewTypeEnum.BooleanDecision: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.BooleanDecision) // this.form.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm()); const data: BooleanDecisionFieldData = { - label:"" + label: "" } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.BooleanDecision; @@ -514,14 +515,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.CheckBox:{ + case this.viewTypeEnum.CheckBox: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.CheckBox) // this.form.addControl('data', new CheckBoxFieldDataEditorModel().buildForm()); const data: CheckBoxFieldData = { - label:'' + label: '' } const defaultValue: DefaultValue = { type: '', @@ -534,7 +535,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Select:{ + case this.viewTypeEnum.Select: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox) @@ -542,13 +543,13 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // this.form.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options')); // this.form.get('data').updateValueAndValidity(); - const option1 = {label:'', value:''} as FieldDataOption; + const option1 = { label: '', value: '' } as FieldDataOption; - const data:WordListFieldData = { - label:'', - multiList:false, - options:[option1], - type:DatasetProfileComboBoxType.WordList + const data: WordListFieldData = { + label: '', + multiList: false, + options: [option1], + type: DatasetProfileComboBoxType.WordList } @@ -557,7 +558,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Other:{ + case this.viewTypeEnum.Other: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ComboBox) @@ -567,9 +568,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // this.form.get('data').updateValueAndValidity(); const data: AutoCompleteFieldData = { - autoCompleteSingleDataList:[], + autoCompleteSingleDataList: [], multiAutoComplete: false, - label:'', + label: '', type: DatasetProfileComboBoxType.Autocomplete } @@ -578,14 +579,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.InternalDmpEntities:{ + case this.viewTypeEnum.InternalDmpEntities: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.InternalDmpEntities) // this.form.addControl('data', new ResearchersAutoCompleteFieldDataEditorModel().buildForm());//TODO TO SEE const data: DmpsAutoCompleteFieldData = { - label:'', + label: '', multiAutoComplete: false, type: DatasetProfileInternalDmpEntitiesType.Dmps } @@ -595,14 +596,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.FreeText:{ + case this.viewTypeEnum.FreeText: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.FreeText) // this.form.addControl('data', new FreeTextFieldDataEditorModel().buildForm()); const data: FreeTextFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.FreeText; @@ -610,7 +611,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.RadioBox:{ + case this.viewTypeEnum.RadioBox: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.RadioBox) @@ -619,8 +620,8 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // this.form.get('data').setValidators(EditorCustomValidators.atLeastOneElementListValidator('options')); // this.form.get('data').updateValueAndValidity(); - const data: RadioBoxFieldData= { - label:'', + const data: RadioBoxFieldData = { + label: '', options: [] } @@ -630,14 +631,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.TextArea:{ + case this.viewTypeEnum.TextArea: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.TextArea) // this.form.addControl('data', new TextAreaFieldDataEditorModel().buildForm()); const data: TextAreaFieldData = { - label:'' + label: '' } @@ -645,9 +646,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements field.data = data; break; } - case this.viewTypeEnum.RichTextArea:{ + case this.viewTypeEnum.RichTextArea: { const data: RichTextAreaFieldData = { - label:'' + label: '' } @@ -655,9 +656,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements field.data = data; break; } - case this.viewTypeEnum.Upload:{ + case this.viewTypeEnum.Upload: { const data: UploadFieldData = { - label:'', + label: '', types: [], maxFileSizeInMB: this.configurationService.maxFileSizeInMB } @@ -677,14 +678,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // field.data = data; // break; // } - case this.viewTypeEnum.DatePicker:{ + case this.viewTypeEnum.DatePicker: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatePicker) // this.form.addControl('data', new DatePickerDataEditorModel().buildForm()); const data: DatePickerFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatePicker; @@ -692,12 +693,12 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.ExternalDatasets:{ + case this.viewTypeEnum.ExternalDatasets: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.ExternalDatasets) // this.form.addControl('data', new ExternalDatasetsDataEditorModel().buildForm()); const data: ExternalDatasetsFieldData = { - label:'', + label: '', multiAutoComplete: false } @@ -707,7 +708,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.DataRepositories:{ + case this.viewTypeEnum.DataRepositories: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DataRepositories) @@ -723,7 +724,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.PubRepositories:{ + case this.viewTypeEnum.PubRepositories: { const data: DataRepositoriesFieldData = { label: '', @@ -735,7 +736,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.JournalRepositories:{ + case this.viewTypeEnum.JournalRepositories: { const data: DataRepositoriesFieldData = { label: '', @@ -747,7 +748,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Taxonomies:{ + case this.viewTypeEnum.Taxonomies: { const data: TaxonomiesFieldData = { label: '', @@ -759,7 +760,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Licenses:{ + case this.viewTypeEnum.Licenses: { const data: LicensesFieldData = { label: '', @@ -771,7 +772,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Publications:{ + case this.viewTypeEnum.Publications: { const data: PublicationsFieldData = { label: '', @@ -783,13 +784,13 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Registries:{ + case this.viewTypeEnum.Registries: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Registries) // this.form.addControl('data', new RegistriesDataEditorModel().buildForm()); - const data:RegistriesFieldData = { + const data: RegistriesFieldData = { label: '', multiAutoComplete: false } @@ -799,14 +800,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Services:{ + case this.viewTypeEnum.Services: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Services) // this.form.addControl('data', new ServicesDataEditorModel().buildForm()); - const data:ServicesFieldData = { - label:'', + const data: ServicesFieldData = { + label: '', multiAutoComplete: false } @@ -815,12 +816,12 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Tags:{ + case this.viewTypeEnum.Tags: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Tags) // this.form.addControl('data', new TagsDataEditorModel().buildForm()); const data: TagsFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Tags; @@ -829,7 +830,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Researchers:{ + case this.viewTypeEnum.Researchers: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Researchers) // // this.form.addControl('data', new ResearchersDataEditorModel().buildForm()); //TODO TO ASK @@ -837,8 +838,8 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements // field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Researchers; - const data : ResearchersAutoCompleteFieldData = { - label:'', + const data: ResearchersAutoCompleteFieldData = { + label: '', multiAutoComplete: false, type: DatasetProfileInternalDmpEntitiesType.Researchers } @@ -850,15 +851,15 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Organizations:{ + case this.viewTypeEnum.Organizations: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Organizations) // this.form.addControl('data', new OrganizationsDataEditorModel().buildForm()); const data = { - autoCompleteSingleDataList:[], - label:'', + autoCompleteSingleDataList: [], + label: '', multiAutoComplete: false, } as OrganizationsFieldData; //TODO @@ -868,14 +869,14 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.DatasetIdentifier:{ + case this.viewTypeEnum.DatasetIdentifier: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.DatasetIdentifier) // this.form.addControl('data', new DatasetIdentifierDataEditorModel().buildForm()); - const data : DatasetIdentifierFieldData = { - label:'' + const data: DatasetIdentifierFieldData = { + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.DatasetIdentifier; @@ -883,28 +884,28 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements break; } - case this.viewTypeEnum.Currency:{ + case this.viewTypeEnum.Currency: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Currency) // this.form.addControl('data', new CurrencyDataEditorModel().buildForm()); const data: CurrencyFieldData = { - label:'' + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Currency; field.data = data; break; } - case this.viewTypeEnum.Validation:{ + case this.viewTypeEnum.Validation: { // this.form.get('viewStyle').get('renderStyle').setValue(DatasetProfileFieldViewStyle.Validation) // this.form.addControl('data', new ValidationDataEditorModel().buildForm()); - const data:ValidationFieldData = { - label:'' + const data: ValidationFieldData = { + label: '' } field.viewStyle.renderStyle = DatasetProfileFieldViewStyle.Validation; @@ -925,12 +926,12 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements const fields = this.form.parent as UntypedFormArray; let index = -1; - fields.controls.forEach((control,i)=>{ - if(this.form.get('id').value === control.get('id').value){ + fields.controls.forEach((control, i) => { + if (this.form.get('id').value === control.get('id').value) { index = i } }); - if(index>=0){ + if (index >= 0) { fields.removeAt(index); fields.insert(index, form); this.form = form; @@ -944,11 +945,11 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements } - toggleRequired(event:MatSlideToggleChange){ + toggleRequired(event: MatSlideToggleChange) { this.setValidator(ValidationType.Required, event.checked); } - toggleURL(event:MatSlideToggleChange){ + toggleURL(event: MatSlideToggleChange) { this.setValidator(ValidationType.URL, event.checked); } @@ -956,32 +957,32 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements let validationsControl = this.form.get('validations') as UntypedFormControl; let validations: Array = validationsControl.value; - if(add){ - if(!validations.includes(validationType)){ + if (add) { + if (!validations.includes(validationType)) { validations.push(validationType); validationsControl.updateValueAndValidity(); } - } else{ - validationsControl.setValue(validations.filter(validator=> validator != validationType)); + } else { + validationsControl.setValue(validations.filter(validator => validator != validationType)); validationsControl.updateValueAndValidity(); } this.form.markAsDirty();//deactivate guard } - get isRequired(){ + get isRequired() { let validationsControl = this.form.get('validations') as UntypedFormControl; let validations: Array = validationsControl.value; return validations.includes(ValidationType.Required); } - get isURL(){ + get isURL() { let validationsControl = this.form.get('validations') as UntypedFormControl; let validations: Array = validationsControl.value; return validations.includes(ValidationType.URL); } - onDelete(){ + onDelete() { this.delete.emit(); } } diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts index af9184e83..7bc08888c 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts @@ -4,7 +4,7 @@ import { HttpClient, HttpErrorResponse } from '@angular/common/http'; import { Component, OnInit, QueryList, ViewChild } from '@angular/core'; import { AbstractControl, UntypedFormArray, UntypedFormBuilder, UntypedFormControl, UntypedFormGroup, Validators } from '@angular/forms'; import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; -import { MatHorizontalStepper} from '@angular/material/stepper'; +import { MatStepper} from '@angular/material/stepper'; import { ActivatedRoute, ParamMap, Router } from '@angular/router'; import { TranslateService } from '@ngx-translate/core'; import { debounceTime, filter, map, mergeMap, takeUntil, tap } from 'rxjs/operators'; @@ -77,7 +77,7 @@ export class DatasetProfileEditorComponent extends CheckDeactivateBaseComponent newVersionId: string; dataWizardModel: DatasetWizardModel; breadCrumbs: Observable; - @ViewChild('stepper') stepper: MatHorizontalStepper; + @ViewChild('stepper') stepper: MatStepper; viewOnly = false; nestedCount: number[] = []; nestedIndex: number = 0; diff --git a/dmp-frontend/src/app/ui/admin/dataset-profile/table-of-contents/table-of-contents.ts b/dmp-frontend/src/app/ui/admin/dataset-profile/table-of-contents/table-of-contents.ts index 9357f3e99..08945b983 100644 --- a/dmp-frontend/src/app/ui/admin/dataset-profile/table-of-contents/table-of-contents.ts +++ b/dmp-frontend/src/app/ui/admin/dataset-profile/table-of-contents/table-of-contents.ts @@ -102,7 +102,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn if(!(element && (targetContainer ||((element.type===ToCEntryType.Page) && (targetId === this.ROOT_ID))) && (sourceContainer||((element.type===ToCEntryType.Page) && (sourceId === this.ROOT_ID))))){ // console.info('Could not find elements'); this.dataNeedsRefresh.emit(); - drake.cancel(true); + //TODO: angular update //drake.cancel(true); return; } diff --git a/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts b/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts index d53569ddd..03fca64ee 100644 --- a/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts +++ b/dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.ts @@ -1,68 +1,66 @@ -import {ChangeDetectorRef, Component, OnInit, ViewChild} from '@angular/core'; -import {AbstractControl, UntypedFormArray, UntypedFormControl, UntypedFormGroup} from '@angular/forms'; -import {MatLegacyDialog as MatDialog} from '@angular/material/legacy-dialog'; -import {MatLegacySnackBar as MatSnackBar} from '@angular/material/legacy-snack-bar'; -import {ActivatedRoute, Router} from '@angular/router'; -import {DatasetStatus} from '@app/core/common/enum/dataset-status'; -import {DmpStatus} from '@app/core/common/enum/dmp-status'; -import {DataTableRequest} from '@app/core/model/data-table/data-table-request'; -import {DatasetProfileModel} from '@app/core/model/dataset/dataset-profile'; -import {DmpModel} from '@app/core/model/dmp/dmp'; -import {DmpListingModel} from '@app/core/model/dmp/dmp-listing'; -import {DatasetProfileCriteria} from '@app/core/query/dataset-profile/dataset-profile-criteria'; -import {DmpCriteria} from '@app/core/query/dmp/dmp-criteria'; -import {RequestItem} from '@app/core/query/request-item'; -import {DatasetWizardService} from '@app/core/services/dataset-wizard/dataset-wizard.service'; -import {DmpService} from '@app/core/services/dmp/dmp.service'; +import { Location } from '@angular/common'; +import { HttpClient } from '@angular/common/http'; +import { Component, OnInit, ViewChild } from '@angular/core'; +import { AbstractControl, UntypedFormArray, UntypedFormControl, UntypedFormGroup } from '@angular/forms'; +import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; +import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'; +import { ActivatedRoute, Router } from '@angular/router'; +import { DatasetStatus } from '@app/core/common/enum/dataset-status'; +import { DmpStatus } from '@app/core/common/enum/dmp-status'; +import { SaveType } from '@app/core/common/enum/save-type'; +import { DataTableRequest } from '@app/core/model/data-table/data-table-request'; +import { DatasetProfileModel } from '@app/core/model/dataset/dataset-profile'; +import { DatasetWizardModel } from '@app/core/model/dataset/dataset-wizard'; +import { DmpModel } from '@app/core/model/dmp/dmp'; +import { DmpListingModel } from '@app/core/model/dmp/dmp-listing'; +import { LockModel } from '@app/core/model/lock/lock.model'; +import { DatasetProfileCriteria } from '@app/core/query/dataset-profile/dataset-profile-criteria'; +import { DmpCriteria } from '@app/core/query/dmp/dmp-criteria'; +import { RequestItem } from '@app/core/query/request-item'; +import { AuthService } from '@app/core/services/auth/auth.service'; +import { ConfigurationService } from '@app/core/services/configuration/configuration.service'; +import { DatasetWizardService } from '@app/core/services/dataset-wizard/dataset-wizard.service'; +import { DmpService } from '@app/core/services/dmp/dmp.service'; import { ExternalSourcesConfigurationService } from '@app/core/services/external-sources/external-sources-configuration.service'; -import {ExternalSourcesService} from '@app/core/services/external-sources/external-sources.service'; +import { ExternalSourcesService } from '@app/core/services/external-sources/external-sources.service'; +import { LockService } from '@app/core/services/lock/lock.service'; +import { MatomoService } from '@app/core/services/matomo/matomo-service'; import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service'; -import {SingleAutoCompleteConfiguration} from '@app/library/auto-complete/single/single-auto-complete-configuration'; +import { SingleAutoCompleteConfiguration } from '@app/library/auto-complete/single/single-auto-complete-configuration'; +import { CheckDeactivateBaseComponent } from '@app/library/deactivate/deactivate.component'; +import { PopupNotificationDialogComponent } from '@app/library/notification/popup/popup-notification.component'; import { DatasetCopyDialogueComponent } from '@app/ui/dataset/dataset-wizard/dataset-copy-dialogue/dataset-copy-dialogue.component'; -import {DatasetWizardEditorModel} from '@app/ui/dataset/dataset-wizard/dataset-wizard-editor.model'; -import {BreadcrumbItem} from '@app/ui/misc/breadcrumb/definition/breadcrumb-item'; -import {IBreadCrumbComponent} from '@app/ui/misc/breadcrumb/definition/IBreadCrumbComponent'; -import {DatasetDescriptionFormEditorModel} from '@app/ui/misc/dataset-description-form/dataset-description-form.model'; +import { DatasetWizardEditorModel } from '@app/ui/dataset/dataset-wizard/dataset-wizard-editor.model'; +import { PrefillDatasetComponent } from "@app/ui/dataset/dataset-wizard/prefill-dataset/prefill-dataset.component"; +import { IBreadCrumbComponent } from '@app/ui/misc/breadcrumb/definition/IBreadCrumbComponent'; +import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item'; +import { DatasetDescriptionFormEditorModel } from '@app/ui/misc/dataset-description-form/dataset-description-form.model'; +import { ToCEntry, ToCEntryType } from "@app/ui/misc/dataset-description-form/dataset-description.component"; import { Link, LinkToScroll, TableOfContents } from '@app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents'; -import {FormService} from '@common/forms/form-service'; +import { VisibilityRulesService } from '@app/ui/misc/dataset-description-form/visibility-rules/visibility-rules.service'; +import { isNullOrUndefined } from '@app/utilities/enhancers/utils'; +import { FormService } from '@common/forms/form-service'; import { FormValidationErrorsDialogComponent } from '@common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component'; -import {ValidationErrorModel} from '@common/forms/validation/error-model/validation-error-model'; -import {ConfirmationDialogComponent} from '@common/modules/confirmation-dialog/confirmation-dialog.component'; -import {TranslateService} from '@ngx-translate/core'; +import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model'; +import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component'; +import { Guid } from '@common/types/guid'; +import { TranslateService } from '@ngx-translate/core'; import * as FileSaver from 'file-saver'; -import {interval, Observable, of as observableOf} from 'rxjs'; -import {catchError, debounceTime, filter, map, takeUntil} from 'rxjs/operators'; -import {LockService} from '@app/core/services/lock/lock.service'; -import {Location} from '@angular/common'; -import {LockModel} from '@app/core/model/lock/lock.model'; -import {Guid} from '@common/types/guid'; -import {isNullOrUndefined} from '@app/utilities/enhancers/utils'; -import {AuthService} from '@app/core/services/auth/auth.service'; -import {ConfigurationService} from '@app/core/services/configuration/configuration.service'; -import {SaveType} from '@app/core/common/enum/save-type'; -import {DatasetWizardModel} from '@app/core/model/dataset/dataset-wizard'; -import {MatomoService} from '@app/core/services/matomo/matomo-service'; -import {HttpClient} from '@angular/common/http'; -import {VisibilityRulesService} from '@app/ui/misc/dataset-description-form/visibility-rules/visibility-rules.service'; -import {PopupNotificationDialogComponent} from '@app/library/notification/popup/popup-notification.component'; -import {CheckDeactivateBaseComponent} from '@app/library/deactivate/deactivate.component'; -import {PrefillDatasetComponent} from "@app/ui/dataset/dataset-wizard/prefill-dataset/prefill-dataset.component"; -import {ToCEntry, ToCEntryType} from "@app/ui/misc/dataset-description-form/dataset-description.component"; -import {dispatchFakeEvent} from "@angular/cdk/testing/testbed/fake-events"; -import { DmpDatasetProfile } from '@app/core/model/dmp/dmp-dataset-profile/dmp-dataset-profile'; +import { Observable, interval, of as observableOf } from 'rxjs'; +import { catchError, debounceTime, filter, map, takeUntil } from 'rxjs/operators'; @Component({ selector: 'app-dataset-wizard-component', @@ -196,63 +194,63 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.datasetWizardService.getSingle(this.itemId) .pipe(takeUntil(this._destroyed)) .subscribe(data => { - this.lockService.checkLockStatus(data.id).pipe(takeUntil(this._destroyed)).subscribe(lockStatus => { - this.lockStatus = lockStatus; - this.datasetWizardModel = new DatasetWizardEditorModel().fromModel(data); - this.dmpSectionIndex = this.datasetWizardModel.dmpSectionIndex; - this.needsUpdate(); - this.breadCrumbs = observableOf([ - { - parentComponentName: null, - label: this.datasetWizardModel.label, - url: '/datasets/edit/' + this.datasetWizardModel.id, - notFoundResolver: [ - { - parentComponentName: null, - label: this.language.instant('NAV-BAR.MY-DATASET-DESCRIPTIONS').toUpperCase(), - url: '/datasets' - }, - ] - }]); - this.formGroup = this.datasetWizardModel.buildForm(); - let profiles = this.datasetWizardModel.dmp.profiles.filter(profile => profile.data.dmpSectionIndex.includes(this.datasetWizardModel.dmpSectionIndex)); - for(var profile of profiles){ - this.availableDescriptionTemplates.push({id: profile.descriptionTemplateId, label: profile.label, description: ""}) - } - this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue())); - this.editMode = this.datasetWizardModel.status === DatasetStatus.Draft; - if (this.datasetWizardModel.status === DatasetStatus.Finalized || lockStatus) { - this.formGroup.disable(); - this.viewOnly = true; - } - if (!lockStatus && !isNullOrUndefined(this.authService.current())) { - this.lock = new LockModel(data.id, this.authService.current()); + this.lockService.checkLockStatus(data.id).pipe(takeUntil(this._destroyed)).subscribe(lockStatus => { + this.lockStatus = lockStatus; + this.datasetWizardModel = new DatasetWizardEditorModel().fromModel(data); + this.dmpSectionIndex = this.datasetWizardModel.dmpSectionIndex; + this.needsUpdate(); + this.breadCrumbs = observableOf([ + { + parentComponentName: null, + label: this.datasetWizardModel.label, + url: '/datasets/edit/' + this.datasetWizardModel.id, + notFoundResolver: [ + { + parentComponentName: null, + label: this.language.instant('NAV-BAR.MY-DATASET-DESCRIPTIONS').toUpperCase(), + url: '/datasets' + }, + ] + }]); + this.formGroup = this.datasetWizardModel.buildForm(); + let profiles = this.datasetWizardModel.dmp.profiles.filter(profile => profile.data.dmpSectionIndex.includes(this.datasetWizardModel.dmpSectionIndex)); + for (var profile of profiles) { + this.availableDescriptionTemplates.push({ id: profile.descriptionTemplateId, label: profile.label, description: "" }) + } + this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue())); + this.editMode = this.datasetWizardModel.status === DatasetStatus.Draft; + if (this.datasetWizardModel.status === DatasetStatus.Finalized || lockStatus) { + this.formGroup.disable(); + this.viewOnly = true; + } + if (!lockStatus && !isNullOrUndefined(this.authService.current())) { + this.lock = new LockModel(data.id, this.authService.current()); - this.lockService.createOrUpdate(this.lock).pipe(takeUntil(this._destroyed)).subscribe(async result => { - this.lock.id = Guid.parse(result); - interval(this.configurationService.lockInterval).pipe(takeUntil(this._destroyed)).subscribe(() => this.pumpLock()); - }); - } - // if (this.viewOnly) { this.formGroup.disable(); } // For future use, to make Dataset edit like DMP. - this.loadDatasetProfiles(); - this.registerFormListeners(); + this.lockService.createOrUpdate(this.lock).pipe(takeUntil(this._destroyed)).subscribe(async result => { + this.lock.id = Guid.parse(result); + interval(this.configurationService.lockInterval).pipe(takeUntil(this._destroyed)).subscribe(() => this.pumpLock()); + }); + } + // if (this.viewOnly) { this.formGroup.disable(); } // For future use, to make Dataset edit like DMP. + this.loadDatasetProfiles(); + this.registerFormListeners(); - if (lockStatus) { - this.dialog.open(PopupNotificationDialogComponent, { - data: { - title: this.language.instant('DATASET-WIZARD.LOCKED.TITLE'), - message: this.language.instant('DATASET-WIZARD.LOCKED.MESSAGE') - }, maxWidth: '30em' - }); - } - if(this.finalize && !this.lockStatus && !this.viewOnly) { - setTimeout(() => { - this.saveFinalize(); - }, 0); - } - // this.availableProfiles = this.datasetWizardModel.dmp.profiles; - }); - }, + if (lockStatus) { + this.dialog.open(PopupNotificationDialogComponent, { + data: { + title: this.language.instant('DATASET-WIZARD.LOCKED.TITLE'), + message: this.language.instant('DATASET-WIZARD.LOCKED.MESSAGE') + }, maxWidth: '30em' + }); + } + if (this.finalize && !this.lockStatus && !this.viewOnly) { + setTimeout(() => { + this.saveFinalize(); + }, 0); + } + // this.availableProfiles = this.datasetWizardModel.dmp.profiles; + }); + }, error => { switch (error.status) { case 403: @@ -278,8 +276,8 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.datasetWizardModel.dmpSectionIndex = this.dmpSectionIndex; this.formGroup = this.datasetWizardModel.buildForm(); let profiles = this.datasetWizardModel.dmp.profiles.filter(profile => profile.data.dmpSectionIndex.includes(this.dmpSectionIndex)); - for(var profile of profiles){ - this.availableDescriptionTemplates.push({id: profile.descriptionTemplateId, label: profile.label, description: ""}) + for (var profile of profiles) { + this.availableDescriptionTemplates.push({ id: profile.descriptionTemplateId, label: profile.label, description: "" }) } this.formGroupRawValue = JSON.parse(JSON.stringify(this.formGroup.getRawValue())); this.editMode = this.datasetWizardModel.status === DatasetStatus.Draft; @@ -295,7 +293,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme panelClass: 'custom-modalbox' }); dialogRef.afterClosed().subscribe(result => { - if(result) { + if (result) { this.datasetWizardModel = this.datasetWizardModel.fromModel(result); this.datasetWizardModel.dmp = data; this.datasetWizardModel.dmpSectionIndex = this.dmpSectionIndex; @@ -393,11 +391,11 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.isNew = false; this.datasetWizardService.getSinglePublic(this.publicId) .pipe(takeUntil(this._destroyed)).pipe( - catchError((error: any) => { - this.uiNotificationService.snackBarNotification(error.error.message, SnackBarNotificationLevel.Error); - this.router.navigate(['/datasets/publicEdit/' + this.publicId]); - return observableOf(null); - })) + catchError((error: any) => { + this.uiNotificationService.snackBarNotification(error.error.message, SnackBarNotificationLevel.Error); + this.router.navigate(['/datasets/publicEdit/' + this.publicId]); + return observableOf(null); + })) .subscribe(data => { if (data) { this.datasetWizardModel = new DatasetWizardEditorModel().fromModel(data); @@ -567,7 +565,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme searchDmp(query: string): Observable { const fields: Array = new Array(); fields.push('-created'); - const dmpDataTableRequest: DataTableRequest = new DataTableRequest(0, null, {fields: fields}); + const dmpDataTableRequest: DataTableRequest = new DataTableRequest(0, null, { fields: fields }); dmpDataTableRequest.criteria = new DmpCriteria(); dmpDataTableRequest.criteria.like = query; dmpDataTableRequest.criteria.status = DmpStatus.Draft; @@ -698,12 +696,12 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.hasChanges = false; this.datasetIsOnceSaved = true; this.onCallbackSuccess(data, saveType); - if(onSuccess) { + if (onSuccess) { onSuccess(); } }, error => { - if(onError) { + if (onError) { onError(); } this.onCallbackError(error) @@ -721,9 +719,9 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme else if (key === 'email') { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.EMAIL')); } else if (key === 'min') { - errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MIN-VALUE', {'min': formControl.getError('min').min})); + errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MIN-VALUE', { 'min': formControl.getError('min').min })); } else if (key === 'max') { - errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MAX-VALUE', {'max': formControl.getError('max').max})); + errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.MAX-VALUE', { 'max': formControl.getError('max').max })); } else { errors.push(this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.THIS-FIELD') + ' "' + name + '" ' + this.language.instant('GENERAL.FORM-VALIDATION-DISPLAY-DIALOG.HAS-ERROR') + ', ' + formControl.errors[key].message); } @@ -878,27 +876,27 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme filter(x => x), takeUntil(this._destroyed) ).subscribe(result => { - if (result) { - // if (!this.isFormValid()) { return; } - this.formGroup.get('status').setValue(DatasetStatus.Draft); - this.submit(SaveType.finalize, () => { - this.viewOnly = false; - this.datasetWizardModel.status = DatasetStatus.Draft; - setTimeout(x => { - this.formGroup = null; + if (result) { + // if (!this.isFormValid()) { return; } + this.formGroup.get('status').setValue(DatasetStatus.Draft); + this.submit(SaveType.finalize, () => { + this.viewOnly = false; + this.datasetWizardModel.status = DatasetStatus.Draft; + setTimeout(x => { + this.formGroup = null; + }); + setTimeout(x => { + this.formGroup = this.datasetWizardModel.buildForm(); + this.registerFormListeners(); + }); + }, () => { + this.formGroup.get('status').setValue(DatasetStatus.Finalized); + this.viewOnly = true; }); - setTimeout(x => { - this.formGroup = this.datasetWizardModel.buildForm(); - this.registerFormListeners(); - }); - }, () => { - this.formGroup.get('status').setValue(DatasetStatus.Finalized); - this.viewOnly = true; - }); - } else { - this.saving = false; - } - }); + } else { + this.saving = false; + } + }); } @@ -983,7 +981,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme document.getElementById('stepper-options').scrollTop = this.tocScrollTop; }, 500); this.saving = false; - if(this.isNew) { + if (this.isNew) { this.reloadDateset(this.datasetWizardModel.id); } // this.router.navigate(['/reload']).then(() => { this.router.navigate(['/datasets', 'edit', data.id]); }); @@ -1014,7 +1012,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.datasetWizardService.downloadPDF(id) .pipe(takeUntil(this._destroyed)) .subscribe(response => { - const blob = new Blob([response.body], {type: 'application/pdf'}); + const blob = new Blob([response.body], { type: 'application/pdf' }); const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition')); FileSaver.saveAs(blob, filename); @@ -1026,7 +1024,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.datasetWizardService.downloadDOCX(id) .pipe(takeUntil(this._destroyed)) .subscribe(response => { - const blob = new Blob([response.body], {type: 'application/msword'}); + const blob = new Blob([response.body], { type: 'application/msword' }); const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition')); FileSaver.saveAs(blob, filename); @@ -1039,7 +1037,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme this.datasetWizardService.downloadXML(id) .pipe(takeUntil(this._destroyed)) .subscribe(response => { - const blob = new Blob([response.body], {type: 'application/xml'}); + const blob = new Blob([response.body], { type: 'application/xml' }); const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition')); FileSaver.saveAs(blob, filename); @@ -1160,7 +1158,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme .subscribe(result => { if (result && result.datasetProfileExist) { const newDmpId = result.formControl.value.id - this.router.navigate(['/datasets/copy/' + result.datasetId], {queryParams: {newDmpId: newDmpId}}); + this.router.navigate(['/datasets/copy/' + result.datasetId], { queryParams: { newDmpId: newDmpId } }); } }); } @@ -1212,9 +1210,9 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme getEntryVisibleFieldSets(entry: ToCEntry): ToCEntry[] { let fieldSets = []; - if(entry.type === ToCEntryType.FieldSet && !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === entry.id)) { + if (entry.type === ToCEntryType.FieldSet && !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === entry.id)) { fieldSets.push(entry); - } else if(entry.type !== ToCEntryType.FieldSet) { + } else if (entry.type !== ToCEntryType.FieldSet) { entry.subEntries.forEach(subEntry => { fieldSets = fieldSets.concat(this.getEntryVisibleFieldSets(subEntry)); }); @@ -1222,13 +1220,13 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme return fieldSets; } - get visibleFieldSets(): ToCEntry[]{ + get visibleFieldSets(): ToCEntry[] { let fieldSets = []; - let arrays= this.table0fContents?this.table0fContents.tocentries. - filter(entry => !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === entry.id)).map(entry => { - return this.getEntryVisibleFieldSets(entry); + let arrays = this.table0fContents ? this.table0fContents.tocentries. + filter(entry => !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === entry.id)).map(entry => { + return this.getEntryVisibleFieldSets(entry); }) - :[]; + : []; arrays.forEach(array => { fieldSets = fieldSets.concat(array); }); @@ -1236,11 +1234,11 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme } getFirstFieldSet(entry: ToCEntry): ToCEntry { - if(entry.type === ToCEntryType.FieldSet && !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === entry.id)) { + if (entry.type === ToCEntryType.FieldSet && !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === entry.id)) { return entry; } else { let subEntries = entry.subEntries.filter(subEntry => !this.table0fContents.internalTable.hiddenEntries.find(hiddenEntry => hiddenEntry === subEntry.id)); - if(subEntries.length > 0) { + if (subEntries.length > 0) { return this.getFirstFieldSet(subEntries[0]); } else { return null; @@ -1249,11 +1247,11 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme } public changeStep(selected: ToCEntry = null, execute: boolean = true) { - if(execute) { - if(selected) { + if (execute) { + if (selected) { let fieldSet = this.getFirstFieldSet(selected); let index = this.visibleFieldSets.findIndex(entry => entry.id === fieldSet.id); - this.step = index + (selected.type === ToCEntryType.FieldSet?1:0.5); + this.step = index + (selected.type === ToCEntryType.FieldSet ? 1 : 0.5); } else { this.step = 0; this.resetScroll(); @@ -1277,7 +1275,7 @@ export class DatasetWizardComponent extends CheckDeactivateBaseComponent impleme public previousStep() { if (this.step > 0) { this.step = Math.ceil(this.step - 1); - if(this.step >= 1) { + if (this.step >= 1) { let entry = this.visibleFieldSets[this.step - 1]; this.table0fContents.onToCentrySelected(entry, false); this.scroll(entry); diff --git a/dmp-frontend/src/app/ui/dataset/dataset-wizard/external-references/dataset-external-references-editor.component.ts b/dmp-frontend/src/app/ui/dataset/dataset-wizard/external-references/dataset-external-references-editor.component.ts index 56323b09e..a2ca711c8 100644 --- a/dmp-frontend/src/app/ui/dataset/dataset-wizard/external-references/dataset-external-references-editor.component.ts +++ b/dmp-frontend/src/app/ui/dataset/dataset-wizard/external-references/dataset-external-references-editor.component.ts @@ -23,7 +23,7 @@ import { TranslateService } from '@ngx-translate/core'; import { Observable } from 'rxjs'; import { takeUntil, map } from 'rxjs/operators'; import { ENTER, COMMA } from '@angular/cdk/keycodes'; -import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips'; +import { MatChipInputEvent } from '@angular/material/chips'; import { isNullOrUndefined } from '@app/utilities/enhancers/utils'; import { ExternalDataRepositoryService } from '@app/core/services/external-sources/data-repository/extternal-data-repository.service'; import { ExternalDatasetService } from '@app/core/services/external-sources/dataset/external-dataset.service'; diff --git a/dmp-frontend/src/app/ui/dmp/editor/dataset-editor-details/dataset-editor-details.component.ts b/dmp-frontend/src/app/ui/dmp/editor/dataset-editor-details/dataset-editor-details.component.ts index c085fb846..ab0ce30c0 100644 --- a/dmp-frontend/src/app/ui/dmp/editor/dataset-editor-details/dataset-editor-details.component.ts +++ b/dmp-frontend/src/app/ui/dmp/editor/dataset-editor-details/dataset-editor-details.component.ts @@ -3,7 +3,7 @@ import { OnInit, Component, Input, Output, EventEmitter } from '@angular/core'; import { TranslateService } from '@ngx-translate/core'; import { ConfigurationService } from '@app/core/services/configuration/configuration.service'; import { ExternalSourcesService } from '@app/core/services/external-sources/external-sources.service'; -import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips'; +import { MatChipInputEvent } from '@angular/material/chips'; import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog'; import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar'; import { DatasetWizardService } from '@app/core/services/dataset-wizard/dataset-wizard.service'; diff --git a/dmp-frontend/src/app/ui/dmp/invitation/dmp-invitation-dialog.component.ts b/dmp-frontend/src/app/ui/dmp/invitation/dmp-invitation-dialog.component.ts index d8fa4c484..e08b80b8e 100644 --- a/dmp-frontend/src/app/ui/dmp/invitation/dmp-invitation-dialog.component.ts +++ b/dmp-frontend/src/app/ui/dmp/invitation/dmp-invitation-dialog.component.ts @@ -2,7 +2,7 @@ import { COMMA, ENTER } from '@angular/cdk/keycodes'; import { Component, Inject, OnInit, ViewChild } from '@angular/core'; import { UntypedFormGroup } from '@angular/forms'; -import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips'; +import { MatChipInputEvent } from '@angular/material/chips'; import { MatLegacyDialogRef as MatDialogRef, MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA } from '@angular/material/legacy-dialog'; import { ActivatedRoute, Router } from '@angular/router'; import { DmpInvitation } from '@app/core/model/dmp/invitation/dmp-invitation'; diff --git a/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-field/form-field.component.ts b/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-field/form-field.component.ts index 45b7c7a0f..c76424be7 100644 --- a/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-field/form-field.component.ts +++ b/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-field/form-field.component.ts @@ -29,7 +29,7 @@ import { ServiceCriteria } from '@app/core/query/service/service-criteria'; import { TagCriteria } from '@app/core/query/tag/tag-criteria'; import { isNullOrUndefined } from '@app/utilities/enhancers/utils'; import { ExternalTagEditorModel } from '@app/ui/dataset/dataset-wizard/dataset-wizard-editor.model'; -import { MatLegacyChipInputEvent as MatChipInputEvent } from '@angular/material/legacy-chips'; +import { MatChipInputEvent } from '@angular/material/chips'; import { ENTER, COMMA } from '@angular/cdk/keycodes'; import { DatasetIdModel } from '@app/core/model/dataset/dataset-id.model'; import { LocalFetchModel } from '@app/core/model/local-fetch/local-fetch.model'; diff --git a/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description-form.component.ts b/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description-form.component.ts index 67ad4fdfe..733d281e9 100644 --- a/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description-form.component.ts +++ b/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description-form.component.ts @@ -1,6 +1,6 @@ import { AfterViewInit, Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core'; import { UntypedFormGroup } from '@angular/forms'; -import { MatHorizontalStepper } from '@angular/material/stepper'; +import { MatStepper } from '@angular/material/stepper'; import { Rule } from '@app/core/model/dataset-profile-definition/rule'; import { LinkToScroll } from '@app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents'; import { VisibilityRulesService } from '@app/ui/misc/dataset-description-form/visibility-rules/visibility-rules.service'; @@ -13,7 +13,7 @@ import { BaseComponent } from '@common/base/base.component'; }) export class DatasetDescriptionFormComponent extends BaseComponent implements OnInit, AfterViewInit, OnChanges { - @ViewChild('stepper') stepper: MatHorizontalStepper; + @ViewChild('stepper') stepper: MatStepper; @Input() path: string; @Input() form: UntypedFormGroup; @Input() visibilityRules: Rule[] = []; diff --git a/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description.component.ts b/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description.component.ts index 09fb2bf26..174aa4313 100644 --- a/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description.component.ts +++ b/dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description.component.ts @@ -1,7 +1,7 @@ import { AfterViewInit, Component, Input, OnChanges, OnInit, SimpleChanges, ViewChild, Output, EventEmitter } from '@angular/core'; import { AbstractControl, AbstractControlOptions, UntypedFormArray, UntypedFormGroup } from '@angular/forms'; import { MatExpansionPanel } from '@angular/material/expansion'; -import { MatHorizontalStepper } from '@angular/material/stepper'; +import { MatStepper } from '@angular/material/stepper'; import { CompositeField } from '@app/core/model/dataset-profile-definition/composite-field'; import { Field } from '@app/core/model/dataset-profile-definition/field'; import { Rule } from '@app/core/model/dataset-profile-definition/rule'; @@ -19,7 +19,7 @@ import { VisibilityRuleSource } from './visibility-rules/models/visibility-rule- }) export class DatasetDescriptionComponent extends BaseComponent implements OnInit, AfterViewInit, OnChanges { - // @ViewChild('stepper', { static: false }) stepper: MatHorizontalStepper; + // @ViewChild('stepper', { static: false }) stepper: MatStepper; @Input() path: string; @Input() visibilityRules: Rule[] = []; @Input() datasetProfileId: String; diff --git a/dmp-frontend/src/assets/scss/core/_buttons.scss b/dmp-frontend/src/assets/scss/core/_buttons.scss index 489a4d783..d5bc732c7 100644 --- a/dmp-frontend/src/assets/scss/core/_buttons.scss +++ b/dmp-frontend/src/assets/scss/core/_buttons.scss @@ -14,7 +14,7 @@ cursor: pointer; background-color: transparent; border: 0; - border-radius: $border-radius-sm; + //TODO: angular update border-radius: $border-radius-sm; outline: 0; transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1); will-change: box-shadow, transform; diff --git a/dmp-frontend/src/assets/scss/material-dashboard.scss b/dmp-frontend/src/assets/scss/material-dashboard.scss index 73990a596..a052ec24d 100644 --- a/dmp-frontend/src/assets/scss/material-dashboard.scss +++ b/dmp-frontend/src/assets/scss/material-dashboard.scss @@ -47,7 +47,8 @@ $custom-theme: mat.define-light-theme($custom-theme-primary, $custom-theme-accen @import "core/variables"; @import "core/mixins"; -@import "~bootstrap/scss/bootstrap"; +//Material-Bootstrap configuration +//TODO: angular update @import "assets/scss/bootstrap-material"; // Core Components @import "core/buttons"; diff --git a/dmp-frontend/src/common/forms/validation/custom-validator.ts b/dmp-frontend/src/common/forms/validation/custom-validator.ts index 1ca4dec4b..e8db1e8af 100644 --- a/dmp-frontend/src/common/forms/validation/custom-validator.ts +++ b/dmp-frontend/src/common/forms/validation/custom-validator.ts @@ -39,13 +39,13 @@ export function DateValidator(): ValidatorFn { let monthParsed: number = null; let dayParsed: number = null; - if (!isNullOrUndefined(yearString) && yearString.length === 4 && Number(yearString) !== NaN) { + if (!isNullOrUndefined(yearString) && yearString.length === 4 && !Number.isNaN(Number(yearString))) { yearParsed = Number(yearString); } - if (!isNullOrUndefined(monthString) && monthString.length > 0 && Number(monthString) !== NaN) { + if (!isNullOrUndefined(monthString) && monthString.length > 0 && !Number.isNaN(Number(monthString))) { monthParsed = Number(monthString); } - if (!isNullOrUndefined(dayString) && dayString.length > 0 && Number(dayString) !== NaN) { + if (!isNullOrUndefined(dayString) && dayString.length > 0 && !Number.isNaN(Number(dayString))) { dayParsed = Number(dayString); } diff --git a/dmp-frontend/src/polyfills.ts b/dmp-frontend/src/polyfills.ts index c921fb830..811edbf88 100644 --- a/dmp-frontend/src/polyfills.ts +++ b/dmp-frontend/src/polyfills.ts @@ -18,10 +18,10 @@ * BROWSER POLYFILLS */ -import 'core-js/es7/array'; +//TODO: angular update import 'core-js/es7/array'; /** Evergreen browsers require these. **/ -import 'core-js/es6/reflect'; +//TODO: angular update import 'core-js/es6/reflect'; diff --git a/dmp-frontend/src/styles.scss b/dmp-frontend/src/styles.scss index 863c6661b..f855b65bb 100644 --- a/dmp-frontend/src/styles.scss +++ b/dmp-frontend/src/styles.scss @@ -2,15 +2,15 @@ @import "@angular/material/theming"; // @import '../node_modules/@angular/material/theming'; @import "@angular/material/prebuilt-themes/indigo-pink.css"; -// Material-Bootstrap configuration -@import "~bootstrap/scss/bootstrap"; +@import "~bootstrap/dist/css/bootstrap.css"; + +//Material-Bootstrap configuration +@import "assets/scss/bootstrap-material"; // Guided Tour style @import '../node_modules/ngx-guided-tour/scss/guided-tour-base-theme.scss'; -@import '../node_modules/dragula/dist/dragula.css'; - - +//TODO: angular update @import '../node_modules/dragula/dist/dragula.css'; /* in-flight clone */ .gu-mirror { position: fixed !important;