113 lines
5.8 KiB
HTML
113 lines
5.8 KiB
HTML
<form [formGroup]="myForm">
|
|
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.route.dirty}">
|
|
<label for="pageRouteTag">Page Route</label>
|
|
<input type="text" class="form-control" formControlName="route" id="pageRouteTag" placeholder="Page Route">
|
|
</div>
|
|
<div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.name.dirty}">
|
|
<label for="pageNameTag">Page Name</label>
|
|
<input type="text" class="form-control" formControlName="name" id="pageNameTag" placeholder="Page Name">
|
|
</div>
|
|
|
|
<!--div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.entities.dirty}"-->
|
|
|
|
<!--label for="pageEntitiesTag">Entities</label>
|
|
<span type="text" class="form-array" formArrayName="entities" id="pageEntitiesTag" placeholder="Entities">
|
|
<input *ngFor="let entity of myForm.value.entities" type="text" class="form-control">
|
|
</span-->
|
|
|
|
<!--select>
|
|
<option [value]="">--add entities--</option>
|
|
<option *ngFor="let entity of myForm.value.entities" [value]="entity._id">{{entity.name}}</option>
|
|
</select-->
|
|
|
|
|
|
<!--button type="button" (click)="isCollapsed = !isCollapsed">Toggle collapse</button>
|
|
<div [collapse]="isCollapsed" class="card card-block card-header">
|
|
<div class="well well-lg">
|
|
<div *ngFor="let entity of myForm.value.entities" class="row user form-control" formControlName="entities" id="pageEntitiesTag" >
|
|
|
|
<button value="{{entity._id}}" type="button">ADD</button>{{entity.name}}
|
|
</div>
|
|
</div>
|
|
</div-->
|
|
|
|
|
|
<!--span class="col-sm-1 avatar">
|
|
<input id="{{entity._id}}" class="checkBox" type="checkbox" name="" value="{{entity._id}}">
|
|
</span-->
|
|
|
|
<!--div formArrayName="entities">
|
|
<div *ngFor="let entity of entities.controls; let i=index" [formGroupName]="i" >
|
|
<div class="form-group">
|
|
<label class="center-block">Name:</label>
|
|
<input class="form-control" formControlName="name"
|
|
<span><button class="col-sm-2" value="{{entity.value._id}}" type="button">ADD</button><label class="form-control col-sm-10">{{entity.value.name}}</label></span>
|
|
</div>
|
|
<br>
|
|
</div>
|
|
<button (click)="addEntity()" type="button">Add an Entity</button>
|
|
</div-->
|
|
|
|
<!-- <div formArrayName="entities">
|
|
<div *ngFor="let entity of entities.controls; let i=index" [formGroupName]="i" >
|
|
<div class="form-group">
|
|
<label class="center-block">Name:</label>
|
|
<span><button class="col-sm-2" value="{{entity.value._id}}" type="button">ADD</button><label class="form-control col-sm-10">{{entity.value.name}}</label></span>
|
|
</div>
|
|
</div>
|
|
</div> -->
|
|
|
|
<div formArrayName="entities" class="form-group">
|
|
<label for="entityNameTag">Entity Name</label>
|
|
<div id="entityNameTag">
|
|
<!-- <label class="form-control">
|
|
<span *ngFor="let entity of entities.controls; let i=index">{{entity.value.name}}<span *ngIf="i<(entities.controls.length-1)">, </span></span>
|
|
</label> -->
|
|
<pre class="card card-block card-header"><span *ngFor="let entity of myForm.value.entities; let i=index">{{entity.name}}<span *ngIf="i<(myForm.value.entities.length-1)">, </span></span></pre>
|
|
|
|
<button type="button" (click)="toggle()">Add / Remove entities</button>
|
|
<div [collapse]="myForm.value.isCollapsed" *ngFor="let entity of getKeys(allEntities)">
|
|
<span><!--button type="button">ADD</button-->
|
|
<span *ngIf="allEntities.get(entity)" class="activated" >
|
|
<input (click)="toggleEntity(false,[entity._id], entity)" class="deactivate" src="imgs/delete-icon.png" title="Disable" width="20" type="image" height="20">
|
|
</span>
|
|
<span *ngIf="!allEntities.get(entity)" class="deactivated" >
|
|
<input (click)="toggleEntity(true,[entity._id], entity)" class="deactivate" src="imgs/add-icon.png" title="Enable" width="20" type="image" height="20">
|
|
</span>
|
|
{{entity.name}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- <p>myForm value: {{ myForm.value | json}}</p> -->
|
|
|
|
<!--/div-->
|
|
|
|
|
|
<!--
|
|
<div ngModelGroup="phoneNumbers">
|
|
<h3>Phone numbers</h3>
|
|
<div *ngFor="let phoneId of phoneNumberIds; let i=index;">
|
|
<label>Phone number {{i + 1}}</label>
|
|
<input type="text" name="phoneNumber[{{phoneId}}]" #phoneNumber="ngModel" ngModel/>
|
|
<button type="button" (click)="remove(i); myForm.control".markAsTouched()">remove</button>
|
|
</div>
|
|
<button type="button" (click)="add(); myForm.control.markAsTouched()">Add phone number</button>
|
|
</div>
|
|
-->
|
|
|
|
<!-- <div class="form-group" [ngClass]="{'has-error':!myForm.controls.name.valid && myForm.controls.entities.dirty}">
|
|
<div *ngFor="let entity of entities; let i=index;">
|
|
<label>Entity {{i + 1}}</label>
|
|
<input type="text" name="entities[{{entity}}]" class="form-control" formControlName="entity"/>
|
|
</div>
|
|
</div> -->
|
|
|
|
|
|
<input type="hidden" formControlName="_id">
|
|
</form>
|
|
|
|
<!--<pre>-->
|
|
<!--{{myForm.value | json}}-->
|
|
<!--</pre>-->
|