You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
235 lines
14 KiB
HTML
235 lines
14 KiB
HTML
<div class="main-content">
|
|
<div class="container-fluid dataset-wizard">
|
|
<form *ngIf="formGroup" [formGroup]="formGroup">
|
|
<!-- <form *ngIf="formGroup" [formGroup]="formGroup" (ngSubmit)="formSubmit()"> -->
|
|
<!-- Dataset Header -->
|
|
<div class="fixed-editor-header">
|
|
<div class="card dataset-editor-header">
|
|
<div class="col">
|
|
<div class="row">
|
|
<div class="col info">
|
|
<ng-container *ngIf="!viewOnly else viewOnlyTemplate">
|
|
<div *ngIf="isNew" class="dataset-title">{{'DMP-EDITOR.TITLE.ADD-DATASET' | translate}}</div>
|
|
<div *ngIf="!isNew" class="dataset-title">{{'DMP-EDITOR.TITLE.EDIT-DATASET' | translate}}</div>
|
|
<div class="dataset-subtitle">{{ formGroup.get('label').value }} <span *ngIf="isDirty()" class="dataset-changes">({{'DMP-EDITOR.CHANGES' | translate}})</span></div>
|
|
</ng-container>
|
|
<ng-template #viewOnlyTemplate>
|
|
<div class="dataset-title">{{'DMP-EDITOR.TITLE.PREVIEW-DATASET' | translate}}</div>
|
|
</ng-template>
|
|
<div class="d-flex flex-direction-row dmp-info">
|
|
<div class="col-auto dataset-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" *ngIf="!viewOnly">
|
|
<div class="col-auto d-flex align-items-center p-0">
|
|
<button *ngIf="isDirty()" type="button" mat-raised-button class="dataset-discard-btn" (click)="discardChanges()">
|
|
{{'DMP-EDITOR.ACTIONS.DISCARD' | translate}}
|
|
</button>
|
|
</div>
|
|
<div class="col-auto d-flex align-items-center">
|
|
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="touchForm()" type="button">{{ 'DATASET-WIZARD.ACTIONS.VALIDATE' | translate }}</button>
|
|
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="save()" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</button>
|
|
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="save(saveAnd.close)" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-CLOSE' | translate }}</button>
|
|
<button *ngIf="!lockStatus" mat-raised-button class="dataset-save-btn mr-2" (click)="save(saveAnd.addNew)">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</button>
|
|
<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 editor-content">
|
|
<div class="col-auto dataset-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)="changeStep(0)" *ngIf="!datasetInfoValid()" class="main-info" [ngClass]="{'active': this.step === 0, 'text-danger':hintErrors}">0. {{'DMP-EDITOR.STEPPER.MAIN-INFO' | translate}} (2)</div>
|
|
<div (click)="changeStep(0)" *ngIf="datasetInfoValid()" 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 (click)="changeStep(1)">
|
|
<div #spacer></div>
|
|
<table-of-contents [visibilityRulesService]="visRulesService" [selectedFieldsetId]="fieldsetIdWithFocus" #table0fContents [showErrors]="showtocentriesErrors" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [hasFocus]="step === 1" [formGroup]="formGroup" *ngIf="formGroup && formGroup.get('datasetProfileDefinition')" [links]="links" [boundary]="boundary" [spacer]="spacer" [isActive]="step !== 0" stickyThing (stepFound)="onStepFound($event)" (currentLinks)="getLinks($event)" [visibilityRules]="formGroup.get('datasetProfileDefinition').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 dataset-next ml-auto" (click)="nextStep()">
|
|
<span class="material-icons">chevron_right</span>
|
|
<div>{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</div>
|
|
</div>
|
|
<div *ngIf="!formGroup.get('profile').value" mat-raised-button type="button" class="col-auto stepper-btn dataset-next next-disabled ml-auto">
|
|
<span class="material-icons">chevron_right</span>
|
|
<div>{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</div>
|
|
</div>
|
|
<div *ngIf="(this.step === this.maxStep) && !lockStatus && formGroup.get('profile').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-dataset-btn ml-auto">
|
|
<div (click)="save(saveAnd.addNew)">{{ 'DATASET-WIZARD.ACTIONS.SAVE-AND-ADD' | translate }}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto pr-0">
|
|
<app-form-progress-indication class="col-12" *ngIf="formGroup && !viewOnly" [formGroup]="formGroup" [isDatasetEditor]="true"></app-form-progress-indication>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto form" id="dataset-editor-form">
|
|
<app-dataset-editor-component [hidden]="this.step !== 0" [formGroup]="formGroup" [dmpId]="formGroup.get('dmp').value.id" [availableProfiles]="formGroup.get('dmp').value.profiles" (formChanged)="formChanged()"></app-dataset-editor-component>
|
|
<app-dataset-description (visibilityRulesInstance)="visRulesService = $event" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [hidden]="this.step === 0" *ngIf="formGroup && formGroup.get('datasetProfileDefinition')" [form]="this.formGroup.get('datasetProfileDefinition')" [visibilityRules]="formGroup.get('datasetProfileDefinition').get('rules').value" [datasetProfileId]="formGroup.get('profile').value" [linkToScroll]="linkToScroll" (fieldsetFocusChange)="fieldsetIdWithFocus = $event"></app-dataset-description>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- <mat-slide-toggle [(ngModel)]="showtocentriesErrors">
|
|
|
|
</mat-slide-toggle> -->
|
|
|
|
<!-- <div class="row">
|
|
<div class="col-12">
|
|
<button (click)="printForm()">Print form</button>
|
|
</div>
|
|
<div class="col-12">
|
|
<button (click)="printFormValue()">Print form value</button>
|
|
</div>
|
|
</div> -->
|
|
|
|
<!-- <div class="main-content">
|
|
<div class="container-fluid">
|
|
<div class="card dataset-wizard">
|
|
<div class="row card-header card-header-plain d-flex">
|
|
<div class="col-12 card-desc d-flex flex-column justify-content-center">
|
|
<div class="row">
|
|
<div class="col d-flex align-items-center flex-wrap-nowrap">
|
|
<h4 *ngIf="!isNew" class="card-title">{{datasetWizardModel?.label}}
|
|
<span *ngIf="this.formGroup && this.formGroup.dirty"> -
|
|
{{ 'GENERAL.STATUSES.EDIT' | translate }}</span>
|
|
</h4>
|
|
<div *ngIf="isNew" class="card-desc new-dataset d-flex flex-column justify-content-center">
|
|
<h4 class="card-title">{{ 'DATASET-WIZARD.TITLE.NEW' | translate }}</h4>
|
|
</div>
|
|
|
|
<div *ngIf="datasetWizardModel && !isNew" class="ml-auto">
|
|
<button mat-icon-button [matMenuTriggerFor]="actionsMenu" class="more-icon" *ngIf="!publicMode" (click)="$event.stopImmediatePropagation();">
|
|
<mat-icon class="more-horiz">more_horiz</mat-icon>
|
|
</button>
|
|
<mat-menu #actionsMenu="matMenu">
|
|
<button mat-menu-item (click)="openDmpSearchDialogue()" class="menu-item">
|
|
<mat-icon>file_copy</mat-icon>{{'DATASET-WIZARD.ACTIONS.COPY-DATASET' | translate}}
|
|
</button>
|
|
<button mat-menu-item *ngIf="!viewOnly && !isCopy" (click)="openConfirm(formGroup.get('label').value, formGroup.get('id').value)" class="menu-item">
|
|
<mat-icon>delete</mat-icon>{{ 'DATASET-WIZARD.ACTIONS.DELETE' | translate }}
|
|
</button>
|
|
<button mat-menu-item *ngIf="needsUpdate()" class="menu-item" (click)="openUpdateDatasetProfileDialogue();">{{ 'DATASET-WIZARD.ACTIONS.UPDATE-DATASET-PROFILE' | translate }}</button>
|
|
</mat-menu>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto d-flex flex-wrap p-2" *ngIf="datasetWizardModel && !isNew">
|
|
<button mat-raised-button [matMenuTriggerFor]="exportMenu" color="primary" class="lightblue-btn ml-2 export-btn">
|
|
{{ 'DMP-LISTING.ACTIONS.EXPORT' | translate }} <mat-icon>arrow_drop_down</mat-icon>
|
|
</button>
|
|
<mat-menu #exportMenu="matMenu" xPosition="before">
|
|
<button mat-menu-item (click)="downloadPDF()">
|
|
<i class="fa fa-file-pdf-o pr-2"></i>
|
|
<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
|
|
</button>
|
|
<button mat-menu-item (click)="downloadDOCX()">
|
|
<i class="fa fa-file-word-o pr-2"></i>
|
|
<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
|
|
</button>
|
|
<button mat-menu-item (click)="downloadXML()">
|
|
<i class="fa fa-file-code-o pr-2"></i>
|
|
<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
|
|
</button>
|
|
</mat-menu>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<form *ngIf="formGroup">
|
|
<div class="d-flex flex-column">
|
|
<mat-tab-group class="mt-3">
|
|
<mat-tab>
|
|
<ng-template mat-tab-label class="tab-label">
|
|
<i class="material-icons-outlined mr-2">view_agenda</i>
|
|
{{'DATASET-PROFILE-EDITOR.STEPS.PAGES.DATASET-DETAILS' | translate}}
|
|
</ng-template>
|
|
<form *ngIf="formGroup" [formGroup]="formGroup" class="p-3">
|
|
<mat-form-field class="col-md-6">
|
|
<app-single-auto-complete [required]="true" [formControl]="formGroup.get('dmp')" placeholder="{{'DATASET-EDITOR.FIELDS.DMP' | translate}}" [configuration]="dmpAutoCompleteConfiguration">
|
|
</app-single-auto-complete>
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-6">
|
|
<mat-select placeholder=" {{'DATASET-WIZARD.FIRST-STEP.PROFILE'| translate}}" [required]="true" formControlName="profile">
|
|
<mat-option *ngFor="let profile of availableProfiles" [value]="profile">
|
|
{{profile.label}}
|
|
</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="formGroup.get('profile').hasError('backendError')">
|
|
{{formGroup.get('profile').getError('backendError').message}}</mat-error>
|
|
</mat-form-field>
|
|
<app-dataset-editor-component [formGroup]="formGroup"></app-dataset-editor-component>
|
|
</form>
|
|
</mat-tab>
|
|
<mat-tab>
|
|
<ng-template mat-tab-label>
|
|
<mat-icon class="mr-2">work_outline</mat-icon>
|
|
{{'DATASET-PROFILE-EDITOR.STEPS.PAGES.EXTERNAL-REFERENCES' | translate}}
|
|
</ng-template>
|
|
<form *ngIf="formGroup" [formGroup]="formGroup" class="p-3">
|
|
<app-dataset-external-references-editor-component [formGroup]="formGroup" [viewOnly]="viewOnly"></app-dataset-external-references-editor-component>
|
|
</form>
|
|
</mat-tab>
|
|
<mat-tab [disabled]="isNew && (formGroup.get('profile').disabled || !(formGroup.get('profile').valid))">
|
|
<ng-template mat-tab-label>
|
|
<div class="d-flex">
|
|
<mat-icon class="mr-2">library_books</mat-icon>
|
|
{{'DATASET-PROFILE-EDITOR.STEPS.PAGES.DESCRIPTION' | translate}}
|
|
</div>
|
|
</ng-template>
|
|
<div class="col">
|
|
<div class="row toc-pane-container" #boundary>
|
|
<div class="col-md-8 h-100 ">
|
|
<app-dataset-description-form class="w-100 h-100" *ngIf="formGroup && datasetWizardModel && datasetWizardModel.datasetProfileDefinition" [form]="this.formGroup.get('datasetProfileDefinition')" [visibilityRules]="datasetWizardModel.datasetProfileDefinition.rules" [datasetProfileId]="formGroup.get('profile').value" [linkToScroll]="linkToScroll">
|
|
</app-dataset-description-form>
|
|
</div>
|
|
<div #spacer></div>
|
|
<div class="col-md-4">
|
|
<table-of-contents class="toc-pane-container" [boundary]="boundary" [spacer]="spacer" stickyThing (stepFound)="onStepFound($event)"></table-of-contents>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</mat-tab>
|
|
</mat-tab-group>
|
|
|
|
<div class="actions">
|
|
<mat-icon *ngIf="hasNotReversableStatus() || lockStatus" color="accent" class="align-self-center mr-1">info_outlined</mat-icon>
|
|
<div *ngIf="hasNotReversableStatus()" class="align-self-center mr-3">{{'DATASET-WIZARD.ACTIONS.INFO' | translate}}</div>
|
|
<div *ngIf="lockStatus" class="align-self-center mr-3">{{'DATASET-WIZARD.ACTIONS.LOCK' | translate}}</div>
|
|
<button mat-raised-button (click)="cancel()" type="button" class="cancelButton" color="primary">
|
|
{{'DMP-EDITOR.ACTIONS.CANCEL' | translate}}
|
|
</button>
|
|
<button *ngIf="(datasetWizardModel.status == 0 || isNew) && !lockStatus" mat-raised-button class="saveButton" color="primary" (click)="save();" type="button">{{ 'DATASET-WIZARD.ACTIONS.SAVE' | translate }}</button>
|
|
<button *ngIf="(datasetWizardModel.status == 0 || isNew) && !lockStatus" mat-raised-button class="finalizeButton" color="primary" (click)="saveFinalize();" type="button">{{ 'DATASET-WIZARD.ACTIONS.FINALIZE' | translate }}</button>
|
|
<div class="fill-space"></div>
|
|
<button *ngIf="hasReversableStatus() && !lockStatus" mat-raised-button class="reverseButton" color="primary" (click)="reverse()" type="button">{{ 'DATASET-WIZARD.ACTIONS.REVERSE' | translate }}</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div> -->
|