food.html

<ion-header>

    <ion-navbar>
        <ion-title>订餐预定</ion-title>
        <ion-buttons *ngIf="role.includes(1) || role.includes(11)" end>
            <button ion-button (click)="goApply()">
                <ion-icon style="font-size: 2rem" class="top-right-icon icon-fabu iconfont"></ion-icon>
            </button>
        </ion-buttons>
        <ion-buttons *ngIf="role.includes(11)" end>
            <button ion-button icon-only (click)="goDeal()" class="toolbar-icon">
                <span style="font-size: 2.5rem" class="top-right-icon icon iconfont icon-shenhe"></span>
            </button>
        </ion-buttons>

    </ion-navbar>
    <div class="duty">
        <div class="dutyItem" (click)="change(1)">
            <span class="{{changeType == 1?'duty-title':''}}">订餐安排</span>
        </div>
        <div class="dutyItem" (click)="change(2)">
            <span class="{{changeType == 2?'duty-title':''}}">我的预定</span>
        </div>
    </div>
</ion-header>


<ion-content>
    <ion-content direction="y" scrollbar-y="true" class="bgc-e7e8ed">
        <ion-refresher (ionRefresh)="doRefresh($event)">
            <ion-refresher-content pullingText="下拉刷新"
                                   refreshingSpinner="bubbles">
            </ion-refresher-content>
        </ion-refresher>
        <ng-container *ngIf="changeType == 1">
            <ion-calendar #calendar [(ngModel)]="date"
                          (onChange)="getDate($event)"
                          [options]="options"
                          type="string"
                          format="YYYY-MM-DD">
            </ion-calendar>
            <div class="room">
                <div class="already">
                    <p>已审核</p>
                    <div class="morning">
                        <div class="morning-room">
                            <ng-container *ngFor="let item1 of room?.checkedList">
                                <span *ngIf="role.includes(11) || (role.includes(1) && mineInfo.orgName == item1.orgName)"
                                      (click)="goApplyEdit(item1)">
                                    <span *ngIf="item1?.type == 1">午餐</span>&nbsp;&nbsp;
                                    <span *ngIf="item1?.type == 2">晚餐</span> {{item1.orgName}}等{{item1.peopleCount}}
                                    人，标准:{{item1.total}}元
                                </span>
                            </ng-container>
                        </div>
                    </div>
                </div>
                <div class="already">
                    <p>未审核</p>
                    <div class="morning">
                        <div class="morning-room">
                            <ng-container *ngFor="let item3 of room?.uncheckList">
                                <span (click)="goApplyEdit(item3)"
                                      *ngIf=" role.includes(11) || (role.includes(1) && mineInfo.orgName == item3.orgName)">
                                    <span *ngIf="item3?.type == 1">午餐</span>&nbsp;&nbsp;
                                    <span *ngIf="item3?.type == 2">晚餐</span> {{item3.orgName}}等{{item3.peopleCount}}
                                    人，标准:{{item3.total}}元
                                </span>
                            </ng-container>
                        </div>
                    </div>
                </div>
            </div>
        </ng-container>
        <ng-container *ngIf="changeType == 2">
            <div class="duty-content">
                <ion-list class="myItem">
                    <ion-item-sliding class="apply" *ngFor="let item of applyList">
                        <ion-item *ngIf="item.diffFlag == 1">
                            <p>
                                <span *ngIf="item.status == 1">已提交</span>
                                <span *ngIf="item.status == 2">已审核</span>
                                <span *ngIf="item.status == 3">已驳回</span>
                                <span float-end>申请时间：
                                    <span>{{item.submitTime | date:'yyyy-MM-dd HH:mm'}}</span>
                                </span>
                            </p>
                            <p>
                                <span class="apply-room">标准:
                                    <span>{{item.amount}}元</span>
                                </span>
                                <span class="apply-room">总额:
                                    <span>{{item.total}}元</span>
                                </span>
                                <span class="meet-type">
                                    人数:<span>{{item.peopleCount}}人</span>
                                </span>
                            </p>
                            <p>
                                <span class="order-time">预定时间：
                                    <span>{{item.orderDate | date:'yyyy-MM-dd'}}</span>
                                    <span *ngIf="item.typeList && item.typeList.includes(1)">午餐</span>&nbsp;&nbsp;
                                    <span *ngIf="item.typeList && item.typeList.includes(2)">晚餐</span>
                                </span>
                            </p>
                            <p (click)="removeItem(item)" class="cancelBtn"> <span>取消</span> </p>
                        </ion-item>
                        <ion-item *ngIf="item.diffFlag == 2">
                            <p>
                                <span class="success">抢购成功</span>
                                <span float-end>抢购时间：
                                    <span>{{item.submitTime | date:'yyyy-MM-dd HH:mm'}}</span>
                                </span>
                            </p>
                            <p>
                                <span class="apply-room">物品:
                                    <span>{{item.remark}}</span>
                                </span>
                                <span class="apply-room margin-left-10">数量:
                                    <span>{{item.peopleCount}}</span>
                                </span>
                            </p>
                            <p>
                                <span class="order-time">领取时间：
                                    <span>{{item.orderDate | date:'yyyy-MM-dd'}}</span>
                                </span>
                            </p>
                            <p (click)="removeItem(item)" class="cancelBtn"> <span>取消</span> </p>
                        </ion-item>

                    </ion-item-sliding>
                </ion-list>
                <ion-list text-center style="margin-top: 10rem;color: #666666"
                          *ngIf="!page.isLoad  && applyList.length == 0">
                    <img style="width: 20%;" src="./assets/imgs/no-info.png" alt="">
                    <p text-center>
                        暂无预定
                    </p>
                </ion-list>
            </div>
        </ng-container>
        <ion-infinite-scroll (ionInfinite)="doInfinite($event)">
            <ion-infinite-scroll-content
                    loadingSpinner="bubbles"
                    loadingText="加载中"></ion-infinite-scroll-content>
        </ion-infinite-scroll>
        <ion-fab right bottom>
            <button ion-fab color="light" (click)="buy()">
                <div class="loader">
                    <div class="rotation">
                        <span class="text">抢购</span>
                        <svg width="50" height="50">
                            <line class="top" x1="-50" y1="0" x2="100" y2="0"/>
                            <line class="left" x1="0" y1="0" x2="0" y2="-100"/>
                            <line class="bottom" x1="-50" y1="50" x2="0" y2="50"/>
                            <line class="right" x1="50" y1="50" x2="50" y2="100"/>
                        </svg>
                    </div>
                </div>
            </button>
        </ion-fab>
    </ion-content>
</ion-content>