MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Merge branch 'AdminTemplateRedesign' into WizardDescriptionRefactor

This commit is contained in:
Kristian Ntavidi 2021-04-05 12:07:33 +03:00
parent ee1c09149e 450dbb519f
commit 6e70071a16
11 changed files with 162 additions and 143 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
dmp-frontend/src/app/ui/admin/dataset-profile/dataset-profile.module.ts
View File

@ -53,6 +53,7 @@ import {DragulaModule} from 'ng2-dragula';
//matrial //matrial
import {MatBadgeModule} from '@angular/material/badge'; import {MatBadgeModule} from '@angular/material/badge';
import { DatasetProfileEditorSectionFieldSetComponent } from './editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component'; import { DatasetProfileEditorSectionFieldSetComponent } from './editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component';
import { FinalPreviewComponent } from './editor/components/final-preview/final-preview.component';
@NgModule({ @NgModule({
imports: [ imports: [
@ -106,12 +107,12 @@ import { DatasetProfileEditorSectionFieldSetComponent } from './editor/component
DatasetProfileEditorValidatorFieldComponent, DatasetProfileEditorValidatorFieldComponent,
DatasetProfileTableOfContents, DatasetProfileTableOfContents,
DatasetProfileTableOfContentsInternalSection, DatasetProfileTableOfContentsInternalSection,
DatasetProfileEditorSectionFieldSetComponent DatasetProfileEditorSectionFieldSetComponent,
FinalPreviewComponent
], ],
entryComponents: [ entryComponents: [
DialogConfirmationUploadDatasetProfiles DialogConfirmationUploadDatasetProfiles
], ]
providers:[VisibilityRulesService]
}) })
export class DatasetProfileModule { } export class DatasetProfileModule { }

6
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.ts
View File

@ -209,7 +209,11 @@ export class DatasetProfileEditorCompositeFieldComponent implements OnInit, OnCh
multiplicity: {max:formValue.multiplicity.max, min : formValue.multiplicity.min}, multiplicity: {max:formValue.multiplicity.max, min : formValue.multiplicity.min},
multiplicityItems:null, multiplicityItems:null,
fields: fields.map(editorField=>{ fields: fields.map(editorField=>{
return new DatasetDescriptionFieldEditorModel().fromModel(editorField); const model = new DatasetDescriptionFieldEditorModel().fromModel(editorField);
if(model.viewStyle.renderStyle === this.viewStyleEnum.CheckBox){
model.value = model.value?"true":"false";//patch
}
return model;
}) })
} }

8
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.html
View File

