This commit is contained in:
mmrbnjd
2025-10-03 23:30:50 +03:30
parent 4e31d34164
commit ba3bffd9eb
8 changed files with 156 additions and 137 deletions

View File

@@ -1,5 +1,4 @@

@using Common.Dtos.Verification
@using Common.Dtos.Verification
@using Common.Enums
@using HushianWebApp.Service
@inject VerificationService verificationService;
@@ -10,27 +9,9 @@
</div>
@if (type == VerificationCodeType.ForgetPassword)
{
<div style="justify-content: space-between;margin-top:5px;;margin-bottom:15px">
<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" />
<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 style="justify-content: space-between;margin-top:5px;margin-bottom:15px">
<input class="cus-input" maxlength='4' @bind-value="code" @bind-value:event="oninput" />
</div>
<div style="justify-content: space-between">
<TextInput @bind-value=Value type="password" name="Value" style="text-align:center;margin-top: 10px;;margin-left: 10px" placeholder="کلمه عبور جدید" required="required" />
@@ -43,27 +24,7 @@
else
{
<div style="justify-content: space-between;margin-top:5px">
<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" />
<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" />
<input class="cus-input" maxlength='4' @bind-value="code" @bind-value:event="oninput" />
</div>
}
@@ -82,7 +43,18 @@ else
public string sendValue { get; set; }
[Parameter]
public int? ID { get; set; }
public string? code { get; set; }
private string? _code = string.Empty;
public string? code
{
get { return _code; }
set
{
_code = value;
if (value.Length == 4)
onClick().ConfigureAwait(true);
}
}
[Parameter] public string? Title { get; set; }
[Inject] protected ToastService ToastService { get; set; } = default!;
[Parameter] public EventCallback<VerificationCodeType> OnMultipleOfThree { get; set; }
@@ -92,7 +64,7 @@ else
string resendmsg = "ارسال مجدد";
bool Disabledresendmsg = false;
//-----------------
private string code1, code2, code3, code4;
//private string code1, code2, code3, code4;
private ElementReference input1, input2, input3, input4;
}
@@ -144,14 +116,16 @@ else
else
{
if (Value != ReValue)
{ ToastService.Notify(new(ToastType.Warning, $"کلمه عبور جدید و تکرار متفاوت هستند"));
return;}
{
ToastService.Notify(new(ToastType.Warning, $"کلمه عبور جدید و تکرار متفاوت هستند"));
return;
}
}
}
loading = true;
loading = true;
if (await verificationService.ConfirmedCode(new ConfirmedCodeDto()
{ code = code, codeType = type, Id = ID.Value, value = Value }))
{
@@ -161,35 +135,54 @@ else
}
loading = false;
}
private async Task MoveNext(ChangeEventArgs e)
{
if (e.Value?.ToString()?.Length == 1)
{
if (input1.Context == null) return;
// 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(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}";
if(type==VerificationCodeType.PhoneNumberConfirmed)
await onClick();
}
}
// if (!string.IsNullOrEmpty(code) && code.Length == 4)
// {
// // code = $"{code1}{code2}{code3}{code4}";
// if (type == VerificationCodeType.PhoneNumberConfirmed)
// await onClick();
// }
// }
}
<style>
.cus-input {
direction: ltr;
display: block;
margin: 2em auto;
border: none;
padding: 0;
width: 6ch;
background: repeating-linear-gradient(90deg, dimgrey 0, dimgrey 1ch, transparent 0, transparent 1.5ch) 0 100%/ 5.5ch 2px no-repeat;
font: 5ch droid sans mono, consolas, monospace;
letter-spacing: 0.5ch;
}
input:focus {
outline: none;
color: dodgerblue;
}
</style>