| | 1 | | @namespace Syki.Front.Features.Cross.SetupMfa |
| | 2 | |
|
| | 3 | | <MudPaper Style="position: relative; height: 100%"> |
| | 4 | | <MudOverlay @bind-Visible="@_validateCodeLoading" LightBackground="true" Absolute="true"> |
| | 5 | | <MudProgressCircular Color="Color.Info" Indeterminate="true" Size="Size.Large" /> |
| | 6 | | </MudOverlay> |
| | 7 | |
|
| | 8 | | <MudCard Class="px-4 py-0" Elevation="0" Style="height: 100%"> |
| | 9 | | <MudCardContent> |
| | 10 | | <MudStack AlignItems="AlignItems.Center"> |
| | 11 | | <MudAlert NoIcon="true" Severity="Severity.Info" Variant="Variant.Text"> |
| | 12 | | <MudStack Row="true" Justify="Justify.SpaceAround"> |
| | 13 | | <MudText>Insira o código gerado pelo app para finalizar o setup</MudText> |
| | 14 | | </MudStack> |
| | 15 | | </MudAlert> |
| | 16 | | <MudForm> |
| | 17 | | <style> |
| | 18 | | .align-center input{ |
| | 19 | | text-align: center; |
| | 20 | | } |
| | 21 | | </style> |
| | 22 | | <MudNumericField |
| | 23 | | T="int?" |
| | 24 | | Immediate="true" |
| | 25 | | OnlyValidateIfDirty="true" |
| | 26 | | ReadOnly="@_validateCodeLoading" |
| | 27 | | Disabled="@_codeIsCorrect" |
| | 28 | | Style="width: 200px;" |
| | 29 | | Value="@_userCode" |
| | 30 | | ValueChanged="@HandleCodeChanged" |
| | 31 | | Variant="Variant.Outlined" |
| | 32 | | HideSpinButtons="true" |
| | 33 | | Typo="Typo.h6" |
| | 34 | | Class="mt-8" |
| | 35 | | Margin="Margin.Dense" |
| | 36 | | Max="999999" |
| | 37 | | MaxLength="6" |
| | 38 | | Min="0" |
| | 39 | | /> |
| | 40 | | </MudForm> |
| | 41 | |
|
| 0 | 42 | | @if (_showCodeFeedback && !_codeIsCorrect) |
| | 43 | | { |
| | 44 | | <MudAlert Class="mt-2" Severity="Severity.Error" Variant="Variant.Text"> |
| | 45 | | <MudStack Row="true" Justify="Justify.SpaceAround"> |
| | 46 | | <MudText>Código inválido</MudText> |
| | 47 | | </MudStack> |
| | 48 | | </MudAlert> |
| | 49 | | } |
| | 50 | | </MudStack> |
| | 51 | | </MudCardContent> |
| | 52 | | </MudCard> |
| | 53 | | </MudPaper> |
| | 54 | |
|
| | 55 | | @inject SetupMfaClient Client |
| | 56 | | @inject IDialogService DialogService |
| | 57 | | @inject IBrowserViewportService BrowserViewportService |
| | 58 | |
|
| | 59 | | @code |
| | 60 | | { |
| | 61 | | private int? _userCode; |
| | 62 | | private bool _validateCodeLoading; |
| | 63 | | private bool _showCodeFeedback; |
| | 64 | | private bool _codeIsCorrect; |
| | 65 | |
|
| | 66 | | private async Task HandleCodeChanged(int? newValue) |
| | 67 | | { |
| 0 | 68 | | _showCodeFeedback = false; |
| 0 | 69 | | _userCode = newValue; |
| | 70 | |
|
| 0 | 71 | | if (_userCode != null && _userCode.ToString().Length == 6) |
| | 72 | | { |
| 0 | 73 | | _validateCodeLoading = true; |
| 0 | 74 | | _codeIsCorrect = await Client.Setup(_userCode.ToString()!); |
| 0 | 75 | | _showCodeFeedback = true; |
| 0 | 76 | | _validateCodeLoading = false; |
| | 77 | | } |
| | 78 | |
|
| 0 | 79 | | if (_codeIsCorrect) |
| | 80 | | { |
| 0 | 81 | | await OpenDialog(); |
| | 82 | | } |
| 0 | 83 | | } |
| | 84 | |
|
| | 85 | | private async Task OpenDialog() |
| | 86 | | { |
| 0 | 87 | | var breakpoint = await BrowserViewportService.GetCurrentBreakpointAsync(); |
| 0 | 88 | | var options = new DialogOptions { |
| 0 | 89 | | FullWidth = true, |
| 0 | 90 | | CloseButton = false, |
| 0 | 91 | | MaxWidth = MaxWidth.ExtraSmall, |
| 0 | 92 | | FullScreen = breakpoint == Breakpoint.Xs, |
| 0 | 93 | | }; |
| 0 | 94 | | await DialogService.ShowAsync<SetupMfaDialog>("", options); |
| 0 | 95 | | } |
| | 96 | | } |