SensoFarm/BlazorPages/Pages/Login/Login.razor

@page "/login"
@using BootStrapComponents
@using Components
@using Models.Identity
@layout LayoutWithoutMenu
<style>
    form {
        min-height: 300px;
    }
</style>

<div class="login text-center p-5">
    <div class="logo">
        <img src="assets/img/logo.svg" alt="">
    </div>
    <EditForm Model="@LoginModel" OnValidSubmit="Submit">
        <DataAnnotationsValidator />
        <div class="d-flex flex-column">
            <input type="email" @bind="LoginModel.Username" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter Email">
            <input type="password" @bind="LoginModel.Password" class="form-control mt-2" id="exampleInputPassword1" placeholder="Password">
            <a href="" class="btn text-right">Forgot Password?</a>
            <button class="btn btn-primary mt-2">
                @(Loading ? "Wait..." : "Login")
            </button>
            <ValidationSummary></ValidationSummary>
        </div>
    </EditForm>
    <div class="d-flex flex-column">
        <div class="title_line">Or Login with</div>
        <div class="d-flex social_login">
            <a href="" class="btn"><img src="assets/img/google_ic.svg"></a>
        </div>
    </div>

    <div>
        Don’t have an account? <a href="/Signup" class="bold text-secondary">Register Now</a>
    </div>

</div>

@code {

    protected LoginModel LoginModel { get; set; } = new();
    protected bool Loading { set; get; }
    protected async Task Submit()
    {
        Loading = true;
        StateHasChanged();
        var response = await _userUtils.LoginWithPasswordRequest(LoginModel);
        Loading = false;
        if (response.IsSuccessStatusCode)
        {
            var result = await response.Content.ReadFromJsonAsync<Models.Identity.PlainToken>();
            await LocalStorage.SetItemAsync(Statics.LoginTokenKey, result.AccessToken);
            NavManager.NavigateTo("/dashboard");
        }
    }
}