You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
128 lines
3.8 KiB
128 lines
3.8 KiB
<app-page>
|
|
<ng-template #pageExtraTpl>
|
|
<nz-space>
|
|
<button *nzSpaceItem nz-button [disabled]="!selectedIds.length" (click)="deleteItem()">批量删除</button>
|
|
<button *nzSpaceItem nz-button [disabled]="!selectedIds.length" (click)="printTag()">
|
|
批量打印营养标签
|
|
</button>
|
|
<button *nzSpaceItem nz-button nzType="primary" (click)="showFoodForm()">
|
|
<i nz-icon nzType="plus"></i>
|
|
新增菜品
|
|
</button>
|
|
</nz-space>
|
|
</ng-template>
|
|
<div class="h-full overflow-hidden bg-white rounded-lg">
|
|
<nz-card [nzBordered]="false" nzTitle="菜品管理">
|
|
<table-list
|
|
[props]="tableList"
|
|
[search]="searchTpl"
|
|
[action]="pageExtraTpl"
|
|
[formGroup]="queryForm"
|
|
[renderColumns]="renderColumnsTpl"
|
|
>
|
|
<ng-template #searchTpl>
|
|
<nz-form-item class="w-60">
|
|
<nz-form-control>
|
|
<nz-select nzPlaceHolder="请选择单位" formControlName="vendors">
|
|
<nz-option
|
|
*ngFor="let o of listOfOption"
|
|
[nzLabel]="o.text"
|
|
[nzValue]="o.value"
|
|
></nz-option>
|
|
</nz-select>
|
|
</nz-form-control>
|
|
</nz-form-item>
|
|
<nz-form-item class="w-40">
|
|
<nz-form-control>
|
|
<nz-select nzPlaceHolder="菜品标签" formControlName="mark" nzAllowClear>
|
|
<nz-option
|
|
*ngFor="let item of globalEnum.mark"
|
|
[nzLabel]="item.key"
|
|
[nzValue]="item.key"
|
|
>
|
|
</nz-option>
|
|
</nz-select>
|
|
</nz-form-control>
|
|
</nz-form-item>
|
|
|
|
<nz-form-item>
|
|
<nz-form-control>
|
|
<input nz-input placeholder="请输入菜品名称" formControlName="keyword" />
|
|
</nz-form-control>
|
|
</nz-form-item>
|
|
</ng-template>
|
|
<ng-template #renderColumnsTpl let-data let-key="key" let-row="row">
|
|
<ng-container [ngSwitch]="key">
|
|
<ng-container *ngSwitchCase="'icon'">
|
|
<div
|
|
class="dish-img overflow-auto"
|
|
*ngIf="data"
|
|
[ngStyle]="{ 'background-image': 'url(/api/icon/' + data + ')' }"
|
|
></div>
|
|
</ng-container>
|
|
<ng-container *ngSwitchCase="'vender'">
|
|
{{ tableOrg[data] ? tableOrg[data].name : '-' }}
|
|
</ng-container>
|
|
<ng-container *ngSwitchCase="'label'">
|
|
<nz-tag *ngFor="let item of data ?? []">
|
|
{{ item }}
|
|
</nz-tag>
|
|
</ng-container>
|
|
<ng-container *ngSwitchCase="'ingredient'">
|
|
<div class="flex flex-wrap">
|
|
<ng-container *ngFor="let item of data">
|
|
<nz-tag *ngIf="tableFoods[item.key]" class="m-1">
|
|
{{ tableFoods[item.key]['name'] }}：{{ item.value }} g
|
|
</nz-tag>
|
|
</ng-container>
|
|
</div>
|
|
</ng-container>
|
|
<ng-container *ngSwitchDefault>
|
|
{{ data }}
|
|
</ng-container>
|
|
</ng-container>
|
|
</ng-template>
|
|
</table-list>
|
|
</nz-card>
|
|
</div>
|
|
</app-page>
|
|
|
|
<ng-template #formFooterTpl>
|
|
<nz-space>
|
|
<button *nzSpaceItem nz-button (click)="cancelForm()" type="button">取消</button>
|
|
<button *nzSpaceItem nz-button nzType="primary" [nzLoading]="submitLoading" (click)="onSubmit()">保存</button>
|
|
</nz-space>
|
|
</ng-template>
|
|
|
|
<app-print #print [content]="printContent"> </app-print>
|
|
|
|
<ng-template #printContent>
|
|
<div class="printContent" *ngFor="let item of printData">
|
|
<table class="print-table">
|
|
<tbody>
|
|
<tr>
|
|
<th colspan="3">
|
|
{{ item.name }}
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<th colspan="3">营养成分表</th>
|
|
</tr>
|
|
<tr>
|
|
<th class="text-left">名称</th>
|
|
<th class="text-center">每100克（g）</th>
|
|
<th class="text-center">营养参考值%（NVR%）</th>
|
|
</tr>
|
|
</tbody>
|
|
<tbody>
|
|
<tr *ngFor="let th of item.component">
|
|
<td [width]="'38.2%'">{{ th.name }}</td>
|
|
<td class="text-center">{{ th.nutrition }}</td>
|
|
<td class="text-center">{{ th.nvr }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<div>主要原料：{{ item.ingredients.join('，') }}</div>
|
|
<div>1毫克（mg）钠相当于2.5毫克食盐</div>
|
|
</div>
|
|
</ng-template>
|
|
|