|
|
|
<form nz-form [formGroup]="formGroup" nzLayout="vertical">
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label nzRequired>
|
|
|
|
食材编号
|
|
|
|
</nz-form-label>
|
|
|
|
<nz-form-control [nzErrorTip]="formControlErrorTpl">
|
|
|
|
<input placeholder="请输入食材编号" nz-input formControlName="key" />
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label nzRequired>
|
|
|
|
食材名称
|
|
|
|
</nz-form-label>
|
|
|
|
<nz-form-control [nzErrorTip]="formControlErrorTpl">
|
|
|
|
<input placeholder="请输入食材名称" nz-input formControlName="name" />
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label nzRequired>
|
|
|
|
食材类型
|
|
|
|
</nz-form-label>
|
|
|
|
<nz-form-control [nzErrorTip]="formControlErrorTpl">
|
|
|
|
<nz-select nzPlaceHolder="请选择" formControlName="type">
|
|
|
|
<nz-option
|
|
|
|
*ngFor="let item of globalEnum.category"
|
|
|
|
[nzValue]="item.value"
|
|
|
|
[nzLabel]="item.key">
|
|
|
|
</nz-option>
|
|
|
|
</nz-select>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
<nz-form-item>
|
|
|
|
<nz-form-label nzRequired class="block-label">
|
|
|
|
<div class="flex justify-between items-center flex-1">
|
|
|
|
<span class="flex-1">
|
|
|
|
营养素(每100g可食部)
|
|
|
|
</span>
|
|
|
|
<a nz-button nzType="link" (click)="createNutrition()">
|
|
|
|
<span nz-icon nzType="plus"></span>
|
|
|
|
<span>
|
|
|
|
添加营养素
|
|
|
|
</span>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</nz-form-label>
|
|
|
|
<nz-form-control [nzErrorTip]="formControlErrorTpl" class="hide-input">
|
|
|
|
<input type="hidden" formControlName="nutrient" />
|
|
|
|
<ul formArrayName="_nutrition">
|
|
|
|
<li class="mb-2" *ngFor="let n of nutrition.controls;let i = index" [formGroupName]="i">
|
|
|
|
<div class="flex">
|
|
|
|
<div>
|
|
|
|
<nz-select class="!w-[160px]" nzPlaceHolder="营养素"
|
|
|
|
(ngModelChange)="nutritionChange($event,i)"
|
|
|
|
formControlName="nutritionName">
|
|
|
|
<nz-option
|
|
|
|
*ngFor="let item of globalEnum.nutrient"
|
|
|
|
[nzValue]="item.key"
|
|
|
|
[nzLabel]="item.value">
|
|
|
|
</nz-option>
|
|
|
|
</nz-select>
|
|
|
|
</div>
|
|
|
|
<div class="flex-1 px-2">
|
|
|
|
<nz-input-group [nzAddOnAfter]="nutrition.value[i].measurement" class="w-full">
|
|
|
|
<input nz-input formControlName="nutritionNum" />
|
|
|
|
</nz-input-group>
|
|
|
|
</div>
|
|
|
|
<div>
|
|
|
|
<button nz-button (click)="removeNutrition(i)">
|
|
|
|
<span nz-icon nzType="delete"></span>
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</li>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</ul>
|
|
|
|
</nz-form-control>
|
|
|
|
</nz-form-item>
|
|
|
|
</form>
|
|
|
|
<ng-template #formControlErrorTpl let-control>
|
|
|
|
<form-error-tips [control]="control"></form-error-tips>
|
|
|
|
</ng-template>
|