Using timezone settings to display datetime.

Directory.Packages.props

@@ -174,7 +174,7 @@
     <PackageVersion Include="System.Text.Json" Version="9.0.0" />
     <PackageVersion Include="System.Threading.Tasks.Extensions" Version="4.5.4" />
     <PackageVersion Include="TencentCloudSDK.Sms" Version="3.0.1142" />
-    <PackageVersion Include="TimeZoneConverter" Version="6.1.0" />
+    <PackageVersion Include="TimeZoneConverter" Version="7.0.0" />
     <PackageVersion Include="Unidecode.NET" Version="2.1.0" />
     <PackageVersion Include="xunit" Version="2.9.2" />
     <PackageVersion Include="xunit.extensibility.execution" Version="2.9.2" />

framework/src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Shared/wwwroot/libs/abp/aspnetcore-mvc-ui-theme-shared/datatables/datatables-extensions.js

@@ -516,7 +516,7 @@ var abp = abp || {};
         if (!value) {
             return value;
         } else {
-            return (ISOStringToDateTimeLocaleString())(value);
+            return abp.clock.normalizeToLocaleString(value, { year: 'numeric', month: '2-digit', day: '2-digit' });
         }
     };
 
@@ -524,7 +524,7 @@ var abp = abp || {};
         if (!value) {
             return value;
         } else {
-            return (ISOStringToDateTimeLocaleString(luxon.DateTime.DATETIME_SHORT))(value);
+            return abp.clock.normalizeToLocaleString(value);
         }
     };
 

framework/src/Volo.Abp.AspNetCore.Mvc/Volo/Abp/AspNetCore/Mvc/ApplicationConfigurations/AbpApplicationConfigurationAppService.cs

@@ -311,7 +311,7 @@ public class AbpApplicationConfigurationAppService : ApplicationService, IAbpApp
 
     protected virtual async Task<TimingDto> GetTimingConfigAsync()
     {
-        var windowsTimeZoneId = await _settingProvider.GetOrNullAsync(TimingSettingNames.TimeZone);
+        var timeZone = await _settingProvider.GetOrNullAsync(TimingSettingNames.TimeZone);
 
         return new TimingDto
         {
@@ -319,13 +319,11 @@ public class AbpApplicationConfigurationAppService : ApplicationService, IAbpApp
             {
                 Windows = new WindowsTimeZone
                 {
-                    TimeZoneId = windowsTimeZoneId
+                    TimeZoneId = timeZone.IsNullOrWhiteSpace() ? null : _timezoneProvider.IanaToWindows(timeZone)
                 },
                 Iana = new IanaTimeZone
                 {
-                    TimeZoneName = windowsTimeZoneId.IsNullOrWhiteSpace()
-                        ? null
-                        : _timezoneProvider.WindowsToIana(windowsTimeZoneId!)
+                    TimeZoneName = timeZone
                 }
             }
         };

modules/setting-management/src/Volo.Abp.SettingManagement.Application/Volo/Abp/SettingManagement/TimeZoneSettingsAppService.cs

@@ -30,7 +30,7 @@ public class TimeZoneSettingsAppService : SettingManagementAppServiceBase, ITime
 
     public virtual Task<List<NameValue>> GetTimezonesAsync()
     {
-        return Task.FromResult(TimeZoneHelper.GetTimezones(TimezoneProvider.GetWindowsTimezones()));
+        return Task.FromResult(TimeZoneHelper.GetTimezones(TimezoneProvider.GetIanaTimezones()));
     }
 
     public virtual async Task UpdateAsync(string timezone)

modules/setting-management/src/Volo.Abp.SettingManagement.Web/Pages/SettingManagement/Components/TimeZoneSettingGroup/Default.cshtml

@@ -1,18 +1,18 @@
 @using Microsoft.AspNetCore.Mvc.Localization
 @using Volo.Abp.SettingManagement.Localization
 @inject IHtmlLocalizer<AbpSettingManagementResource> L
-@model Volo.Abp.SettingManagement.Web.Pages.SettingManagement.Components.TimeZoneSettingGroup.TimeZoneSettingGroupViewComponent.UpdateTimezoneSettingsViewModel
-
 <abp-script src="/Pages/SettingManagement/Components/TimeZoneSettingGroup/Default.js" />
 
 <form id="TimeZoneSettingsForm" method="post">
     <abp-row>
         <abp-column size-md="_12">
             <div>
-                <abp-select asp-for="Timezone" asp-items="@Model.TimeZoneItems" info="@L["TimezoneHelpText"].Value" />
+                <label for="timezone-select" class="mb-1">@L["Timezone"].Value</label>
+                <select style="width: 100%" name="timezone" id="timezone-select"></select>
             </div>
+            <div class="mt-1 form-text">@L["TimezoneHelpText"].Value</div>
             <div>
-                <abp-button button-type="Primary" type="submit">
+                <abp-button class="mt-3" button-type="Primary" type="submit">
                     <i class="fa fa-save"></i> @L["Save"]
                 </abp-button>
             </div>

modules/setting-management/src/Volo.Abp.SettingManagement.Web/Pages/SettingManagement/Components/TimeZoneSettingGroup/Default.js

@@ -3,13 +3,28 @@
 
         var l = abp.localization.getResource('AbpSettingManagement');
 
+        var select2 = null;
+        volo.abp.settingManagement.timeZoneSettings.getTimezones().then(function (result) {
+            var data = $.map(result, function (obj) {
+                obj.id = obj.value;
+                obj.text = obj.name;
+                return obj;
+            });
+
+            select2 = $("#timezone-select").select2({
+                data: data
+            });
+
+            volo.abp.settingManagement.timeZoneSettings.get().then(function (result) {
+                select2.val(result).trigger("change");
+            });
+        });
+
         $("#TimeZoneSettingsForm").on('submit', function (event) {
             event.preventDefault();
-
-            volo.abp.settingManagement.timeZoneSettings.update($("#Timezone").val()).then(function (result) {
+            volo.abp.settingManagement.timeZoneSettings.update(select2.find(':selected')[0].value).then(function (result) {
                 $(document).trigger("AbpSettingSaved");
             });
-
         });
     });
 })(jQuery);