@ -251,11 +251,11 @@
<!-- PREVIEW --> <!-- PREVIEW -->
<ng-container *ngIf="false"> <!-- <ng-container *ngIf="false">
<div class="row"> <div class="row">
<div class="col-12" *ngIf="expandView && previewForm"> <div class="col-12" *ngIf="expandView && previewForm">
<span style="font-weight: bold">{{'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span> <span style="font-weight: bold">{{'DATASET-PROFILE-EDITOR.ACTIONS.FIELD.PREVIEW' | translate}}</span>
</div> </div> -->
<!-- <div class="col-12"> <!-- <div class="col-12">
<mat-radio-group [(ngModel)]="showPreview"> <mat-radio-group [(ngModel)]="showPreview">
<mat-radio-button [value]="true">Yes</mat-radio-button> <mat-radio-button [value]="true">Yes</mat-radio-button>
@ -263,7 +263,7 @@
</mat-radio-group> </mat-radio-group>
</div> --> </div> -->
<!--
<div class="col-12" *ngIf="showPreview"> <div class="col-12" *ngIf="showPreview">
<ng-container *ngIf="viewType === viewTypeEnum.Other else regularField"> <ng-container *ngIf="viewType === viewTypeEnum.Other else regularField">
<app-form-field [form]="previewForm" *ngIf="previewForm" [autocompleteOptions]="form.get('data').get('autoCompleteSingleDataList').getRawValue()"> <app-form-field [form]="previewForm" *ngIf="previewForm" [autocompleteOptions]="form.get('data').get('autoCompleteSingleDataList').getRawValue()">
@ -283,7 +283,7 @@
</em> </em>
</div> </div>
</div> </div>
</ng-container> </ng-container> -->
<!-- {{form.touched|json}} --> <!-- {{form.touched|json}} -->
<!-- {{form.value |json}} --> <!-- {{form.value |json}} -->

156
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.ts
View File

@ -58,9 +58,8 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
viewType: ViewStyleType; viewType: ViewStyleType;
viewTypeEnum = ViewStyleType; viewTypeEnum = ViewStyleType;
private subject$:Subject<DatasetDescriptionFieldEditorModel> = new Subject<DatasetDescriptionFieldEditorModel>(); // private subject$:Subject<DatasetDescriptionFieldEditorModel> = new Subject<DatasetDescriptionFieldEditorModel>();
private myCustomValidators = new EditorCustomValidators();
@Input() expandView: boolean = true; @Input() expandView: boolean = true;
@ -85,9 +84,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
ngOnInit() { ngOnInit() {
this.subject$.pipe(takeUntil(this._destroyed)).pipe(debounceTime(600)).subscribe(model=>{ // this.subject$.pipe(takeUntil(this._destroyed)).pipe(debounceTime(600)).subscribe(model=>{
this.previewForm = model.buildForm(); // this.previewForm = model.buildForm();
}); // });
@ -168,7 +167,7 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
} }
this.showPreview = true; // this.showPreview = true;
@ -297,88 +296,88 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
private _formChangesSubscription:Subscription; private _formChangesSubscription:Subscription;
private _showPreview: boolean = false;; private _showPreview: boolean = false;;
get showPreview(): boolean{ // get showPreview(): boolean{
return this._showPreview; // return this._showPreview;
} // }
set showPreview(value:boolean){ // set showPreview(value:boolean){
if(value == false){//hide preview // if(value == false){//hide preview
//close subsciption // //close subsciption
if(this._formChangesSubscription){ // if(this._formChangesSubscription){
this._formChangesSubscription.unsubscribe(); // this._formChangesSubscription.unsubscribe();
this._formChangesSubscription = null; // this._formChangesSubscription = null;
} // }
} // }
if(value == true){ // if(value == true){
//value is already true // //value is already true
if(this._showPreview){ // if(this._showPreview){
if(this._formChangesSubscription){ // if(this._formChangesSubscription){
this._formChangesSubscription.unsubscribe(); // this._formChangesSubscription.unsubscribe();
this._formChangesSubscription = null; // this._formChangesSubscription = null;
} // }
} // }
//initialize // //initialize
if(this.form.get('viewStyle').get('renderStyle').value){ // if(this.form.get('viewStyle').get('renderStyle').value){
this._generatePreviewForm(); // this._generatePreviewForm();
} // }
this._formChangesSubscription = this.form.valueChanges.subscribe(()=>{ // this._formChangesSubscription = this.form.valueChanges.subscribe(()=>{
this._generatePreviewForm(); // this._generatePreviewForm();
}); // });
} // }
this._showPreview = value; // this._showPreview = value;
} // }
previewForm: FormGroup; // previewForm: FormGroup;
private _generatePreviewForm(){ // private _generatePreviewForm(){
if(!this.form.get('data')){ // if(!this.form.get('data')){
return; // return;
} // }
this.previewForm = null; // this.previewForm = null;
const fieldEditorModel = new DatasetDescriptionFieldEditorModel(); // const fieldEditorModel = new DatasetDescriptionFieldEditorModel();
fieldEditorModel.viewStyle= { // fieldEditorModel.viewStyle= {
renderStyle: this.form.get('viewStyle').get('renderStyle').value, // renderStyle: this.form.get('viewStyle').get('renderStyle').value,
cssClass: null // cssClass: null
}; // };
fieldEditorModel.data = (this.form.get('data') as FormGroup).getRawValue(); // fieldEditorModel.data = (this.form.get('data') as FormGroup).getRawValue();
fieldEditorModel.value = this.form.get('defaultValue').get('value').value; // fieldEditorModel.value = this.form.get('defaultValue').get('value').value;
fieldEditorModel.validationRequired = (this.form.get('validations').value as Array<ValidationType>).includes(ValidationType.Required); // fieldEditorModel.validationRequired = (this.form.get('validations').value as Array<ValidationType>).includes(ValidationType.Required);
if(this.form.get('viewStyle').get('renderStyle').value == DatasetProfileFieldViewStyle.CheckBox){ // if(this.form.get('viewStyle').get('renderStyle').value == DatasetProfileFieldViewStyle.CheckBox){
fieldEditorModel.value = this.form.get('defaultValue').get('value').value === 'true'; // fieldEditorModel.value = this.form.get('defaultValue').get('value').value === 'true';
} // }
// if(this.form.get('viewStyle').get('renderStyle').value == DatasetProfileFieldViewStyle.Researchers){ // // if(this.form.get('viewStyle').get('renderStyle').value == DatasetProfileFieldViewStyle.Researchers){
// fieldEditorModel.data = new ResearchersAutoCompleteFieldDataEditorModel().buildForm().getRawValue(); // // fieldEditorModel.data = new ResearchersAutoCompleteFieldDataEditorModel().buildForm().getRawValue();
// } // // }
if(fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.Validation || (fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.DatasetIdentifier) // if(fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.Validation || (fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.DatasetIdentifier)
|| (fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.Tags) // || (fieldEditorModel.viewStyle.renderStyle === DatasetProfileFieldViewStyle.Tags)
){ // ){
fieldEditorModel.value = null; // fieldEditorModel.value = null;
} // }
// const myTicket = Guid.create().toString(); // // const myTicket = Guid.create().toString();
// this.validTicket = myTicket; // // this.validTicket = myTicket;
// setTimeout(() => { //TODO // // setTimeout(() => { //TODO
// //user hasnt make any new change to inputs /show preview // // //user hasnt make any new change to inputs /show preview
// if(myTicket === this.validTicket){ // // if(myTicket === this.validTicket){
// this.previewForm = fieldEditorModel.buildForm(); // // this.previewForm = fieldEditorModel.buildForm();
// } // // }
// }, 600); // // }, 600);
this.subject$.next(fieldEditorModel); // this.subject$.next(fieldEditorModel);
// setTimeout(() => { // // setTimeout(() => {
// this.previewForm = fieldEditorModel.buildForm(); // // this.previewForm = fieldEditorModel.buildForm();
// }); // // });
}; // };
get canApplyVisibility():boolean{ get canApplyVisibility():boolean{
@ -429,12 +428,13 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
const x = this.viewType; const x = this.viewType;
this.showPreview = false; // this.showPreview = false;
const field: Field = this.form.getRawValue(); const field: Field = this.form.getRawValue();
field.defaultValue = {type:null, value: null}; // field.defaultValue = {type:null, value: null};
field.defaultValue = undefined;
if(!this.canApplyVisibility){ if(!this.canApplyVisibility){
field.visible.rules = []; field.visible.rules = [];
} }
@ -792,9 +792,9 @@ export class DatasetProfileEditorFieldComponent extends BaseComponent implements
} }
setTimeout(() => { //TODO // setTimeout(() => { //TODO
this.showPreview = true; // this.showPreview = true;
}); // });
} }

