<GridLayout>
    <RadListView (itemTap)="onTapItem($event)" [itemTemplateSelector]="templateSelector" [items]="items">
        <ng-template let-item="item" tkListItemTemplate>
            <GridLayout columns="auto, auto,*, auto" rows="auto">
                <Label class="fas" col="0" text="{{item.expanded ? downIcon : rightIcon}}"></Label>
                <!-- <Image col="1" [src]="item.image.src"></Image> -->
                <Label [text]="item.DisplayName" class="h4" col="2" row="0" textWrap="true"></Label>
                <Label (tap)="onTap(item)" class="h4 reserve" col="3" text="REZERVOVAT"></Label>
            </GridLayout>
        </ng-template>

        <ng-template let-item="item" tkTemplateKey="expanded">
            <GridLayout columns="auto, auto,*, auto" rows="auto,auto">
                <Label class="fas" col="0" text="{{item.expanded ? downIcon : rightIcon}}"></Label>
                <!-- <Image col="1" [src]="item.image.src"></Image> -->
                <Label [text]="item.DisplayName" class="h4" col="2" row="0" textWrap="true"></Label>
                <Label (tap)="onTap(item)" class="h4 reserve" col="3" text="REZERVOVAT"></Label>

                <StackLayout col="0" colSpan="4" row="1" textWrap="true">
                    <LineInfoItem [value]="item.City" name="Umístění"></LineInfoItem>
                    <LineInfoItem [value]="item.UnitWithRegistrationNumber" name="Jednotka"></LineInfoItem>
                    <LineInfoItem [value]="item.RentPrice" name="Cena půjčení" type="price"></LineInfoItem>
                    <LineInfoItem [value]="item.InStock ? 'Ano' : 'Ne'" name="Skladem"></LineInfoItem>
                    <LineInfoItem *ngIf="item.RentNote" name="Poznámka" value=" "></LineInfoItem>
                    <Label [text]="item.RentNote" class="m-l-10" textWrap="true"
                           visibility="{{item.RentNote ? 'visible' : 'collapsed'}}"></Label>
                </StackLayout>
            </GridLayout>
        </ng-template>
    </RadListView>
</GridLayout>
