@page "/mytransfers/{transferId:guid}"
@using TIAM.Entities.Transfers
@using TIAMWebApp.Shared.Application.Interfaces
@using AyCode.Core.Loggers
@using AyCode.Services.Loggers
@using TIAM.Core.Loggers
@using TIAM.Core.Enums
@using TIAMWebApp.Shared.Application.Utility
@inject HttpClient Http
@inject NavigationManager navManager
@inject IEnumerable<IAcLogWriterClientBase> LogWriters
@inject ITransferDataService transferDataService
<PageTitle>Transfer details</PageTitle>
<div class="text-center m-5">
    <h1>Transfer details</h1>
    <h2 style="font-size:small">Manage your transfer here</h2>
</div>

@if (isLoading)
{
    <div class="text-center m-5">
        <DxWaitIndicator Visible="true"
                         CssClass="m-auto"
                         AnimationType="WaitIndicatorAnimationType.Spin" />
    </div>
    
}
else if (!string.IsNullOrEmpty(errorMessage))
{
    <div class="alert alert-danger">@errorMessage</div>
}
else
{
    <div class="container mt-4">        

        @if (!editMode)
        {
            <section>
                <div class="container py-4">
                    <div class="row d-flex justify-content-center align-items-center h-100">
                        <div class="col-md-10 col-lg-8 col-xl-6">
                            <div class="card" style="border-radius: 16px;">
                                <div class="card-header py-3 px-4">
                                    <div class="d-flex justify-content-between align-items-center">
                                        <div>
                                            <span class="fw-bold text-body">Transfer identifier: @transfer.Id</span>
                                            <p class="text-muted mb-0">@transfer.ContactPhone</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="card-body p-4">
                                    <div class="mb-4 pb-2">
                                        <div class="mb-3">
                                            <h4 class="fw-bold">Passenger: @transfer.FullName</h4>
                                            <h4 class="fw-bold">E-mail address: @transfer.ContactEmail</h4>
                                            <h5 class="text-muted">From: @transfer.FromAddress</h5>
                                            <h5 class="text-muted">To: @transfer.ToAddress</h5>
                                            <h5>@transfer.Appointment.ToString("MMMM dd, yyyy")</h5>
                                            <h5 class="mb-3 text-muted">@transfer.Appointment.ToString("hh:mm tt")</h5>
                                            <p>Passengers: @transfer.PassengerCount</p>
                                            <p>Luggage: @transfer.LuggageCount</p>
                                            <p>Flight number (optional): @transfer.FlightNumber</p>
                                            <hr />
                                            <h3>License plate: POX-382</h3>
                                            <p class="text-muted">Car looks: Silver, Toyota, Prius</p>
                                            <hr />
                                            <p class="text-muted">Status on: <span class="text-body">@DateTime.Now.ToString("hh:mm tt"), @DateTime.Today.ToString("MMMM dd, yyyy")</span></p>
                                        </div>
                                    </div>
                                    <div class="d-flex justify-content-between align-items-center">
                                        <h4>EUR @transfer.Price <span class="small text-muted"> </span></h4>
                                    </div>
                                </div>
                                <div class="card-footer p-4">
                                    <div class="d-flex justify-content-between align-items-center">
                                        <h5 class="fw-normal mb-0"><a href="#!" class="text-decoration-none">Contact driver</a></h5>
                                        <div class="vr"></div>
                                        <h5 class="fw-normal mb-0"><a href="#!" class="text-decoration-none">Cancel</a></h5>
                                        <div class="vr"></div>
                                        <h5 class="fw-normal mb-0"><a class="btn btn-primary">Pay</a></h5>
                                        <div class="vr"></div>
                                        <h5 class="fw-normal mb-0"><a class="btn btn-secondary" @onclick="SetEditMode">Modify</a></h5>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </section>

        }

        else
        {


            <section>
                <div class="container py-1">
                    <div class="row d-flex justify-content-center align-items-center h-100">
                        <div class="col-md-10 col-lg-8 col-xl-6">
                            <DxFormLayout>
                                <div class="card card-admin card-stepper" style="border-radius: 16px;">
                                    <div class="card-header py-2 px-4">
                                        <div class="d-flex justify-content-between align-items-center">
                                            <div>
                                                <span class="fw-bold text-body">Transfer identifier: @transfer.Id</span>
                                                <p class="text-muted">
                                                    <DxFormLayoutItem ColSpanLg="12" CssClass="form-field dxbl-col-12" Caption="Contact Phone">
                                                        <DxTextBox @bind-Text="transfer.ContactPhone" />
                                                    </DxFormLayoutItem>
                                                </p>
                                            </div>
                                            <div>
                                                <h6 class="mb-0"> </h6>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="card-body p-4">
                                        <div class="d-flex flex-row mb-4 pb-2">
                                            <div class="flex-fill">

                                                <DxFormLayoutItem ColSpanLg="6" CssClass="form-field" Caption="First Name">
                                                    <DxTextBox @bind-Text="transfer.FirstName" />
                                                </DxFormLayoutItem>
                                                <DxFormLayoutItem ColSpanLg="6" CssClass="form-field" Caption="Last Name">
                                                    <DxTextBox @bind-Text="transfer.LastName" />
                                                </DxFormLayoutItem>

                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="Contact Email">
                                                    <DxTextBox @bind-Text="transfer.ContactEmail" />
                                                </DxFormLayoutItem>


                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="From Address">
                                                        <DxTextBox @bind-Text="transfer.FromAddress" />
                                                    </DxFormLayoutItem>

                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="To Address">
                                                        <DxTextBox @bind-Text="transfer.ToAddress" />
                                                    </DxFormLayoutItem>



                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="Appointment">
                                                        <DxDateEdit TimeSectionVisible="true" @bind-Date="transfer.Appointment" />
                                                    </DxFormLayoutItem>

                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="Passenger Count">
                                                        <DxSpinEdit @bind-Value="transfer.PassengerCount" />
                                                    </DxFormLayoutItem>

                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="Luggage Count">
                                                        <DxSpinEdit @bind-Value="transfer.LuggageCount" />
                                                    </DxFormLayoutItem>

                                                <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="Flight Number">
                                                        <DxTextBox @bind-Text="transfer.FlightNumber" />
                                                    </DxFormLayoutItem>
                                               
                                                <hr />
                                                <h4>License plate: POX-382</h4>
                                                <p class="text-muted">Car looks: Silver, Toyota, Prius</p>
                                                <hr />
                                                <p class="text-muted">Status on: <span class="text-body">@DateTime.Now.TimeOfDay, @DateTime.Today.Date</span></p>
                                            </div>


                                        </div>
                                        <!--ul id="progressbar-1" class="mx-0 mt-0 mb-5 px-0 pt-0 pb-4">
                                            <li class="step0 active" id="step1">
                                                <span style="margin-left: 22px; margin-top: 12px;">PLACED</span>
                                            </li>
                                            <li class="step0 active text-center" id="step2"><span>WAITING FOR PICK UP</span></li>
                                            <li class="step0 text-muted text-end" id="step3">
                                                <span style="margin-right: 22px;">ARRIVED</span>
                                            </li>
                                        </ul-->

                                        <div class="d-flex flex-row mb-4 pb-2">
                                            <h4> EUR @transfer.Price <span class="small text-muted"> via (COD) </span></h4>
                                        </div>
                                        <div class="d-flex flex-row mb-4 pb-2">
                                            <DxFormLayoutItem ColSpanLg="12" CssClass="form-field" Caption="Comment">
                                                <DxMemo @bind-Text="transfer.Comment" />
                                            </DxFormLayoutItem>
                                        </div>
                                    </div>
                                    <div class="card-footer p-4">
                                        <div class="d-flex justify-content-between">
                                            <DxButton Click="UpdateTransfer">Save Changes</DxButton>

                                        </div>
                                    </div>
                                </div>
                            </DxFormLayout>
                        </div>
                    </div>
                </div>
            </section>


        }

    </div>
}

