74 lines
4.2 KiB
HTML
74 lines
4.2 KiB
HTML
<div [formGroup]="form" class="row dataset-profile-editor">
|
|
<h4 style="font-weight: bold" class="col-12">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.TITLE' | translate}}</h4>
|
|
|
|
<mat-form-field class="col-md-3">
|
|
<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.ID' | translate}}"
|
|
formControlName="id" required>
|
|
<mat-error *ngIf="form.get('id').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
<mat-error *ngIf="form.get('id').hasError('pattern')">{{'GENERAL.VALIDATION.PATTERN-_' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-3">
|
|
<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.TITLE' | translate}}"
|
|
formControlName="title">
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-3">
|
|
<mat-select placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.PAGE' | translate}}" formControlName="page"
|
|
required>
|
|
<mat-option *ngFor="let pageGroup of form.root.get('pages')['controls'];" [value]="pageGroup.get('id').value">{{pageGroup.get('title').value}}</mat-option>
|
|
</mat-select>
|
|
<mat-error *ngIf="form.get('page').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-3">
|
|
<input matInput type="number" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.ORDER' | translate}}"
|
|
formControlName="ordinal">
|
|
</mat-form-field>
|
|
<mat-form-field class="col-md-12">
|
|
<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.DESCRIPTION' | translate}}"
|
|
formControlName="description">
|
|
</mat-form-field>
|
|
<!-- <div class="col-md-6">
|
|
<label>Default Visibility</label>
|
|
<mat-radio-group formControlName="defaultVisibility" class="full-width">
|
|
<mat-radio-button [value]="true">true</mat-radio-button>
|
|
<mat-radio-button [value]="false">false</mat-radio-button>
|
|
</mat-radio-group>
|
|
</div> -->
|
|
<h4 style="font-weight: bold" class="col-12">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.FIELDS-TITLE' |
|
|
translate}}</h4>
|
|
<div class="col-12">
|
|
<mat-card class="field-card" *ngFor="let fieldControl of form.get('fieldSets')['controls'] let i=index;">
|
|
<div class="row">
|
|
<mat-card-title class="col">{{i + 1}}. {{getFieldTile(fieldControl, i)}}</mat-card-title>
|
|
<button mat-icon-button type="button" class="deleteBtn col-auto" (click)="deleteFieldSet(i);" [disabled]="viewOnly">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
<app-dataset-profile-editor-composite-field-component class="col-12" [form]="fieldControl" [indexPath]="indexPath + 'cf' + i" [viewOnly]="viewOnly"></app-dataset-profile-editor-composite-field-component>
|
|
</div>
|
|
</mat-card>
|
|
</div>
|
|
<div class="col-12"><button mat-button class="full-width" (click)="addField()" [disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.ACTIONS.ADD-FIELD'
|
|
| translate}}</button></div>
|
|
<h4 style="font-weight: bold" class="col-12">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.FIELDS.SUB-SECTIONS-TITLE' |
|
|
translate}}</h4>
|
|
<div *ngIf="dataModel.sections.length > 0" class="col-12">
|
|
<mat-expansion-panel *ngFor="let section of dataModel.sections; let i=index;" #panel>
|
|
<mat-expansion-panel-header>
|
|
<mat-panel-title>{{i + 1}}. {{form.get('sections').get(''+i).get('title').value}}</mat-panel-title>
|
|
<div class="row">
|
|
<!-- <span class="col">{{i + 1}}. {{form.get('sections').get(''+i).get('title').value}}</span> -->
|
|
<button mat-icon-button type="button" class="deleteBtn col-auto" (click)="DeleteSectionInSection(i);" [disabled]="viewOnly">
|
|
<mat-icon>delete</mat-icon>
|
|
</button>
|
|
</div>
|
|
</mat-expansion-panel-header>
|
|
<div id="{{indexPath + 's' + i}}" *ngIf="panel.expanded" class="row">
|
|
<app-dataset-profile-editor-section-component class="col-12" [form]="form.get('sections').get(''+i)" [dataModel]="section"
|
|
[indexPath]="indexPath + 's' + i" [viewOnly]="viewOnly"></app-dataset-profile-editor-section-component>
|
|
</div>
|
|
</mat-expansion-panel>
|
|
</div>
|
|
<div class="col-12"><button mat-button class="full-width" (click)="addSectioninSection()" [disabled]="viewOnly">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.SECTION.ACTIONS.ADD-SUB-SECTION'
|
|
| translate}}</button></div>
|
|
|
|
</div>
|