150 lines
10 KiB
HTML
150 lines
10 KiB
HTML
<div class="main-content">
|
|
<div class="container-fluid description-editor">
|
|
<form *ngIf="formGroup" [formGroup]="formGroup">
|
|
<!-- <form *ngIf="formGroup" [formGroup]="formGroup" (ngSubmit)="formSubmit()"> -->
|
|
<!-- Description Header -->
|
|
<div class="fixed-editor-header">
|
|
<div class="card description-editor-header">
|
|
<div class="col">
|
|
<div class="row">
|
|
<div class="col info">
|
|
<ng-container *ngIf="!viewOnly else viewOnlyTemplate">
|
|
<div *ngIf="isNew" class="description-title">{{'DMP-EDITOR.TITLE.ADD-DATASET' | translate}}</div>
|
|
<div *ngIf="!isNew" class="description-title">{{'DMP-EDITOR.TITLE.EDIT-DESCRIPTION' | translate}}</div>
|
|
<div class="description-subtitle">{{ formGroup.get('label').value }} <span *ngIf="isDirty()" class="description-changes">({{'DMP-EDITOR.CHANGES' | translate}})</span></div>
|
|
</ng-container>
|
|
<ng-template #viewOnlyTemplate>
|
|
<div class="description-title">{{'DMP-EDITOR.TITLE.PREVIEW-DATASET' | translate}}</div>
|
|
</ng-template>
|
|
<div class="d-flex flex-direction-row dmp-info">
|
|
<div class="col-auto description-to-dmp">{{'DATASET-LISTING.TOOLTIP.TO-DMP' | translate}}</div>
|
|
<div class="dmp-title p-0">: {{ formGroup.get('dmp').value.label }}</div>
|
|
<div class="col-auto d-flex align-items-center">
|
|
<a [routerLink]="['/overview/' + formGroup.get('dmp').value.id]" target="_blank" class="pointer open-in-new-icon">
|
|
<mat-icon class="size-18">open_in_new</mat-icon>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-auto d-flex align-items-center">
|
|
<button *ngIf="formGroup.get('id').value" [disabled]="isDirty()" [matTooltipDisabled]="!isDirty()"
|
|
mat-raised-button class="description-export-btn" type="button"
|
|
[matMenuTriggerFor]="exportMenu" (click)="$event.stopPropagation();"
|
|
[matTooltip]="'DATASET-EDITOR.ACTIONS.DISABLED-EXPORT' | translate">
|
|
{{ 'DMP-LISTING.ACTIONS.EXPORT' | translate }}
|
|
<mat-icon [disabled]="isDirty()" style="width: 14px;">expand_more</mat-icon>
|
|
</button>
|
|
<mat-menu #exportMenu="matMenu" xPosition="before">
|
|
<button mat-menu-item (click)="downloadPDF(formGroup.get('id').value)">
|
|
<i class="fa fa-file-pdf-o pr-2"></i>
|
|
<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
|
|
</button>
|
|
<button mat-menu-item (click)="downloadDOCX(formGroup.get('id').value)">
|
|
<i class="fa fa-file-word-o pr-2"></i>
|
|
<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
|
|
</button>
|
|
<button mat-menu-item (click)="downloadXML(formGroup.get('id').value)">
|
|
<i class="fa fa-file-code-o pr-2"></i>
|
|
<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
|
|
</button>
|
|
</mat-menu>
|
|
</div>
|
|
|
|
<mat-divider *ngIf="formGroup.get('id').value && (!viewOnly || (!lockStatus && !viewOnly) || lockStatus || (hasReversableStatus() && !lockStatus))"
|
|
[vertical]="true" class="ml-2 mr-2"></mat-divider>
|
|
|
|
<div *ngIf="isDirty() && !viewOnly" class="col-auto d-flex align-items-center pr-0">
|
|
<button [disabled]="saving" type="button" mat-raised-button class="description-discard-btn" (click)="discardChanges()">
|
|
{{'DMP-EDITOR.ACTIONS.DISCARD' | translate}}
|
|
</button>
|
|
</div>
|
|
<div class="col-auto d-flex align-items-center">
|
|
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly" mat-raised-button
|
|
class="description-save-btn mr-2" type="button">
|
|
<span class="d-flex flex-row row">
|
|
<span (click)="!saving?save():null" class="col">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</span>
|
|
<mat-divider [vertical]="true"></mat-divider>
|
|
<span *ngIf="!saving" class="align-items-center justify-content-center col-4 d-flex"
|
|
(click)="$event.stopPropagation();" [matMenuTriggerFor]="menu">
|
|
<mat-icon >expand_more</mat-icon>
|
|
</span>
|
|
<span *ngIf="saving" class="align-items-center justify-content-center col-4 d-flex">
|
|
<mat-icon >expand_more</mat-icon>
|
|
</span>
|
|
</span>
|
|
</button>
|
|
<mat-menu #menu="matMenu">
|
|
<button [disabled]="saving" mat-menu-item (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
|
|
<button [disabled]="saving" mat-menu-item (click)="save(saveAnd.addNew)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button>
|
|
<button [disabled]="saving" mat-menu-item (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CONTINUE' | translate }}</button>
|
|
</mat-menu>
|
|
|
|
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly" mat-raised-button class="description-save-btn mr-2" type="button" (click)="saveFinalize()">{{ 'DATASET-WIZARD.ACTIONS.FINALIZE' | translate }}</button>
|
|
<!-- <button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="description-save-btn mr-2" (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</button>
|
|
<button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="description-save-btn mr-2" (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
|
|
<button *ngIf="!lockStatus && !viewOnly" mat-raised-button class="description-save-btn mr-2" (click)="save(saveAnd.addNew)">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button> -->
|
|
<button [disabled]="saving" *ngIf="lockStatus" mat-raised-button disabled class="description-save-btn cursor-default" type="button">{{ 'DMP-OVERVIEW.LOCKED' | translate}}</button>
|
|
<button [disabled]="saving" *ngIf="hasReversableStatus() && !lockStatus" mat-raised-button class="description-save-btn mr-2" (click)="reverse()" type="button">{{ 'DATASET-WIZARD.ACTIONS.REVERSE' | translate }}</button>
|
|
<!-- <button *ngIf="!lockStatus" mat-raised-button class="description-save-btn mr-2" (click)="touchForm()" type="button">{{ 'DATASET-WIZARD.ACTIONS.VALIDATE' | translate }}</button> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row editor-content">
|
|
<div class="col-auto description-stepper">
|
|
<div class="stepper-back d-flex flex-direction-row">
|
|
<div class="d-flex align-items-center pr-2 back-to-dmp" (click)="backToDmp(formGroup.get('dmp').value.id)">
|
|
<mat-icon class="back-icon pointer">chevron_left</mat-icon>
|
|
<span class="pointer">{{'DATASET-WIZARD.ACTIONS.BACK-TO' | translate}}</span>
|
|
</div>
|
|
<div class="col-auto dmp-label ml-3">{{'DATASET-LISTING.TOOLTIP.DMP' | translate}}</div>
|
|
</div>
|
|
<div class="stepper-title">{{'DMP-EDITOR.STEPPER.USER-GUIDE' | translate}}</div>
|
|
<div class="stepper-options" id="stepper-options">
|
|
<div class="col stepper-list">
|
|
<div (click)="table0fContents.onToCentrySelected()" *ngIf="!descriptionInfoValid()" class="main-info" [ngClass]="{'active': this.step === 0, 'text-danger':hintErrors}">0. {{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (2)</div>
|
|
<div (click)="table0fContents.onToCentrySelected()" *ngIf="descriptionInfoValid()" class="main-info" [ngClass]="{'active': this.step === 0}">0. {{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (<mat-icon class="done-icon">done</mat-icon>)</div>
|
|
<div class="row toc-pane-container" #boundary>
|
|
<div #spacer></div>
|
|
<table-of-contents [visibilityRulesService]="visRulesService" [selectedFieldsetId]="fieldsetIdWithFocus" #table0fContents
|
|
[showErrors]="showtocentriesErrors" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [hasFocus]="step > 0"
|
|
[formGroup]="formGroup" *ngIf="formGroup && formGroup.get('descriptionProfileDefinition')" [links]="links"
|
|
[boundary]="boundary" [spacer]="spacer" [isActive]="step !== 0" stickyThing (stepFound)="onStepFound($event)"
|
|
(currentLinks)="getLinks($event)" (entrySelected)="changeStep($event.entry, $event.execute)"
|
|
[visibilityRules]="formGroup.get('descriptionProfileDefinition').get('rules').value"></table-of-contents>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="stepper-actions">
|
|
<div mat-raised-button type="button" class="col-auto previous stepper-btn mr-2" [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 description-next ml-auto" (click)="nextStep()">
|
|
<div>{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</div>
|
|
<span class="material-icons">chevron_right</span>
|
|
</div>
|
|
<div *ngIf="!formGroup.get('profile').value" mat-raised-button type="button" class="col-auto stepper-btn description-next next-disabled ml-auto">
|
|
<div>{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</div>
|
|
<span class="material-icons">chevron_right</span>
|
|
</div>
|
|
<button [disabled]="saving" (click)="save(saveAnd.addNew)" *ngIf="(step === maxStep) && !lockStatus && formGroup.get('profile').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-description-btn ml-auto">
|
|
{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}
|
|
</button>
|
|
</div>
|
|
<div class="col-auto pr-0">
|
|
<app-form-progress-indication class="col-12" *ngIf="formGroup && !viewOnly" [formGroup]="formGroup" [isDescriptionEditor]="true"></app-form-progress-indication>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto form" id="description-editor-form">
|
|
<app-description-editor-component [hidden]="this.step !== 0" [formGroup]="formGroup" [dmpId]="formGroup.get('dmp').value.id" [availableProfiles]="availableDescriptionTemplates" (formChanged)="formChanged()"></app-description-editor-component>
|
|
<app-description-description (visibilityRulesInstance)="visRulesService = $event" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [hidden]="this.step === 0" *ngIf="formGroup && formGroup.get('descriptionProfileDefinition')" [form]="this.formGroup.get('descriptionProfileDefinition')" [visibilityRules]="formGroup.get('descriptionProfileDefinition').get('rules').value" [descriptionProfileId]="formGroup.get('profile').value" [linkToScroll]="linkToScroll" (fieldsetFocusChange)="fieldsetIdWithFocus = $event"></app-description-description>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div> |