101 lines
2.8 KiB
HTML
101 lines
2.8 KiB
HTML
<div [formGroup]="toppingForm">
|
|
<div
|
|
formArrayName="toppingList"
|
|
*ngFor="let topping of toppingList.controls; let i = index"
|
|
>
|
|
<!-- toppingList.at(i) -->
|
|
<div class="space-y-2" formGroupName="{{ i }}">
|
|
<!-- iterate through ListGroupId -->
|
|
|
|
<div class="flex space-x-2">
|
|
<h3>Enable</h3>
|
|
<input class="toggle" type="checkbox" formControlName="isUse" />
|
|
</div>
|
|
|
|
<div class="flex space-x-2 items-center">
|
|
<!-- toppingGroup -->
|
|
<ng-select
|
|
class="w-52"
|
|
appendTo="body"
|
|
[clearable]="false"
|
|
[compareWith]="this.compareFunc"
|
|
formControlName="groupID"
|
|
(close)="getDefaultOfGroup(getGroupIdByIndex(i))"
|
|
>
|
|
<ng-option
|
|
*ngFor="let item of allToppingsDefinitions"
|
|
[value]="item.groupId.toString()"
|
|
>
|
|
<div>{{ item.name }} ({{ item.groupId }})</div>
|
|
</ng-option>
|
|
</ng-select>
|
|
<!-- defaultSelect -->
|
|
<ng-select
|
|
class="w-52"
|
|
appendTo="body"
|
|
[clearable]="false"
|
|
[compareWith]="this.compareFunc"
|
|
formControlName="defaultIDSelect"
|
|
>
|
|
<ng-option
|
|
*ngFor="
|
|
let item of getMembersByGroupId(getGroupIdByIndex(this.index!))
|
|
"
|
|
[value]="item.id.toString()"
|
|
>
|
|
<div>{{ item.name }} ({{ item.id }})</div>
|
|
</ng-option>
|
|
</ng-select>
|
|
</div>
|
|
|
|
<div class="flex items-center justify-center">
|
|
<p class="text-sm">Mix with</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex flex-row space-x-2 items-center justify-center">
|
|
<ng-select
|
|
class="w-80"
|
|
appendTo="body"
|
|
[clearable]="false"
|
|
(compareWith)="(this.compareFunc)"
|
|
[multiple]="true"
|
|
[maxSelectedItems]="3"
|
|
(close)="registerExtraTopping(extraTopping)"
|
|
[(ngModel)]="extraTopping"
|
|
>
|
|
<ng-option
|
|
*ngFor="let item of allToppingsDefinitions"
|
|
[value]="item.groupId.toString()"
|
|
>
|
|
<div>
|
|
<p>{{ item.name }} ({{ item.groupId }}) </p>
|
|
</div>
|
|
</ng-option>
|
|
</ng-select>
|
|
|
|
|
|
</div>
|
|
<div *ngFor="let item of extraTopping; let i = index">
|
|
<div class="flex items-center space-y-2 space-x-2 justify-start">
|
|
<p>{{getToppingDefinitionByGroupId(item)['name']}} ({{getToppingDefinitionByGroupId(item)['groupId']}})</p>
|
|
<ng-select
|
|
class="w-52"
|
|
appendTo="body"
|
|
[clearable]="false"
|
|
[compareWith]="this.compareFunc"
|
|
bindLabel="name"
|
|
[(ngModel)]="this.extraToppingDefault[item]"
|
|
(close)="triggerValueChange()"
|
|
>
|
|
<ng-option
|
|
*ngFor="let item2 of getMembersByGroupId(item)"
|
|
[value]="item2.id.toString()"
|
|
>
|
|
<div>{{ item2.name }} ({{ item2.id }})</div>
|
|
</ng-option>
|
|
</ng-select>
|
|
</div>
|
|
</div>
|