Improved Account manage layout, added Permissions display to Profile Page
This commit is contained in:
parent
4a6599d165
commit
c63b60a7de
|
@ -13,34 +13,101 @@
|
|||
|
||||
<PageTitle>Profile</PageTitle>
|
||||
|
||||
<h3 class="text-xl mb-3">Profile</h3>
|
||||
<div class="flex gap-4 flex-wrap">
|
||||
<section class="max-w-xs" Model="Input" FormName="profile" OnValidSubmit="OnValidSubmitAsync" method="post">
|
||||
<h2 class="text-2xl lg:text-4xl mb-3">Profile</h2>
|
||||
|
||||
<div class="max-w-xs" Model="Input" FormName="profile" OnValidSubmit="OnValidSubmitAsync" method="post">
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">Username</span>
|
||||
</div>
|
||||
<input class="input input-bordered w-full" type="text" value="@Username"
|
||||
placeholder="Please choose your username." disabled/>
|
||||
</label>
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">Username</span>
|
||||
</div>
|
||||
<input class="input input-bordered w-full" type="text" value="@Username"
|
||||
placeholder="Please choose your username." disabled/>
|
||||
</label>
|
||||
|
||||
@if (User?.ProfilePicture is not null) {
|
||||
<div class="avatar w-24 my-3">
|
||||
<div class="rounded">
|
||||
<img src="/images/@(User.ProfilePicture.ImageId)" alt="" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">Profile Picture</span>
|
||||
</div>
|
||||
<FileUploadComponent FileUploadedCallback="ProfilePictureChanged"/>
|
||||
</label>
|
||||
@if (User?.ProfilePicture is not null) {
|
||||
<div class="avatar w-24 my-3">
|
||||
<div class="rounded">
|
||||
<img src="/images/@(User.ProfilePicture.ImageId)" alt="" loading="lazy"/>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">Profile Picture</span>
|
||||
</div>
|
||||
<FileUploadComponent FileUploadedCallback="ProfilePictureChanged"/>
|
||||
</label>
|
||||
</section>
|
||||
<section>
|
||||
<h2 class="text-2xl lg:text-4xl mb-3">Permissions</h2>
|
||||
<ul>
|
||||
<li class="flex gap-2 content-center">
|
||||
<AuthorizeView Policy="ArticleEditPermissions">
|
||||
<Authorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</Authorized>
|
||||
<NotAuthorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</NotAuthorized>
|
||||
</AuthorizeView>
|
||||
Create or Edit Articles
|
||||
</li>
|
||||
<li class="flex gap-2 content-center">
|
||||
<AuthorizeView Policy="ArticleReviewPermissions">
|
||||
<Authorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</Authorized>
|
||||
<NotAuthorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</NotAuthorized>
|
||||
</AuthorizeView>
|
||||
Review Articles
|
||||
</li>
|
||||
<li class="flex gap-2 content-center">
|
||||
<AuthorizeView Policy="ArticleDeletePermissions">
|
||||
<Authorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</Authorized>
|
||||
<NotAuthorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</NotAuthorized>
|
||||
</AuthorizeView>
|
||||
Delete Articles
|
||||
</li>
|
||||
<li class="flex gap-2 content-center">
|
||||
<AuthorizeView Policy="RoleAssignPermissions">
|
||||
<Authorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-success">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</Authorized>
|
||||
<NotAuthorized>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-error">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
|
||||
</svg>
|
||||
</NotAuthorized>
|
||||
</AuthorizeView>
|
||||
Assign Roles to User
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
@code {
|
||||
private ApplicationUser? User { get; set; } = default!;
|
||||
private ApplicationUser? User { get; set; }
|
||||
private string? Username { get; set; }
|
||||
|
||||
[CascadingParameter]
|
||||
|
|
|
@ -1,17 +1,15 @@
|
|||
@inherits LayoutComponentBase
|
||||
@layout AccountLayout
|
||||
|
||||
<h1>Manage your account</h1>
|
||||
<div class="flex gap-x-8 gap-y-4 flex-wrap">
|
||||
<div class="max-w-xs">
|
||||
<div class="bg-base-200 p-4 rounded">
|
||||
<ManageNavMenu/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h1 class="text-3xl lg:text-5xl mb-3">Manage your account</h1>
|
||||
|
||||
<div>
|
||||
<h2>Change your account settings</h2>
|
||||
<hr />
|
||||
<div class="row">
|
||||
<div class="col-md-3">
|
||||
<ManageNavMenu />
|
||||
</div>
|
||||
<div class="col-md-9">
|
||||
@Body
|
||||
</div>
|
||||
</div>
|
||||
@Body
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -3,35 +3,34 @@
|
|||
|
||||
@inject SignInManager<ApplicationUser> SignInManager
|
||||
|
||||
<ul class="nav nav-pills flex-column">
|
||||
<ul class="menu" role="navigation">
|
||||
<li class="nav-item">
|
||||
<NavLink class="nav-link" href="Account/Manage" Match="NavLinkMatch.All">Profile</NavLink>
|
||||
<NavLink href="Account/Manage" Match="NavLinkMatch.All">Profile</NavLink>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<NavLink class="nav-link" href="Account/Manage/Email">Email</NavLink>
|
||||
<NavLink href="Account/Manage/Email">Email</NavLink>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<NavLink class="nav-link" href="Account/Manage/ChangePassword">Password</NavLink>
|
||||
<NavLink href="Account/Manage/ChangePassword">Password</NavLink>
|
||||
</li>
|
||||
@if (hasExternalLogins)
|
||||
{
|
||||
@if (_hasExternalLogins) {
|
||||
<li class="nav-item">
|
||||
<NavLink class="nav-link" href="Account/Manage/ExternalLogins">External logins</NavLink>
|
||||
<NavLink href="Account/Manage/ExternalLogins">External logins</NavLink>
|
||||
</li>
|
||||
}
|
||||
<li class="nav-item">
|
||||
<NavLink class="nav-link" href="Account/Manage/TwoFactorAuthentication">Two-factor authentication</NavLink>
|
||||
<NavLink href="Account/Manage/TwoFactorAuthentication">Two-factor authentication</NavLink>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<NavLink class="nav-link" href="Account/Manage/PersonalData">Personal data</NavLink>
|
||||
<NavLink href="Account/Manage/PersonalData">Personal data</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
@code {
|
||||
private bool hasExternalLogins;
|
||||
private bool _hasExternalLogins;
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
hasExternalLogins = (await SignInManager.GetExternalAuthenticationSchemesAsync()).Any();
|
||||
_hasExternalLogins = (await SignInManager.GetExternalAuthenticationSchemesAsync()).Any();
|
||||
}
|
||||
}
|
||||
|
|
2
Wave/wwwroot/css/main.min.css
vendored
2
Wave/wwwroot/css/main.min.css
vendored
File diff suppressed because one or more lines are too long
Loading…
Reference in a new issue