modules/setting-management/src/Volo.Abp.SettingManagement.Web/Pages/SettingManagement/Components/TimeZoneSettingGroup/TimeZoneSettingGroupViewComponent.cs

@@ -1,42 +1,18 @@
-using System.Collections.Generic;
-using System.ComponentModel.DataAnnotations;
-using System.Linq;
-using System.Threading.Tasks;
+using System.Threading.Tasks;
 using Microsoft.AspNetCore.Mvc;
-using Microsoft.AspNetCore.Mvc.Rendering;
 using Volo.Abp.AspNetCore.Mvc;
-using Volo.Abp.Auditing;
-using Volo.Abp.Timing.Localization.Resources.AbpTiming;
 
 namespace Volo.Abp.SettingManagement.Web.Pages.SettingManagement.Components.TimeZoneSettingGroup;
 
 public class TimeZoneSettingGroupViewComponent : AbpViewComponent
 {
-    protected ITimeZoneSettingsAppService TimeZoneSettingsAppService { get; }
-
     public TimeZoneSettingGroupViewComponent(ITimeZoneSettingsAppService timeZoneSettingsAppService)
     {
         ObjectMapperContext = typeof(AbpSettingManagementWebModule);
-        TimeZoneSettingsAppService = timeZoneSettingsAppService;
     }
 
     public virtual async Task<IViewComponentResult> InvokeAsync()
     {
-        var timezone = await TimeZoneSettingsAppService.GetAsync();
-        var timezones = await TimeZoneSettingsAppService.GetTimezonesAsync();
-        var model = new UpdateTimezoneSettingsViewModel()
-        {
-            Timezone = timezone,
-            TimeZoneItems = new List<SelectListItem>()
-        };
-        model.TimeZoneItems.AddRange(timezones.Select(x => new SelectListItem(x.Name, x.Value)).ToList());
-        return View("~/Pages/SettingManagement/Components/TimeZoneSettingGroup/Default.cshtml", model);
-    }
-
-    public class UpdateTimezoneSettingsViewModel
-    {
-        public string Timezone { get; set; }
-
-        public List<SelectListItem> TimeZoneItems { get; set; }
+        return View("~/Pages/SettingManagement/Components/TimeZoneSettingGroup/Default.cshtml");
     }
 }

npm/packs/core/src/abp.js

@@ -748,9 +748,9 @@ var abp = abp || {};
 
     abp.clock.kind = 'Unspecified';
 
-    abp.clock.supportsMultipleTimezone = function () {
-        return abp.clock.kind === 'Utc';
-    };
+    abp.clock.supportsMultipleTimezone = abp.clock.kind === 'Utc';
+
+    abp.clock.timeZone = abp.setting.get('Abp.Timing.TimeZone');
 
     // Normalize Date object or date string to standard string format that will be sent to server
     abp.clock.normalizeToString = function (date) {
@@ -763,7 +763,7 @@ var abp = abp || {};
             return date;
         }
 
-        if (abp.clock.kind === 'Utc') {
+        if (abp.clock.supportsMultipleTimezone) {
             return dateObj.toISOString();
         }
 
@@ -787,8 +787,11 @@ var abp = abp || {};
                 padMilliseconds(dateObj.getMilliseconds());
     };
 
+    // Default options for toLocaleString
+    abp.clock.toLocaleStringOptions = abp.clock.toLocaleStringOptions || {};
+
     // Normalize date string to locale date string that will be displayed to user
-    abp.clock.normalizeToLocaleString = function (dateString) {
+    abp.clock.normalizeToLocaleString = function (dateString, options) {
         if (!dateString) {
             return dateString;
         }
@@ -797,8 +800,14 @@ var abp = abp || {};
         if (isNaN(date)) {
             return dateString;
         }
-        
-        //TODO: Get timezone setting and pass it to toLocaleString
+
+        if (abp.clock.supportsMultipleTimezone) {
+            var timezone = abp.clock.timeZone;
+            if (timezone) {
+                options = options || {};
+                return date.toLocaleString(abp.localization.currentCulture.cultureName, Object.assign({}, abp.clock.toLocaleStringOptions, options, { timeZone: timezone }));
+            }
+        }
         return date.toLocaleString();
     }