@page "/Register"
@using Front.Services
@using Shared.DTOs
@inject HttpClient _hc
@inject NavigationManager nav
@inject localService localserv;
<PageTitle>مودیران / ثبت نام</PageTitle>
<main>

    <!-- tp-banner-area-start -->
    <div class="signin-banner-area signin-banner-main-wrap d-flex align-items-center">
        <div class="signin-banner-left-box signin-banner-bg p-relative">
            <div class="signin-banner-bottom-shape">
                <img src="img/login/login-shape-1.png" alt="">
            </div>
            <div class="signin-banner-left-wrap">
                <div class="signin-banner-title-box mb-100">
                    <br />
                    <h4 class="signin-banner-title" style="color:black">
                      برای استفاده از همه بخش ها <br /> ثبت نام کنید
                    </h4>
                </div>
                <div class="signin-banner-img-box position-relative">
                    <div class="signin-banner-img signin-img-1 d-none d-md-block z-index-3">
                        <img src="img/login/login-2.png" alt="">
                    </div>
                    <div class="signin-banner-img signin-img-2 d-none d-md-block">
                        <img src="img/login/login-1.png" alt="">
                    </div>
                    <div class="signin-banner-img signin-img-3 d-none d-md-block z-index-5">
                        <img src="img/login/login-3.png" alt="">
                    </div>
                    <div class="signin-banner-img signin-img-4 d-none d-sm-block">
                        <img src="img/login/login-4.png" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="signin-banner-from d-flex justify-content-center align-items-center">
            <div class="signin-banner-from-wrap">
                <div class="signin-banner-title-box">
                    <h4 class="signin-banner-from-title">ثبت نام</h4>
                </div>
              
                <div class="signin-banner-from-box">
                    
                   <EditForm EditContext="editContext" OnValidSubmit="OnRegisterClick">
                        <DataAnnotationsValidator />
                            <div class="postbox__comment-input mb-35">
                                <ValidationMessage For="()=>model.CompanyName" />
                                <ValidationMessage For="()=>model.Mobile" />
  
                            </div>
                        <div class="row">
                            <div class="col-12">
                                <div class="postbox__comment-input mb-30">
                                    <InputText style="text-align:center" onkeydown="@OnClearmessageStore" @bind-Value="model.CompanyName" id="CompanyName" type="text" class="inputText" required="" />
                                    <span class="floating-label">نام کامل</span>
                                </div>
                            </div>
                            <div class="col-12">
                                <div class="postbox__comment-input mb-30">
                                    <InputText style="text-align:center" dir="ltr" onkeydown="@OnClearmessageStore" @bind-Value="model.Mobile" id="Mobile" type="number" class="inputText" required="" />
                                    <span class="floating-label">موبایل</span>
                                </div>
                            </div>
                        </div>
                        <div class="col-2">
                            <Spinner Visible="SpinnerVisible" Color="SpinnerColor.Primary" />
                        </div>
                        <div class="signin-banner-from-btn mb-20">
                            <button hidden="@hidden" type="submit" class="signin-btn ">ثبت نام</button>
                        </div>
                    </EditForm>
                  
                    
                    <div class="signin-banner-from-register">
                        <NavLink hidden="@hidden" href="Sign-in">ثبت نام کردید؟ <span>ورود</span></NavLink>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- tp-banner-area-end -->
</main>

@code {
    public string hidden { get; set; }
    public bool SpinnerVisible { get; set; } = false;
    string type = "CompanyRegistration";
    private EditContext? editContext;
    [SupplyParameterFromForm]
    private CompanyRegistrationDTO? model { get; set; } = new CompanyRegistrationDTO();
    private ValidationMessageStore? messageStore;

    protected override async Task OnInitializedAsync()
    {

        editContext = new EditContext(model);
        messageStore = new(editContext);
    
        if (await localserv.OnlineUser())
            nav.NavigateTo("/");

        await base.OnInitializedAsync();
    }
}
@functions{
    private async Task OnClearmessageStore() => messageStore?.Clear();
    private async Task OnRegisterClick()
    {
        SpinnerVisible = !SpinnerVisible;
        hidden = "hidden";
        var request = await _hc.PostAsJsonAsync("Base/CompanyRegistration", model);
        if (request.IsSuccessStatusCode)
        {
            messageStore?.Clear();
            var VerificationID = await request.Content.ReadFromJsonAsync<int>();
            nav.NavigateTo($"Verification/{VerificationID}");
        }
        else
        {
            var error = await request.Content.ReadFromJsonAsync<List<string>>();
            messageStore?.Add(() => model.Mobile, error);

        }
        hidden = null;
        SpinnerVisible = !SpinnerVisible;
    }
}