imhven
/
abp
mirror of https://github.com/abpframework/abp
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

dashboard demo: added chart example

Browse Source
pull/1467/head
Yunus Emre Kalkan 6 years ago
parent b1ce6a5ee4
commit 530b7dc25f
19 changed files with 34183 additions and 11 deletions
Show Stats Download Patch File Download Diff File

13
samples/DashboardDemo/src/DashboardDemo.Application/IUserStatisticAppService.cs
Unescape View File

@ -0,0 +1,13 @@
using System;
using System.Collections.Generic;
using System.Text;
using System.Threading.Tasks;
using Volo.Abp.Application.Services;
namespace DashboardDemo
{
public interface IUserStatisticAppService : IApplicationService
{
Task<NewUserPerDayStatisticDto> GetNewUserPerDayStatistic();
}
}

7
samples/DashboardDemo/src/DashboardDemo.Application/NewUserPerDayStatisticDto.cs
Unescape View File

@ -0,0 +1,7 @@
namespace DashboardDemo
{
public class NewUserPerDayStatisticDto
{
public int[] Data { get; set; }
}
}

22
samples/DashboardDemo/src/DashboardDemo.Application/UserStatisticAppService.cs
Unescape View File

@ -0,0 +1,22 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Volo.Abp.Application.Services;
namespace DashboardDemo
{
public class UserStatisticAppService : ApplicationService, IUserStatisticAppService
{
public async Task<NewUserPerDayStatisticDto> GetNewUserPerDayStatistic()
{
var data = Enumerable
.Repeat(0, 7)
.Select(i => new Random().Next(50, 99))
.ToArray();
return new NewUserPerDayStatisticDto{Data = data};
}
}
}

12
samples/DashboardDemo/src/DashboardDemo.Web/Pages/widgets/Chartjs/ChartjsScriptContributor.cs
Unescape View File

@ -0,0 +1,12 @@
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
namespace DashboardDemo.Pages.widgets.Chartjs
{
public class ChartjsScriptContributor : BundleContributor
{
public override void ConfigureBundle(BundleConfigurationContext context)
{
context.Files.Add("/libs/chart.js/Chart.js");
}
}
}

15
samples/DashboardDemo/src/DashboardDemo.Web/Pages/widgets/Chartjs/ChartjsStyleContributor.cs
Unescape View File

@ -0,0 +1,15 @@
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
using Volo.Abp.AspNetCore.Mvc.UI.Packages.Clipboard;
using Volo.Abp.Modularity;
namespace DashboardDemo.Pages.widgets.Chartjs
{
public class ChartjsStyleContributor : BundleContributor
{
public override void ConfigureBundle(BundleConfigurationContext context)
{
context.Files.Add("/libs/chart.js/Chart.css");
}
}
}

33
samples/DashboardDemo/src/DashboardDemo.Web/Pages/widgets/UserCountWidget.js
Unescape View File

