final description template preview changes
This commit is contained in:
parent
621ddd0aee
commit
f4bf80aeb5
|
@ -98,7 +98,7 @@
|
||||||
<div [id]="'preview_container'+ form.get('id').value" class="w-100" style="margin-right: -15px; margin-left: -15px;">
|
<div [id]="'preview_container'+ form.get('id').value" class="w-100" style="margin-right: -15px; margin-left: -15px;">
|
||||||
<div *ngIf="previewFieldSet && showPreview && firstField?.get('data')?.get('fieldType')?.value" class="row" [@fade-in-fast]>
|
<div *ngIf="previewFieldSet && showPreview && firstField?.get('data')?.get('fieldType')?.value" class="row" [@fade-in-fast]>
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<app-description-form-field-set class="w-100" [propertiesFormGroup]="previewPropertiesFormGroup" [fieldSet]="previewFieldSet"></app-description-form-field-set>
|
<app-description-form-field-set class="w-100" [propertiesFormGroup]="previewPropertiesFormGroup" [fieldSet]="previewFieldSet" [visibilityRulesService]="visibilityRulesService"></app-description-form-field-set>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -79,6 +79,7 @@ export class DescriptionTemplateEditorCompositeFieldComponent extends BaseCompon
|
||||||
public enumUtils: EnumUtils,
|
public enumUtils: EnumUtils,
|
||||||
public datasetProfileService: DescriptionTemplateService,
|
public datasetProfileService: DescriptionTemplateService,
|
||||||
private configurationService: ConfigurationService,
|
private configurationService: ConfigurationService,
|
||||||
|
public visibilityRulesService: VisibilityRulesService
|
||||||
) {
|
) {
|
||||||
super();
|
super();
|
||||||
}
|
}
|
||||||
|
@ -289,6 +290,7 @@ export class DescriptionTemplateEditorCompositeFieldComponent extends BaseCompon
|
||||||
this.previewPropertiesFormGroup = descriptionEditorModel.properties.fieldSets.get(fieldSet.id).buildForm() as UntypedFormGroup;
|
this.previewPropertiesFormGroup = descriptionEditorModel.properties.fieldSets.get(fieldSet.id).buildForm() as UntypedFormGroup;
|
||||||
this.previewFieldSet = fieldSet;
|
this.previewFieldSet = fieldSet;
|
||||||
|
|
||||||
|
this.visibilityRulesService.setContext(mockDescription.descriptionTemplate.definition, this.previewPropertiesFormGroup);
|
||||||
// this.previewSubject$.next(section);
|
// this.previewSubject$.next(section);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -561,10 +563,6 @@ export class DescriptionTemplateEditorCompositeFieldComponent extends BaseCompon
|
||||||
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS: {
|
|
||||||
//TODO: refactor
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS:
|
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS:
|
||||||
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS: {
|
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS: {
|
||||||
const data: DescriptionTemplateLabelAndMultiplicityData = {
|
const data: DescriptionTemplateLabelAndMultiplicityData = {
|
||||||
|
|
|
@ -27,10 +27,10 @@
|
||||||
<mat-error *ngIf="form.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
<mat-error *ngIf="form.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<!-- ComboBox -->
|
<!-- SELECT -->
|
||||||
<mat-form-field class="col-md-12" *ngIf="fieldType === descriptionTemplateFieldTypeEnum.SELECT">
|
<mat-form-field class="col-md-12" *ngIf="fieldType === descriptionTemplateFieldTypeEnum.SELECT">
|
||||||
<mat-label>{{placeHolder}}</mat-label>
|
<mat-label>{{placeHolder}}</mat-label>
|
||||||
<mat-select [formControl]="form" [placeholder]="placeHolder">
|
<mat-select multiple [formControl]="form" [placeholder]="placeHolder">
|
||||||
<mat-option [value]="null">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate }}</mat-option>
|
<mat-option [value]="null">{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.FIELD.DEFAULT-VALUES.NONE' | translate }}</mat-option>
|
||||||
<mat-option *ngFor="let opt of formArrayOptions['controls']" [value]="opt.get('value').value">{{opt.get('label').value}}</mat-option>
|
<mat-option *ngFor="let opt of formArrayOptions['controls']" [value]="opt.get('value').value">{{opt.get('label').value}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
|
|
|
@ -161,10 +161,6 @@ export class DescriptionTemplateEditorFieldComponent extends BaseComponent imple
|
||||||
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS: {
|
|
||||||
//TODO: refactor
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS:
|
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS:
|
||||||
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS:{
|
case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS:{
|
||||||
const data: DescriptionTemplateLabelAndMultiplicityData = {
|
const data: DescriptionTemplateLabelAndMultiplicityData = {
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
<app-description-form *ngIf="formGroup" [propertiesFormGroup]="previewPropertiesFormGroup" [descriptionTemplate]="descriptionTemplate" [visibilityRulesService]="visibilityRulesService"></app-description-form>
|
<app-description-form *ngIf="previewPropertiesFormGroup" [propertiesFormGroup]="previewPropertiesFormGroup" [descriptionTemplate]="descriptionTemplate" [visibilityRulesService]="visibilityRulesService"></app-description-form>
|
|
@ -21,13 +21,20 @@ export class FinalPreviewComponent implements OnInit {
|
||||||
@Input() descriptionTemplatePersist: DescriptionTemplatePersist;
|
@Input() descriptionTemplatePersist: DescriptionTemplatePersist;
|
||||||
descriptionTemplate: DescriptionTemplate;
|
descriptionTemplate: DescriptionTemplate;
|
||||||
|
|
||||||
previewPropertiesFormGroup
|
previewPropertiesFormGroup: UntypedFormGroup;
|
||||||
@Input() formGroup = null;
|
|
||||||
|
|
||||||
constructor(public visibilityRulesService: VisibilityRulesService) {
|
constructor(public visibilityRulesService: VisibilityRulesService) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
this.generatePreviewForm();
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnChanges(changes: SimpleChanges) {
|
||||||
|
if(changes['descriptionTemplatePersist']) this.generatePreviewForm();
|
||||||
|
}
|
||||||
|
|
||||||
private generatePreviewForm() {
|
private generatePreviewForm() {
|
||||||
|
|
||||||
this.descriptionTemplate = this.buildDescriptionTemplate(this.descriptionTemplatePersist);
|
this.descriptionTemplate = this.buildDescriptionTemplate(this.descriptionTemplatePersist);
|
||||||
|
@ -132,12 +139,4 @@ export class FinalPreviewComponent implements OnInit {
|
||||||
return convertedField;
|
return convertedField;
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
this.generatePreviewForm();
|
|
||||||
}
|
|
||||||
|
|
||||||
// ngOnChanges(changes: SimpleChanges) {
|
|
||||||
// if(changes['descriptionTemplatePersist']) this.generatePreviewForm();
|
|
||||||
// }
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,6 +3,7 @@
|
||||||
|
|
||||||
<app-description-template-editor-default-value-component *ngIf="isTextType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
|
<app-description-template-editor-default-value-component *ngIf="isTextType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
|
||||||
<app-description-template-editor-default-value-component *ngIf="isDateType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('dateValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
|
<app-description-template-editor-default-value-component *ngIf="isDateType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('dateValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
|
||||||
|
<app-description-template-editor-default-value-component *ngIf="isTextListType(fieldTypeForCheck)" class="col align-self-center" [fieldType]="fieldTypeForCheck" [form]="ruleFormGroup.get('textListValue')" [formArrayOptions]="formArrayOptionsForCheck" placeHolder="{{'DESCRIPTION-TEMPLATE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-IF'| translate}}" required="true"></app-description-template-editor-default-value-component>
|
||||||
|
|
||||||
<!-- SELECTION -->
|
<!-- SELECTION -->
|
||||||
<mat-form-field class="col align-self-center">
|
<mat-form-field class="col align-self-center">
|
||||||
|
|
|
@ -43,12 +43,12 @@ export class DescriptionTemplateEditorRuleComponent implements OnInit {
|
||||||
return type == DescriptionTemplateFieldType.FREE_TEXT || type == DescriptionTemplateFieldType.CHECK_BOX ||
|
return type == DescriptionTemplateFieldType.FREE_TEXT || type == DescriptionTemplateFieldType.CHECK_BOX ||
|
||||||
type == DescriptionTemplateFieldType.TEXT_AREA || type == DescriptionTemplateFieldType.RICH_TEXT_AREA ||
|
type == DescriptionTemplateFieldType.TEXT_AREA || type == DescriptionTemplateFieldType.RICH_TEXT_AREA ||
|
||||||
type == DescriptionTemplateFieldType.BOOLEAN_DECISION || type == DescriptionTemplateFieldType.RADIO_BOX ||
|
type == DescriptionTemplateFieldType.BOOLEAN_DECISION || type == DescriptionTemplateFieldType.RADIO_BOX ||
|
||||||
type == DescriptionTemplateFieldType.CURRENCY || type == DescriptionTemplateFieldType.SELECT;
|
type == DescriptionTemplateFieldType.CURRENCY;
|
||||||
}
|
}
|
||||||
|
|
||||||
isTextListType(type: DescriptionTemplateFieldType){
|
isTextListType(type: DescriptionTemplateFieldType){
|
||||||
return type == DescriptionTemplateFieldType.TAGS || type == DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS ||
|
return type == DescriptionTemplateFieldType.TAGS || type == DescriptionTemplateFieldType.INTERNAL_ENTRIES_DMPS ||
|
||||||
type == DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS;
|
type == DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS || type == DescriptionTemplateFieldType.SELECT;
|
||||||
}
|
}
|
||||||
|
|
||||||
isDateType(type: DescriptionTemplateFieldType){
|
isDateType(type: DescriptionTemplateFieldType){
|
||||||
|
|
|
@ -268,7 +268,7 @@
|
||||||
<div class="col-9">
|
<div class="col-9">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<div class="col-12">
|
<div class="col-12">
|
||||||
<app-final-preview-component [formGroup]="formGroup" [visibilityRules]="visibilityRules" [descriptionTemplatePersist]="formGroup.getRawValue()">
|
<app-final-preview-component [descriptionTemplatePersist]="finalPreviewDescriptionTemplatePersist">
|
||||||
|
|
||||||
</app-final-preview-component>
|
</app-final-preview-component>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -78,6 +78,7 @@ export class DescriptionTemplateEditorComponent extends BaseEditor<DescriptionTe
|
||||||
//Preview
|
//Preview
|
||||||
previewFieldSet: DescriptionTemplate = null;
|
previewFieldSet: DescriptionTemplate = null;
|
||||||
previewPropertiesFormGroup: UntypedFormGroup = null;
|
previewPropertiesFormGroup: UntypedFormGroup = null;
|
||||||
|
finalPreviewDescriptionTemplatePersist: DescriptionTemplatePersist;
|
||||||
|
|
||||||
protected get canDelete(): boolean {
|
protected get canDelete(): boolean {
|
||||||
return !this.isDeleted && !this.isNew && this.hasPermission(this.authService.permissionEnum.DeleteDescriptionTemplate);
|
return !this.isDeleted && !this.isNew && this.hasPermission(this.authService.permissionEnum.DeleteDescriptionTemplate);
|
||||||
|
@ -391,63 +392,7 @@ export class DescriptionTemplateEditorComponent extends BaseEditor<DescriptionTe
|
||||||
//
|
//
|
||||||
//
|
//
|
||||||
generatePreviewForm() {
|
generatePreviewForm() {
|
||||||
// const formValue: DescriptionTemplatePersist = this.formGroup.getRawValue();
|
this.finalPreviewDescriptionTemplatePersist = this.formGroup.getRawValue();
|
||||||
|
|
||||||
// const fields: DescriptionTemplateField[] = formValue.fields.map(editorField => {
|
|
||||||
// return {
|
|
||||||
// id: editorField.id,
|
|
||||||
// ordinal: editorField.ordinal,
|
|
||||||
// numbering: '',
|
|
||||||
// schematics: editorField.schematics,
|
|
||||||
// defaultValue: editorField.defaultValue,
|
|
||||||
// visibilityRules: editorField.visibilityRules,
|
|
||||||
// validations: editorField.validations,
|
|
||||||
// includeInExport: editorField.includeInExport,
|
|
||||||
// data: editorField.data
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
// const fieldSet: DescriptionTemplateFieldSet = {
|
|
||||||
// id: formValue.id,
|
|
||||||
// ordinal: formValue.ordinal,
|
|
||||||
// numbering: '',
|
|
||||||
// title: formValue.title,
|
|
||||||
// description: formValue.description,
|
|
||||||
// extendedDescription: formValue.extendedDescription,
|
|
||||||
// additionalInformation: formValue.additionalInformation,
|
|
||||||
// multiplicity: {
|
|
||||||
// max: formValue.multiplicity.max, min: formValue.multiplicity.min,
|
|
||||||
// placeholder: formValue.multiplicity.placeholder, tableView: formValue.multiplicity.tableView
|
|
||||||
// },
|
|
||||||
// hasCommentField: formValue.hasCommentField,
|
|
||||||
// fields: fields
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const mockDescription: Description = {
|
|
||||||
// descriptionTemplate: {
|
|
||||||
// definition: {
|
|
||||||
// pages: [
|
|
||||||
// {
|
|
||||||
// sections: [{
|
|
||||||
// fieldSets: [fieldSet]
|
|
||||||
// }]
|
|
||||||
// }
|
|
||||||
// ]
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const descriptionEditorModel = new DescriptionEditorModel().fromModel(mockDescription, mockDescription.descriptionTemplate);
|
|
||||||
// this.previewPropertiesFormGroup = descriptionEditorModel.properties.fieldSets.get(fieldSet.id).buildForm() as UntypedFormGroup;
|
|
||||||
// this.previewFieldSet = fieldSet;
|
|
||||||
// let data = this.form.getRawValue();
|
|
||||||
// this.datasetProfileService.preview(data).subscribe(x => {
|
|
||||||
// this.datasetWizardModel = new DatasetWizardEditorModel().fromModel({
|
|
||||||
// datasetProfileDefinition: x
|
|
||||||
// });
|
|
||||||
// this.updateVisibilityRules();
|
|
||||||
// this.formGroup = <FormGroup>this.datasetWizardModel.buildForm().get('datasetProfileDefinition');
|
|
||||||
// });
|
|
||||||
}
|
}
|
||||||
|
|
||||||
//
|
//
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
<mat-expansion-panel class="row expansion-panel toc-section-header" [id]="path" [(expanded)]="panelExpanded">
|
<mat-expansion-panel class="row expansion-panel toc-section-header" [id]="path" [(expanded)]="panelExpanded">
|
||||||
<mat-expansion-panel-header>
|
<mat-expansion-panel-header>
|
||||||
<mat-panel-title>
|
<mat-panel-title>
|
||||||
<h6 class='panel-title' *ngIf="section?.sections?.length > 0">{{path}}.section {{section.title}}</h6>
|
<h6 class='panel-title' *ngIf="section?.sections?.length >= 0">{{path}}.section {{section.title}}</h6>
|
||||||
<h6 class='panel-title' *ngIf="section?.fieldSets?.length > 0">{{path}} {{section.title}}</h6>
|
<h6 class='panel-title' *ngIf="section?.fieldSets?.length > 0">{{path}} {{section.title}}</h6>
|
||||||
</mat-panel-title>
|
</mat-panel-title>
|
||||||
</mat-expansion-panel-header>
|
</mat-expansion-panel-header>
|
||||||
|
|
Loading…
Reference in New Issue