docker
This commit is contained in:
@@ -45,38 +45,17 @@
|
||||
|
||||
<div class="d-flex justify-content-center">
|
||||
|
||||
<div class="verification-inputs" style="display: flex; gap: 8px; direction: ltr;">
|
||||
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
|
||||
@bind="code1" @oninput="MoveNext"
|
||||
style="width: 45px; height: 45px; text-align: center; border: 2px solid #ccc; border-radius: 8px; font-size: 18px; font-weight: bold;"
|
||||
@ref="input1" autoFocus />
|
||||
|
||||
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
|
||||
@bind="code2" @oninput="MoveNext"
|
||||
style="width: 45px; height: 45px; text-align: center; border: 2px solid #ccc; border-radius: 8px; font-size: 18px; font-weight: bold;"
|
||||
@ref="input2" />
|
||||
|
||||
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
|
||||
@bind="code3" @oninput="MoveNext"
|
||||
style="width: 45px; height: 45px; text-align: center; border: 2px solid #ccc; border-radius: 8px; font-size: 18px; font-weight: bold;"
|
||||
@ref="input3" />
|
||||
|
||||
<input maxlength="1" type="text" inputmode="numeric" pattern="[0-9]*"
|
||||
@bind="code4" @oninput="OnLastInput"
|
||||
style="width: 45px; height: 45px; text-align: center; border: 2px solid #ccc; border-radius: 8px; font-size: 18px; font-weight: bold;"
|
||||
@ref="input4" />
|
||||
|
||||
</div>
|
||||
<input class="cus-input" maxlength='4' @bind-value="Code" @bind-value:event="oninput"/>
|
||||
|
||||
</div>
|
||||
<Button Color="ButtonColor.Link"
|
||||
Disabled="@isButtonDisabled"
|
||||
@onclick="async () =>
|
||||
Disabled="@isButtonDisabled"
|
||||
@onclick="async () =>
|
||||
{
|
||||
await verificationService.ReSendCode(ID);
|
||||
await verifiTimer();
|
||||
}"
|
||||
Style="padding: 6px 16px; font-size: 14px; background-color: #f8f9fa; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;margin-bottom: -10px;">
|
||||
Style="padding: 6px 16px; font-size: 14px; background-color: #f8f9fa; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;margin-bottom: -10px;">
|
||||
|
||||
<span>ارسال مجدد</span>
|
||||
|
||||
@@ -98,9 +77,16 @@
|
||||
[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 _code = string.Empty;
|
||||
public string Code { get { return _code; } set
|
||||
{
|
||||
_code=value;
|
||||
if (value.Length == 4)
|
||||
ver().ConfigureAwait(true);
|
||||
|
||||
} }
|
||||
//-----------------
|
||||
private string code1, code2, code3, code4;
|
||||
// private string code1, code2, code3, code4;
|
||||
private ElementReference input1, input2, input3, input4;
|
||||
string validateStyleUser = "";
|
||||
private bool isButtonDisabled = true;
|
||||
@@ -161,35 +147,35 @@
|
||||
await OnMultipleOfThree.InvokeAsync();
|
||||
visible = 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 (!string.IsNullOrEmpty(code4) && code4.Length == 1)
|
||||
// {
|
||||
// Code = $"{code1}{code2}{code3}{code4}";
|
||||
|
||||
await ver();
|
||||
}
|
||||
}
|
||||
// await ver();
|
||||
// }
|
||||
// }
|
||||
}
|
||||
<script>
|
||||
function formatPhoneNumber(input) {
|
||||
@@ -281,4 +267,22 @@
|
||||
box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
.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>
|
Reference in New Issue
Block a user