<Page class="page-container">
    <ActionBar flat="true">
        <NavigationButton (tap)="onBackButton()" android.systemIcon="ic_menu_back" text="Zpět"></NavigationButton>
        <Label class="action-bar-title" text="Vydané položky" textWrap="true"></Label>
    </ActionBar>

    <GridLayout class="page page-content">
        <StackLayout>
            <StackLayout class="page-area">
                <GridLayout class="m-10 m-b-0" columns="auto,auto, auto *" rows="auto">
                    <Label (tap)="onSortTap()" text="Seřadit podle: " verticalAlignment="center"></Label>
                    <Label (tap)="onSortTap()" [text]="chosenSortType" class="" col="1" textWrap="true"
                           verticalAlignment="center"></Label>
                    <Label (tap)="onSortTap()" class="fas" col="2" text="&#xf107;"></Label>

                    <Label (tap)="showModalHelp()" [text]="helpIcon" class="fas help text-right" col="3"></Label>
                </GridLayout>
            </StackLayout>
            <StackLayout class="page-area" rows="auto *">
                <Label class="no-data" text="Nemáte vydané žádné položky." textWrap="true"
                       visibility="{{!reservationLent || reservationLent.length === 0 ? 'visible' : 'collapsed'}}"></Label>

                <StackLayout visibility="{{reservationLent && reservationLent.length > 0 ? 'visible' : 'collapsed'}}">
                    <ReservationLentList (tapItem)="onTapItem($event)" [items]="reservationLent"></ReservationLentList>
                </StackLayout>
            </StackLayout>
        </StackLayout>

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