145 lines
9.6 KiB
HTML
145 lines
9.6 KiB
HTML
<div class="main-content">
|
|
<div class="container-fluid description-editor">
|
|
<form *ngIf="formGroup" [formGroup]="formGroup">
|
|
<!-- 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">{{'DESCRIPTION-EDITOR.TITLE-ADD-DESCRIPTION' | translate}}</div>
|
|
<div *ngIf="!isNew" class="description-title">{{'DESCRIPTION-EDITOR.TITLE-EDIT-DESCRIPTION' | translate}}</div>
|
|
<div class="description-subtitle">{{ formGroup.get('label').value }} <span *ngIf="isDirty()" class="description-changes">({{'DESCRIPTION-EDITOR.CHANGES' | translate}})</span></div>
|
|
</ng-container>
|
|
<ng-template #viewOnlyTemplate>
|
|
<div class="description-title">{{'DESCRIPTION-EDITOR.TITLE-PREVIEW-DESCRIPTION' | translate}}</div>
|
|
</ng-template>
|
|
<div *ngIf="item?.dmp?.id" class="d-flex flex-direction-row dmp-info">
|
|
<div class="col-auto description-to-dmp">{{'DESCRIPTION-EDITOR.TO-DMP' | translate}}</div>
|
|
<div class="dmp-title p-0">: {{ item?.dmp?.label }}</div>
|
|
<div class="col-auto d-flex align-items-center">
|
|
<a [routerLink]="['/overview/' + item.dmp.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">
|
|
{{ 'DESCRIPTION-EDITOR.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-TRANSFOMER.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-TRANSFOMER.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-TRANSFOMER.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()">
|
|
{{'DESCRIPTION-EDITOR.ACTIONS.DISCARD' | translate}}
|
|
</button>
|
|
</div>
|
|
<div class="col-auto d-flex align-items-center">
|
|
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly && hasReversableStatus() == false" mat-raised-button class="description-save-btn mr-2" type="button">
|
|
<span class="d-flex flex-row row">
|
|
<span (click)="!saving?formSubmit():null" class="col">{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE' | translate }}</span>
|
|
<mat-divider [vertical]="true"></mat-divider>
|
|
<span *ngIf="!saving" class="align-items-center justify-content-center col 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 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">{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
|
|
<button [disabled]="saving" mat-menu-item (click)="save(saveAnd.addNew)" type="button">{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-ADD-NEW' | translate }}</button>
|
|
<button [disabled]="saving" mat-menu-item (click)="save()" type="button">{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-CONTINUE' | translate }}</button>
|
|
</mat-menu>
|
|
|
|
<button [disabled]="saving" *ngIf="!lockStatus && !viewOnly && hasReversableStatus() == false" mat-raised-button class="description-save-btn mr-2" type="button" (click)="finalize()">{{ 'DESCRIPTION-EDITOR.ACTIONS.FINALIZE' | 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">{{ 'DESCRIPTION-EDITOR.ACTIONS.REVERSE' | 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()">
|
|
<mat-icon class="back-icon pointer">chevron_left</mat-icon>
|
|
<span class="pointer">{{'DESCRIPTION-EDITOR.ACTIONS.BACK-TO' | translate}}</span>
|
|
</div>
|
|
<div class="col-auto dmp-label ml-3">{{'DESCRIPTION-EDITOR.DMP' | translate}}</div>
|
|
</div>
|
|
<div class="stepper-title">{{'DESCRIPTION-EDITOR.TOC.TITLE' | 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. {{'DESCRIPTION-EDITOR.TOC.MAIN-INFO' | translate}} (2)</div>
|
|
<div (click)="table0fContents.onToCentrySelected()" *ngIf="descriptionInfoValid()" class="main-info" [ngClass]="{'active': this.step === 0}">0. {{'DESCRIPTION-EDITOR.TOC.MAIN-INFO' | translate}} (<mat-icon class="done-icon">done</mat-icon>)</div>
|
|
<div class="row toc-pane-container" #boundary>
|
|
<div #spacer></div>
|
|
<app-table-of-contents [visibilityRulesService]="visibilityRulesService" [selectedFieldsetId]="fieldsetIdWithFocus" #table0fContents [showErrors]="showtocentriesErrors" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [hasFocus]="step > 0" [propertiesFormGroup]="formGroup.get('properties')" [descriptionTemplate]="item.descriptionTemplate" *ngIf="formGroup" [links]="links" [boundary]="boundary" [spacer]="spacer" [isActive]="step !== 0" stickyThing (stepFound)="onStepFound($event)" (currentLinks)="getLinks($event)" (entrySelected)="changeStep($event.entry, $event.execute)"></app-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>{{'DESCRIPTION-EDITOR.TOC.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>{{'DESCRIPTION-EDITOR.TOC.NEXT' | translate}}</div>
|
|
<span class="material-icons">chevron_right</span>
|
|
</div>
|
|
<div *ngIf="!formGroup.get('descriptionTemplateId').value" mat-raised-button type="button" class="col-auto stepper-btn description-next next-disabled ml-auto">
|
|
<div>{{'DESCRIPTION-EDITOR.TOC.NEXT' | translate}}</div>
|
|
<span class="material-icons">chevron_right</span>
|
|
</div>
|
|
<button [disabled]="saving" (click)="save(saveAnd.addNew)" *ngIf="(step === maxStep) && !lockStatus && formGroup.get('descriptionTemplateId').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-description-btn ml-auto">
|
|
{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-ADD-NEW' | 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-base-fields-editor-component [hidden]="this.step !== 0" [formGroup]="formGroup" [description]="item" (formChanged)="formChanged()"></app-description-base-fields-editor-component>
|
|
<app-description-form
|
|
*ngIf="formGroup && formGroup.get('properties')"
|
|
[propertiesFormGroup]="formGroup.get('properties')"
|
|
[descriptionId]="formGroup.get('id').value"
|
|
[descriptionTemplate]="item.descriptionTemplate"
|
|
[visibilityRulesService]="visibilityRulesService"
|
|
[TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX"
|
|
[hidden]="this.step === 0"
|
|
[linkToScroll]="linkToScroll"
|
|
[validationErrorModel]="editorModel.validationErrorModel"
|
|
(fieldsetFocusChange)="fieldsetIdWithFocus = $event"></app-description-form>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|