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

    <FlexboxLayout
        *ngIf="(isLoading$ | async) == false" 
        class="page page-content" flexDirection="column" justifyContent="space-between" height="90%">
        <ScrollView>
            <StackLayout>
                <Label *ngIf="advertisingDetail.Unit" class="h4" text="{{ advertisingDetail.Unit }}"></Label>
        
                <StackLayout class="page-area">
                    <FlexboxLayout flexDirection="row" justifyContent="space-between">
                        <Label text="Poznámka:"></Label>
                        <Label *ngIf="canEdit" class="fas" [text]="editIcon" (tap)="onNoteEdit()"></Label>
                    </FlexboxLayout> 
                    <Label *ngIf="advertisingDetail.Note" textWrap="true" text="{{ advertisingDetail.Note }}" (tap)="onNoteEdit()" style="color: #ee8027"></Label>
                    <Label *ngIf="!advertisingDetail.Note" textWrap="true" text="žádná poznámka" (tap)="onNoteEdit()" style="color: #ee8027"></Label>
                </StackLayout>
                
                <StackLayout class="page-area">
                    <StackLayout (tap)="onMeetingsExpandTap()" orientation="horizontal">
                        <Label class="fas fas-arrow" text="{{ showMeetings ? downIcon : rightIcon }}"></Label>
                        <Label text="Termíny schůzek" class="h4" verticalAlignment="middle"></Label>
                    </StackLayout>
                    <MeetingDateListView (tapItem)="onMeetingTap($event)" *ngIf="showMeetings"
                                         [items]="meetingDateAll"></MeetingDateListView>
                    <Label *ngIf="canEdit" visibility="{{ showMeetings ? 'visible' : 'collapsed' }}" 
                        class="fas fas-new label-section" horizontalAlignment="center" [text]="newIcon" (tap)="onNavTap('/advertising/meetingNew')"></Label>
                </StackLayout>

                <StackLayout class="page-area">
                    <StackLayout (tap)="onCategoriesExpandTap()" orientation="horizontal">
                        <Label class="fas fas-arrow" text="{{ showCategories ? downIcon : rightIcon }}"></Label>
                        <Label text="Náborové kategorie" class="h4" verticalAlignment="middle"></Label>
                    </StackLayout>
                    <AdvertisingCategoryListView (tapItem)="onCategoryTap($event)" *ngIf="showCategories"
                                                 [items]="advertisingCategoryAll"></AdvertisingCategoryListView>
                    <Label *ngIf="canEdit" visibility="{{ showCategories ? 'visible' : 'collapsed' }}" 
                        class="fas fas-new label-section" horizontalAlignment="center" [text]="newIcon" (tap)="onNavTap('/advertising/advertisingCategoryNew')"></Label>
                </StackLayout>
            </StackLayout>
        </ScrollView>
    </FlexboxLayout>

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