Updated account management views

This commit is contained in:
Pat Hartl 2023-01-18 19:29:50 -06:00
parent 45be2f7d89
commit b52ee7e6de
4 changed files with 63 additions and 57 deletions

View file

@ -1,35 +1,40 @@
@page @page
@model ChangePasswordModel @model ChangePasswordModel
@{ @{
ViewData["Title"] = "Change password"; ViewData["Title"] = "Change Password";
ViewData["ActivePage"] = ManageNavPages.ChangePassword; ViewData["ActivePage"] = ManageNavPages.ChangePassword;
} }
<h3>@ViewData["Title"]</h3> <form id="change-password-form" method="post" class="col d-flex flex-column">
<partial name="_StatusMessage" for="StatusMessage" /> <div class="card-body">
<div class="row"> <h2 class="mb-4">Change Password</h2>
<div class="col-md-6"> <div class="row g-3">
<form id="change-password-form" method="post"> <div class="col-md">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-floating">
<input asp-for="Input.OldPassword" class="form-control" autocomplete="current-password" aria-required="true" />
<label asp-for="Input.OldPassword" class="form-label"></label> <label asp-for="Input.OldPassword" class="form-label"></label>
<input asp-for="Input.OldPassword" class="form-control" autocomplete="current-password" aria-required="true" />
<span asp-validation-for="Input.OldPassword" class="text-danger"></span> <span asp-validation-for="Input.OldPassword" class="text-danger"></span>
</div> </div>
<div class="form-floating">
<input asp-for="Input.NewPassword" class="form-control" autocomplete="new-password" aria-required="true" /> <div class="col-md">
<label asp-for="Input.NewPassword" class="form-label"></label> <label asp-for="Input.NewPassword" class="form-label"></label>
<input asp-for="Input.NewPassword" class="form-control" autocomplete="new-password" aria-required="true" />
<span asp-validation-for="Input.NewPassword" class="text-danger"></span> <span asp-validation-for="Input.NewPassword" class="text-danger"></span>
</div> </div>
<div class="form-floating">
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" /> <div class="col-md">
<label asp-for="Input.ConfirmPassword" class="form-label"></label> <label asp-for="Input.ConfirmPassword" class="form-label"></label>
<input asp-for="Input.ConfirmPassword" class="form-control" autocomplete="new-password" aria-required="true" />
<span asp-validation-for="Input.ConfirmPassword" class="text-danger"></span> <span asp-validation-for="Input.ConfirmPassword" class="text-danger"></span>
</div> </div>
<button type="submit" class="w-100 btn btn-lg btn-primary">Update password</button> </div>
</form>
</div> </div>
</div>
<div class="card-footer bg-transparent mt-auto">
<div class="btn-list justify-content-end">
<button type="submit" class="btn btn-primary">Save</button>
</div>
</div>
</form>
@section Scripts { @section Scripts {
<partial name="_ValidationScriptsPartial" /> <partial name="_ValidationScriptsPartial" />

View file

@ -5,25 +5,23 @@
ViewData["ActivePage"] = ManageNavPages.Index; ViewData["ActivePage"] = ManageNavPages.Index;
} }
<h3>@ViewData["Title"]</h3> <form id="profile-form" method="post" class="col d-flex flex-column">
<partial name="_StatusMessage" for="StatusMessage" /> <div class="card-body">
<div class="row"> <h2 class="mb-4">Profile</h2>
<div class="col-md-6"> <div class="row g-3">
<form id="profile-form" method="post"> <div class="col-md">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-floating">
<input asp-for="Username" class="form-control" disabled />
<label asp-for="Username" class="form-label"></label> <label asp-for="Username" class="form-label"></label>
<input asp-for="Username" class="form-control" autocomplete="current-password" aria-required="true" disabled />
</div> </div>
<div class="form-floating"> </div>
<input asp-for="Input.PhoneNumber" class="form-control" />
<label asp-for="Input.PhoneNumber" class="form-label"></label>
<span asp-validation-for="Input.PhoneNumber" class="text-danger"></span>
</div>
<button id="update-profile-button" type="submit" class="w-100 btn btn-lg btn-primary">Save</button>
</form>
</div> </div>
</div>
<div class="card-footer bg-transparent mt-auto">
<div class="btn-list justify-content-end">
<button type="submit" class="btn btn-primary">Save</button>
</div>
</div>
</form>
@section Scripts { @section Scripts {
<partial name="_ValidationScriptsPartial" /> <partial name="_ValidationScriptsPartial" />

View file

@ -9,17 +9,27 @@
} }
} }
<h1>Manage your account</h1> <div class="container-xl">
<div class="page-header d-print-none">
<div> <div class="row align-items-center">
<h2>Change your account settings</h2> <div class="col">
<hr /> <div class="page-pretitle">Account</div>
<div class="row"> <h2 class="page-title">
<div class="col-md-3"> @ViewData["Title"]
<partial name="_ManageNav" /> </h2>
</div>
</div> </div>
<div class="col-md-9"> </div>
@RenderBody() </div>
<div class="page-body">
<div class="container-xl">
<div class="card">
<div class="row g-0">
<partial name="_ManageNav" />
@RenderBody()
</div>
</div> </div>
</div> </div>
</div> </div>

View file

@ -1,15 +1,8 @@
@inject SignInManager<User> SignInManager <div class="col-3 d-none d-md-block border-end">
@{ <div class="card-body">
var hasExternalLogins = (await SignInManager.GetExternalAuthenticationSchemesAsync()).Any(); <div class="list-group list-group-transparent">
} <a asp-page="./Index" class="list-group-item list-group-item-action d-flex align-items-center @ManageNavPages.IndexNavClass(ViewContext)">Profile</a>
<ul class="nav nav-pills flex-column"> <a asp-page="./ChangePassword" class="list-group-item list-group-item-action d-flex align-items-center @ManageNavPages.ChangePasswordNavClass(ViewContext)">Password</a>
<li class="nav-item"><a class="nav-link @ManageNavPages.IndexNavClass(ViewContext)" id="profile" asp-page="./Index">Profile</a></li> </div>
<li class="nav-item"><a class="nav-link @ManageNavPages.EmailNavClass(ViewContext)" id="email" asp-page="./Email">Email</a></li> </div>
<li class="nav-item"><a class="nav-link @ManageNavPages.ChangePasswordNavClass(ViewContext)" id="change-password" asp-page="./ChangePassword">Password</a></li> </div>
@if (hasExternalLogins)
{
<li id="external-logins" class="nav-item"><a id="external-login" class="nav-link @ManageNavPages.ExternalLoginsNavClass(ViewContext)" asp-page="./ExternalLogins">External logins</a></li>
}
<li class="nav-item"><a class="nav-link @ManageNavPages.TwoFactorAuthenticationNavClass(ViewContext)" id="two-factor" asp-page="./TwoFactorAuthentication">Two-factor authentication</a></li>
<li class="nav-item"><a class="nav-link @ManageNavPages.PersonalDataNavClass(ViewContext)" id="personal-data" asp-page="./PersonalData">Personal data</a></li>
</ul>