Added more personalization to profile page, separated forms into partials
This commit is contained in:
parent
677458c308
commit
b8b50e8f19
GPG key ID:
4B6F6A83178F595E
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
@using Microsoft.AspNetCore.Identity
|
||||
@using Wave.Data
|
||||
@using System.ComponentModel.DataAnnotations
|
||||
@using Wave.Components.Account.Pages.Manage.Partials
|
||||
|
||||
@inject IdentityUserAccessor UserAccessor
|
||||
@inject UserManager<ApplicationUser> UserManager
|
||||
|
|
@ -14,36 +14,25 @@
|
|||
<StatusMessage Message="@Message" />
|
||||
|
||||
<div class="flex gap-4 flex-wrap">
|
||||
<section class="w-80 max-w-xs" Model="Input" FormName="profile" OnValidSubmit="OnValidSubmitAsync" method="post">
|
||||
<section class="w-80 max-w-xs" Model="Input" FormName="profile" OnValidSubmit="OnValidSubmitAsync" method="post">
|
||||
<h2 class="text-2xl lg:text-4xl mb-3">@Localizer["Title"]</h2>
|
||||
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">@Localizer["UserName_Label"]</span>
|
||||
</div>
|
||||
<input class="input input-bordered w-full" type="text" value="@UserName"
|
||||
placeholder="Please choose your username." disabled/>
|
||||
</label>
|
||||
|
||||
<EditForm FormName="update-profile" Model="@Model" OnValidSubmit="@SubmitFullNameUpdate" method="post" Enhance="false">
|
||||
<DataAnnotationsValidator />
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">@Localizer["FullName_Label"]</span>
|
||||
</div>
|
||||
<InputText class="input input-bordered w-full" maxlength="64" autocomplete="name"
|
||||
@bind-Value="@Model.FullName" placeholder="@Localizer["FullName_Placeholder"]" />
|
||||
<div class="label">
|
||||
<span class="label-text-alt text-error">
|
||||
<ValidationMessage For="() => Model.FullName" />
|
||||
</span>
|
||||
</div>
|
||||
</label>
|
||||
<button type="submit" class="btn btn-primary w-full">
|
||||
@Localizer["FullName_Submit"]
|
||||
</button>
|
||||
</EditForm>
|
||||
</section>
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">@Localizer["UserName_Label"]</span>
|
||||
</div>
|
||||
<input class="input input-bordered w-full" type="text" value="@UserName"
|
||||
placeholder="Please choose your username." disabled/>
|
||||
</label>
|
||||
@if (User is not null) {
|
||||
<ProfileFormPartial User="@User" />
|
||||
}
|
||||
</section>
|
||||
<section class="w-80 max-w-xs">
|
||||
<h2 class="text-2xl lg:text-4xl mb-3">@Localizer["AboutMe"]</h2>
|
||||
@if (User is not null) {
|
||||
<AboutMeFormPartial User="@User" />
|
||||
}
|
||||
</section>
|
||||
<section class="w-80 max-w-xs">
|
||||
<h2 class="text-2xl lg:text-4xl mb-3">@Localizer["Permissions"]</h2>
|
||||
<ul>
|
||||
|
|
@ -113,29 +102,14 @@
|
|||
|
||||
@code {
|
||||
private string? Message { get; set; }
|
||||
[SupplyParameterFromForm]
|
||||
private InputModel Model { get; set; } = new();
|
||||
[CascadingParameter]
|
||||
private HttpContext HttpContext { get; set; } = default!;
|
||||
|
||||
private ApplicationUser User { get; set; } = default!;
|
||||
private ApplicationUser? User { get; set; }
|
||||
private string UserName { get; set; } = string.Empty;
|
||||
|
||||
protected override async Task OnInitializedAsync() {
|
||||
UserName = UserManager.GetUserName(HttpContext.User)!;
|
||||
User = await UserAccessor.GetRequiredUserAsync(HttpContext);
|
||||
Model.FullName ??= User.FullName;
|
||||
}
|
||||
|
||||
private async Task SubmitFullNameUpdate() {
|
||||
User.FullName = Model.FullName?.Trim();
|
||||
await UserManager.UpdateAsync(User);
|
||||
await SignInManager.RefreshSignInAsync(User);
|
||||
Message = Localizer["FullName_Success"];
|
||||
}
|
||||
|
||||
private sealed class InputModel {
|
||||
[MaxLength(64)]
|
||||
public string? FullName { get; set; }
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,74 @@
|
|||
@using Wave.Data
|
||||
@using Microsoft.AspNetCore.Identity
|
||||
@using System.ComponentModel.DataAnnotations
|
||||
@using Wave.Utilities
|
||||
|
||||
@inject UserManager<ApplicationUser> UserManager
|
||||
@inject IStringLocalizer<Wave.Components.Account.Pages.Manage.Index> Localizer
|
||||
|
||||
<EditForm FormName="about-me" Model="@Model" OnValidSubmit="OnValidSubmit" method="post" class="w-full">
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">
|
||||
@Localizer["AboutTheAuthor_Label"]
|
||||
<HelpDropdownComponent Body="@Localizer["AboutTheAuthor_Explanation"]" />
|
||||
</span>
|
||||
</div>
|
||||
<InputTextArea class="textarea textarea-bordered w-full" rows="10" maxlength="512"
|
||||
@bind-Value="@Model.AboutTheAuthor" placeholder="@Localizer["AboutTheAuthor_Placeholder"]" />
|
||||
<div class="label">
|
||||
<span class="label-text-alt text-error"><ValidationMessage For="() => Model.AboutTheAuthor" /></span>
|
||||
</div>
|
||||
</label>
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">
|
||||
@Localizer["Biography_Label"]
|
||||
<span class="badge badge-info badge-sm badge-outline">Markdown</span>
|
||||
<HelpDropdownComponent Body="@Localizer["Biography_Explanation"]" />
|
||||
</span>
|
||||
</div>
|
||||
<InputTextArea class="textarea textarea-bordered w-full" rows="10" maxlength="512"
|
||||
@bind-Value="@Model.Biography" placeholder="@Localizer["Biography_Placeholder"]" />
|
||||
<div class="label">
|
||||
<span class="label-text-alt text-error"><ValidationMessage For="() => Model.Biography" /></span>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
<button type="submit" class="btn btn-primary w-full">
|
||||
@Localizer["Submit"]
|
||||
</button>
|
||||
</EditForm>
|
||||
|
||||
@code {
|
||||
[Parameter]
|
||||
public required ApplicationUser? User { get; set; }
|
||||
|
||||
[SupplyParameterFromForm(FormName = "about-me")]
|
||||
private InputModel Model { get; set; } = new();
|
||||
|
||||
protected override void OnInitialized() {
|
||||
Model.AboutTheAuthor ??= User?.AboutTheAuthor;
|
||||
Model.Biography ??= User?.Biography;
|
||||
}
|
||||
|
||||
private async Task OnValidSubmit(EditContext obj) {
|
||||
if (User is null) return;
|
||||
if (Model.Biography is not null) {
|
||||
User.BiographyHtml = MarkdownUtilities.Parse(Model.Biography);
|
||||
User.Biography = Model.Biography;
|
||||
}
|
||||
if (Model.AboutTheAuthor is not null)
|
||||
User.AboutTheAuthor = Model.AboutTheAuthor;
|
||||
|
||||
await UserManager.UpdateAsync(User);
|
||||
}
|
||||
|
||||
private sealed record InputModel {
|
||||
[MaxLength(512)]
|
||||
public string? AboutTheAuthor { get; set; }
|
||||
[MaxLength(4096)]
|
||||
public string? Biography { get; set; }
|
||||
}
|
||||
|
||||
}
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
@using Wave.Data
|
||||
@using Microsoft.AspNetCore.Identity
|
||||
@using System.ComponentModel.DataAnnotations
|
||||
|
||||
@inject UserManager<ApplicationUser> UserManager
|
||||
@inject SignInManager<ApplicationUser> SignInManager
|
||||
@inject IStringLocalizer<Wave.Components.Account.Pages.Manage.Index> Localizer
|
||||
|
||||
<EditForm FormName="update-profile" Model="@Model" OnValidSubmit="@OnValidSubmit" method="post" Enhance="false">
|
||||
<DataAnnotationsValidator />
|
||||
<label class="form-control w-full">
|
||||
<div class="label">
|
||||
<span class="label-text">@Localizer["FullName_Label"]</span>
|
||||
</div>
|
||||
<InputText class="input input-bordered w-full" maxlength="64" autocomplete="name"
|
||||
@bind-Value="@Model.FullName" placeholder="@Localizer["FullName_Placeholder"]" />
|
||||
<div class="label">
|
||||
<span class="label-text-alt text-error">
|
||||
<ValidationMessage For="() => Model.FullName" />
|
||||
</span>
|
||||
</div>
|
||||
</label>
|
||||
<button type="submit" class="btn btn-primary w-full">
|
||||
@Localizer["Submit"]
|
||||
</button>
|
||||
</EditForm>
|
||||
|
||||
@code {
|
||||
[Parameter]
|
||||
public required ApplicationUser? User { get; set; }
|
||||
|
||||
[SupplyParameterFromForm(FormName = "update-profile")]
|
||||
private InputModel Model { get; set; } = new();
|
||||
|
||||
protected override void OnInitialized() {
|
||||
Model.FullName ??= User?.FullName;
|
||||
}
|
||||
|
||||
private async Task OnValidSubmit() {
|
||||
if (User is null) return;
|
||||
|
||||
User.FullName = Model.FullName?.Trim();
|
||||
await UserManager.UpdateAsync(User);
|
||||
await SignInManager.RefreshSignInAsync(User);
|
||||
// Message = Localizer["FullName_Success"];
|
||||
}
|
||||
|
||||
private sealed class InputModel {
|
||||
[MaxLength(64)]
|
||||
public string? FullName { get; set; }
|
||||
}
|
||||
}
|
||||
|
|
@ -101,10 +101,7 @@
|
|||
<data name="Title" xml:space="preserve">
|
||||
<value>Profil</value>
|
||||
</data>
|
||||
<data name="FullName_Submit" xml:space="preserve">
|
||||
<value>Speichern</value>
|
||||
</data>
|
||||
<data name="FullName_Label" xml:space="preserve">
|
||||
<data name="FullName_Label" xml:space="preserve">
|
||||
<value>Voller Name</value>
|
||||
</data>
|
||||
<data name="FullName_Placeholder" xml:space="preserve">
|
||||
|
|
@ -128,4 +125,29 @@
|
|||
<data name="Permission_RoleAssign" xml:space="preserve">
|
||||
<value>Benutzern Rollen zuweisen</value>
|
||||
</data>
|
||||
<data name="AboutMe" xml:space="preserve">
|
||||
<value>Über Mich</value>
|
||||
</data>
|
||||
<data name="AboutTheAuthor_Label" xml:space="preserve">
|
||||
<value>Über den Autor/die Autorin</value>
|
||||
</data>
|
||||
<data name="AboutTheAuthor_Placeholder" xml:space="preserve">
|
||||
<value>Alex Muster ist professionelle*r Konditor*in...</value>
|
||||
</data>
|
||||
<data name="AboutTheAuthor_Explanation" xml:space="preserve">
|
||||
<value>Diese Beschreibung wird, neben Ihren Namen und Profilbild, in Artikeln eingefügt den Ihr verfasst. Diese soll dem Lesenden informationen über Ihre Qualifikationen und Fähigkeiten bereit stellen.</value>
|
||||
</data>
|
||||
<data name="Biography_Label" xml:space="preserve">
|
||||
<value>Biographie</value>
|
||||
</data>
|
||||
<data name="Biography_Placeholder" xml:space="preserve">
|
||||
<value># Meine Reise
|
||||
Ich koche seit dem jungen Alter von 7...</value>
|
||||
</data>
|
||||
<data name="Biography_Explanation" xml:space="preserve">
|
||||
<value>Dies ist ein freiform Text der auf Ihrer persönlichen Seite angezeigt wird.</value>
|
||||
</data>
|
||||
<data name="Submit" xml:space="preserve">
|
||||
<value>Speichern</value>
|
||||
</data>
|
||||
</root>
|
||||
|
|
@ -107,10 +107,7 @@
|
|||
<data name="FullName_Placeholder" xml:space="preserve">
|
||||
<value>Enter your full Name</value>
|
||||
</data>
|
||||
<data name="FullName_Submit" xml:space="preserve">
|
||||
<value>Save</value>
|
||||
</data>
|
||||
<data name="UserName_Label" xml:space="preserve">
|
||||
<data name="UserName_Label" xml:space="preserve">
|
||||
<value>User Name</value>
|
||||
</data>
|
||||
<data name="Permissions" xml:space="preserve">
|
||||
|
|
@ -128,4 +125,29 @@
|
|||
<data name="Permission_RoleAssign" xml:space="preserve">
|
||||
<value>Assign roles to users</value>
|
||||
</data>
|
||||
<data name="AboutMe" xml:space="preserve">
|
||||
<value>About Me</value>
|
||||
</data>
|
||||
<data name="AboutTheAuthor_Label" xml:space="preserve">
|
||||
<value>About the Author</value>
|
||||
</data>
|
||||
<data name="AboutTheAuthor_Explanation" xml:space="preserve">
|
||||
<value>This description gets embedded next to your name and profile picture in articles that you wrote, it is intended to tell the reader about yourself and your qualifications and skills.</value>
|
||||
</data>
|
||||
<data name="AboutTheAuthor_Placeholder" xml:space="preserve">
|
||||
<value>John Smith has a degree of arts in cooking...</value>
|
||||
</data>
|
||||
<data name="Biography_Label" xml:space="preserve">
|
||||
<value>Biography</value>
|
||||
</data>
|
||||
<data name="Biography_Explanation" xml:space="preserve">
|
||||
<value>This is a free form text that will be shown on your personal page.</value>
|
||||
</data>
|
||||
<data name="Biography_Placeholder" xml:space="preserve">
|
||||
<value># My Journey
|
||||
I started cooking at the young age of 7...</value>
|
||||
</data>
|
||||
<data name="Submit" xml:space="preserve">
|
||||
<value>Save</value>
|
||||
</data>
|
||||
</root>
|
||||
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