From 86d128c6d3e2f06492a6a3caf18b16788d24d173 Mon Sep 17 00:00:00 2001 From: shaohanzhong Date: Fri, 25 Oct 2024 00:09:03 +0800 Subject: [PATCH 1/2] switch theme --- .../Components/App.razor | 61 ++++++++++++------- .../Components/Layout/ThemeSiderbar.razor | 13 +++- .../Controllers/ThemeController.cs | 15 +++++ .../Utils/AbpRadzenUICookieHelper.cs | 25 ++++++++ 4 files changed, 89 insertions(+), 25 deletions(-) create mode 100644 src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs create mode 100644 src/Abp.Blazor.Server.RadzenUI/Utils/AbpRadzenUICookieHelper.cs diff --git a/src/Abp.Blazor.Server.RadzenUI/Components/App.razor b/src/Abp.Blazor.Server.RadzenUI/Components/App.razor index fe70270..43ab8f3 100644 --- a/src/Abp.Blazor.Server.RadzenUI/Components/App.razor +++ b/src/Abp.Blazor.Server.RadzenUI/Components/App.razor @@ -1,8 +1,10 @@ -@using Microsoft.Extensions.Hosting +@using Microsoft.AspNetCore.Http +@using Microsoft.Extensions.Hosting @using Microsoft.Extensions.Options @inject IHostEnvironment Env @inject ThemeService ThemeService @inject IOptions AbpRadzenUIOptions +@inject IHttpContextAccessor HttpContextAccessor @@ -13,29 +15,42 @@ - + - -
- @if (Env.IsDevelopment()) - { - - An unhandled exception has occurred. See browser dev tools for details. - - } - else - { - - An error has occurred. This app may no longer respond until reloaded. - - } - Reload - 🗙 -
+ +
+ @if (Env.IsDevelopment()) + { + + An unhandled exception has occurred. See browser dev tools for details. + + } + else + { + + An error has occurred. This app may no longer respond until reloaded. + + } + Reload + 🗙 +
- - - + + + - \ No newline at end of file + + +@code{ + string _theme = "material-dark"; + + protected override void OnInitialized() + { + base.OnInitialized(); + + _theme = Utils.AbpRadzenUICookieHelper.GetThemeCookie(HttpContextAccessor.HttpContext!) + ?? AbpRadzenUIOptions.Value.Theme.Default; + } + +} \ No newline at end of file diff --git a/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor b/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor index 1bd2895..1e321cd 100644 --- a/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor +++ b/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor @@ -1,10 +1,13 @@ -@using Microsoft.Extensions.Options +@using Microsoft.AspNetCore.Http +@using Microsoft.Extensions.Options @inject ThemeService ThemeService @inject TooltipService TooltipService @inject QueryStringThemeService QueryStringThemeService @inject NavigationManager UriHelper @inject IOptions RadzenUIOptions @inject IJSRuntime JSRuntime +@inject IHttpContextAccessor HttpContextAccessor + @@ -182,7 +185,13 @@ void ChangeTheme(object value) { - ThemeService.SetTheme($"{value}"); + //ThemeService.SetTheme($"{value}"); + //Utils.AbpRadzenUICookieHelper.SetThemeCookie(HttpContextAccessor.HttpContext!, $"{value}"); + var relativeUrl = UriHelper.Uri.RemovePreFix(UriHelper.BaseUri).EnsureStartsWith('/').EnsureStartsWith('~'); + UriHelper.NavigateTo( + $"/theme/switch?theme={value}&returnUrl={relativeUrl}", + forceLoad: true + ); } void WcagColorsTooltip(ElementReference elementReference, TooltipOptions? options = null) => TooltipService.Open(elementReference, ds => diff --git a/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs b/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs new file mode 100644 index 0000000..c5db3e5 --- /dev/null +++ b/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs @@ -0,0 +1,15 @@ +using Abp.RadzenUI.Utils; +using Microsoft.AspNetCore.Mvc; +using Volo.Abp.AspNetCore.Mvc; + +namespace Abp.RadzenUI.Controllers; + +public class ThemeController : AbpControllerBase +{ + [HttpGet("/theme/switch")] + public IActionResult SwitchAsync(string theme, string returnUrl = "~/") + { + AbpRadzenUICookieHelper.SetThemeCookie(HttpContext, theme); + return Redirect(returnUrl); + } +} diff --git a/src/Abp.Blazor.Server.RadzenUI/Utils/AbpRadzenUICookieHelper.cs b/src/Abp.Blazor.Server.RadzenUI/Utils/AbpRadzenUICookieHelper.cs new file mode 100644 index 0000000..dd4e0d6 --- /dev/null +++ b/src/Abp.Blazor.Server.RadzenUI/Utils/AbpRadzenUICookieHelper.cs @@ -0,0 +1,25 @@ +using Microsoft.AspNetCore.Http; + +namespace Abp.RadzenUI.Utils; + +public static class AbpRadzenUICookieHelper +{ + private static string ThemeKey = ".AbpRadzenUI.Theme"; + + public static void SetThemeCookie(HttpContext context, string theme) + { + context.Response.Cookies.Append(ThemeKey, theme, new CookieOptions + { + Path = "/", + HttpOnly = false, + IsEssential = true, + Expires = DateTimeOffset.Now.AddYears(10) + }); + } + + public static string? GetThemeCookie(HttpContext context) + { + context.Request.Cookies.TryGetValue(ThemeKey, out var theme); + return theme; + } +} From 074bcca2635b6f71eadf4dea2046195621fe17be Mon Sep 17 00:00:00 2001 From: shaohanzhong Date: Fri, 25 Oct 2024 23:46:14 +0800 Subject: [PATCH 2/2] theme name write to cookie --- .../Components/Layout/ThemeSiderbar.razor | 13 +------------ .../Controllers/ThemeController.cs | 4 ++-- 2 files changed, 3 insertions(+), 14 deletions(-) diff --git a/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor b/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor index 1e321cd..ad29234 100644 --- a/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor +++ b/src/Abp.Blazor.Server.RadzenUI/Components/Layout/ThemeSiderbar.razor @@ -186,10 +186,9 @@ void ChangeTheme(object value) { //ThemeService.SetTheme($"{value}"); - //Utils.AbpRadzenUICookieHelper.SetThemeCookie(HttpContextAccessor.HttpContext!, $"{value}"); var relativeUrl = UriHelper.Uri.RemovePreFix(UriHelper.BaseUri).EnsureStartsWith('/').EnsureStartsWith('~'); UriHelper.NavigateTo( - $"/theme/switch?theme={value}&returnUrl={relativeUrl}", + $"Theme/Switch?value={value}&returnUrl={relativeUrl}", forceLoad: true ); } @@ -198,9 +197,6 @@ @
WCAG Compliant Colors Enable to preview themes with WCAG 2.2 AA compliant color swatches. - @* - See how to use - *@
, options); void RtlTooltip(ElementReference elementReference, TooltipOptions? options = null) => TooltipService.Open(elementReference, ds => @@ -213,18 +209,11 @@ @
Use Premium Themes Premium themes can be used with an active Radzen Professional or Enterprise subscription. - @* - See Pricing - Learn more - *@
, options); void FreeThemesTooltip(ElementReference elementReference, TooltipOptions? options = null) => TooltipService.Open(elementReference, ds => @
Use Free Themes These themes are free for commercial use. - @* - Learn more - *@
, options); } diff --git a/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs b/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs index c5db3e5..04f3dd4 100644 --- a/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs +++ b/src/Abp.Blazor.Server.RadzenUI/Controllers/ThemeController.cs @@ -7,9 +7,9 @@ namespace Abp.RadzenUI.Controllers; public class ThemeController : AbpControllerBase { [HttpGet("/theme/switch")] - public IActionResult SwitchAsync(string theme, string returnUrl = "~/") + public IActionResult SwitchAsync(string value, string returnUrl = "~/") { - AbpRadzenUICookieHelper.SetThemeCookie(HttpContext, theme); + AbpRadzenUICookieHelper.SetThemeCookie(HttpContext, value); return Redirect(returnUrl); } }