108 lines
4.7 KiB
HTML
108 lines
4.7 KiB
HTML
<div>
|
|
<div fxLayout="row" fxLayoutAlign="start center">
|
|
<div fxFlex>
|
|
<mat-form-field class="full-width">
|
|
<input matInput placeholder='Id' type="text" [formControl]="this.form.get('id')">
|
|
</mat-form-field>
|
|
<div fxFlex>
|
|
<mat-form-field class="full-width">
|
|
<mat-select placeholder="View Style" [formControl]="this.form.get('viewStyle').get('renderStyle')" (change)="onchangeCombo()">
|
|
<mat-option value="textarea">textarea</mat-option>
|
|
<mat-option value="booleanDecision">booleanDecision</mat-option>
|
|
<mat-option value='combobox'>combobox</mat-option>
|
|
<mat-option value="checkBox">checkBox</mat-option>
|
|
<mat-option value="freetext">freetext</mat-option>
|
|
<mat-option value="radiobox">radiobox</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <div class="row">
|
|
<div class="form-group col-md-6">
|
|
<label>description</label>
|
|
<input type="text" class="form-control" formControlName="description">
|
|
</div>
|
|
<div class="form-group col-md-6">
|
|
<label>extendedDescription</label>
|
|
<input type="text" class="form-control" formControlName="extendedDescription">
|
|
</div>
|
|
</div> -->
|
|
<div fxLayout="row" fxLayoutAlign="start center">
|
|
<div fxFlex *ngIf="isFieldMultiplicityEnabled">
|
|
<h5>Multiplicity</h5>
|
|
<mat-form-field class="full-width">
|
|
<input matInput type="number" placeholder="Min" [formControl]="this.form.get('multiplicity').get('min')">
|
|
</mat-form-field>
|
|
|
|
<mat-form-field class="full-width">
|
|
<input matInput type="number" placeholder="Max" [formControl]="this.form.get('multiplicity').get('max')">
|
|
</mat-form-field>
|
|
</div>
|
|
<div fxFlex>
|
|
<mat-form-field class="full-width">
|
|
<input matInput type="number" placeholder="Ordinal" [formControl]="this.form.get('ordinal')">
|
|
</mat-form-field>
|
|
</div>
|
|
<div fxFlex>
|
|
<mat-form-field class="full-width">
|
|
<input matInput type="text" placeholder="Default Value" [formControl]="this.form.get('defaultValue').get('value')">
|
|
</mat-form-field>
|
|
</div>
|
|
<div fxFlex>
|
|
<div>
|
|
<div *ngFor="let validation of form['controls']['validations']['controls']; let i=index">
|
|
<mat-form-field class="full-width">
|
|
<mat-select placeholder='Validation' [formControl]="this.form.get('validations').get(''+i)">
|
|
<mat-option *ngFor="let option of validationsOptions" [value]="option.key">{{option.value}}</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div fxLayout="row" fxLayoutAlign="start center" [ngSwitch]="form.get('viewStyle').get('renderStyle').value">
|
|
<div class="full-width" *ngSwitchCase="'combobox'">
|
|
<combobox-component [form]="form" [dataModel]="dataModel"></combobox-component>
|
|
</div>
|
|
<div class="full-width" *ngSwitchCase="'radiobox'">
|
|
<radiobox-component [form]="form" [dataModel]="dataModel"></radiobox-component>
|
|
</div>
|
|
<div class="full-width" *ngSwitchCase="'freetext'">
|
|
<freetext-component [form]="form" [dataModel]="dataModel"></freetext-component>
|
|
</div>
|
|
<div class="full-width" *ngSwitchCase="'textarea'">
|
|
<textarea-component [form]="form" [dataModel]="dataModel"></textarea-component>
|
|
</div>
|
|
<div class="full-width" *ngSwitchCase="'booleanDecision'">
|
|
<booleanDecision-component [form]="form" [dataModel]="dataModel"></booleanDecision-component>
|
|
</div>
|
|
<div class="full-width" *ngSwitchCase="'checkBox'">
|
|
<checkbox-component [form]="form" [dataModel]="dataModel"></checkbox-component>
|
|
</div>
|
|
</div>
|
|
<mat-checkbox *ngIf="showMultiplicity" [(ngModel)]="isFieldMultiplicityEnabled" (ngModelChange)="onIsFieldMultiplicityEnabledChange(isFieldMultiplicityEnabled)">Multiplicity</mat-checkbox>
|
|
<div fxLayout="row">
|
|
<h4 style="font-weight: bold">Rules Description</h4>
|
|
<button mat-button (click)="addNewRule()" style="cursor: pointer">
|
|
Add Rule +
|
|
</button>
|
|
</div>
|
|
<mat-expansion-panel *ngFor="let rule of dataModel.visible.rules let i=index;" #panel>
|
|
<mat-expansion-panel-header>
|
|
<mat-panel-title>{{i + 1}}. Rule {{i + 1}}</mat-panel-title>
|
|
|
|
<div class="btn-group pull-right">
|
|
<button type="button" class="btn btn-sm" style="margin-left:5px;" (click)="DeleteRule(i);">
|
|
<span class="glyphicon glyphicon-erase"></span>
|
|
</button>
|
|
</div>
|
|
</mat-expansion-panel-header>
|
|
<rule-form *ngIf="panel.expanded" [form]="form.get('visible').get('rules').get(''+i)" [dataModel]="rule"></rule-form>
|
|
</mat-expansion-panel>
|
|
|
|
|
|
|
|
</div>
|