@code {
    [Parameter]
    public Guid transferId { get; set; } = Guid.Empty;

    private Transfer transfer = new Transfer();
    private bool isLoading = true;
    private string errorMessage = string.Empty;

    private LoggerClient<EditTransfers> _logger;

    List<string> StatusTypes = new List<string>();
    private bool editMode = false;

    protected override async Task OnInitializedAsync()
    {
        foreach (var t in Enum.GetValues(typeof(TransferStatusType)).OfType<TransferStatusType>().ToList())
            StatusTypes.Add(t.ToString());

        _logger = new LoggerClient<EditTransfers>(LogWriters.ToArray());
        _logger.Info($"parameter: {transferId.ToString()}");
        await LoadTransfer();
    }

    protected override async Task OnParametersSetAsync()
    {
        _logger.Info($"on parameter set: {transferId.ToString()}");
        base.OnParametersSet();
    }

    private void SetEditMode()
    {
        editMode = true;
    }

    private async Task LoadTransfer()
    {
        try
        {
            var response = await transferDataService.GetTransferByIdAsync(transferId);

            if (response != null)
            {
                transfer = response;
            }

            else
            {
                errorMessage = $"Error loading transfer: {transfer.Id}";
            }
        }
        catch (Exception ex)
        {
            errorMessage = $"Exception: {ex.Message}";
        }
        isLoading = false;
    }

    private async Task UpdateTransfer()
    {
        try
        {
            var result = await transferDataService.UpdateTransferAsync(transfer);
            if (result)
            {
                navManager.NavigateTo("/mytransfers"); // Redirect to a list or another page after successful update
            }
            else
            {
                errorMessage = $"Error updating transfer: {result.ToString()}";
            }
        }
        catch (Exception ex)
        {
            errorMessage = $"Exception: {ex.Message}";
        }
    }
}