@ -1,10 +1,39 @@
(function ($) {
var $container = $('#UserCountWidgetContainer');
if ($container.length > 0) {
var _identityUserAppService = volo.abp.identity.identityUser;
_identityUserAppService.getList({}).then(function(result) {
_identityUserAppService.getList({}).then(function (result) {
$container.find('#UserCount').text(result.items.length);
});
var createChart = function() {
dashboardDemo.userStatistic.getNewUserPerDayStatistic().then(function (result) {
console.log(result.data);
var chart = new Chart($container.find('#UserStatistics'), {
type: 'bar',
data: {
labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', "Sun"],
datasets: [{
label: 'Avarage new user per day',
data: result.data,
backgroundColor: 'rgba(255, 99, 132, 0.2)'
}]
},
options: {
scales: {
yAxes: [{
ticks: {
beginAtZero: true
}
}]
}
}
});
});
};
createChart();
}
})(jQuery);

2
samples/DashboardDemo/src/DashboardDemo.Web/Pages/widgets/UserCountWidgetScriptBundleContributor.cs
Unescape View File

@ -1,3 +1,4 @@
using DashboardDemo.Pages.widgets.Chartjs;
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
using Volo.Abp.AspNetCore.Mvc.UI.Packages.Clipboard;
using Volo.Abp.AspNetCore.Mvc.UI.Packages.JQuery;
@ -7,6 +8,7 @@ namespace DashboardDemo.Pages.widgets
{
[DependsOn(typeof(JQueryScriptContributor))]
[DependsOn(typeof(ClipboardScriptBundleContributor))]
[DependsOn(typeof(ChartjsScriptContributor))]
public class UserCountWidgetScriptBundleContributor : BundleContributor
{
public override void ConfigureBundle(BundleConfigurationContext context)

4
samples/DashboardDemo/src/DashboardDemo.Web/Pages/widgets/UserCountWidgetStyleBundleContributor.cs
Unescape View File

@ -1,4 +1,5 @@
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
using DashboardDemo.Pages.widgets.Chartjs;
using Volo.Abp.AspNetCore.Mvc.UI.Bundling;
using Volo.Abp.AspNetCore.Mvc.UI.Packages.Bootstrap;
using Volo.Abp.AspNetCore.Mvc.UI.Packages.HighlightJs;
using Volo.Abp.Modularity;
@ -7,6 +8,7 @@ namespace DashboardDemo.Pages.widgets
{
[DependsOn(typeof(BootstrapStyleContributor))]
[DependsOn(typeof(HighlightJsStyleContributor))]
[DependsOn(typeof(ChartjsStyleContributor))]
public class UserCountWidgetStyleBundleContributor : BundleContributor
{
public override void ConfigureBundle(BundleConfigurationContext context)

6
samples/DashboardDemo/src/DashboardDemo.Web/Pages/widgets/UserCountWidgetViewComponent.cshtml
Unescape View File

@ -6,9 +6,11 @@
}
<div id="UserCountWidgetContainer">
<abp-card background="Light">
<abp-card-header background="Info">@L["UserCount"] :</abp-card-header>
<abp-card-header background="Info">@L["UserCount"]</abp-card-header>
<abp-card-body>
<h1 id="UserCount"></h1>
<div class="row margin-bottom-5">
<canvas id="UserStatistics"></canvas>
</div>
</abp-card-body>
</abp-card>
</div>

2
samples/DashboardDemo/src/DashboardDemo.Web/Widgets/WidgetDefinitionProvider.cs
Unescape View File

@ -16,7 +16,7 @@ namespace DashboardDemo.Widgets
LocalizableString.Create<DashboardDemoResource>(UserCountWidgetViewComponent.DisplayName),
typeof(UserCountWidgetViewComponent)
)
.SetDefaultDimension(6, 3)
.SetDefaultDimension(6, 7)
.AddRequiredPermission(IdentityPermissions.Users.Default);
var roleListWidget = new WidgetDefinition(

7
samples/DashboardDemo/src/DashboardDemo.Web/abp.resourcemapping.js
Unescape View File

@ -1,8 +1,7 @@
module.exports = {
aliases: {
},
mappings: {
"@node_modules/chart.js/dist/*.*": "@libs/chart.js/"
//"@node_modules/chartjs-color/*.*": "@libs/chartjs-color/",
//"@node_modules/chartjs-color-string/*.*": "@libs/chartjs-color-string/"
}
};

3
samples/DashboardDemo/src/DashboardDemo.Web/package.json
Unescape View File

@ -3,6 +3,7 @@
"name": "DashboardDemo",
"private": true,
"dependencies": {
"@abp/aspnetcore.mvc.ui.theme.basic": "^0.6.6"
"@abp/aspnetcore.mvc.ui.theme.basic": "^0.6.6",
"chart.js": "^2.8.0"
}
}

19288
samples/DashboardDemo/src/DashboardDemo.Web/wwwroot/libs/chart.js/Chart.bundle.js vendored
View File

File diff suppressed because it is too large Load Diff

7
samples/DashboardDemo/src/DashboardDemo.Web/wwwroot/libs/chart.js/Chart.bundle.min.js vendored
View File

File diff suppressed because one or more lines are too long

47
samples/DashboardDemo/src/DashboardDemo.Web/wwwroot/libs/chart.js/Chart.css vendored
Unescape View File

@ -0,0 +1,47 @@
/*
* DOM element rendering detection
* https://davidwalsh.name/detect-node-insertion
*/
@keyframes chartjs-render-animation {
from { opacity: 0.99; }
to { opacity: 1; }
}
.chartjs-render-monitor {
animation: chartjs-render-animation 0.001s;
}
/*
* DOM element resizing detection
* https://github.com/marcj/css-element-queries
*/
.chartjs-size-monitor,
.chartjs-size-monitor-expand,
.chartjs-size-monitor-shrink {
position: absolute;
direction: ltr;
left: 0;
top: 0;
right: 0;
bottom: 0;
overflow: hidden;
pointer-events: none;
visibility: hidden;
z-index: -1;
}
.chartjs-size-monitor-expand > div {
position: absolute;
width: 1000000px;
height: 1000000px;
left: 0;
top: 0;
}
.chartjs-size-monitor-shrink > div {
position: absolute;
width: 200%;
height: 200%;
left: 0;
top: 0;
}

14680
samples/DashboardDemo/src/DashboardDemo.Web/wwwroot/libs/chart.js/Chart.js vendored
View File

File diff suppressed because it is too large Load Diff

1
samples/DashboardDemo/src/DashboardDemo.Web/wwwroot/libs/chart.js/Chart.min.css vendored
Unescape View File

@ -0,0 +1 @@
@keyframes chartjs-render-animation{from{opacity:.99}to{opacity:1}}.chartjs-render-monitor{animation:chartjs-render-animation 1ms}.chartjs-size-monitor,.chartjs-size-monitor-expand,.chartjs-size-monitor-shrink{position:absolute;direction:ltr;left:0;top:0;right:0;bottom:0;overflow:hidden;pointer-events:none;visibility:hidden;z-index:-1}.chartjs-size-monitor-expand>div{position:absolute;width:1000000px;height:1000000px;left:0;top:0}.chartjs-size-monitor-shrink>div{position:absolute;width:200%;height:200%;left:0;top:0}

7
samples/DashboardDemo/src/DashboardDemo.Web/wwwroot/libs/chart.js/Chart.min.js vendored
View File

File diff suppressed because one or more lines are too long

38
samples/DashboardDemo/src/DashboardDemo.Web/yarn.lock
Unescape View File

@ -411,6 +411,29 @@ camelcase@^3.0.0:
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-3.0.0.tgz#32fc4b9fcdaf845fcdf7e73bb97cac2261f0ab0a"
integrity sha1-MvxLn82vhF/N9+c7uXysImHwqwo=
chart.js@^2.8.0:
version "2.8.0"
resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.8.0.tgz#b703b10d0f4ec5079eaefdcd6ca32dc8f826e0e9"
integrity sha512-Di3wUL4BFvqI5FB5K26aQ+hvWh8wnP9A3DWGvXHVkO13D3DSnaSsdZx29cXlEsYKVkn1E2az+ZYFS4t0zi8x0w==
dependencies:
chartjs-color "^2.1.0"
moment "^2.10.2"
chartjs-color-string@^0.6.0:
version "0.6.0"
resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
dependencies:
color-name "^1.0.0"
chartjs-color@^2.1.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.3.0.tgz#0e7e1e8dba37eae8415fd3db38bf572007dd958f"
integrity sha512-hEvVheqczsoHD+fZ+tfPUE+1+RbV6b+eksp2LwAhwRTVXEjCSEavvk+Hg3H6SZfGlPh/UfmWKGIvZbtobOEm3g==
dependencies:
chartjs-color-string "^0.6.0"
color-convert "^0.5.3"
chokidar@^2.0.0:
version "2.1.6"
resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-2.1.6.tgz#b6cad653a929e244ce8a834244164d241fa954c5"
@ -498,6 +521,16 @@ collection-visit@^1.0.0:
map-visit "^1.0.0"
object-visit "^1.0.0"
color-convert@^0.5.3:
version "0.5.3"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-0.5.3.tgz#bdb6c69ce660fadffe0b0007cc447e1b9f7282bd"
integrity sha1-vbbGnOZg+t/+CwAHzER+G59ygr0=
color-name@^1.0.0:
version "1.1.4"
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
color-support@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/color-support/-/color-support-1.1.3.tgz#93834379a1cc9a0c61f82f52f0d04322251bd5a2"
@ -1510,6 +1543,11 @@ mkdirp@^0.5.0, mkdirp@^0.5.1:
dependencies:
minimist "0.0.8"
moment@^2.10.2:
version "2.24.0"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
ms@2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"

Write Preview
Loading…
Cancel
Save