Merge pull request #235 from bcgov/feature/AB#9260-dashboard-economic…

…-region Feature/AB#9260 Economic Region in Dashboard
bcgov · Dec 9, 2023 · ab37739 · ab37739
2 parents 4bc26e1 + f460bad
commit ab37739
Show file tree

Hide file tree

Showing 10 changed files with 139 additions and 0 deletions.
diff --git a/.../src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Basic/Bundling/BasicThemeGlobalScriptContributor.cs b/.../src/Volo.Abp.AspNetCore.Mvc.UI.Theme.Basic/Bundling/BasicThemeGlobalScriptContributor.cs
@@ -19,5 +19,6 @@ public override void ConfigureBundle(BundleConfigurationContext context)
         context.Files.AddIfNotContains("/libs/datatables.net-select/js/dataTables.select.js");
         context.Files.AddIfNotContains("/libs/datatables.net-select-bs5/js/select.bootstrap5.js");
         context.Files.AddIfNotContains("/libs/datatables.net-fixedheader/js/dataTables.fixedHeader.js");
+        context.Files.AddIfNotContains("/libs/chart.js/dist/chart.umd.js");
     }
 }
diff --git a/...er/src/Unity.GrantManager.Application.Contracts/GrantApplications/GetEconomicRegionDto.cs b/...er/src/Unity.GrantManager.Application.Contracts/GrantApplications/GetEconomicRegionDto.cs
@@ -0,0 +1,12 @@
+using System;
+using System.Collections.Generic;
+using System.Text;
+
+namespace Unity.GrantManager.GrantApplications;
+
+public class GetEconomicRegionDto
+{
+    public string? EconomicRegion { get; set; }
+    public int? Count { get; set; }
+
+}
diff --git a/...anager/src/Unity.GrantManager.Application/GrantApplications/GrantApplicationAppService.cs b/...anager/src/Unity.GrantManager.Application/GrantApplications/GrantApplicationAppService.cs
@@ -389,6 +389,15 @@ public async Task<IReadOnlyList<CommentDto>> GetCommentsAsync(Guid id)
             await _commentsManager.GetCommentsAsync(id, CommentType.ApplicationComment));
     }
 
+    public async Task<List<GetEconomicRegionDto>> GetEconomicRegionCountAsync()
+    {
+        var query = await _applicationRepository.GetQueryableAsync();
+
+        var result = query?.GroupBy(app => app.EconomicRegion).Select(group => new GetEconomicRegionDto { EconomicRegion = string.IsNullOrEmpty(group.Key) ? "None" : group.Key, Count = group.Count() }).OrderBy(o => o.EconomicRegion);
+        var queryResult = await AsyncExecuter.ToListAsync(result);
+        return queryResult;
+    }
+
     public async Task<CommentDto> UpdateCommentAsync(Guid id, UpdateCommentDto dto)
     {
         try

diff --git a/...ations/Unity.GrantManager/src/Unity.GrantManager.Web/Menus/GrantManagerMenuContributor.cs b/...ations/Unity.GrantManager/src/Unity.GrantManager.Web/Menus/GrantManagerMenuContributor.cs
@@ -98,6 +98,16 @@ private static Task ConfigureMainMenuAsync(MenuConfigurationContext context)
             )
         );
 
