dashboard component

config/routes/api.js

@@ -62,12 +62,30 @@ module.exports = function(server, db) {
         }
     });
 
+    server.get('/api/buyers', checkAuthenticated, async (req, res) => {
+        try {
+            const buyers = await db.collection('buyers').find({}).toArray();
+            res.json(buyers);
+        } catch (error) {
+            res.render('main/404');
+        }
+    });
+
+    server.get('/api/buyers/:bill_id', checkAuthenticated, async (req, res) => {
+        try {
+            const buyers = await db.collection('buyers').find({bill_id: req.params.bill_id}).toArray();
+            res.json(buyers);
+        } catch (error) {
+            res.render('main/404');
+        }
+    });
+
     server.get('/api/buyers/page/:page', checkAuthenticated, async (req, res) => {
         try {
             const page = parseInt(req.params.page),
                 limit = 5,
-                items = await db.collection('buyers').find({}, {skip: limit * (page - 1), limit}).toArray();
+                buyers = await db.collection('buyers').find({}, {skip: limit * (page - 1), limit}).toArray();
-            items.length > 0 && !isNaN(page) ? res.json(items) : res.json({error: 'Такой страницы не существует.'});
+            buyers.length > 0 && !isNaN(page) ? res.json(buyers) : res.json({error: 'Такой страницы не существует.'});
         } catch (error) {
             res.render('main/404');
         }

config/routes/control-panel.js

@@ -32,6 +32,15 @@ module.exports = function (server, db) {
                 return result;
             }
 
+            // общее кол-во товаров в магазине
+            const itemsAmount = () => {
+                let result = 0;
+                for (let i = 0; i < items.length; i++) {    
+                    result += items[i].count;
+                }
+                return result;
+            }
+            
             res.render('admin/control-panel', {
                 id: req.user.id,
                 name: req.user.name,
@@ -41,7 +50,7 @@ module.exports = function (server, db) {
                 pageName: ['Главная', 'main'],
                 sum: sum(),
                 quantitySold: quantitySold(),
-                count: items.length
+                count: itemsAmount()
             });
         } catch (error) {
             console.log(error);

dist/views/admin/control-panel.pug

@@ -31,7 +31,7 @@ body.has-fixed-sidenav
                             .search-field
                                 .nav-wrapper
                                     .input-field
-                                        input#search(type="search" required placeholder="Введите почту покупателя")
+                                        input#search(type="search" required placeholder="Введите номер заказа")
                                         label.label-icon(for="search")
                                             i.material-icons search
                                         i.material-icons close
@@ -45,56 +45,8 @@ body.has-fixed-sidenav
                                             th Сумма
                                     .divider
                                     tbody
-                                        tr
+                                        #loader.progress
-                                            td test@gmail.com
+                                            .indeterminate     
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽
-                                        tr
-                                            td test@gmail.com
-                                            td Qiwi
-                                            td 2019-12-05
-                                            td 145 ₽      
                         ul#pagination.pagination.center(data-page="1")              
     include ./assets/templates/footer.pug
     include ./assets/scripts.pug

src/admin/components/dashboard.component.js

@@ -1,5 +1,6 @@
 import { Component } from "../core/component";
 import { apiService } from "../services/api.service";
+import { renderBuyers } from "../templates/buyers.template";
 
 export class DashboardComponent extends Component {
     constructor(id, {pagination}, {search}) {
@@ -8,14 +9,20 @@ export class DashboardComponent extends Component {
         this.search = search;
     }
 
-    init() {
+    async init() {
+        const buyers = await apiService.getBuyers();
         this.$table = this.$el.querySelector('table tbody');
-        this.getBuyersByPage(1);
+        this.search.initialize(this.$table, this.getBuyersByBillId);
+        this.pagination.initialize(buyers.length, this.$table, this.getBuyersByPage);
+    }
+
+    async getBuyersByBillId(bill_id) {
+        const buyer = await apiService.getBillId(bill_id);
+        return renderBuyers(buyer);
     }
 
     async getBuyersByPage(page) {
         const buyers = await apiService.getBuyersOffset(page);
-        console.log(buyers);
+        return renderBuyers(buyers);
-        // рендерим дальше
     }
 }

src/admin/services/api.service.js

@@ -79,6 +79,15 @@ class ApiService {
         }
     }
 
+    async getBuyers() {
+        try {
+            const request = `${this.url}/api/buyers`;
+            return useRequest(request);
+        } catch (err) {
+            console.error(err);
+        }
+    }
+
     async getBuyersOffset(page) {
         try {
             const request = `${this.url}/api/buyers/page/${page}`;
@@ -88,6 +97,15 @@ class ApiService {
         }
     }
 
+    async getBillId(bill_id) {
+        try {
+            const request = `${this.url}/api/buyers/${bill_id}`;
+            return useRequest(request);
+        } catch (err) {
+            console.error(err);
+        }
+    }
+
     async getIcons() {
         try {
             const request = `${this.url}/api/icons`;

src/admin/templates/buyers.template.js

@@ -0,0 +1,7 @@
+export function renderBuyers(buyers) {
+    let html = '';
+    buyers.forEach(buyer => {
+        html += `<tr><td>${buyer.email}</td><td>${buyer.method[0].toUpperCase() + buyer.method.slice(1)}</td><td>${new Date(buyer.date).toLocaleDateString()}</td><td>${buyer.amount} ₽</td></tr>`;
+    });
+    return html;
+}

src/main/services/api.service.js

@@ -58,4 +58,4 @@ async function useRequest(request) {
     return await JSON.parse(response.request.response);
 }
 
-export const apiService = new ApiService('https://polar-peak-95205.herokuapp.com');
+export const apiService = new ApiService('http://localhost:3000');