@page "/transfer"
@using TIAMSharedUI.Shared
@using TIAMWebApp.Shared.Application.Interfaces
@inject ITransferDataService transferDataService

<PageTitle>Transfer</PageTitle>

<div class="text-center m-5">
    <h1>Transfer</h1>
    <h2 style="font-size:small">Swipe to select your destination!</h2>
</div>


    <SliderItemSelector @ref="slider" OnSliderChanged=@DisplaySlideData></SliderItemSelector>

<div class="wrapper">    
    <div class="text-center name">
        @message
    </div>
    <form class="p-3 mt-2">
        <div class="form-field d-flex align-items-center">
            <input type="tel" name="phone" id="phone" placeholder="Pick up address">
        </div>
        <div class="form-field d-flex align-items-center">            
            <input type="text" name="address" id="address" placeholder="Pick up address">
        </div>
        <div class="form-field d-flex align-items-center">
            <input type="date" name="date" id="date" placeholder="Date of transfer">
        </div>
        <div class="form-field d-flex align-items-center">
            <input type="time" name="time" id="time" placeholder="Time of transfer">
        </div>
        <div class="form-field d-flex align-items-center">
            <input type="number" name="time" id="passengers" placeholder="Number of passangers">
        </div>

        <a class="btn btn-primary mt-3" @onclick="next">Next</a>
    </form>    
</div>




@code {
    SliderItemSelector slider;
    public string message;    

    void DisplaySlideData()
    {
        message = " Target destination is " + slider.SliderElementId.ToString(); 
    }

    /*protected override void OnAfterRender(bool isFirst)
        {
        message = " Target destination is " + slider.SliderElementId.ToString();
    }*/

    public void next()
    {
        
    }

    protected override async Task OnInitializedAsync()
    {
        var suppliers = await transferDataService.GetDestinationsAsync();
        Console.WriteLine(string.Join("; ", suppliers.Select(x => x.Name)));
    }

}