3
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/final-preview/final-preview.component.html Normal file
View File

@ -0,0 +1,3 @@
<app-dataset-description [form]="formGroup" [visibilityRules]="visibilityRules" *ngIf="formGroup">
</app-dataset-description>

0
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/final-preview/final-preview.component.scss Normal file
View File

28
dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/final-preview/final-preview.component.ts Normal file
View File

@ -0,0 +1,28 @@
import { Component, Input, OnInit} from '@angular/core';
import { Rule } from '@app/core/model/dataset-profile-definition/rule';
import { VisibilityRulesService } from '@app/ui/misc/dataset-description-form/visibility-rules/visibility-rules.service';
@Component({
selector: 'app-final-preview-component',
templateUrl: './final-preview.component.html',
styleUrls: ['./final-preview.component.scss'],
providers:[VisibilityRulesService]
})
export class FinalPreviewComponent implements OnInit {
@Input() formGroup = null;
@Input() visibilityRules:Rule[] = [];
constructor(private visibilityRulesService: VisibilityRulesService){
}
ngOnInit(): void {
this.visibilityRulesService.buildVisibilityRules(this.visibilityRules, this.formGroup);
}
}

9
dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.html
View File

@ -395,9 +395,16 @@
<!-- {{'DATASET-PROFILE-EDITOR.ACTIONS.PREVIEW-AND-FINALIZE' | translate}} --> <!-- {{'DATASET-PROFILE-EDITOR.ACTIONS.PREVIEW-AND-FINALIZE' | translate}} -->
<!-- <button (click)="generatePreviewForm()">foo</button> --> <!-- <button (click)="generatePreviewForm()">foo</button> -->
<ng-container *ngIf="formGroup"> <ng-container *ngIf="formGroup">
<app-final-preview-component [formGroup]="formGroup" [visibilityRules]="visibilityRules">
</app-final-preview-component>
<!--
<app-dataset-description [form]="formGroup" [visibilityRules]="visibilityRules" *ngIf="formGroup"> <app-dataset-description [form]="formGroup" [visibilityRules]="visibilityRules" *ngIf="formGroup">
</app-dataset-description> </app-dataset-description> -->
</ng-container> </ng-container>
</mat-step> </mat-step>

