Files
pos-system/apps/web-client-tpos-net/src/WebClientTpos.Client/Pages/Auth/OtpVerify.razor

45 lines
1.3 KiB
Plaintext

@page "/auth/otp-verify"
@layout AuthLayout
@using WebClientTpos.Client.Components.Auth
@inherits AuthBase
@*
EN: OTP Verification page — 6-digit code input with countdown timer.
VI: Trang xác thực OTP — input 6 chữ số với đếm ngược.
Design: pencil-design/src/pages/tPOS/auth/workflow/otp-verify.pen
*@
<PageTitle>@L["Auth_OTP_PageTitle"]</PageTitle>
<div class="auth-page">
<AuthCard Title="@L["Auth_OTP_Title"]"
Subtitle="@L["Auth_OTP_Subtitle"]"
Icon="smartphone"
IconClass="auth-icon--green"
Compact="true">
<ChildContent>
<OtpInput OnComplete="HandleOtpComplete" />
<AuthButton Variant="orange">
@L["Auth_OTP_Submit"]
</AuthButton>
</ChildContent>
<FooterContent>
<div class="auth-timer">
<i data-lucide="clock"></i>
@L["Auth_OTP_ExpiresIn"] <span class="auth-timer-value">04:30</span>
</div>
<span class="auth-footer-text">
@L["Auth_OTP_NotReceived"] <a href="#">@L["Auth_OTP_Resend"]</a>
</span>
</FooterContent>
</AuthCard>
</div>
@code {
private async Task HandleOtpComplete(string code)
{
Console.WriteLine($"OTP entered: {code}");
}
}