+        context.Menu.AddItem(
+            new ApplicationMenuItem(
+                GrantManagerMenus.Dashboard,
+                l["Menu:Dashboard"],
+                "~/Dashboard",
+                icon: "fl fl-view-dashboard",
+                order: 7
+            )
+        );
+
 
 #pragma warning disable S125 // Sections of code should not be commented out
         /* - will complete later after fixing ui sub menu issue

diff --git a/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.cshtml b/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.cshtml
@@ -0,0 +1,20 @@
+@page
+@model Unity.GrantManager.Web.Pages.Dashboard.IndexModel
+@using Unity.GrantManager.Web.Pages.Dashboard
+@{
+}
+@section styles {
+    <abp-style src="/Pages/Dashboard/Index.css" />
+}
+@section scripts
+{
+    <abp-script src="/Pages/Dashboard/Index.js" />
+}
+
+
+<div class="application-dashboard">
+    <div class="chartBox">
+        <canvas id="economicRegionChart"></canvas>
+    </div>
+
+</div>
diff --git a/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.cshtml.cs b/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.cshtml.cs
@@ -0,0 +1,12 @@
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+
+namespace Unity.GrantManager.Web.Pages.Dashboard
+{
+    public class IndexModel : PageModel
+    {
+        public void OnGet()
+        {
+        }
+    }
+}
diff --git a/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.css b/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.css
@@ -0,0 +1,7 @@
+.application-dashboard {
+    height: calc(100vh - 190px);
+}
+
+.chartBox {
+    width: 80%;
+}
diff --git a/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.js b/applications/Unity.GrantManager/src/Unity.GrantManager.Web/Pages/Dashboard/Index.js
@@ -0,0 +1,66 @@
+$(function () {
+    unity.grantManager.grantApplications.grantApplication.getEconomicRegionCount().then(economicRegion => {
+
+        // setup 
+        const data = {
+            labels: economicRegion.map(obj => obj.economicRegion),
+            datasets: [{
+                label: 'SUBMISSION BREAKDOWN BY ECONOMIC REGION',
+                data: economicRegion.map(obj => obj.count),
+                borderWidth: 1
+            }]
+        };
+
+        const sum = economicRegion.map(obj => obj.count).reduce((partialSum, a) => partialSum + a, 0);
+
+        // innerBarText plugin block
+        const innerBarText = {
+            id: 'innerBarText',
+            afterDatasetDraw(chart, args, pluginOption) {
+                const { ctx, data, chartArea: { left }, scales: { x, y } } = chart;
+                ctx.save();
+                data.datasets[0].data.forEach((dataPoint, index) => {
+                    const percent = (dataPoint / sum) * 100;
+                    ctx.fillText(`${percent.toFixed(2)}%`, left + 10, y.getPixelForValue(index));
+                });
+            }
+        }
+
+        // config 
+        const config = {
+            type: 'bar',
+            data,
+            options: {
+                indexAxis: 'y',
+                scales: {
+                    x: {
+                        beginAtZero: true,
+                        suggestedMin: 0,
+                        ticks: {
+                            precision:0
+                        },
+                        title: {
+                            display: true,
+                            text:'Number of Submissions'
+                        }
+                    },
+                    y: {
+                        title: {
+                            display: true,
+                            text: 'Economic  Regions'
+                        }
+                    }
+                }
+            },
+            plugins: [innerBarText]
+        };
+
+        // render init block
+        const myChart = new Chart(
+            document.getElementById('economicRegionChart'),
+            config
+        );
+    });
+
+
+});
diff --git a/applications/Unity.GrantManager/src/Unity.GrantManager.Web/abp.resourcemapping.js b/applications/Unity.GrantManager/src/Unity.GrantManager.Web/abp.resourcemapping.js
@@ -20,5 +20,6 @@ module.exports = {
         '@node_modules/sweetalert2/src/': '@libs/sweetalert2/src',
         '@node_modules/jquery-maskmoney/': '@libs/jquery-maskmoney',
         '@node_modules/datatables.net-fixedheader/js': '@libs/datatables.net-fixedheader/js/',
+        '@node_modules/chart.js/dist':'@libs/chart.js/dist/'
     },
 };
diff --git a/applications/Unity.GrantManager/src/Unity.GrantManager.Web/package.json b/applications/Unity.GrantManager/src/Unity.GrantManager.Web/package.json
@@ -6,6 +6,7 @@
     "@abp/aspnetcore.mvc.ui.theme.basic": "~7.4.0",
     "@abp/font-awesome": "~7.4.0",
     "axios": "^1.4.0",
+    "chart.js": "^4.4.1",
     "datatables.net-bs5": "^1.13.6",
     "datatables.net-buttons-bs5": "^2.4.2",
     "datatables.net-fixedheader": "^3.4.0",