description editor ui fixes
This commit is contained in:
parent
10a8e93803
commit
279ae95b5a
|
|
@ -78,48 +78,64 @@
|
|||
</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()">
|
||||
<div class="col-12 col-md-3 pr-md-0">
|
||||
<div class="stepper-back row">
|
||||
<div class="col-auto d-flex align-items-center 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 class="col-auto dmp-label ml-1">{{'DESCRIPTION-EDITOR.DMP' | translate}}</div>
|
||||
</div>
|
||||
<div class="row stepper-title"> <div class="col-auto"><span>{{'DESCRIPTION-EDITOR.TOC.TITLE' | translate}}</span></div></div>
|
||||
<div class="row stepper-options" id="stepper-options">
|
||||
<div class="col-12 stepper-list">
|
||||
<div class="row" *ngIf="!descriptionInfoValid()">
|
||||
<div (click)="table0fContents.onToCentrySelected()" class="col-12 main-info" [ngClass]="{'active': this.step === 0, 'text-danger': countErrorsOfBaseInfoPage > 0}">{{'DESCRIPTION-EDITOR.TOC.MAIN-INFO' | translate}} <span *ngIf="countErrorsOfBaseInfoPage > 0">({{ countErrorsOfBaseInfoPage }})</span></div>
|
||||
</div>
|
||||
<div class="row" *ngIf="descriptionInfoValid()">
|
||||
<div (click)="table0fContents.onToCentrySelected()" class="col-12 main-info" [ngClass]="{'active': this.step === 0}">{{'DESCRIPTION-EDITOR.TOC.MAIN-INFO' | translate}} (<mat-icon class="done-icon">done</mat-icon>)</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': countErrorsOfBaseInfoPage > 0}">{{'DESCRIPTION-EDITOR.TOC.MAIN-INFO' | translate}} <span *ngIf="countErrorsOfBaseInfoPage > 0">({{ countErrorsOfBaseInfoPage }})</span></div>
|
||||
<div (click)="table0fContents.onToCentrySelected()" *ngIf="descriptionInfoValid()" class="main-info" [ngClass]="{'active': this.step === 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>
|
||||
<div class="col-12">
|
||||
<app-table-of-contents [visibilityRulesService]="visibilityRulesService" [selectedFieldsetId]="fieldsetIdWithFocus" #table0fContents [showErrors]="showtocentriesErrors" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [hasFocus]="step > 0" [formGroup]="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)" [pageToFieldSetMap]="pageToFieldSetMap"></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()">
|
||||
</div>
|
||||
<div class="row mt-2 stepper-actions justify-content-around">
|
||||
<div class="col-auto mb-1">
|
||||
<div mat-raised-button type="button" class="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>
|
||||
|
||||
<div *ngIf="this.step < this.maxStep" mat-raised-button type="button" class="col-auto stepper-btn description-next ml-auto" (click)="nextStep()">
|
||||
<div *ngIf="this.step < this.maxStep" class="col-auto mb-1">
|
||||
<div mat-raised-button type="button" class="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>
|
||||
<div *ngIf="!formGroup.get('descriptionTemplateId').value" class="col-auto mb-1">
|
||||
<div mat-raised-button type="button" class="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)="saveAndClose()" *ngIf="(step === maxStep) && !isLocked && formGroup.get('descriptionTemplateId').value && !viewOnly" mat-raised-button type="button" class="col-auto stepper-btn add-description-btn ml-auto">
|
||||
</div>
|
||||
<div *ngIf="(step === maxStep) && !isLocked && formGroup.get('descriptionTemplateId').value && !viewOnly" class="col-auto mb-1">
|
||||
<button [disabled]="saving" (click)="saveAndClose()" mat-raised-button type="button" class="col-auto stepper-btn add-description-btn ml-auto">
|
||||
{{ 'DESCRIPTION-EDITOR.ACTIONS.SAVE-AND-CLOSE' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-auto pr-0">
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<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">
|
||||
</div>
|
||||
<div class="col-12 col-md form" id="description-editor-form">
|
||||
<app-description-base-fields-editor-component [hidden]="this.step !== 0" [formGroup]="formGroup" [description]="item" (formChanged)="formChanged()" (refresh)="fireRefreshDataEvent($event)"></app-description-base-fields-editor-component>
|
||||
<app-description-form
|
||||
*ngIf="formGroup && formGroup.get('properties')"
|
||||
|
|
|
|||
|
|
@ -280,7 +280,7 @@
|
|||
height: calc(100vh - 600px);
|
||||
overflow-y: auto;
|
||||
.main-info {
|
||||
padding-left: .2rem;
|
||||
// padding-left: .2rem;
|
||||
color: #21212194;
|
||||
font-weight: 400;
|
||||
cursor: pointer;
|
||||
|
|
@ -381,7 +381,7 @@
|
|||
// width: calc(100% - 366px);
|
||||
|
||||
position: relative;
|
||||
left: 362px;
|
||||
// left: 362px;
|
||||
width: calc(100% - 366px);
|
||||
overflow-y: auto;
|
||||
height: calc(100vh - 218px);
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ span {
|
|||
// width: 100%;
|
||||
// }
|
||||
|
||||
.internal-table{
|
||||
max-width: 320px;
|
||||
min-width: 320px;
|
||||
}
|
||||
// .internal-table{
|
||||
// max-width: 320px;
|
||||
// min-width: 320px;
|
||||
// }
|
||||
|
|
@ -114,7 +114,6 @@
|
|||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
<!-- TODO -->
|
||||
<div class="row justify-content-around" *ngIf="this.step !== 0">
|
||||
<div class="col-auto mb-1">
|
||||
<div mat-raised-button type="button" class="previous stepper-btn mr-2" [ngClass]="{'previous-disabled': this.step === 1}" (click)="previousStep()">
|
||||
|
|
@ -129,7 +128,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- TODO -->
|
||||
<div class="row" *ngIf="this.step !== 0">
|
||||
<div class="col-12">
|
||||
<app-dmp-form-progress-indication class="col-12" *ngIf="formGroup && !formGroup.disabled && !lockStatus" [formGroup]="formGroup"></app-dmp-form-progress-indication>
|
||||
|
|
|
|||
Loading…
Reference in New Issue