<Page (loaded)="onLoad()" class="page-container">
    <ActionBar flat="true">
        <NavigationButton text="Zpět" android.systemIcon="ic_menu_back" (tap)="onBackButton()"></NavigationButton>
        <Label class="action-bar-title" text="Detail rezervace" textWrap="true"></Label>
    </ActionBar>

    <GridLayout class="page page-content">
        <ScrollView>
            <StackLayout>
                <GridLayout class="menu-container page-area" columns="* *" rows="auto">
                    <TopMenuItem (clickItem)="updateReservation()" [disabled]="disabled" [icon]="updateIcon" column="0"
                                 name="Upravit"></TopMenuItem>
                    <TopMenuItem (clickItem)="deleteReservation()" [disabled]="disabled" [icon]="deleteIcon" column="1"
                                 name="Zrušit"></TopMenuItem>
                </GridLayout>

                <StackLayout class="page-area">
                    <GridLayout class="line-info-item m-y-2" columns="*, *" rows="auto"
                                visibility="{{reservation.WarehouseItem ? 'visible' : 'collapsed'}}">
                        <Label (tap)="onItemTap()" class="p-r-5" text="Položka:" textWrap="true"></Label>
                        <Label (tap)="onItemTap()" [text]="reservation.WarehouseItem" class="highlighted" col="1"
                               textAlignment="right" textWrap="true"></Label>
                    </GridLayout>
                    <LineInfoItem [value]="reservationState" name="Stav rezervace:"></LineInfoItem>
                    <LineInfoItem [value]="reservation.Returned  ? 'Ano' : 'Ne'"
                                  name="Vráceno z pohledu příjemce:"></LineInfoItem>
                    <GridLayout class="line-info-item m-y-2" columns="*, *" rows="auto"
                                visibility="{{reservation.Submitter ? 'visible' : 'collapsed'}}">
                        <Label (tap)="onPersonTap()" class="p-r-5" text="Zadal:" textWrap="true"></Label>
                        <Label (tap)="onPersonTap()" [text]="reservation.Submitter" class="highlighted" col="1"
                               textAlignment="right" textWrap="true"></Label>
                    </GridLayout>
                    <GridLayout class="line-info-item m-y-2" columns="auto, *" rows="auto"
                                visibility="{{reservation.WarehouseOrigin ? 'visible' : 'collapsed'}}">
                        <Label (tap)="onWarehouseOriginTap()" class="p-r-5" text="Ze skladu:" textWrap="true"></Label>
                        <Label (tap)="onWarehouseOriginTap()" [text]="reservation.WarehouseOrigin" class="highlighted"
                               col="1" textAlignment="right" textWrap="true"></Label>
                    </GridLayout>
                    <GridLayout class="line-info-item m-y-2" columns="auto *" rows="auto"
                                visibility="{{reservation.Warehouse ? 'visible' : 'collapsed'}}">
                        <Label (tap)="onWarehouseTap()" class="p-r-5" text="Do skladu:" textWrap="true"></Label>
                        <Label (tap)="onWarehouseTap()" [text]="reservation.Warehouse" class="highlighted" col="1"
                               textAlignment="right" textWrap="true"></Label>
                    </GridLayout>
                    <LineInfoItem [value]="reservation.Person" name="Kontaktní osoba:"></LineInfoItem>
                    <GridLayout class="line-info-item m-y-2" columns="* *" rows="auto"
                                visibility="{{reservation.Phone ? 'visible' : 'collapsed'}}">
                        <Label (tap)="onCallTap()" class="p-r-5" text="Telefon na kontaktní osobu:"
                               textWrap="true"></Label>
                        <Label (tap)="onCallTap()" [text]="reservation.Phone" class="highlighted" col="1"
                               textAlignment="right" textWrap="true"></Label>
                    </GridLayout>
                    <GridLayout class="line-info-item m-y-2" columns="* *" rows="auto"
                                visibility="{{reservation.Email ? 'visible' : 'collapsed'}}">
                        <Label (tap)="onEmailTap()" class="p-r-5" text="Email na kontaktní osobu:"
                               textWrap="true"></Label>
                        <Label (tap)="onEmailTap()" [text]="reservation.Email" class="highlighted" col="1"
                               textAlignment="right" textWrap="true"></Label>
                    </GridLayout>
                    <LineInfoItem [value]="reservation.EstimatedStartDate" name="Půjčeno (odhad):"
                                  type="date"></LineInfoItem>
                    <LineInfoItem [value]="reservation.EstimatedEndDate" name="Vráceno (odhad):"
                                  type="date"></LineInfoItem>
                    <LineInfoItem [value]="reservation.RealStartDate" name="Půjčeno:" type="date"></LineInfoItem>
                    <LineInfoItem *ngIf="reservation.Note" name="Poznámka:" value=" "></LineInfoItem>
                    <LineInfoItem *ngIf="reservation.Note" [name]="reservation.Note" class="m-l-10"
                                  value=" "></LineInfoItem>
                </StackLayout>
            </StackLayout>
        </ScrollView>

        <GridLayout [visibility]="(isLoading$ | async) || othersIsLoading ? 'visible' : 'collapsed'"
                    class="activity-indicator-wrapper">
            <ActivityIndicator [busy]="(isLoading$ | async) || othersIsLoading"></ActivityIndicator>
        </GridLayout>
    </GridLayout>
</Page>
