2023-07-25 14:51:29 +02:00
< div class = "main-content" >
< div class = "container-fluid" >
< div class = "form-container" >
<!-- DMP Header -->
< div [ hidden ] = " false " class = "fixed-editor-header" >
< div class = "card editor-header" >
< div class = "col" >
< div class = "row" >
< div class = "col-auto info" >
< div class = "title" > {{'DMP-EDITOR.TITLE.EDIT-DMP' | translate}}< / div >
<!-- <div class="subtitle">{{ formGroup.get('label').value }} <span *ngIf="isDirty()" class="changes">({{'DMP - EDITOR.CHANGES' | translate}})</span></div> -->
< / div >
< div class = "ml-auto d-flex flex-row" >
<!-- <mat - divider *ngIf="formGroup.get('id').value && (isDirty() || isNew || (!isNew && formGroup.enabled && !lockStatus) || lockStatus)"
[vertical]="true" class="ml-2 mr-2">
< / mat-divider > -->
< div class = "col-auto d-flex align-items-center" >
<!-- <button [disabled]="saving" *ngIf="isDirty()" type="button" mat - raised - button class="discard - btn mr - 3" (click)="discard()">
{{'DMP-EDITOR.ACTIONS.DISCARD' | translate}}
< / button > -->
< button [ disabled ] = " saving " * ngIf = "isNew" mat-raised-button type = "button" ( click ) = " save ( ) " class = "save-btn" >
{{'DMP-EDITOR.ACTIONS.SAVE' | translate}}
< / button >
<!-- <div *ngIf="!isNew && formGroup.enabled && !lockStatus">
< button [ disabled ] = " saving " * ngIf = "!isFinalized" mat-raised-button ( click ) = " formSubmit ( ) " class = "save-btn" >
{{'DMP-EDITOR.ACTIONS.SAVE' | translate}}
< / button >
< / div > -->
<!-- <button *ngIf="lockStatus" mat - raised - button disabled class="dataset - save - btn cursor - default" type="button">{{ 'DMP - OVERVIEW.LOCKED' | translate}}</button> -->
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "row" >
< div class = "col-auto dmp-stepper" >
< div class = "stepper-title" > DMP Blueprint< / div >
< div class = "stepper-options" >
< ol class = "stepper-list" start = "0" >
< li ( click ) = " changeStep ( 0 ) " [ ngClass ] = " { ' active ' : this . step = == 0 } " > Select Blueprint< / li >
< div * ngIf = "selectedDmpBlueprintDefinition && this.step !== 0" >
< li ( click ) = " changeStep ( i + 1 ) " * ngFor = "let section of selectedDmpBlueprintDefinition.sections; let i=index" [ ngClass ] = " { ' active ' : this . step = == ( i + 1 ) } " > {{section.label}}< / li >
< / div >
< / ol >
< / div >
< div class = "stepper-actions" * ngIf = "this.step !== 0" >
< div mat-raised-button type = "button" class = "col-auto previous stepper-btn mr-2 ml-auto" [ ngClass ] = " { ' previous-disabled ' : this . step = == 0 } " ( click ) = " previousStep ( ) " >
< span class = "material-icons" > chevron_left< / span >
< div > {{'DMP-EDITOR.STEPPER.PREVIOUS' | translate}}< / div >
< / div >
< div * ngIf = "this.step < this.maxStep" mat-raised-button type = "button" class = "col-auto stepper-btn ml-auto" [ ngClass ] = " { ' next-disabled ' : this . step = == this . maxStep , ' next ' : this . step < stepsBeforeDatasets , ' dataset-next ' : this . step > = stepsBeforeDatasets }" (click)="nextStep()">
< div > {{'DMP-EDITOR.STEPPER.NEXT' | translate}}< / div >
< span class = "material-icons" > chevron_right< / span >
< / div >
<!-- <div *ngIf="this.step >= 3 && hasProfile() && !isFinalized" mat - raised - button type="button" class="col - auto stepper - btn add - dataset - btn ml - auto" (click)="addDataset()" target="_blank"> -->
< button [ disabled ] = " saving " * ngIf = "this.step >= this.maxStep && !isFinalized" mat-raised-button type = "button" class = "col-auto stepper-btn add-dataset-btn ml-auto" ( click ) = " addDataset ( ) " target = "_blank" >
<!-- <mat - icon>add</mat - icon> -->
{{'DMP-EDITOR.ACTIONS.SAVE' | translate}} & {{'DMP-LISTING.ACTIONS.ADD-DESCRIPTION-SHORT' | translate}}
< / button >
< / div >
< div class = "col-auto pr-0" * ngIf = "this.step !== 0" >
< app-form-progress-indication class = "col-12" * ngIf = "formGroup && !formGroup.disabled && !lockStatus" [ formGroup ] = " formGroup " [ isDmpEditor ] = " true " > < / app-form-progress-indication >
< / div >
< / div >
< div class = "col-auto form" id = "editor-form" >
< div class = "col-12 blueprint-section" [ hidden ] = " this . step ! = = 0 " >
2023-08-03 12:10:36 +02:00
< div class = "input-form" >
< div class = "heading2" > 0.1 Title of DMP *< / div >
2023-07-25 14:51:29 +02:00
< mat-form-field >
2023-08-03 12:10:36 +02:00
< mat-label > Title< / mat-label >
< input matInput type = "text" name = "label" [ formControl ] = " formGroup . get ( ' label ' ) " required >
<!-- <mat - error *ngIf="formGroup.get('label').hasError('backendError')">
{{formGroup.get('label').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('label').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error > -->
< / mat-form-field >
< / div >
< div class = "input-form" >
< div class = "heading2" > 0.2 Description of DMP *< / div >
< rich-text-editor-component [ parentFormGroup ] = " formGroup " [ controlName ] = " ' description ' "
[placeholder]="'Fill with description'" [required]="true">
< / rich-text-editor-component >
< / div >
< div class = "dmp-blueprint-form" style = "margin-top: 3%;" >
< div class = "heading2" > 0.3 Blueprint of DMP *< / div >
< mat-form-field >
< mat-label > Select blueprint< / mat-label >
2023-07-25 14:51:29 +02:00
< app-single-auto-complete [ required ] = " false " [ formControl ] = " formGroup . get ( ' profile ' ) " placeholder = "Select blueprint" [ configuration ] = " dmpBlueprintAutoCompleteConfiguration " >
< / app-single-auto-complete >
< / mat-form-field >
< / div >
< div class = "row" >
< div class = "col-5" >
< button mat-button class = "action-btn" [ disabled ] = " selectedDmpBlueprintDefinition = = null " ( click ) = " selectBlueprint ( ) " > Next< / button >
< / div >
< div class = "col-7" * ngIf = "formGroup.get('profile').value == null || (formGroup.get('profile').value && formGroup.get('profile').value.id !== '86635178-36a6-484f-9057-a934e4eeecd5')" >
< div class = "row" >
< div class = "col-6" >
< p > or continue with< / p >
< / div >
< div class = "col-6" >
< button mat-button class = "action-btn" style = "float: right;" ( click ) = " selectDefaultBlueprint ( ) " > Default Blueprint< / button >
< / div >
< / div >
< / div >
< / div >
< / div >
< div * ngIf = "selectedDmpBlueprintDefinition" >
< div * ngFor = "let section of selectedDmpBlueprintDefinition.sections; let i=index" >
< div class = "section-info" [ hidden ] = " this . step ! = = ( i + 1 ) " >
< div class = "col-12 intro" >
{{section.description}}
< / div >
< div class = "col-12 card" >
< div class = "row" >
< div class = "col-12" >
< div * ngFor = "let field of section.systemFields; let j=index" >
< div class = "heading" > {{i + 1}}.{{j + 1}} {{field.label}}< span * ngIf = "field.required" > *< / span > < / div >
< div * ngIf = "field.description != null && field.description.length > 0" class = "hint" > {{field.description}}< / div >
< div class = "input-form" >
< div * ngIf = "field.type == 'TEXT'" >
< mat-form-field >
< input matInput placeholder = "{{'DMP-EDITOR.FIELDS.NAME' | translate}}" type = "text" name = "label" [ formControl ] = " formGroup . get ( ' label ' ) " required >
<!-- <mat - error *ngIf="formGroup.get('label').hasError('backendError')">
{{formGroup.get('label').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('label').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error > -->
< / mat-form-field >
< / div >
< div * ngIf = "field.type == 'HTML_TEXT'" >
< rich-text-editor-component [ parentFormGroup ] = " formGroup " [ controlName ] = " ' description ' "
[placeholder]="'DMP-EDITOR.PLACEHOLDER.DESCRIPTION'">
< / rich-text-editor-component >
< / div >
< div * ngIf = "field.type == 'RESEARCHERS'" >
< mat-form-field >
< mat-label > {{'DMP-EDITOR.PLACEHOLDER.RESEARCHERS' | translate}}< / mat-label >
< app-multiple-auto-complete [ formControl ] = " formGroup . get ( ' researchers ' ) " [ configuration ] = " researchersAutoCompleteConfiguration " >
< / app-multiple-auto-complete >
< mat-error * ngIf = "formGroup.get('researchers').hasError('backendError')" >
{{formGroup.get('researchers').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('researchers').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
<!-- <button matSuffix class="input - btn" [disabled]="formGroup.get('researchers').disabled" type="button" (click)="addResearcher($event)">
< mat-icon class = "icon-btn" > add_circle< / mat-icon >
< / button > -->
< / mat-form-field >
< div class = "mb-4" >
< span * ngIf = "!formGroup.get('researchers').disabled" class = "not-found" > {{'DMP-EDITOR.FUNDING-INFO.FIND' | translate}}< / span >
< span * ngIf = "!formGroup.get('researchers').disabled" class = "insert-manually" ( click ) = " addResearcher ( $ event ) " > {{'DMP-EDITOR.ACTIONS.INSERT-MANUALLY' | translate}}< / span >
< / div >
< / div >
< div * ngIf = "field.type == 'ORGANIZATIONS'" >
< mat-form-field >
< mat-label > {{'DMP-EDITOR.PLACEHOLDER.ORGANIZATION' | translate}}< / mat-label >
< app-multiple-auto-complete [ formControl ] = " formGroup . get ( ' organisations ' ) " [ configuration ] = " organisationsAutoCompleteConfiguration " >
< / app-multiple-auto-complete >
< mat-error * ngIf = "formGroup.get('organisations').hasError('backendError')" >
{{formGroup.get('organisations').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('organisations').hasError('required')" > {{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
<!-- <button *ngIf="showOrganizationCreator()" matSuffix class="input - btn" [disabled]="cantAddOrganizations()" type="button" (click)="addOrganization($event)">
< mat-icon class = "icon-btn" > add_circle< / mat-icon >
< / button > -->
< / mat-form-field >
< div * ngIf = "showOrganizationCreator()" class = "mb-4" >
< span * ngIf = "!cantAddOrganizations()" class = "not-found" > {{'DMP-EDITOR.FUNDING-INFO.FIND' | translate}}< / span >
< span * ngIf = "!cantAddOrganizations()" class = "insert-manually" ( click ) = " addOrganization ( $ event ) " > {{'DMP-EDITOR.ACTIONS.INSERT-MANUALLY' | translate}}< / span >
< / div >
< / div >
< div * ngIf = "field.type == 'LANGUAGE'" >
< mat-form-field >
< mat-select [ formControl ] = " formGroup . get ( ' extraProperties ' ) . get ( ' language ' ) " placeholder = "{{'DMP-EDITOR.FIELDS.LANGUAGE' | translate}}" required >
< mat-option * ngFor = "let lang of getLanguageInfos()" [ value ] = " lang . code " >
{{ lang.name }}
< / mat-option >
< / mat-select >
< mat-error * ngIf = "formGroup.get('extraProperties').get('language').hasError('backendError')" >
{{formGroup.get('extraProperties').get('language').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('extraProperties').get('language').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
< / mat-form-field >
< / div >
< div * ngIf = "field.type == 'CONTACT'" >
< div class = "contact-form" >
< mat-form-field >
< mat-select [ formControl ] = " formGroup . get ( ' extraProperties ' ) . get ( ' contact ' ) " placeholder = "{{'DMP-EDITOR.FIELDS.CONTACT' | translate}}" >
< mat-option * ngFor = "let vis of getAssociates()" [ value ] = " vis . id " >
{{vis.name | translate}}
< / mat-option >
< / mat-select >
< mat-error * ngIf = "formGroup.get('extraProperties').get('contact').hasError('backendError')" >
{{formGroup.get('extraProperties').get('contact').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('extraProperties').get('contact').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
< / mat-form-field >
< / div >
< / div >
< div * ngIf = "field.type == 'FUNDER'" >
< funding-info [ formGroup ] = " formGroup " [ grantformGroup ] = " formGroup . get ( ' grant ' ) " [ projectFormGroup ] = " formGroup . get ( ' project ' ) " [ funderFormGroup ] = " formGroup . get ( ' funder ' ) " [ isFinalized ] = " false " [ isNew ] = " true " [ isUserOwner ] = " true " [ type ] = " 1 " ( onFormChanged ) = " formChanged ( ) " > < / funding-info >
< / div >
< div * ngIf = "field.type == 'GRANT'" >
< funding-info [ formGroup ] = " formGroup " [ grantformGroup ] = " formGroup . get ( ' grant ' ) " [ projectFormGroup ] = " formGroup . get ( ' project ' ) " [ funderFormGroup ] = " formGroup . get ( ' funder ' ) " [ isFinalized ] = " false " [ isNew ] = " true " [ isUserOwner ] = " true " [ type ] = " 2 " ( onFormChanged ) = " formChanged ( ) " > < / funding-info >
< / div >
< div * ngIf = "field.type == 'PROJECT'" >
< funding-info [ formGroup ] = " formGroup " [ grantformGroup ] = " formGroup . get ( ' grant ' ) " [ projectFormGroup ] = " formGroup . get ( ' project ' ) " [ funderFormGroup ] = " formGroup . get ( ' funder ' ) " [ isFinalized ] = " false " [ isNew ] = " true " [ isUserOwner ] = " true " [ type ] = " 3 " ( onFormChanged ) = " formChanged ( ) " > < / funding-info >
< / div >
< div * ngIf = "field.type == 'LICENSE'" >
< mat-form-field >
< app-single-auto-complete [ formControl ] = " formGroup . get ( ' extraProperties ' ) . get ( ' license ' ) " placeholder = "{{'DMP-EDITOR.FIELDS.LICENSE' | translate}}" [ configuration ] = " licenseAutoCompleteConfiguration " >
< / app-single-auto-complete >
< mat-error * ngIf = "formGroup.get('extraProperties').get('license').hasError('backendError')" >
{{formGroup.get('extraProperties').get('license').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('extraProperties').get('license').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
< / mat-form-field >
< / div >
< div * ngIf = "field.type == 'ACCESS_RIGHTS'" >
< mat-form-field >
< mat-select [ formControl ] = " formGroup . get ( ' extraProperties ' ) . get ( ' visible ' ) " placeholder = "{{'DMP-EDITOR.FIELDS.VISIBILITY' | translate}}" >
< mat-option * ngFor = "let vis of visibles" [ value ] = " vis . value " >
{{vis.name | translate}}
< / mat-option >
< / mat-select >
< mat-error * ngIf = "formGroup.get('extraProperties').get('visible').hasError('backendError')" >
{{formGroup.get('extraProperties').get('visible').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('extraProperties').get('visible').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
< / mat-form-field >
< / div >
< div * ngIf = "field.type == 'DESCRIPTION_TEMPLATES'" >
< mat-form-field >
< mat-label > {{'DMP-EDITOR.FIELDS.SELECT-TEMPLATE' | translate}}< / mat-label >
< app-multiple-auto-complete placeholder = "{{'DMP-EDITOR.FIELDS.SELECT-TEMPLATE' | translate}}" [ hidePlaceholder ] = " true " required = 'true' [ formControl ] = " formGroup . get ( ' profiles ' ) " [ configuration ] = " profilesAutoCompleteConfiguration " ( optionRemoved ) = " onRemoveTemplate ( $ event ) " ( optionActionClicked ) = " onPreviewTemplate ( $ event ) " ( optionSelected ) = " onOptionSelected ( ) " >
< / app-multiple-auto-complete >
< mat-error * ngIf = "formGroup.get('profiles').hasError('backendError')" >
{{formGroup.get('profiles').getError('backendError').message}}< / mat-error >
< mat-error * ngIf = "formGroup.get('profiles').hasError('required')" >
{{'GENERAL.VALIDATION.REQUIRED' | translate}}< / mat-error >
< button matSuffix class = "input-btn" [ disabled ] = " formGroup . get ( ' profiles ' ) . disabled " ( click ) = " allAvailableProfiles ( $ event ) " >
< mat-icon class = "icon-btn" > view_list< / mat-icon >
< / button >
< / mat-form-field >
< div class = "col pl-0 pt-2 pb-3 d-flex" >
< span class = "not-found" > {{'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.SECOND-STEP.FIELDS.HELP' | translate}}< / span >
< / div >
< / div >
< / div >
< / div >
< / div >
< div class = "col-12" >
< div * ngFor = "let extraField of section.extraFields; let k=index" >
< div class = "heading" > {{i + 1}}.{{k + 1}} {{extraField.label}}< span * ngIf = "extraField.required" > *< / span > < / div >
< div * ngIf = "extraField.description != null && extraField.description.length > 0" class = "hint" > {{extraField.description}}< / div >
< div class = "input-form" >
< div * ngIf = "extraField.type == 'TEXT'" >
< mat-form-field >
< input matInput placeholder = "extraField.placeholder" type = "text" name = "label" [ formControl ] = " label " [ required ] = " extraField . required " >
< / mat-form-field >
< / div >
< div * ngIf = "extraField.type == 'RICH_TEXT'" >
< mat-form-field >
<!-- <rich - text - editor - component [parentFormGroup]="formGroup" [controlName]="'label'"
[placeholder]="extraField.placeholder">
< / rich-text-editor-component > -->
< / mat-form-field >
< / div >
< div * ngIf = "extraField.type == 'DATE'" >
< mat-form-field >
< input matInput placeholder = "extraField.placeholder" type = "date" name = "label" [ formControl ] = " label " [ required ] = " extraField . required " >
< / mat-form-field >
< / div >
< div * ngIf = "extraField.type == 'NUMBER'" >
< mat-form-field >
< input matInput placeholder = "extraField.placeholder" type = "number" name = "label" [ formControl ] = " label " [ required ] = " extraField . required " >
< / mat-form-field >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >