@page "/MedicalHistoryTemplateActionPage"
@page "/MedicalHistoryTemplateActionPage/{TemplateId:string}"
@inject NavigationManager NavigationManager
@inject IRestWrapper RestWrapper
@inject IUserUtility UserUtility
@inject ISnackbar Snackbar

<BasePageUi Title="افزودن یک شرحال جدید" Description="لطفا اطلاعات بیمار را با دقت کامل وارد کنید">

    <div class="flex flex-col w-full h-full rounded-t-xl">

        <MudCarousel class="w-full h-full overflow-x-hidden overflow-y-scroll" @ref="@ViewModel.Carousel" ShowArrows="false"
                     ShowBullets="false" EnableSwipeGesture="false" AutoCycle="false" TData="object">

            <MudCarouselItem>
                <div class="flex flex-col w-full h-full">
                    <MedicalHistoryTemplateActionStep1 @bind-ChiefComplaint="@ViewModel.PageDto.ChiefComplaint" @bind-SelectedSection="@ViewModel.SelectedSelection" />
                </div>
            </MudCarouselItem>
            <MudCarouselItem>
                <div class="flex flex-col h-full">
                    <MedicalHistoryTemplateActionStep2 PiQuestions="@ViewModel.PiQuestions" />
                </div>
            </MudCarouselItem>
            <MudCarouselItem>
                <div class="flex flex-col h-full">
                    <MedicalHistoryTemplateActionStep3 PdhQuestions="@ViewModel.PdhQuestions" PshQuestions="@ViewModel.PshQuestions" />
                </div>
            </MudCarouselItem>
            <MudCarouselItem>
                <div class="flex flex-col h-full">
                    <MedicalHistoryTemplateActionStep4 FamilyHistories="@ViewModel.FhQuestions" DrugHistories="@ViewModel.DhQuestions" AhMedicines="@ViewModel.AhQuestions" />
                </div>
            </MudCarouselItem>
            <MudCarouselItem>
                <div class="flex flex-col h-full">
                    <MedicalHistoryTemplateActionStep5 VitalSigns="@ViewModel.VsQuestions" />
                </div>
            </MudCarouselItem>
            <MudCarouselItem>
                <div class="flex flex-col h-full">
                    <MedicalHistoryTemplateActionStep6 SubmittedOnClick="@ViewModel.SubmitCreateTemplateAsync" />
                </div>
            </MudCarouselItem>
        </MudCarousel>

        @if (!@ViewModel.MedicalHistorySubmitted)
        {
            if (@ViewModel.IsProcessing)
            {
                <MudPaper class="bottom-0 left-0 fixed w-full bg-gray-700 px-3 pt-4 pb-3 rou nded-t-xl flex flex-row">

                    <div class="flex flex-row w-full mx-auto">
                        <MudProgressCircular class="my-auto mr-1 -ml-4" Size="Size.Small" Color="Color.Warning" Indeterminate="true" />
                        <p class="font-extrabold my-0 mr-7 text-lg text-[--color-medicalhistory]">منتظر بمانید</p>
                    </div>

                </MudPaper>                
            }
            else
            {
                <MudPaper class="bottom-0 left-0 fixed w-full bg-gray-700 px-3 pt-4 pb-3 rounded-t-xl flex flex-row">

                    @if (@ViewModel.CurrentStep == 4)
                    {
                        <MudButton @onclick="@ViewModel.CompleteStepClicked" Variant="Variant.Filled" IconSize="Size.Large" StartIcon="@Icons.Material.Filled.ChevronRight" class="font-extrabold rounded-full bg-[--color-medicalhistory]">تـــکمیل</MudButton>
                    }
                    else
                    {
                        <MudButton @onclick="@ViewModel.CompleteStepClicked" Variant="Variant.Outlined" IconSize="Size.Large"
                                   StartIcon="@Icons.Material.Filled.ChevronRight" class="font-extrabold rounded-full  border-[--color-medicalhistory] text-[--color-medicalhistory]">
                            مرحله بعد
                        </MudButton>
                    }

                    <p class="my-auto text-lg text-[--color-medicalhistory] font-extrabold text-center grow">@ViewModel.StepCounter</p>
                    <MudButton @onclick="@ViewModel.RollBackStepClicked" IconSize="Size.Large" EndIcon="@Icons.Material.Filled.ChevronLeft"
                               class="font-extrabold text-[--color-medicalhistory] rounded-full">مرحله قبل</MudButton>
                </MudPaper>
            }
        }
    </div>
</BasePageUi>

@code {
    [Parameter]
    public string TemplateId { get; set; }
    public MedicalHistoryTemplateActionPageViewModel ViewModel { get; set; }
    protected override async Task OnInitializedAsync()
    {
        ViewModel = new MedicalHistoryTemplateActionPageViewModel(NavigationManager,Snackbar,RestWrapper,UserUtility);
        await ViewModel.InitializeAsync();
        await base.OnInitializedAsync();
    }

}