From ebc2455bfb924df311cb3358880c9a9ab04dda3b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Halil=20=C4=B0brahim=20Kalkan?= Date: Fri, 26 Jul 2019 11:12:49 +0300 Subject: [PATCH] Add RefreshUrl for Widgets --- .../Mvc/UI/Widgets/AbpViewComponentHelper.cs | 10 ++- .../Mvc/UI/Widgets/WidgetAttribute.cs | 2 + .../Mvc/UI/Widgets/WidgetDefinition.cs | 10 +++ .../DashboardDemo.Web/Pages/MyDashboard.js | 63 +++++++++++++------ .../CountersWidgetController.cs | 17 +++++ .../CountersWidgetViewComponent.cs | 2 +- .../Components/CountersWidget/Default.cshtml | 8 +-- .../Components/CountersWidget/Default.js | 26 -------- 8 files changed, 88 insertions(+), 50 deletions(-) create mode 100644 samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetController.cs delete mode 100644 samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.js diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/AbpViewComponentHelper.cs b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/AbpViewComponentHelper.cs index 8d0dede237..384952c893 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/AbpViewComponentHelper.cs +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/AbpViewComponentHelper.cs @@ -1,5 +1,6 @@ using System; using System.Linq; +using System.Text; using System.Threading.Tasks; using Microsoft.AspNetCore.Authorization; using Microsoft.AspNetCore.Html; @@ -80,8 +81,15 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Widgets PageWidgetManager.TryAdd(widget); + var wrapperAttributesBuilder = new StringBuilder($"class=\"abp-widget-wrapper\" data-widget-name=\"{widget.Name}\""); + + if (widget.RefreshUrl != null) + { + wrapperAttributesBuilder.Append($" data-refresh-url=\"{widget.RefreshUrl}\""); + } + return new HtmlContentBuilder() - .AppendHtml($"
") + .AppendHtml($"
") .AppendHtml(await DefaultViewComponentHelper.InvokeAsync(widget.ViewComponentType, arguments)) .AppendHtml("
"); } diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetAttribute.cs b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetAttribute.cs index e7852b0454..8bd5bc4929 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetAttribute.cs +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetAttribute.cs @@ -35,6 +35,8 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Widgets public int? DefaultHeight { get; set; } + public string RefreshUrl { get; set; } + public static bool IsWidget(Type type) { return type.IsSubclassOf(typeof(ViewComponent)) && diff --git a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetDefinition.cs b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetDefinition.cs index d7ff2ae78e..d82704b968 100644 --- a/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetDefinition.cs +++ b/framework/src/Volo.Abp.AspNetCore.Mvc.UI.Widgets/Volo/Abp/AspNetCore/Mvc/UI/Widgets/WidgetDefinition.cs @@ -50,6 +50,9 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Widgets [CanBeNull] public WidgetDimensions DefaultDimensions { get; set; } + [CanBeNull] + public string RefreshUrl { get; set; } + public WidgetDefinition( [NotNull] Type viewComponentType, [CanBeNull] ILocalizableString displayName = null) @@ -63,6 +66,7 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Widgets RequiresAuthentication = WidgetAttribute.RequiresAuthentication; Styles = GetStyles(WidgetAttribute); Scripts = GetScripts(WidgetAttribute); + RefreshUrl = WidgetAttribute.RefreshUrl; if (WidgetAttribute.DefaultWidth.HasValue && WidgetAttribute.DefaultHeight.HasValue) { @@ -191,6 +195,12 @@ namespace Volo.Abp.AspNetCore.Mvc.UI.Widgets return WithResources(Scripts, bundleContributorTypes); } + public WidgetDefinition WithRefreshUrl(string refreshUrl) + { + RefreshUrl = refreshUrl; + return this; + } + private WidgetDefinition WithResources(List resourceItems, Type[] bundleContributorTypes) { if (bundleContributorTypes.IsNullOrEmpty()) diff --git a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/MyDashboard.js b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/MyDashboard.js index 9c591df854..ac84a3cf79 100644 --- a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/MyDashboard.js +++ b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/MyDashboard.js @@ -22,32 +22,59 @@ } return opts.filterCallback(); - } + }; + + var initWidget = function($widgetWrapperDiv) { + var widgetName = $widgetWrapperDiv.attr('data-widget-name'); + var widgetApiClass = abp.widgets[widgetName]; + if (widgetApiClass) { + var widgetApi = new widgetApiClass($widgetWrapperDiv); + if (widgetApi.init) { + widgetApi.init(getFilters()); + } + + $widgetWrapperDiv.data('abp-widget-api', widgetApi); + } + }; var init = function () { $dashboardWrapper.find('.abp-widget-wrapper').each(function () { - var $widgetWrapperDiv = $(this); - var widgetName = $widgetWrapperDiv.attr('data-widget-name'); - var widgetApiClass = abp.widgets[widgetName]; - if (widgetApiClass) { - var widgetApi = new widgetApiClass($widgetWrapperDiv); - if (widgetApi.init) { - widgetApi.init(getFilters()); - } - $widgetWrapperDiv.data('abp-widget-api', widgetApi); - } + initWidget($(this)); }); }; + var callRefreshWidgetApi = function ($widgetWrapperDiv) { + var widgetApi = $widgetWrapperDiv.data('abp-widget-api'); + if (widgetApi && widgetApi.refresh) { + widgetApi.refresh(getFilters()); + } + } + + var refreshWidget = function ($widgetWrapperDiv) { + var refreshUrl = $widgetWrapperDiv.attr('data-refresh-url'); + if (refreshUrl) { + abp.ajax({ + url: refreshUrl, + type: 'GET', + dataType: 'html', + contentType: 'application/x-www-form-urlencoded; charset=UTF-8', + data: getFilters() + }).then(function(result) { + var $newWidgetWrapperDiv = $(result); + $widgetWrapperDiv.replaceWith($newWidgetWrapperDiv); + $widgetWrapperDiv = $newWidgetWrapperDiv; + initWidget($widgetWrapperDiv); + }); + } else { + callRefreshWidgetApi($widgetWrapperDiv); + } + }; + var refresh = function() { - $dashboardWrapper.find('.abp-widget-wrapper').each(function () { - var $widgetWrapperDiv = $(this); - var widgetApi = $widgetWrapperDiv.data('abp-widget-api'); - if (widgetApi && widgetApi.refresh) { - widgetApi.refresh(getFilters()); - } + $dashboardWrapper.find('.abp-widget-wrapper').each(function() { + refreshWidget($(this)); }); - } + }; return { init: init, diff --git a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetController.cs b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetController.cs new file mode 100644 index 0000000000..12f597e530 --- /dev/null +++ b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetController.cs @@ -0,0 +1,17 @@ +using System; +using Microsoft.AspNetCore.Mvc; +using Volo.Abp.AspNetCore.Mvc; + +namespace DashboardDemo.Web.Pages.Shared.Components.CountersWidget +{ + [Route("Widgets")] + public class CountersWidgetController : AbpController + { + [HttpGet] + [Route("Counters")] + public IActionResult Counters(DateTime startDate, DateTime endDate) + { + return ViewComponent("CountersWidget", new {startDate, endDate}); + } + } +} diff --git a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetViewComponent.cs b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetViewComponent.cs index dd6b0611d2..11b60bffb2 100644 --- a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetViewComponent.cs +++ b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/CountersWidgetViewComponent.cs @@ -8,7 +8,7 @@ namespace DashboardDemo.Web.Pages.Shared.Components.CountersWidget { [Widget( StyleFiles = new[] { "/Pages/Shared/Components/CountersWidget/Default.css" }, - ScriptFiles = new[] { "/Pages/Shared/Components/CountersWidget/Default.js" } + RefreshUrl = "Widgets/Counters" )] public class CountersWidgetViewComponent : AbpViewComponent { diff --git a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.cshtml b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.cshtml index 05f7d6efb6..4f318d75dd 100644 --- a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.cshtml +++ b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.cshtml @@ -3,25 +3,25 @@
-
@Model.NewUsers
+
@Model.NewUsers
New Users
-
@Model.ActiveUsers
+
@Model.ActiveUsers
Active Users
-
$@Model.TotalIncome.ToString("0.00")
+
@Model.TotalIncome.ToString("c")
Total Income
-
$@Model.TotalProfit.ToString("0.00")
+
@Model.TotalProfit.ToString("c")
Total Profit
 diff --git a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.js b/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.js deleted file mode 100644 index 6ed71d7055..0000000000 --- a/samples/DashboardDemo/src/DashboardDemo.Web/Pages/Shared/Components/CountersWidget/Default.js +++ /dev/null @@ -1,26 +0,0 @@ -abp.widgets = abp.widgets || {}; //TODO: Remove later -(function () { - abp.widgets.CountersWidget = function ($wrapper) { - - var refresh = function (filters) { - dashboardDemo.dashboard.getCountersWidget({ - startDate: filters.startDate, - endDate: filters.endDate - }).then(function (result) { - $wrapper.find('.new-user-count').text(result.newUsers); - $wrapper.find('.active-user-count').text(result.activeUsers); - $wrapper.find('.total-income').text('$' + result.totalIncome.toFixed(2)); - $wrapper.find('.total-profit').text('$' + result.totalProfit.toFixed(2)); - }); - }; - - var init = function (filters) { - // there is no initial process for this widget. - }; - - return { - init: init, - refresh: refresh - }; - }; -})(); \ No newline at end of file