使用新的密码框组件

Author: JiuLing-zhang

src/ComputerLock/Components/ResetPassword.razor

@@ -1,19 +1,22 @@
 <MudDialog>
     <DialogContent>
-        <MudTextField @bind-Value="_currentPassword"
-                      Label="@(Lang["CurrentPassword"])"
-                      InputType="InputType.Password"
-                      Variant="Variant.Text" />
+        <MudPaper Width="350px" Elevation="0">
+            <MudPasswordField @bind-Value="@_currentPassword"
+                              Variant="Variant.Text"
+                              Label="@(Lang["CurrentPassword"])"
+                              IconSize="Size.Small" />
 
-        <MudTextField @bind-Value="_newPassword"
-                      Label="@(Lang["NewPassword"])"
-                      InputType="InputType.Password"
-                      Variant="Variant.Text" />
+            <MudPasswordField @bind-Value="@_newPassword"
+                              Class="my-2"
+                              Variant="Variant.Text"
+                              Label="@(Lang["NewPassword"])"
+                              IconSize="Size.Small" />
 
-        <MudTextField @bind-Value="_confirmPassword"
-                      Label="@(Lang["ConfirmPassword"])"
-                      InputType="InputType.Password"
-                      Variant="Variant.Text" />
+            <MudPasswordField @bind-Value="@_confirmPassword"
+                              Variant="Variant.Text"
+                              Label="@(Lang["ConfirmPassword"])"
+                              IconSize="Size.Small" />
+        </MudPaper>
     </DialogContent>
     <DialogActions>
         <MudButton Color="Color.Primary"

src/ComputerLock/Components/SetPassword.razor

@@ -1,12 +1,8 @@
-<MudTextField @bind-Value="_password"
-              Class="mt-6"
-              Label="@(Lang["SetPasswordInput"])"
-              Variant="Variant.Text"
-              InputType="@_passwordInputType"
-              Adornment="Adornment.End"
-              AdornmentIcon="@_passwordInputIcon"
-              IconSize="Size.Small"
-              OnAdornmentClick="ShowPassword" />
+<MudPasswordField @bind-Value="@_password"
+                  Class="mt-6"
+                  Variant="Variant.Text"
+                  Label="@(Lang["SetPasswordInput"])"
+                  IconSize="Size.Small" />
 
 <MudButton Class="mt-4"
            FullWidth="true"

src/ComputerLock/Components/SetPassword.razor.cs

@@ -7,11 +7,7 @@ public partial class SetPassword
     [Inject]
     private ISnackbar Snackbar { get; set; } = default!;
 
-
-    private bool _isShow;
     private string _password = "";
-    private InputType _passwordInputType = InputType.Password;
-    private string _passwordInputIcon = Icons.Material.Filled.VisibilityOff;
 
     [Parameter]
     public EventCallback<string> PasswordSetFinished { get; set; }
@@ -21,22 +17,6 @@ protected override async Task OnInitializedAsync()
         await base.OnInitializedAsync();
     }
 
-    private void ShowPassword()
-    {
-        if (_isShow)
-        {
-            _isShow = false;
-            _passwordInputIcon = Icons.Material.Filled.VisibilityOff;
-            _passwordInputType = InputType.Password;
-        }
-        else
-        {
-            _isShow = true;
-            _passwordInputIcon = Icons.Material.Filled.Visibility;
-            _passwordInputType = InputType.Text;
-        }
-    }
-
     private async Task SavePasswordAsync()
     {
         if (_password.IsEmpty())