Dataset Profile editor. Create section button on page component. Dataset profile listing: Add Download Option. Minor ui fixes.

This commit is contained in:
Kristian Ntavidi 2021-03-30 11:36:09 +03:00
parent c849ea13fe
commit d667d574af
16 changed files with 77 additions and 18 deletions

View File

@ -57,7 +57,7 @@
<!-- MAIN CONTENT -->
<div class="main-content-page">
<div class="main-content-page" [ngClass]="{'pb-2': !hasFocus}">
<!-- TITLE -->
<div class="col-12">
<div class="row fielset-header">
@ -184,9 +184,11 @@
<!-- PREVIEW -->
<div class="col-12" >
<span style="font-weight: bold;" *ngIf="hasFocus">{{'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span>
<div class="mb-1" *ngIf="hasFocus">
<span style="font-weight: bold;">{{'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span>
</div>
<div class="mt-3" style="margin-right: -15px; margin-left: -15px;" *ngIf="previewForm && form?.get('fields').controls[0].get('viewStyle')?.value.renderStyle">
<div style="margin-right: -15px; margin-left: -15px;" *ngIf="previewForm && form?.get('fields').controls[0].get('viewStyle')?.value.renderStyle">
<app-form-section-inner [form]="previewForm">
</app-form-section-inner>
@ -212,7 +214,9 @@
<li class="list-inline-item" *ngIf="!viewOnly">
<mat-icon [matMenuTriggerFor]="inputmenu" [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.FIELDSET.ADD-INPUT' | translate">folder</mat-icon>
<img src="/assets/images/editor/icons/add_input_set.svg" [matMenuTriggerFor]="inputmenu" style="width: 18px;transform: translateY(-1px);" [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.FIELDSET.ADD-INPUT' | translate" class="input_icon" alt="Add Input icon">
<!-- <mat-icon [matMenuTriggerFor]="inputmenu" [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.FIELDSET.ADD-INPUT' | translate">folder</mat-icon> -->
<mat-menu #inputmenu="matMenu" [class]="'add_input_menu'">
<!-- <button class="mat-menu-item" (click)="addNewInput(viewTypeEnum.TextArea)">{{enumUtils.toDatasetProfileViewTypeString(viewTypeEnum.TextArea)}}</button>
@ -373,7 +377,7 @@
</li>
<li class="list-inline-item">
<!-- <mat-icon>more_vert</mat-icon> -->
<mat-icon [matMenuTriggerFor]="menu" [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.FIELDSET.MORE' | translate">more_vert</mat-icon>
<mat-icon [matMenuTriggerFor]="menu" [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.FIELDSET.MORE' | translate" style="transform: translateY(-1px);">more_vert</mat-icon>
<mat-menu #menu="matMenu">
<!-- TODO to check -->
<mat-checkbox class="mat-menu-item" (click)="$event.stopPropagation()" [(ngModel)]="showDescription">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.DESCRIPTION' | translate}}</mat-checkbox>

View File

@ -104,7 +104,9 @@ $blue-color-light: #5cf7f2;
::ng-deep .mat-menu-panel{
max-height: 32em;
}
:host ::ng-deep .fielset-header .mat-form-field-wrapper{
padding-bottom: 0px;
}
// ::ng-deep .underline-line-field .mat-form-field-appearance-legacy .mat-form-field-wapper{
// padding-bottom: 1.25em !important;

View File

@ -14,7 +14,7 @@
</app-dataset-profile-editor-section-component>
</mat-card-content>
</mat-card>
<div class="col-2 col-xl-auto ml-4" *ngIf="!selectedFieldSetId">
<div class="col-2 col-xl-auto ml-4" *ngIf="!selectedFieldSetId && !viewOnly">
<div class="row bg-white actions-list">
<nav *ngIf="!viewOnly">
@ -69,7 +69,7 @@
</mat-card-content>
</mat-card>
<div class="col-2 col-xl-auto ml-4" *ngIf="selectedFieldSetId === fieldset.get('id').value">
<div class="col-2 col-xl-auto ml-4" *ngIf="selectedFieldSetId === fieldset.get('id').value &&(!viewOnly)">
<div class="row bg-white actions-list">
<nav *ngIf="!viewOnly">

View File

@ -219,7 +219,7 @@
<form [formGroup]="selectedTocEntry.form" class="page-infos">
<div class="row">
<!-- PAGE NAME -->
<div class="col">
<div class="col-12">
<div class="heading">{{'DATASET-PROFILE-EDITOR.STEPS.PAGE-INFO.PAGE-NAME' | translate}} *</div>
<div class="hint">{{'DATASET-PROFILE-EDITOR.STEPS.PAGE-INFO.PAGE-NAME-HINT' | translate}}</div>
<mat-form-field>
@ -228,6 +228,9 @@
</mat-form-field>
</div>
<div class="col-12" *ngIf="!viewOnly && (!selectedTocEntry?.subEntries?.length)">
<button class="create-section-btn" (click)="addNewEntry({parent:selectedTocEntry, childType: tocEntryEnumValues.Section})">Create section</button>
</div>
<!-- PAGE ID -->
<!-- <div class="col">
<div class="heading">Page id *</div>

View File

@ -106,6 +106,15 @@ background-color: #CBCBCB;
color: #FFF;
}
.create-section-btn {
border-radius: 30px;
background-color: #f7dd72;
border: 1px solid transparent;
padding-left: 1em;
padding-right: 1em;
box-shadow: 0px 3px 6px #1E202029;
line-height: 1.7em;
}
$blue-color : #129D99;

View File

@ -67,6 +67,10 @@
<mat-icon>library_books</mat-icon>
{{'DATASET-PROFILE-LISTING.ACTIONS.VIEW-VERSIONS' | translate}}
</button>
<button mat-menu-item (click)="downloadXML(row.id)" *ngIf="row.status === datasetStatusEnum.Finalized">
<mat-icon>download</mat-icon>
{{'DMP-PROFILE-EDITOR.ACTIONS.DOWNLOAD-XML' | translate}}
</button>
<button mat-menu-item (click)="deleteTemplate(row.id)">
<mat-icon>delete</mat-icon>
{{'DATASET-PROFILE-LISTING.ACTIONS.DELETE' | translate}}

View File

@ -19,6 +19,7 @@ import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-it
import { BaseComponent } from '@common/base/base.component';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
import { TranslateService } from '@ngx-translate/core';
import * as FileSaver from 'file-saver';
import { merge as observableMerge, Observable, of as observableOf } from 'rxjs';
import { map, startWith, switchMap, takeUntil } from 'rxjs/operators';
import { DialogConfirmationUploadDatasetProfiles } from './criteria/dialog-confirmation-upload-profile/dialog-confirmation-upload-profiles.component';
@ -42,6 +43,7 @@ export class DatasetProfileListingComponent extends BaseComponent implements OnI
titlePrefix: String;
dmpId: String;
itemId: string;
datasetStatusEnum = DatasetStatus;
constructor(
private datasetService: DatasetProfileService,
@ -124,6 +126,33 @@ export class DatasetProfileListingComponent extends BaseComponent implements OnI
viewVersions(rowId, rowLabel) {
this.router.navigate(['/dataset-profiles/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
}
downloadXML(datasetProfileId: string): void {
this.datasetProfileService.downloadXML(datasetProfileId)
.pipe(takeUntil(this._destroyed))
.subscribe(response => {
const blob = new Blob([response.body], { type: 'application/xml' });
const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
FileSaver.saveAs(blob, filename);
});
}
getFilenameFromContentDispositionHeader(header: string): string {
const regex: RegExp = new RegExp(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/g);
const matches = header.match(regex);
let filename: string;
for (let i = 0; i < matches.length; i++) {
const match = matches[i];
if (match.includes('filename="')) {
filename = match.substring(10, match.length - 1);
break;
} else if (match.includes('filename=')) {
filename = match.substring(9);
break;
}
}
return filename;
}
deleteTemplate(id: string){
if(id){

View File

@ -1,6 +1,6 @@
<div class="">
<h3 id="guide-steps">{{'DMP-EDITOR.STEPPER.USER-GUIDE' | translate}}</h3>
<h3 id="guide-steps">{{'DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.TEMPLATE-OUTLINE' | translate}}</h3>
<div class="scroll-container" id="tocentrytable">
<app-dataset-profile-table-of-contents-internal-section [links]="links" (itemClick)="itemClicked($event)"

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",

View File

@ -291,7 +291,8 @@
"DATASET-TEMPLATE-SELECT-LANGUAGE": "Select a language",
"DATASET-TEMPLATE-DESCRIPTION-PLACEHOLDER": "Dataset template description",
"UNTITLED": "Untitled",
"QUESTION": "Question"
"QUESTION": "Question",
"TEMPLATE-OUTLINE":"Template outline"
},
"PAGE-INFO": {
"PAGE-NAME": "Chapter Name",