<Page class="page-container">
    <ActionBar flat="true">
        <NavigationButton (tap)="onBackButton()" android.systemIcon="ic_menu_back" text="Zpět"></NavigationButton>
        <Label [text]="item.DisplayName" class="action-bar-title" textWrap="true"></Label>
    </ActionBar>

    <StackLayout *ngIf="(isLoading$ | async) == false && othersIsLoading == false" class="page page-content">
        <GridLayout class="menu-container page-area" columns="*" rows="auto"
                    visibility="{{!item.DeletionDate ? 'visible' : 'collapsed'}}">
            <TopMenuItem (clickItem)="updateItem()" [column]="0" [disabled]="false" [icon]="saveIcon"
                         name="Uložit"></TopMenuItem>
        </GridLayout>

        <GridLayout>
            <ScrollView>
                <GridLayout class="page-area" columns="auto *"
                            rows="auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto">
                    <!-- <Image [src]="item.image" stretch="aspectFit" colSpan="2" (tap)="onTakePhotoTap($event)"></Image> -->
                    <!-- ZAKL INFO -->
                    <StackLayout (tap)="onMainExpandTap()" colSpan="2" orientation="horizontal" row="1">
                        <Label class="fas" text="{{mainExpanded ? downIcon : rightIcon}}"></Label>
                        <Label class="h4" text="Základní info" verticalAlignment="middle"></Label>
                    </StackLayout>
                    <Label row="2" text="Název*:" verticalAlignment="bottom"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #name class="m-l-10" col="1" row="2"
                               visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label row="3" text="Sklad:" verticalAlignment="bottom"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #warehouse (tap)="onTapWarehouseSelect($event)" class="m-l-10" col="1" editable="false"
                               row="3" visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label row="4" text="Kategorie:" verticalAlignment="bottom"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #category (tap)="onTapCategorySelect($event)" class="m-l-10" col="1" editable="false"
                               row="4" visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label row="5" text="Inventární číslo:" verticalAlignment="bottom"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #inventoryNumber class="m-l-10" col="1" row="5"
                               visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label class="m-top" row="6" text="Popis:" verticalAlignment="top"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextView #description class="m-l-10" col="1" row="6"
                              visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextView>

                    <Label row="7" text="Aktuální cena:" verticalAlignment="bottom"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #actualPrice class="m-l-10" col="1" keyboardType="number" row="7"
                               visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label class="m-top" row="8" text="Poznámka:" verticalAlignment="top"
                           visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextView #note class="m-l-10" col="1" height="auto"
                              row="8" visibility="{{mainExpanded ? 'visible' : 'collapsed'}}"></TextView>

                    <!-- PUJCENI -->
                    <StackLayout (tap)="onRentExpandTap()" colSpan="2" orientation="horizontal" row="9">
                        <Label class="fas" text="{{rentExpanded ? downIcon : rightIcon}}"></Label>
                        <Label class="h4" text="Možnosti půjčení" verticalAlignment="middle"></Label>
                    </StackLayout>

                    <Label class="m-t-10" row="10" text="Komerčně:" verticalAlignment="bottom"
                           visibility="{{rentExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <Switch #commercialRent (checkedChange)="switchClicked()" class="m-t-10 m-l-10" col="1" row="10"
                            visibility="{{rentExpanded ? 'visible' : 'collapsed'}}"></Switch>

                    <Label class="m-t-10" row="11" text="Všem skautům:" verticalAlignment="bottom"
                           visibility="{{rentExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <Switch #unitRent (checkedChange)="switchClicked()" class="m-t-10 m-l-10" col="1" row="11"
                            visibility="{{rentExpanded ? 'visible' : 'collapsed'}}"></Switch>

                    <Label class="m-t-10" row="12" text="Ústřední akce:" verticalAlignment="bottom"
                           visibility="{{rentExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <Switch #eventRent (checkedChange)="switchClicked()" class="m-t-10 m-l-10" col="1" row="12"
                            visibility="{{rentExpanded ? 'visible' : 'collapsed'}}"></Switch>

                    <Label row="13" text="Cena za den:" verticalAlignment="bottom"
                           visibility="{{rentExpanded && canBeRent ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #rentPrice class="m-l-10" col="1" row="13"
                               visibility="{{rentExpanded && canBeRent ? 'visible' : 'collapsed'}}"></TextField>

                    <Label class="m-top" row="14" text="Poznámka:" verticalAlignment="top"
                           visibility="{{rentExpanded && canBeRent ? 'visible' : 'collapsed'}}"></Label>
                    <TextView #rentNote class="m-l-10" col="1" height="auto"
                              row="14" visibility="{{rentExpanded && canBeRent ? 'visible' : 'collapsed'}}"></TextView>

                    <!-- PORIZENI -->
                    <StackLayout (tap)="onPurchaseExpandTap()" colSpan="2" orientation="horizontal" row="15">
                        <Label class="fas" text="{{purchaseExpanded ? downIcon : rightIcon}}"></Label>
                        <Label class="h4" text="Pořízení" verticalAlignment="middle"></Label>
                    </StackLayout>
                    <Label row="16" text="Způsob pořízení:" verticalAlignment="bottom"
                           visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #purchaseType (tap)="onPurchaseTypeTap($event)" class="m-l-10" col="1" editable="false"
                               row="16" visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label row="17" text="Datum pořízení:" verticalAlignment="bottom"
                           visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #purchaseDate (tap)="showDate($event)" class="m-l-10" col="1" editable="false" row="17"
                               visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label class="m-top" row="18" text="Poznámka:" verticalAlignment="top"
                           visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextView #purchaseNote class="m-l-10" col="1" height="auto" row="18"
                              visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></TextView>

                    <Label row="19" text="Výrobní číslo:" verticalAlignment="bottom"
                           visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #serialNumber class="m-l-10" col="1" row="19"
                               visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label row="20" text="Číslo dokladu:" textWrap="true" verticalAlignment="bottom"
                           visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #accountNumber class="m-l-10" col="1" row="20"
                               visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></TextField>

                    <Label row="21" text="Pořizovací cena:" verticalAlignment="bottom"
                           visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></Label>
                    <TextField #purchasePrice class="m-l-10" col="1" keyboardType="number" row="21"
                               visibility="{{purchaseExpanded ? 'visible' : 'collapsed'}}"></TextField>
                </GridLayout>
            </ScrollView>
        </GridLayout>
    </StackLayout>
    <GridLayout [visibility]="(isLoading$ | async) || othersIsLoading ? 'visible' : 'collapsed'"
                class="activity-indicator-wrapper">
        <ActivityIndicator [busy]="(isLoading$ | async) || othersIsLoading"></ActivityIndicator>
    </GridLayout>
</Page>
