added gender distribution to main page

7 files changed, 42 insertions, 9 deletions

diff --git a/interface/controllers/citizens.controller.js b/interface/controllers/citizens.controller.js
index 64522b1..b50ee74 100644
--- a/interface/controllers/citizens.controller.js
+++ b/interface/controllers/citizens.controller.js
@@ -1,11 +1,26 @@
 const db = require("../models");
 const citizens = db.citizens;
-const op = db.Sequelize.Op;
 
 // Retrieve all citizens from the database. Limit the number of citizens returned to 10.
 exports.findXCitizens = () => {
-    const limit = 10;
-    return citizens.findAll({
-        limit: limit
-    });
-}
+  const limit = 10;
+  return citizens.findAll({
+    limit: limit,
+  });
+};
+
+// Get total number of male and female citizens
+exports.findGenderDistribution = () => {
+  // group by the 'gender' column
+
+  /**
+   * This code is equivalent to the following SQL query:
+   * select count(gender), gender from citizens group by gender;
+   */
+
+  return citizens.findAll({
+    group: ["gender"],
+    attributes: ["gender", [db.sequelize.fn("COUNT", "gender"), "genderCount"]],
+    raw: true
+  });
+};
diff --git a/interface/package-lock.json b/interface/package-lock.json
index 2613ab1..dc4079f 100644
--- a/interface/package-lock.json
+++ b/interface/package-lock.json
@@ -9,6 +9,7 @@
       "version": "1.0.0",
       "license": "GPL-3.0-or-later",
       "dependencies": {
+        "async": "^3.2.3",
         "bcryptjs": "^2.4.3",
         "body-parser": "^1.20.0",
         "cors": "^2.8.5",
diff --git a/interface/package.json b/interface/package.json
index d421c00..9cca33f 100644
--- a/interface/package.json
+++ b/interface/package.json
@@ -12,6 +12,7 @@
   "author": "Kumar Priyansh <[email protected]>",
   "license": "GPL-3.0-or-later",
   "dependencies": {
+    "async": "^3.2.3",
     "bcryptjs": "^2.4.3",
     "body-parser": "^1.20.0",
     "cors": "^2.8.5",
diff --git a/interface/public/verify.js b/interface/public/verify.js
index ca7b47f..94025f8 100644
--- a/interface/public/verify.js
+++ b/interface/public/verify.js
@@ -7,7 +7,6 @@ if (token) {
         }
     }).then(response => {
         if (response.status === 200) {
-            console.log(response.json());
             $('#loginButton').hide();
             $('#logoutButton').show();
         } else {
diff --git a/interface/routes/index.js b/interface/routes/index.js
index fcc7c14..12cd088 100644
--- a/interface/routes/index.js
+++ b/interface/routes/index.js
@@ -8,8 +8,12 @@ router.use('/api', api);
 
 
 router.get('/', (req, res) => {
-    res.render('index', {
-        title: 'Home Page'
+    Promise.all([citizensController.findGenderDistribution()]).then(results => {
+        const [genderDistribution] = results;
+        res.render('index', {
+            title: 'Home Page',
+            genderDistribution
+        });
     });
 });
 
diff --git a/interface/views/index.ejs b/interface/views/index.ejs
index 6848aa3..99dc89b 100644
--- a/interface/views/index.ejs
+++ b/interface/views/index.ejs
@@ -44,6 +44,14 @@
           <div class="content">
             <div class="header">Citizens</div>
             <div class="description">
+              <pre>
+                Gender Statistics:<br>
+                =====================<br>
+                Male: <%= genderDistribution[0].genderCount %><br>
+                Female: <%= genderDistribution[1].genderCount %><br>
+                ---------------------<br>
+                Total: <%= genderDistribution[0].genderCount + genderDistribution[1].genderCount %>
+              </pre>
               Provides the details of all the citizens in the database
             </div>
           </div>
diff --git a/interface/views/partials/head.ejs b/interface/views/partials/head.ejs
index c4b963e..1296994 100644
--- a/interface/views/partials/head.ejs
+++ b/interface/views/partials/head.ejs
@@ -3,3 +3,8 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <title>Welfare Schemes | <%= title %></title>
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/semantic.min.css">
+<style>
+    pre, code{
+        white-space:normal;
+    }
+</style>