Merge branch 'AdminTemplateRedesign' into WizardDescriptionRefactor

This commit is contained in:
Kristian Ntavidi 2021-04-01 18:59:00 +03:00
commit ee1c09149e
37 changed files with 531 additions and 652 deletions

View File

@ -6,11 +6,16 @@ export class DatasetIdModel {
type: string;
constructor(data: any) {
try{
const parsed = JSON.parse(data);
if (!isNullOrUndefined(parsed)) {
this.identifier = parsed.identifier;
this.type = parsed.type;
}
}
catch(error){
console.warn('Could not parse DatasetIdModel');
}
}
buildForm(): FormGroup {

View File

@ -1,4 +1,4 @@
import { FormGroup } from "@angular/forms";
import { FormGroup, Validators } from "@angular/forms";
import { Rule } from "../../../../core/model/admin/dataset-profile/dataset-profile";
import { BaseFormModel } from "../../../../core/model/base-form-model";
@ -21,9 +21,9 @@ export class RuleEditorModel extends BaseFormModel {
buildForm(disabled: boolean = false, skipDisable: Array<String> = []): FormGroup {
const formGroup = this.formBuilder.group({
// sourceField: [this.sourceField],
target: [{ value: this.target, disabled: (disabled && !skipDisable.includes('RuleEditorModel.target')) }],
target: [{ value: this.target, disabled: (disabled && !skipDisable.includes('RuleEditorModel.target')) }, [Validators.required]],
ruleStyle: [{ value: this.ruleStyle, disabled: (disabled && !skipDisable.includes('RuleEditorModel.ruleStyle')) }],
value: [{ value: this.value, disabled: (disabled && !skipDisable.includes('RuleEditorModel.value')) }],
value: [{ value: this.value, disabled: (disabled && !skipDisable.includes('RuleEditorModel.value')) }, [Validators.required]],
ruleType: [{ value: this.ruleType, disabled: (disabled && !skipDisable.includes('RuleEditorModel.ruleType')) }],
valueType: [{ value: this.valueType, disabled: (disabled && !skipDisable.includes('RuleEditorModel.valueType')) }]
});

View File

@ -59,6 +59,6 @@ export const GENERAL_ANIMATIONS = [
trigger('fadeElement',[
state('updated',style({opacity:0})),
transition("*=>updated",
animate('2s 40ms ease-out'))
animate('2s 1s ease-out'))
])
]

View File

@ -1,4 +1,4 @@
import { Component, Input, OnChanges, OnInit } from '@angular/core';
import { ChangeDetectorRef, Component, Input, OnChanges, OnInit } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup, ValidationErrors, ValidatorFn, Validators } from '@angular/forms';
import { FieldEditorModel } from '../../../admin/field-editor-model';
import { Guid } from '@common/types/guid';
@ -73,6 +73,7 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit, OnCh
viewStyleEnum = DatasetProfileFieldViewStyle;
viewTypeEnum = ViewStyleType;
private myCustomValidators:EditorCustomValidators = new EditorCustomValidators();
constructor(
@ -245,7 +246,6 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit, OnCh
}
// generatePreview(){
// const editorModel = new DatasetDescriptionCompositeFieldEditorModel();
// editorModel.title = this.form.get('title').value;
@ -806,7 +806,6 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit, OnCh
}
(<FormArray>this.form.get('fields')).push(new FieldEditorModel().fromModel(field).buildForm());
// fieldForm.get('viewStyle').get('renderStyle').updateValueAndValidity();
// fieldForm.get('data').updateValueAndValidity();

View File

@ -9,7 +9,7 @@
{{'GENERAL.VALIDATION.REQUIRED' | translate}}
</mat-slide-toggle>
</li>
<li class="list-inline-item" *ngIf="!viewOnly && viewType">
<li class="list-inline-item" *ngIf="!viewOnly && viewType && canApplyVisibility">
<mat-icon style="cursor: pointer;" (click)="addNewRule()" [matTooltip]="'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.ADD-VISIBILITY-RULE' | translate">visibility</mat-icon>
</li>
<li class="list-inline-item" *ngIf="!viewOnly && viewType && canBeDeleted">

View File

@ -380,7 +380,25 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
// });
};
get canApplyVisibility():boolean{
switch(this.viewType){
case this.viewTypeEnum.TextArea:
case this.viewTypeEnum.FreeText:
case this.viewTypeEnum.BooleanDecision:
case this.viewTypeEnum.RadioBox:
case this.viewTypeEnum.Select:
case this.viewTypeEnum.CheckBox:
case this.viewTypeEnum.DatePicker:
return true;
}
return false;
}
// validTicket:string;
// generatePreview(){
@ -417,6 +435,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
const field: Field = this.form.getRawValue();
field.defaultValue = {type:null, value: null};
if(!this.canApplyVisibility){
field.visible.rules = [];
}
@ -767,6 +788,8 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
fields.removeAt(index);
fields.insert(index, form);
this.form = form;
}
setTimeout(() => { //TODO

View File

@ -25,7 +25,7 @@
<!-- SELECTION -->
<mat-form-field class="col align-self-center">
<mat-label>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-THEN'| translate}}</mat-label>
<mat-select formControlName="target" required>
<mat-select formControlName="target" (openedChange)="computeOptions($event)">
<!-- SHOW SECTIONS -->
<!-- <mat-optgroup label="Sections" *ngIf="false">
<mat-option *ngFor="let option of sectionOptions" [value]="option.id" style="line-height: normal;"
@ -43,7 +43,10 @@
<!-- SHOW FIELDSETS -->
<mat-optgroup [label]="'DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.FIELDS.FIELDSETS' | translate">
<mat-option *ngFor="let option of fieldSetOptions" [value]="option.id" style="line-height: normal;"
[disabled]="parentIds.includes(option.id)">
[disabled]="parentIds.includes(option.id) || hiddenBy.includes(option.id)"
[matTooltip]="getToolTipMessage(option.id)"
[matTooltipShowDelay]="700"
>
<span>
{{option.label? option.label:'<'+ ('DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.UNTITLED' | translate) + '>'}}
</span> <br>
@ -55,7 +58,10 @@
<!-- SHOW FIELDS -->
<mat-optgroup [label]="'DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.FIELDS.FIELDS' | translate">
<mat-option *ngFor="let option of fieldOptions" [value]="option.id" style="line-height: normal;"
[disabled]="parentIds.includes(option.id)">
[disabled]="parentIds.includes(option.id) ||hiddenBy.includes(option.id)"
[matTooltip]="getToolTipMessage(option.id)"
[matTooltipShowDelay]="700"
>
<span>
{{option.label? option.label:'<'+ ('DATASET-PROFILE-EDITOR.STEPS.GENERAL-INFO.UNTITLED' | translate) + '>'}}
</span> <br>

View File

@ -1,8 +1,10 @@
import { Component, Input, OnInit } from '@angular/core';
import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
import { FormArray, FormControl, FormGroup } from '@angular/forms';
import { DatasetProfileFieldViewStyle } from '../../../../../../core/common/enum/dataset-profile-field-view-style';
import { DatasetProfileComboBoxType } from '../../../../../../core/common/enum/dataset-profile-combo-box-type';
import { ToCEntryType } from '../../../table-of-contents/table-of-contents-entry';
import { Rule } from '@app/core/model/admin/dataset-profile/dataset-profile';
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'app-dataset-profile-editor-rule-component',
@ -12,6 +14,7 @@ import { ToCEntryType } from '../../../table-of-contents/table-of-contents-entry
export class DatasetProfileEditorRuleComponent implements OnInit{
@Input() form: FormArray;
@Input() viewStyleForCheck: DatasetProfileFieldViewStyle;
@ -20,6 +23,16 @@ export class DatasetProfileEditorRuleComponent implements OnInit{
@Input() comboBoxTypeForCheck: DatasetProfileComboBoxType;
@Input() viewOnly: boolean;
options: OptionItem[];
sectionOptions: OptionItem[];
fieldSetOptions: OptionItem[];
fieldOptions: OptionItem[];
constructor(private language: TranslateService){
}
targetValidation() {
//TODO
}
@ -29,8 +42,11 @@ export class DatasetProfileEditorRuleComponent implements OnInit{
}
ngOnInit(): void {
this._computeOptions();
}
private _computeOptions(){
this.options = this.getOptions();
// TODO TO SEE IF THE COMPONENT IS NOT DESTROYED AND THE FORM UPDATES
this.sectionOptions = [];
this.fieldOptions = [];
@ -50,12 +66,39 @@ export class DatasetProfileEditorRuleComponent implements OnInit{
break;
}
});
//remove options to hide if given fieldset is already hidden by option
this.fieldOptions.forEach(e=>this._buildHiddenBy(e));
this.fieldSetOptions.forEach(e=>this._buildHiddenBy(e));
}
options: OptionItem[];
sectionOptions: OptionItem[];
fieldSetOptions: OptionItem[];
fieldOptions: OptionItem[];
computeOptions(isOpened: boolean){
if(isOpened){
this._computeOptions();
}
}
private _buildHiddenBy(fo:OptionItem){
try{
this.fieldOptions.forEach(foption=>{
const rules = (foption.form.get('visible').get('rules') as FormArray).controls.map(c=>(c as FormGroup).getRawValue()) as Rule[]
const targets = rules.map(rule=>rule.target);
targets.forEach(target=>{
if(fo.parentsIds.includes(target) && !fo.hiddenBy.includes(foption.id)){
fo.hiddenBy.push(...foption.parentsIds);
}
})
});
}catch{
console.log('error');
}
}
getOptions():OptionItem[]{
@ -96,7 +139,9 @@ export class DatasetProfileEditorRuleComponent implements OnInit{
type: type,
label: type ===ToCEntryType.Field? form.get('data').get('label').value :form.get('title').value,
// parentsIds: [form.get('id').value]
parentsIds: [...parentIds, form.get('id').value]
parentsIds: [...parentIds, form.get('id').value],
form: form,
hiddenBy:[]
}
result.push(currentOptionItem);
@ -130,6 +175,26 @@ export class DatasetProfileEditorRuleComponent implements OnInit{
}
return [];
}
get hiddenBy(): string[]{
if(!this.formControlForCheck.get('id')) return [];
const current = this.options.find(opt=> opt.id === this.formControlForCheck.get('id').value);
if(current){
return current.hiddenBy;
}
return [];
}
getToolTipMessage(id: string){
if(this.parentIds.includes(id)){
// return 'Cannot hide element that contain the field';
return this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.HINTS.ELEMENT-CHILD-OF-TARGET');
}else if(this.hiddenBy.includes(id)){
return this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.HINTS.ELEMENT-HIDDEN-FROM-ELEMENT');
}
return '';
}
}
@ -138,5 +203,7 @@ interface OptionItem{
id: string,
label: string,
type: ToCEntryType,
parentsIds: string[]
parentsIds: string[],
form:FormGroup,
hiddenBy:string[]
}

View File

@ -17,7 +17,7 @@
<div class="col-2 col-xl-auto ml-4" *ngIf="!selectedFieldSetId && !viewOnly">
<div class="row bg-white actions-list">
<nav *ngIf="!viewOnly">
<nav>
<label class="action-list-label">{{'DATASET-PROFILE-EDITOR.STEPS.TOOLKIT.GENERAL-TOOLS' | translate}}</label>
<ul class="list-unstyled">
<li class="mli">
@ -36,7 +36,7 @@
</div>
<!-- FIELDSET INFO -->
<div class="col-12 drop-list" dragula="FIELDSETS" [(dragulaModel)]="form.get('fieldSets').controls">
<div class="col-12" dragula="FIELDSETS" [(dragulaModel)]="form.get('fieldSets').controls">
<div style="margin-bottom: 2em;" class="row"
*ngFor="let fieldset of form.get('fieldSets')?.controls ; let i=index"[id]="idprefix+fieldset.get('id').value"

View File

@ -9,77 +9,52 @@ $blue-color-light: #5cf7f2;
.fieldset-actions-list li{
cursor: pointer;
}
//cdkDrag
.actions-list{
// border: 1px solid $blue-color;
// box-shadow: 0px 3px 12px #129D9999;
border-radius: 4px;
// padding-top: 1rem;
padding: 1em 0.9em;
padding-bottom: 3em;
min-width: 166px;
.cdk-drag-preview {
box-sizing: border-box;
border-radius: 4px;
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
0 8px 10px 1px rgba(0, 0, 0, 0.14),
0 3px 14px 2px rgba(0, 0, 0, 0.12);
.mat-list-item-content{
padding: 0px;
}
.cdk-drag-placeholder {
opacity: 0;
// background-color: black;
}
.cdk-drag-animating {
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.action-list-item{
display: flex;
align-items: center;
cursor: pointer;
.example-box:last-child {
border: none;
}
.drop-list.cdk-drop-list-dragging {
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.actions-list{
// border: 1px solid $blue-color;
// box-shadow: 0px 3px 12px #129D9999;
border-radius: 4px;
// padding-top: 1rem;
padding: 1em 0.9em;
padding-bottom: 3em;
min-width: 166px;
.mat-list-item-content{
padding: 0px;
.action-list-icon{
font-size: 1.2em;
// padding-right: 1em;
width: 14px;
margin-right: 0.5em;
margin-left: -.09em;
height: auto;
color: #129D99;;
}
.action-list-item{
display: flex;
align-items: center;
cursor: pointer;
.action-list-icon{
font-size: 1.2em;
// padding-right: 1em;
width: 14px;
margin-right: 0.5em;
margin-left: -.09em;
height: auto;
color: #129D99;;
}
.input_icon{
width: 14px;
margin-right: .5em;
}
.action-list-text{
font-size: 0.9em;
}
.input_icon{
width: 14px;
margin-right: .5em;
}
.action-list-label{
color: #212121;
font-size: small;
opacity: 0.6;
.action-list-text{
font-size: 0.9em;
}
.list-unstyled{
margin-bottom: 0.2rem;
}
}
}
.action-list-label{
color: #212121;
font-size: small;
opacity: 0.6;
}
.list-unstyled{
margin-bottom: 0.2rem;
}
}

View File

@ -118,7 +118,8 @@ export class DatasetProfileEditorSectionFieldSetComponent implements OnInit, OnC
this.numbering = this.tocentry.numbering;
this._selectedFieldSetId = null;
this._scrollToElement(this.tocentry.id);
// this._scrollToElement(this.tocentry.id);
this._scrollOnTop();
}else if(this.tocentry.type === ToCEntryType.FieldSet){
this.form = this.tocentry.form.parent.parent;
const numberingArray = this.tocentry.numbering.split('.');

View File

@ -193,7 +193,6 @@
<dataset-profile-table-of-contents class="toc-pane-container col"
[links]="toCEntries"
(itemClick)="displayItem($event)"
(newEntry)="addNewEntry($event)"
(createEntry) = "addNewEntry($event)"
(removeEntry)="onRemoveEntry($event)"
[itemSelected]="selectedTocEntry"

View File

@ -29,7 +29,7 @@ import { MatomoService } from '@app/core/services/matomo/matomo-service';
import { Link, LinkToScroll } from '@app/ui/misc/dataset-description-form/tableOfContentsMaterial/table-of-contents';
import { DatasetWizardService } from '@app/core/services/dataset-wizard/dataset-wizard.service';
import { DatasetWizardEditorModel } from '@app/ui/dataset/dataset-wizard/dataset-wizard-editor.model';
import { Foo, ToCEntry, ToCEntryType } from '../table-of-contents/table-of-contents-entry';
import { NewEntryType, ToCEntry, ToCEntryType } from '../table-of-contents/table-of-contents-entry';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
import { FieldSetEditorModel } from '../admin/field-set-editor-model';
import { Guid } from '@common/types/guid';
@ -263,25 +263,27 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
// (<FormArray>this.form.get('sections')).push(section.buildForm());
// }
addPage() {
const page: PageEditorModel = new PageEditorModel(this.dataModel.pages.length);
this.dataModel.pages.push(page);
(<FormArray>this.form.get('pages')).push(page.buildForm());
}
// addPage() {
// const page: PageEditorModel = new PageEditorModel(this.dataModel.pages.length);
// this.dataModel.pages.push(page);
// (<FormArray>this.form.get('pages')).push(page.buildForm());
// }
DeleteSection(index) {
this.dataModel.sections.splice(index, 1);
(<FormArray>this.form.get('sections')).removeAt(index);
}
// DeleteSection(index) {
// this.dataModel.sections.splice(index, 1);
// (<FormArray>this.form.get('sections')).removeAt(index);
// }
onSubmit() {
let data = this.form.value;
if (this.datasetProfileId) {
this.datasetProfileService.updateForm(this.datasetProfileId, data)
.pipe(takeUntil(this._destroyed))
.subscribe(() => {
this.router.navigate(['/dataset-profiles']);
});
this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-PROFILE-EDITOR.FEEDBACK-MESSAGES.SAVE-SUCCESS'), SnackBarNotificationLevel.Success);
},error=> this.onCallbackError(error));
} else if (this.newVersionId) {
data.label = this.form.get('label').value;
data.description = this.form.get('description').value;
@ -289,17 +291,21 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
.pipe(takeUntil(this._destroyed))
.subscribe(() => {
this.router.navigate(['/dataset-profiles']);
this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-PROFILE-EDITOR.FEEDBACK-MESSAGES.SAVE-SUCCESS'), SnackBarNotificationLevel.Success);
},
error => this.onCallbackErrorNewVersion(error)
);
} else {
this.form.get('status').setValue(DatasetStatus.Draft);
if(this.form.get('status').value != DatasetStatus.Finalized){// forn created and finalized instantly
this.form.get('status').setValue(DatasetStatus.Draft);
}
data = this.form.value;
this.datasetProfileService.createForm(data)
.pipe(takeUntil(this._destroyed))
.subscribe(() => {
this.router.navigate(['/dataset-profiles']);
});
this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-PROFILE-EDITOR.FEEDBACK-MESSAGES.SAVE-SUCCESS'), SnackBarNotificationLevel.Success);
}, error=> this.onCallbackError(error));
}
}
@ -315,21 +321,22 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
.pipe(takeUntil(this._destroyed))
.subscribe(() => {
this.router.navigate(['/dataset-profiles']);
});
this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-PROFILE-EDITOR.FEEDBACK-MESSAGES.SAVE-SUCCESS'), SnackBarNotificationLevel.Success)
},error=>this.onCallbackError(error));
}
showUpdateButton() {
return !this.isNew && this.dataModel.status === DatasetProfileEnum.FINALIZED;
}
isStepActive(step: number) {
return this.stepper && this.stepper.selectedIndex === step;
}
// isStepActive(step: number) {
// return this.stepper && this.stepper.selectedIndex === step;
// }
onCallbackSuccess(): void {
this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
this.router.navigate(['/master-items']);
}
// onCallbackSuccess(): void {
// this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
// this.router.navigate(['/master-items']);
// }
onCallbackErrorNewVersion(errorResponse: HttpErrorResponse) {
this.uiNotificationService.snackBarNotification(errorResponse.error.message, SnackBarNotificationLevel.Error);
@ -430,68 +437,70 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
// }
}
printErrors(rootform: FormGroup) {
if (!rootform.valid) {
Object.keys(rootform.controls).forEach(key => {
const errors = rootform.get(key).errors;
if (errors !== null) {
let numbering: string = '';
for (let j = 0; j < this.nestedCount.length; j++) {
numbering += this.nestedCount[j];
if (j < this.nestedIndex) {
numbering += '.';
} else {
break;
}
}
Object.keys(errors).forEach(keyError => {
if (typeof errors[keyError] === 'boolean') {
this.errorMessages.push(numbering + ' ' + key + ' is ' + keyError);
} else {
this.errorMessages.push(numbering + ' ' + key + ': ' + keyError + ': ' + JSON.stringify(errors[keyError]));
}
});
} else {
if (rootform.get(key) instanceof FormGroup) {
this.printErrors(<FormGroup>rootform.get(key));
} else if (rootform.get(key) instanceof FormArray) {
this.nestedIndex++;
this.nestedCount[this.nestedIndex] = 0;
for (let childForm of (<FormArray>rootform.get(key)).controls) {
this.nestedCount[this.nestedIndex]++;
this.printErrors(<any>childForm);
}
this.nestedCount[this.nestedIndex] = 0;
this.nestedIndex--;
}
}
});
}
}
//BEFORE REDESIGN
// printErrors(rootform: FormGroup) {
// if (!rootform.valid) {
// Object.keys(rootform.controls).forEach(key => {
// const errors = rootform.get(key).errors;
// if (errors !== null) {
// let numbering: string = '';
// for (let j = 0; j < this.nestedCount.length; j++) {
// numbering += this.nestedCount[j];
// if (j < this.nestedIndex) {
// numbering += '.';
// } else {
// break;
// }
// }
// Object.keys(errors).forEach(keyError => {
// if (typeof errors[keyError] === 'boolean') {
// this.errorMessages.push(numbering + ' ' + key + ' is ' + keyError);
// } else {
// this.errorMessages.push(numbering + ' ' + key + ': ' + keyError + ': ' + JSON.stringify(errors[keyError]));
// }
// });
// } else {
// if (rootform.get(key) instanceof FormGroup) {
// this.printErrors(<FormGroup>rootform.get(key));
// } else if (rootform.get(key) instanceof FormArray) {
// this.nestedIndex++;
// this.nestedCount[this.nestedIndex] = 0;
// for (let childForm of (<FormArray>rootform.get(key)).controls) {
// this.nestedCount[this.nestedIndex]++;
// this.printErrors(<any>childForm);
// }
// this.nestedCount[this.nestedIndex] = 0;
// this.nestedIndex--;
private showValidationErrorsDialog(projectOnly?: boolean) {
const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
disableClose: true,
autoFocus: false,
restoreFocus: false,
data: {
errorMessages: this.errorMessages,
projectOnly: projectOnly
},
});
}
// }
// }
// });
// }
// }
// private showValidationErrorsDialog(projectOnly?: boolean) {
// const dialogRef = this.dialog.open(FormValidationErrorsDialogComponent, {
// disableClose: true,
// autoFocus: false,
// restoreFocus: false,
// data: {
// errorMessages: this.errorMessages,
// projectOnly: projectOnly
// },
// });
// }
links: Link[] = [];
// links: Link[] = [];
getLinks(currentLinks: Link[]) {
this.links = currentLinks;
}
// getLinks(currentLinks: Link[]) {
// this.links = currentLinks;
// }
datasetWizardModel: DatasetWizardEditorModel;
@ -751,7 +760,7 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
return tocEntryFound? tocEntryFound: null;
}
addNewEntry(tce: Foo) {
addNewEntry(tce: NewEntryType) {
const parent = tce.parent;
@ -1514,7 +1523,7 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
}
isStepCompleted(stepIndex: number){ //TODO NA TO DOUME MIPOS DEN XREIAZETAI
isStepCompleted(stepIndex: number){
let stepCompleted = false;
this.steps.forEach((step,index)=>{
@ -1708,41 +1717,6 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
return fieldsets;
}
// private _printToCentriesErrrors(entries: ToCEntry[]){
// if(!entries || !entries.length) return;
// entries.forEach(e=>{
// // if(e.form instanceof FormGroup) console.log('is Formgroup');
// // if(e.form instanceof FormControl) console.log('is formcontrols');
// // if(e.form instanceof FormArray) console.log('isForm array');
// const form = e.form as FormGroup;
// if(form.invalid){
// const controls = form.controls;
// const keys = Object.keys(controls);
// keys.forEach(key=>{
// const control = controls[key];
// if(control.invalid){
// console.log('control ', key, 'is invalid');
// }
// })
// // console.log('keys,', keys);
// this._printToCentriesErrrors(e.subEntries);
// }
// });
// }
private _getErrors(aControl: AbstractControl):InvalidControl[]{

View File

@ -21,7 +21,13 @@ export class DialogConfirmationUploadDatasetProfiles {
selectXML(event) {
const file: FileList = event.target.files;
let file: FileList = null;
if(event.target && event.target.files){
file = event.target.files;
}else if(event.addedFiles && event.addedFiles.length){
file = event.addedFiles;
}
if(!file) return;//no select closed with cancel . no file selected
const size: number = file[0].size; // Get file size.
this.sizeError = size > this.maxFileSize; // Checks if file size is valid.

View File

@ -69,10 +69,11 @@ mat-row:hover {
// // background-color: #eef0fb;
// }
::ng-deep .mat-paginator-container {
:host ::ng-deep .mat-paginator-container {
flex-direction: row-reverse !important;
justify-content: space-between !important;
background-color: #f6f6f6;
align-items: center;
// height: 30px;
// min-height: 30px !important;
}

View File

@ -217,7 +217,14 @@ export class DatasetProfileListingComponent extends BaseComponent implements OnI
if (data && data.sucsess && data.name != null && data.file != null) {
this.datasetService.uploadFile(data.file, data.name)
.pipe(takeUntil(this._destroyed))
.subscribe();
.subscribe(_=>{
this.uiNotificationService.snackBarNotification('Template successfully uploaded', SnackBarNotificationLevel.Success);
this.refresh();
},
error=>{
this.uiNotificationService.snackBarNotification(error.message, SnackBarNotificationLevel.Error);
}
);
}
});
}

View File

@ -18,7 +18,7 @@ export enum ToCEntryType {
Field = 3
}
export interface Foo {
export interface NewEntryType {
childType: ToCEntryType,
parent: ToCEntry
}

View File

@ -23,7 +23,7 @@
[ngStyle]="{'font-size' : (parentLink.type == tocEntryType.FieldSet? '.9rem':'1rem')}"
> -->
<span class="table-label-element"
[ngClass]="{'table-label-element-active': itemSelected?.id == parentLink?.id, 'text-danger': colorError() ||(!colorError() && !selectedItemInLinks && parentLink?.form.invalid && colorizeInvalid && (itemSelected?.id != parentLink?.id) && !_findTocEntryById(itemSelected?.id, parentLink?.subEntries))}"
[ngClass]="{'table-label-element-active': itemSelected?.id == parentLink?.id, 'text-danger': colorError() ||( (parentLink?.subEntriesType === tocEntryType.FieldSet )&& !colorError() && !selectedItemInLinks && parentLink?.form.invalid && colorizeInvalid && (itemSelected?.id != parentLink?.id) && !_findTocEntryById(itemSelected?.id, parentLink?.subEntries))}"
(click)="itemClicked(parentLink)"
[ngStyle]="{'font-size' : (parentLink.type == tocEntryType.FieldSet? '.9rem':'1rem')}"
[id]="'TABLE_ENTRY'+parentLink.id"
@ -72,7 +72,7 @@
<!-- [ngClass]="{'border-left-active':itemSelected?.id == parentLink?.id, 'pl-1':itemSelected?.id == parentLink?.id, 'pb-4': isDragging && (parentLink?.type!= tocEntryType.FieldSet) && (parentLink?.id != draggingItemId) }" -->
<div dragula="TABLEDRAG" class="ml-2"
[ngClass]="{'border-left-active':itemSelected?.id == parentLink?.id, 'ml-1':itemSelected?.id == parentLink?.id, 'pb-4': isDragging && (parentLink?.type!= tocEntryType.FieldSet) && (parentLink?.id != draggingItemId) }"
[hidden]="!((parentLink?.subEntriesType!= tocEntryType.FieldSet) || selectedItemInLinks || parentLink?.id === itemSelected?.id || dragHoveringOver ||isDragging)"
[hidden]="!((parentLink?.subEntriesType!= tocEntryType.FieldSet) || selectedItemInLinks || parentLink?.id === itemSelected?.id ||isDragging)"
class="cdk-link-list"
[id]="parentLink.id"
[ngStyle]="{'border': overContainerId === parentLink?.id? '1px solid #129D99': '', 'min-height': ((!links?.length||(links.length ==1) ) && (parentLink?.type != tocEntryType.FieldSet) && (isDragging) && (draggingItemId != parentLink?.id)) ? '3em':'inherit'}"
@ -122,9 +122,6 @@
(createFooEntry)="createNewEntry($event)"
[viewOnly]="viewOnly"
(dataNeedsRefresh)="onDataNeedsRefresh()"
[dropListGroup]="dropListGroup"
[dragHoveringOver]="dragHoveringOver"
[depth]="depth+1"
[DRAGULA_ITEM_ID_PREFIX]="DRAGULA_ITEM_ID_PREFIX"
[overContainerId]="overContainerId"
[isDragging]="isDragging"
@ -161,7 +158,6 @@
</ng-container>
</button>
<!-- <button (click)="showDroplists()">show droplist</button> -->
</ng-container>
<!-- </div> -->
</ng-container>

View File

@ -1,88 +1,52 @@
.docs-toc-container {
width: 100%;
padding: 5px 0 10px 0px;
// cursor: pointer;
// border-left: solid 4px #0c7489;
// .docs-toc-container {
// width: 100%;
// padding: 5px 0 10px 0px;
// // cursor: pointer;
// // border-left: solid 4px #0c7489;
.scroll-container {
overflow-y: auto;
// calc(100vh - 250px)
// height: calc(100vh - 250px);
}
// .scroll-container {
// overflow-y: auto;
// // calc(100vh - 250px)
// // height: calc(100vh - 250px);
// }
.docs-link {
color: rgba(0, 0, 0, 0.54);
// color: mat-color($app-blue-theme-foreground, secondary-text);
transition: color 100ms;
// .docs-link {
// color: rgba(0, 0, 0, 0.54);
// // color: mat-color($app-blue-theme-foreground, secondary-text);
// transition: color 100ms;
&:hover,
&.docs-active {
.link-name {
background-color: #ececec;
border-radius: 6px;
cursor: pointer;;
// color: #0c7489;
}
// color: mat-color($primary, if($is-dark-theme, 200, default));
}
}
}
.docs-toc-heading {
margin: 0;
padding: 0;
font-size: 13px;
font-weight: bold;
}
// span {
// line-height: 16px;
// margin: 6px 0 0;
// position: relative;
// text-decoration: none;
// display: block;
// overflow: hidden;
// color: #21212194;
// font-weight: 400;
// max-width: 290px;
// min-width: 290px;
// padding: 0rem .4rem;
// span {
// white-space: nowrap;
// overflow: hidden;
// text-overflow: ellipsis;
// display: inline-block;
// width: 100%;
// &:hover,
// &.docs-active {
// .link-name {
// background-color: #ececec;
// border-radius: 6px;
// cursor: pointer;;
// // color: #0c7489;
// }
// // color: mat-color($primary, if($is-dark-theme, 200, default));
// }
// }
// }
.selected {
color: #212121 !important;
font-weight: 700 !important;
opacity: 1 !important;
}
// .docs-level-mat-expansion-panel {
// margin-left: 12px;
// .docs-toc-heading {
// margin: 0;
// padding: 0;
// font-size: 13px;
// font-weight: bold;
// }
.docs-level-h5 {
margin-left: 24px;
}
// .table-item-actions{
// // display: none;
// display: inline-block;
// visibility: hidden;
// }
.table-item-actions{
// display: none;
display: inline-block;
visibility: hidden;
}
.table-item:hover {
.table-item-actions{
// display: inline-block;
visibility: visible;
}
}
// .table-item:hover {
// .table-item-actions{
// // display: inline-block;
// visibility: visible;
// }
// }
// .table-item col{
// text-overflow: ellipsis;
@ -117,49 +81,6 @@
overflow: hidden;
}
.link-box {
padding: 20px 10px;
border-bottom: solid 1px #ccc;
color: rgba(0, 0, 0, 0.87);
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
cursor: move;
background: white;
font-size: 14px;
}
.cdk-drag-preview {
background-color: #FFF;
box-sizing: border-box;
border-radius: 4px;
box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
0 8px 10px 1px rgba(0, 0, 0, 0.14),
0 3px 14px 2px rgba(0, 0, 0, 0.12);
.add-new-entry{
display: none;
}
}
.cdk-drag-placeholder {
opacity: 0;
// background-color: black;
}
.cdk-drag-animating {
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
.link-box:last-child {
border: none;
}
.cdk-link-list.cdk-drop-list-dragging .link-box:not(.cdk-drag-placeholder) {
transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}
$blue-color : #129D99;

View File

@ -3,7 +3,7 @@ import { DOCUMENT } from '@angular/common';
import { Component, EventEmitter, Inject, Input, OnInit, Output, SimpleChanges, ViewChild } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { BaseComponent } from '@common/base/base.component';
import { Foo, ToCEntry, ToCEntryType } from '../table-of-contents-entry';
import { NewEntryType, ToCEntry, ToCEntryType } from '../table-of-contents-entry';
@Component({
selector: 'app-dataset-profile-table-of-contents-internal-section',
@ -14,10 +14,9 @@ export class DatasetProfileTableOfContentsInternalSection extends BaseComponent
@Input() links: ToCEntry[];
@Output() itemClick = new EventEmitter<ToCEntry>();
@Output() newEntry = new EventEmitter<ToCEntry>();
@Output() removeEntry = new EventEmitter<ToCEntry>();
@Output() createFooEntry = new EventEmitter<Foo>();
@Output() createFooEntry = new EventEmitter<NewEntryType>();
@Output() dataNeedsRefresh = new EventEmitter<void>();
@ -35,10 +34,10 @@ export class DatasetProfileTableOfContentsInternalSection extends BaseComponent
@Input() viewOnly: boolean;
// @Input() dropListGroup: Set<string> = new Set<string>();
@Input() dropListGroup: string[];
// @Input() dropListGroup: string[];
@Input() dragHoveringOver: boolean = false;
@Input() depth: number = 0;
// @Input() dragHoveringOver: boolean = false;
// @Input() depth: number = 0;
// @Input() dropListStruct: { id: string, depth: number}[] = [];
@ -49,60 +48,25 @@ export class DatasetProfileTableOfContentsInternalSection extends BaseComponent
tocEntryType = ToCEntryType;
// showStructs(){
// console.log(this.dropListStruct.sort(this.compareFn));
// compareFn(a, b){
// if(a.depth> b.depth) return -1;
// if(a.depth< b.depth) return 1;
// return 0;
// }
// get orderedListGroup(){
// return this.dropListStruct.sort(this.compareFn).map(element=> element.id);
// }
compareFn(a, b){
if(a.depth> b.depth) return -1;
if(a.depth< b.depth) return 1;
return 0;
}
ngOnInit(): void {
// if(this.parentLink.id && this.dropListGroup){
// if(!this.dropListGroup.includes(this.parentLink.id)){
// this.dropListGroup.unshift(this.parentLink.id);//TODO
// }
// }
// this.dropListStruct.push({
// id: this.parentLink.id,
// depth: this.depth
// });
// if(this.links){
// this.links.forEach(link=>{
// this.dropListGroup.push(link.id);
// })
// }
// this.dropListGroup.add(this.parentLink.id)
}
showDroplists(){
console.log(this.dropListGroup);
}
// hoveroverEnter(){
// // console.log('user hovering drag over', this.parentLink.id, this.parentLink.label);
// this.dragHoveringOver = true;
// }
// hoveroverLeft(){
// this.dragHoveringOver = false;
// }
hoveroverEnter(){
// console.log('user hovering drag over', this.parentLink.id, this.parentLink.label);
this.dragHoveringOver = true;
}
hoveroverLeft(){
this.dragHoveringOver = false;
}
fellowContainers(){
return this.dropListGroup.filter(dl=> dl != this.parentLink.id);
}
ngOnChanges(changes: SimpleChanges) {
}
@ -119,30 +83,30 @@ export class DatasetProfileTableOfContentsInternalSection extends BaseComponent
this.removeEntry.emit(currentLink);
}
createNewEntry(foo: Foo){
createNewEntry(foo: NewEntryType){
this.createFooEntry.emit(foo);
}
tocEntryIsChildOf(testingChild: ToCEntry,parent: ToCEntry): boolean{
// tocEntryIsChildOf(testingChild: ToCEntry,parent: ToCEntry): boolean{
if(!testingChild || !parent) return false;
// if(!testingChild || !parent) return false;
if(testingChild.id == parent.id){return true;}
// if(testingChild.id == parent.id){return true;}
if(parent.subEntries){
let childFound:boolean = false;
// if(parent.subEntries){
// let childFound:boolean = false;
parent.subEntries.forEach(subEntry=>{
if(this.tocEntryIsChildOf(testingChild, subEntry)){
childFound = true;
return true;
}
})
// parent.subEntries.forEach(subEntry=>{
// if(this.tocEntryIsChildOf(testingChild, subEntry)){
// childFound = true;
// return true;
// }
// })
return childFound;
}
return false;
}
// return childFound;
// }
// return false;
// }
get selectedItemInLinks(){
if(!this.links || !this.itemSelected) return false;
@ -158,59 +122,59 @@ export class DatasetProfileTableOfContentsInternalSection extends BaseComponent
// return this.dropListGroup;
// }
drop(event: CdkDragDrop<string[]>) {
// if(!this.links || !this.links.length) return;
// drop(event: CdkDragDrop<string[]>) {
// // if(!this.links || !this.links.length) return;
if(event.container === event.previousContainer){
moveItemInArray(this.links, event.previousIndex, event.currentIndex);
// if(event.container === event.previousContainer){
// moveItemInArray(this.links, event.previousIndex, event.currentIndex);
let arrayToUpdate: FormArray = this.links[0].form.parent as FormArray;
// if(this.parentLink && this.parentLink.form){
// switch(this.parentLink.subEntriesType){
// case this.tocEntryType.Field:
// arrayToUpdate = (this.parentLink.form.get('fields') as FormArray);
// break;
// case this.tocEntryType.FieldSet:
// arrayToUpdate = (this.parentLink.form.get('fieldSets') as FormArray);
// break;
// case this.tocEntryType.Section:
// arrayToUpdate = (this.parentLink.form.get('sections') as FormArray);
// break
// }
// let arrayToUpdate: FormArray = this.links[0].form.parent as FormArray;
// // if(this.parentLink && this.parentLink.form){
// // switch(this.parentLink.subEntriesType){
// // case this.tocEntryType.Field:
// // arrayToUpdate = (this.parentLink.form.get('fields') as FormArray);
// // break;
// // case this.tocEntryType.FieldSet:
// // arrayToUpdate = (this.parentLink.form.get('fieldSets') as FormArray);
// // break;
// // case this.tocEntryType.Section:
// // arrayToUpdate = (this.parentLink.form.get('sections') as FormArray);
// // break
// // }
// }
if(arrayToUpdate.controls){
moveItemInArray(arrayToUpdate.controls, event.previousIndex, event.currentIndex);
//update ordinality
arrayToUpdate.controls.forEach((element,idx ) => {
element.get('ordinal').setValue(idx);
element.updateValueAndValidity();
});
}
// // }
// if(arrayToUpdate.controls){
// moveItemInArray(arrayToUpdate.controls, event.previousIndex, event.currentIndex);
// //update ordinality
// arrayToUpdate.controls.forEach((element,idx ) => {
// element.get('ordinal').setValue(idx);
// element.updateValueAndValidity();
// });
// }
this.dataNeedsRefresh.emit();
}else{
console.log('not same container');
}
// this.dataNeedsRefresh.emit();
// }else{
// console.log('not same container');
// }
console.log(event.container.id);
// console.log(event.container.id);
}
// }
onDataNeedsRefresh(){
this.dataNeedsRefresh.emit();
}
get hoveringOverParent(){
if(!this.overContainerId) return false;
const child = this._findTocEntryById(this.overContainerId, this.parentLink.subEntries);
if(!child) return false;
return true;
}
// get hoveringOverParent(){
// if(!this.overContainerId) return false;
// const child = this._findTocEntryById(this.overContainerId, this.parentLink.subEntries);
// if(!child) return false;
// return true;
// }
private _findTocEntryById(id: string, tocentries: ToCEntry[]): ToCEntry{
public _findTocEntryById(id: string, tocentries: ToCEntry[]): ToCEntry{
if(!tocentries){
return null;
}

View File

@ -1,16 +1,14 @@
<div class="">
<div>
<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)"
(newEntry)="addNewEntry($event)" (removeEntry)="deleteEntry($event)"
(removeEntry)="deleteEntry($event)"
(createFooEntry)="createNewEntry($event)"
[parentLink]="{ subEntriesType: tocEntryType.Page, subEntries : links , id: ROOT_ID}"
[itemSelected]="itemSelected"
[viewOnly]="viewOnly"
(dataNeedsRefresh)="onDataNeedsRefresh()"
[dropListGroup]="[]"
[DRAGULA_ITEM_ID_PREFIX]="DRAGULA_ITEM_ID_PREFIX"
[overContainerId]="overcontainer"
[isDragging]="isDragging"

View File

@ -1,33 +1,3 @@
.docs-toc-container {
width: 100%;
padding: 5px 0 10px 0px;
// cursor: pointer;
// border-left: solid 4px #0c7489;
.scroll-container {
// overflow-y: auto;
max-height: 60vh;
overflow-y: scroll;
// calc(100vh - 250px)
// height: calc(100vh - 250px);
}
.docs-link {
color: rgba(0, 0, 0, 0.54);
// color: mat-color($app-blue-theme-foreground, secondary-text);
transition: color 100ms;
&:hover,
&.docs-active {
.link-name {
background-color: #ececec;
border-radius: 6px;
// color: #0c7489;
}
// color: mat-color($primary, if($is-dark-theme, 200, default));
}
}
}
.scroll-container {
// overflow-y: auto;
@ -35,82 +5,32 @@
overflow-y: scroll;
padding-left: .2em;
padding-right: 1em;
// padding-right: 0em 1em;
// calc(100vh - 250px)
// height: calc(100vh - 250px);
}
.docs-toc-heading {
margin: 0;
padding: 0;
font-size: 13px;
font-weight: bold;
}
span {
line-height: 16px;
margin: 6px 0 0;
position: relative;
text-decoration: none;
display: block;
overflow: hidden;
color: #21212194;
font-weight: 400;
max-width: 290px;
min-width: 290px;
padding: 0rem .4rem;
span {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: inline-block;
width: 100%;
}
}
.selected {
color: #212121 !important;
font-weight: 700 !important;
opacity: 1 !important;
}
// .docs-level-mat-expansion-panel {
// margin-left: 12px;
// #style-6::-webkit-scrollbar-track
// {
// -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
// background-color: #F5F5F5;
// }
.docs-level-h5 {
margin-left: 24px;
}
#style-6::-webkit-scrollbar-track
{
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
background-color: #F5F5F5;
}
#style-6::-webkit-scrollbar
{
width: 6px;
background-color: #F5F5F5;
}
#style-6::-webkit-scrollbar-thumb
{
background-color: rgb(162, 163, 163);
background-image: -webkit-linear-gradient(45deg,
rgba(255, 255, 255, .2) 25%,
transparent 25%,
transparent 50%,
rgba(255, 255, 255, .2) 50%,
rgba(255, 255, 255, .2) 75%,
transparent 75%,
transparent)
}
// #style-6::-webkit-scrollbar
// {
// width: 6px;
// background-color: #F5F5F5;
// }
// #style-6::-webkit-scrollbar-thumb
// {
// background-color: rgb(162, 163, 163);
// background-image: -webkit-linear-gradient(45deg,
// rgba(255, 255, 255, .2) 25%,
// transparent 25%,
// transparent 50%,
// rgba(255, 255, 255, .2) 50%,
// rgba(255, 255, 255, .2) 75%,
// transparent 75%,
// transparent)
// }
#tocentrytable::-webkit-scrollbar-track

View File

@ -5,29 +5,13 @@ import { interval, Subject, Subscription } from 'rxjs';
import { distinctUntilChanged } from 'rxjs/operators';
import { type } from 'os';
import { SimpleChanges } from '@angular/core';
import { Foo, TableUpdateInfo, ToCEntry, ToCEntryType } from './table-of-contents-entry';
import { NewEntryType, TableUpdateInfo, ToCEntry, ToCEntryType } from './table-of-contents-entry';
import { DragulaService } from 'ng2-dragula';
import { FormArray } from '@angular/forms';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material';
import { TranslateService } from '@ngx-translate/core';
import { ContentObserver } from '@angular/cdk/observers';
// export interface Link {
// /* id of the section*/
// id: string;
// /* header type h3/h4 */
// type: string;
// /* If the anchor is in view of the page */
// active: boolean;
// /* name of the anchor */
// name: string;
// /* top offset px of the anchor */
// top: number;
// page: number;
// section: number;
// show: boolean;
// selected: boolean;
// }
@Component({
selector: 'dataset-profile-table-of-contents',
@ -37,41 +21,26 @@ import { ContentObserver } from '@angular/cdk/observers';
export class DatasetProfileTableOfContents extends BaseComponent implements OnInit {
@Input() links: ToCEntry[];
@Output() itemClick = new EventEmitter<ToCEntry>();
@Output() newEntry = new EventEmitter<ToCEntry>();
@Output() removeEntry = new EventEmitter<ToCEntry>();
@Output() createEntry = new EventEmitter<Foo>();//TODO
@Output() dataNeedsRefresh = new EventEmitter<TableUpdateInfo>();
@Input() itemSelected: ToCEntry;
@Input() colorizeInvalid: boolean = false;
// @Input() set itemSelected(entry:ToCEntry){
// this._itemSelected = entry;
// };
// get itemSelected():ToCEntry{
// return this._itemSelected;
// }
// private _itemSelected:ToCEntry;
@Input() viewOnly: boolean;
show: boolean = false;
@Output() itemClick = new EventEmitter<ToCEntry>();
// @Output() newEntry = new EventEmitter<ToCEntry>();
@Output() removeEntry = new EventEmitter<ToCEntry>();
@Output() createEntry = new EventEmitter<NewEntryType>();
@Output() dataNeedsRefresh = new EventEmitter<TableUpdateInfo>();
isDragging: boolean = false;
draggingItemId: string = null;
tocEntryType = ToCEntryType;
DRAGULA_ITEM_ID_PREFIX="table_item_id_";
ROOT_ID: string = "ROOT_ID";//no special meaning
private _dragStartedAt;
private VALID_DROP_TIME = 500;//ms
overcontainer: string = null;
constructor(
@Inject(DOCUMENT) private _document: Document,
@ -80,8 +49,6 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
private language: TranslateService
) {
super();
if(this.dragulaService.find('TABLEDRAG')){
this.dragulaService.destroy('TABLEDRAG');
@ -117,7 +84,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
if(!(elementId && targetId && sourceId)){
console.error('Elements not have an id');
console.info('Elements do not have an id');
this.dataNeedsRefresh.emit();
return;
}
@ -128,7 +95,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
const sourceContainer:ToCEntry = this._findTocEntryById(sourceId, this.links);
if(!(element && (targetContainer ||((element.type===ToCEntryType.Page) && (targetId === this.ROOT_ID))) && (sourceContainer||((element.type===ToCEntryType.Page) && (sourceId === this.ROOT_ID))))){
console.info('Could not find elements');
// console.info('Could not find elements');
this.dataNeedsRefresh.emit();
drake.cancel(true);
return;
@ -140,7 +107,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
if(targetContainer.type != this.tocEntryType.Section){
// const message = 'Fieldset can only be child of Subsections';
const message = this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.FIELDSET-MUST-HAVE-PARENT-SECTION');
console.error(message);
// console.error(message);
this.notifyUser(message)
this.dataNeedsRefresh.emit();
return;
@ -151,7 +118,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
// const message = 'Cannot have inputs and sections on the same level';
const message = this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.INPUT-SECTION-SAME-LEVEL');
this.notifyUser(message);
console.error(message);
// console.error(message);
this.dataNeedsRefresh.emit();
return;
}
@ -161,7 +128,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
const sourceFieldsets = sourceContainer.form.get('fieldSets') as FormArray;
if(!targetFieldsets){
console.error('Not target fieldsets container found');
console.info('Not target fieldsets container found');
this.dataNeedsRefresh.emit();
return;
}
@ -229,7 +196,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
// const message = 'Cannot have inputs and sections on the same level';
const message = this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.INPUT-SECTION-SAME-LEVEL');;
this.notifyUser(message);
console.info(message);
// console.info(message);
this.dataNeedsRefresh.emit();
return;
}
@ -364,7 +331,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
// const message = 'Drag not support to specific container';
const message = this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.DRAG-NOT-SUPPORTED');
this.notifyUser(message);
console.info(message);
// console.info(message);
this.dataNeedsRefresh.emit();
return;
}
@ -379,7 +346,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
// const message = 'A page element can only be at top level';
const message = this.language.instant('DATASET-PROFILE-EDITOR.STEPS.FORM.TABLE-OF-CONTENTS.ERROR-MESSAGES.PAGE-ELEMENT-ONLY-TOP-LEVEL');
this.notifyUser(message);
console.info(message);
// console.info(message);
this.dataNeedsRefresh.emit();
return;
}
@ -446,7 +413,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
}
default:
console.error('Could not support moving objects for specific type of element');
console.info('Could not support moving objects for specific type of element');
this.dataNeedsRefresh.emit();
return;
@ -456,7 +423,7 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
drake.on('drag',(el,source)=>{
this._dragStartedAt = new Date().getTime();
console.log('drag fired');
// console.log('drag fired');
this.isDragging = true;
this.draggingItemId = (el.id as string).replace(this.DRAGULA_ITEM_ID_PREFIX, '');
@ -484,10 +451,6 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
}
overcontainer: string = null;
private _scrollIntoDragginItem(id: string){
// const table = document.getElementById('tocentrytable');
@ -561,23 +524,15 @@ export class DatasetProfileTableOfContents extends BaseComponent implements OnIn
this.itemClick.emit(item);
}
// propagateClickToParent(childIds:ToCEntry[], currentItem: ToCEntry){
// childIds.push(currentItem);
// this.itemClick.emit(childIds);
// addNewEntry(tce: ToCEntry){
// this.newEntry.emit(tce);
// }
addNewEntry(tce: ToCEntry){
this.newEntry.emit(tce);
}
deleteEntry(currentLink: ToCEntry){
this.removeEntry.emit(currentLink);
}
createNewEntry(foo: Foo){
this.createEntry.emit(foo);
createNewEntry(newEntry: NewEntryType){
this.createEntry.emit(newEntry);
}
onDataNeedsRefresh(){
this.dataNeedsRefresh.emit();

View File

@ -33,7 +33,7 @@
}
}
::ng-deep .mat-paginator-container {
:host ::ng-deep .mat-paginator-container {
flex-direction: row-reverse !important;
justify-content: space-between !important;
background-color: #f6f6f6;
@ -41,25 +41,25 @@
min-height: 30px !important;
}
::ng-deep .mat-paginator-page-size {
:host ::ng-deep .mat-paginator-page-size {
height: 43px;
}
::ng-deep .mat-paginator-range-label {
:host ::ng-deep .mat-paginator-range-label {
margin: 15px 32px 0 24px !important;
}
::ng-deep .mat-paginator-range-actions {
:host ::ng-deep .mat-paginator-range-actions {
width: 55% !important;
min-height: 43px !important;
justify-content: space-between;
}
::ng-deep .mat-paginator-navigation-previous {
:host ::ng-deep .mat-paginator-navigation-previous {
margin-left: auto !important;
}
::ng-deep .mat-icon-button {
:host ::ng-deep .mat-icon-button {
height: 30px !important;
font-size: 12px !important;
}

View File

@ -59,7 +59,7 @@
}
}
::ng-deep .mat-paginator-container {
:host ::ng-deep .mat-paginator-container {
// flex-direction: row-reverse !important;
// justify-content: space-between !important;
// height: 30px;

View File

@ -199,11 +199,11 @@
padding-bottom: 0 !important;
}
::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix {
:host ::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix {
padding: 0.3rem 0rem 0.6rem 0rem !important;
}
::ng-deep .mat-paginator-container {
:host ::ng-deep .mat-paginator-container {
flex-direction: row-reverse !important;
justify-content: space-between !important;
background-color: #f6f6f6;
@ -211,27 +211,27 @@
min-height: 30px !important;
}
::ng-deep .mat-paginator-page-size {
:host ::ng-deep .mat-paginator-page-size {
height: 43px;
}
::ng-deep .mat-icon-button {
:host ::ng-deep .mat-icon-button {
height: 30px !important;
font-size: 12px !important;
}
::ng-deep .mat-paginator-range-label {
:host ::ng-deep .mat-paginator-range-label {
margin: 15px 32px 0 24px !important;
}
::ng-deep .mat-paginator-range-actions {
:host ::ng-deep .mat-paginator-range-actions {
width: auto !important;
min-width: 55% !important;
min-height: 43px !important;
justify-content: space-between;
}
::ng-deep .mat-paginator-navigation-previous {
:host ::ng-deep .mat-paginator-navigation-previous {
margin-left: auto !important;
}

View File

@ -6,12 +6,12 @@
.lightblue-btn {
font-size: 12px;
}
::ng-deep .mat-paginator-container {
:host ::ng-deep .mat-paginator-container {
height: auto !important;
}
}
::ng-deep .mat-paginator-container {
:host ::ng-deep .mat-paginator-container {
flex-direction: row-reverse !important;
justify-content: space-between !important;
background-color: #f6f6f6;
@ -19,7 +19,7 @@
min-height: 30px !important;
}
::ng-deep .mat-paginator-page-size {
:host ::ng-deep .mat-paginator-page-size {
height: 43px;
}
@ -28,18 +28,18 @@
font-size: 12px !important;
}
::ng-deep .mat-paginator-range-label {
:host ::ng-deep .mat-paginator-range-label {
margin: 15px 32px 0 24px !important;
}
::ng-deep .mat-paginator-range-actions {
:host ::ng-deep .mat-paginator-range-actions {
width: auto !important;
min-width: 55% !important;
min-height: 43px !important;
justify-content: space-between;
}
::ng-deep .mat-paginator-navigation-previous {
:host ::ng-deep .mat-paginator-navigation-previous {
margin-left: auto !important;
}
@ -256,7 +256,7 @@
padding-bottom: 0 !important;
}
::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix {
:host::ng-deep .mat-form-field-appearance-outline .mat-form-field-infix {
padding: 0.3rem 0rem 0.6rem 0rem !important;
}

View File

@ -335,8 +335,8 @@ export class FormFieldComponent extends BaseComponent implements OnInit {
this.multipleAutoCompleteConfiguration = {
filterFn: myfunc.bind(this),
initialItems: (extraData) => myfunc(''),
displayFn: (item) => { try{return typeof (item) == 'string' ? JSON.parse(item)['label'] : item['label']}catch{return''}},
titleFn: (item) => { try{return typeof (item) == 'string' ? JSON.parse(item)['label'] : item['label']}catch{return''}},
displayFn: (item) => { try{return typeof (item) == 'string' ? JSON.parse(item)[title] : item[title]}catch{return''}},
titleFn: (item) => { try{return typeof (item) == 'string' ? JSON.parse(item)[title] : item[title]}catch{return''}},
valueAssign: (item) => { try{return typeof (item) == 'string' ? item : JSON.stringify(item)}catch{return''}},
subtitleFn: (item) => { try{return item[subtitle]}catch{return''}}
}
@ -384,6 +384,9 @@ export class FormFieldComponent extends BaseComponent implements OnInit {
}
parseTags() {
try{
let stringValue = this.form.get('value').value;
if (typeof stringValue === 'string') {
stringValue = (<string>stringValue).replace(new RegExp('{', 'g'), '{"').replace(new RegExp('=', 'g'), '":"').replace(new RegExp(',', 'g'), '",').replace(new RegExp(', ', 'g'), ', "').replace(new RegExp('}', 'g'), '"}');
@ -397,6 +400,9 @@ export class FormFieldComponent extends BaseComponent implements OnInit {
}
const tagArray = JSON.parse(stringValue);
this.form.patchValue({'value': tagArray});
}catch(e){
console.warn('Could not parse tags');
}
}
filterTags(value: string): Observable<ExternalSourceItemModel[]> {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "then show Field With Id",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "then show Field With Id",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "entonces muestra el campo con identificación",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "τότε δείξε το Πεδίο με ταυτοποίηση",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "então mostrar Campo com o Id",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "then show Field With Id",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "tada prikazati polje sa Id",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -468,6 +468,10 @@
"RULE-THEN": "sonra alanı kimliği ile göster",
"FIELDSETS": "Questions",
"FIELDS":"Inputs"
},
"HINTS":{
"ELEMENT-CHILD-OF-TARGET":"This element is parent of selected input.",
"ELEMENT-HIDDEN-FROM-ELEMENT":"This element hides the element or a parent element of the input you are trying to apply visibility rule from."
}
},
"FORM-VALIDATION":{
@ -515,11 +519,14 @@
"FIELDSET": {
"ADD-INPUT": "Add new input",
"COMMENT-FIELD": "Comment field",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the givven question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the givven question.",
"INCLUDE-COMMENT-FIELD": "A comment field input is appended to the given question.",
"ENABLE-MULTIPLICITY": "User may provide more than one answer to the given question.",
"MULTIPLICITY": "Multiplicity",
"MORE": "More.."
}
},
"FEEDBACK-MESSAGES":{
"SAVE-SUCCESS":"Changes were saved successfully."
}
},
"GRANT-LISTING": {

View File

@ -180,7 +180,7 @@
<div class="options-menu" id="options-menu">
<div class="row">
<div class="col-7">
<div class="col-12 col-md-7">
<ul class="nav nav-tabs">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" id="multiple-navigation-1" data-img-fragment href="#create_and_add">Create & Add</a>
@ -280,7 +280,7 @@
</div>
</div>
<!-- Images -->
<div class="col">
<div class="col" style="min-height: 20em;">
<img src="../assets/img/3_dmp_editor.png" class="img-fragment-step opacity-1 img-sharp" id="img-fragment-dmp-editor" alt="DMP editor">
<img src="../assets/img/dmp_out.png" class="img-fragment-step img-sharp" id="img-fragment-dmp-out" alt="DMP outputs">
<img src="../assets/img/4_dataset_editor.png" class="img-fragment-step img-sharp" id="img-fragment-dataset-editor" alt="Dataset editor">