Files
Hushian/Presentation/HushianWebApp/Pages/FromUserSide/LoginComponent.razor
mmrbnjd 574a4d3ed6 ...
2025-07-27 16:04:28 +03:30

120 lines
4.5 KiB
Plaintext

@using HushianWebApp.Service
@inject AuthService AuthService
<div class="text-end mb-3">
<span class="badge bg-info p-2">نیاز برای ارتباط با کارشناسان وارد شود</span>
</div>
<div class=" group w-full">
<Spinner Class="me-3" Type="SpinnerType.Dots" Color="SpinnerColor.Primary" Visible="@visible" />
@if (ID==0)
{
<label for="user-name" class="block mb-2 text-slate-600 font-bold">
شماره همراه / نام کاربری
</label>
<div class="d-flex">
<div class="container-input" style="width:150px;margin-left:5px">
<input disabled="@visible" style="text-align:center;height:30px" type="number" id="user-name" maxlength="64"
@bind-value=Username title="نام کاربری را وارد کنید." class="input-form input_vk_1" required="" data-val="true" data-val-required="شماره همراه / نام کاربری را وارد کنید." name="Username">
</div>
<Button disabled="visible" Color="ButtonColor.Primary" Type="ButtonType.Submit" @onclick="Login" class="btn-primary"
style="text-align:center;height:30px">
ورود
</Button>
</div>
}
else{
<label for="user-name" class="block mb-2 text-slate-600 font-bold">
جهت احراز کد ارسال شده را وارد کنید
</label>
<div class="d-flex">
<div style="width:200px;margin-left:5px;direction: ltr;">
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
@bind="code1" @oninput="MoveNext"
style="width: 40px; height: 40px; text-align: center; border: 2px solid #ccc; border-radius: 5px; font-size: 20px;"
@ref="input1" autoFocus />
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
@bind="code2" @oninput="MoveNext"
style="width: 40px; height: 40px; text-align: center; border: 2px solid #ccc; border-radius: 5px; font-size: 20px;"
@ref="input2" />
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
@bind="code3" @oninput="MoveNext"
style="width: 40px; height: 40px; text-align: center; border: 2px solid #ccc; border-radius: 5px; font-size: 20px;"
@ref="input3" />
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
@bind="code4" @oninput="OnLastInput"
style="width: 40px; height: 40px; text-align: center; border: 2px solid #ccc; border-radius: 5px; font-size: 20px;"
@ref="input4" />
</div>
</div>
}
</div>
@code {
private bool visible = false;
[Parameter] public EventCallback OnMultipleOfThree { get; set; }
public string Username { get; set; }
public int ID { get; set; } = 0;
public string Code { get; set; } = string.Empty;
//-----------------
private string code1, code2, code3, code4;
private ElementReference input1, input2, input3, input4;
}
@functions{
async Task Login()
{
visible = true;
ID= await AuthService.login(new Common.Models.Auth.UserSide.AuthRequestFromUserSide()
{
Mobile=Username
});
visible = false;
}
async Task ver()
{
visible = true;
if(await AuthService.Verificationlogin(ID, Code))
await OnMultipleOfThree.InvokeAsync();
visible = false;
}
private async Task MoveNext(ChangeEventArgs e)
{
if (e.Value?.ToString()?.Length == 1)
{
if (input1.Context == null) return;
if (string.IsNullOrEmpty(code1))
await input2.FocusAsync();
else if (string.IsNullOrEmpty(code2))
await input3.FocusAsync();
else if (string.IsNullOrEmpty(code3))
await input4.FocusAsync();
else if (string.IsNullOrEmpty(code4))
{
Code = $"{code1}{code2}{code3}{code4}";
}
}
}
private async Task OnLastInput(ChangeEventArgs e)
{
code4 = e.Value?.ToString();
if (!string.IsNullOrEmpty(code4) && code4.Length == 1)
{
Code = $"{code1}{code2}{code3}{code4}";
await ver();
}
}
}