51
dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.ts
View File

@ -53,7 +53,8 @@ const skipDisable: any[] = require('../../../../../assets/resources/skipDisable.
selector: 'app-dataset-profile-editor-component', selector: 'app-dataset-profile-editor-component',
templateUrl: './dataset-profile-editor.component.html', templateUrl: './dataset-profile-editor.component.html',
styleUrls: ['./dataset-profile-editor.component.scss'], styleUrls: ['./dataset-profile-editor.component.scss'],
animations:[...STEPPER_ANIMATIONS] animations:[...STEPPER_ANIMATIONS],
providers:[VisibilityRulesService]
}) })
export class DatasetProfileEditorComponent extends BaseComponent implements OnInit { export class DatasetProfileEditorComponent extends BaseComponent implements OnInit {
@ -879,54 +880,6 @@ export class DatasetProfileEditorComponent extends BaseComponent implements OnIn
} }
// private customFieldValidator(): ValidatorFn{
// return (control):ValidationErrors | null=>{
// DatasetProfileFieldViewStyle
// switch(control.get('viewStyle').get('renderStyle').value){
// case DatasetProfileFieldViewStyle.TextArea:
// return null;
// case DatasetProfileFieldViewStyle.BooleanDecision:
// return null;
// case DatasetProfileFieldViewStyle.ComboBox:
// return null;
// case DatasetProfileFieldViewStyle.CheckBox:
// return null;
// case DatasetProfileFieldViewStyle.FreeText:
// return null;
// case DatasetProfileFieldViewStyle.RadioBox:
// return null;
// case DatasetProfileFieldViewStyle.DatePicker:
// return null;
// case DatasetProfileFieldViewStyle.InternalDmpEntities:
// return null;
// case DatasetProfileFieldViewStyle.ExternalDatasets:
// return null;
// case DatasetProfileFieldViewStyle.DataRepositories:
// return null;
// case DatasetProfileFieldViewStyle.Registries:
// return null;
// case DatasetProfileFieldViewStyle.Services:
// return null;
// case DatasetProfileFieldViewStyle.Tags:
// return null;
// case DatasetProfileFieldViewStyle.Researchers:
// return null;
// case DatasetProfileFieldViewStyle.Organizations:
// return null;
// case DatasetProfileFieldViewStyle.DatasetIdentifier:
// return null;
// case DatasetProfileFieldViewStyle.Currency:
// return null;
// case DatasetProfileFieldViewStyle.Validation:
// return null;
// default:
// return {inputTypeNotValid: true};
// }
// }
// }
onRemoveEntry(tce: ToCEntry){ onRemoveEntry(tce: ToCEntry){
const dialogRef = this.dialog.open(ConfirmationDialogComponent, { const dialogRef = this.dialog.open(ConfirmationDialogComponent, {

12
dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-field/form-field.component.ts
View File

@ -253,14 +253,14 @@ export class FormFieldComponent extends BaseComponent implements OnInit {
this.form.get('value').valueChanges this.form.get('value').valueChanges
.pipe(takeUntil(this._destroyed)) .pipe(takeUntil(this._destroyed))
.subscribe(item => { .subscribe(item => {
if (this.form.get('viewStyle').value.renderStyle === DatasetProfileFieldViewStyle.ComboBox && this.form.get('data').value.type === DatasetProfileComboBoxType.WordList && this.form.get('data').value.multiList) { // if (this.form.get('viewStyle').value.renderStyle === DatasetProfileFieldViewStyle.ComboBox && this.form.get('data').value.type === DatasetProfileComboBoxType.WordList && this.form.get('data').value.multiList) {
item.forEach(element => { // item.forEach(element => {
this.visibilityRulesService.updateValueAndVisibility(this.form.get('id').value, element); // this.visibilityRulesService.updateValueAndVisibility(this.form.get('id').value, element);
}); // });
} else { // } else {
this.visibilityRulesService.updateValueAndVisibility(this.form.get('id').value, item); this.visibilityRulesService.updateValueAndVisibility(this.form.get('id').value, item);
} // }
}); });
} }

25
dmp-frontend/src/app/ui/misc/dataset-description-form/visibility-rules/visibility-rules.service.ts
View File

@ -1,5 +1,6 @@
import { ApplicationRef, Injectable, NgZone } from '@angular/core'; import { ApplicationRef, Injectable, NgZone } from '@angular/core';
import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms'; import { AbstractControl, FormArray, FormControl, FormGroup } from '@angular/forms';
import { DatasetProfileFieldViewStyle } from '@app/core/common/enum/dataset-profile-field-view-style';
import { isNumeric } from 'rxjs/internal/util/isNumeric'; import { isNumeric } from 'rxjs/internal/util/isNumeric';
import { Rule } from '../../../../core/model/dataset-profile-definition/rule'; import { Rule } from '../../../../core/model/dataset-profile-definition/rule';
import { VisibilityRule } from './models/visibility-rule'; import { VisibilityRule } from './models/visibility-rule';
@ -38,6 +39,22 @@ export class VisibilityRulesService {
} }
private evaluateVisibility(visibilityRule: VisibilityRule, value: any) { private evaluateVisibility(visibilityRule: VisibilityRule, value: any) {
if (value instanceof Array){
const parsedSourceControlValues = visibilityRule.sourceVisibilityRules.map(e=>this.parseValue(e.sourceControlValue));
const parsedValues = value.map(e=>this.parseValue(e));
const isVisible = parsedValues.map(v=>parsedSourceControlValues.includes(v)).reduce((acc,current)=> acc|| current, false);
if(isVisible){
this.elementVisibilityMap.set(visibilityRule.targetControlId, true);
return;
}
}
for (let i = 0; i < visibilityRule.sourceVisibilityRules.length; i++) { for (let i = 0; i < visibilityRule.sourceVisibilityRules.length; i++) {
if (value != null && (this.parseValue(value) !== this.parseValue(visibilityRule.sourceVisibilityRules[i].sourceControlValue))) { if (value != null && (this.parseValue(value) !== this.parseValue(visibilityRule.sourceVisibilityRules[i].sourceControlValue))) {
this.elementVisibilityMap.set(visibilityRule.targetControlId, false); this.elementVisibilityMap.set(visibilityRule.targetControlId, false);
@ -123,7 +140,13 @@ export class VisibilityRulesService {
} }
private resetFieldFormGroup(formGroup: FormGroup) { private resetFieldFormGroup(formGroup: FormGroup) {
formGroup.get('value').setValue(formGroup.get('defaultValue').value ? this.parseValue(formGroup.get('defaultValue').value.value) : undefined); const renderStyle = formGroup.getRawValue().viewStyle.renderStyle;
if(renderStyle ===DatasetProfileFieldViewStyle.Validation || renderStyle === DatasetProfileFieldViewStyle.DatasetIdentifier){
formGroup.get('value').setValue({identifier:'',type:'' });
}else{
formGroup.get('value').setValue(formGroup.get('defaultValue').value ? this.parseValue(formGroup.get('defaultValue').value.value) : undefined);
}
} }
private resetCompositeFieldFormGroup(formGroup: FormGroup) { private resetCompositeFieldFormGroup(formGroup: FormGroup) {