dashboard component

This commit is contained in:
Sergey Yarkov 2020-01-14 22:34:22 +03:00
parent 8ba91f1c9d
commit 3d60cf0bbe
8 changed files with 72 additions and 61 deletions

View File

@ -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) => { server.get('/api/buyers/page/:page', checkAuthenticated, async (req, res) => {
try { try {
const page = parseInt(req.params.page), const page = parseInt(req.params.page),
limit = 5, 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) { } catch (error) {
res.render('main/404'); res.render('main/404');
} }

View File

@ -31,6 +31,15 @@ module.exports = function (server, db) {
} }
return result; 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', { res.render('admin/control-panel', {
id: req.user.id, id: req.user.id,
@ -41,7 +50,7 @@ module.exports = function (server, db) {
pageName: ['Главная', 'main'], pageName: ['Главная', 'main'],
sum: sum(), sum: sum(),
quantitySold: quantitySold(), quantitySold: quantitySold(),
count: items.length count: itemsAmount()
}); });
} catch (error) { } catch (error) {
console.log(error); console.log(error);

File diff suppressed because one or more lines are too long

View File

@ -31,7 +31,7 @@ body.has-fixed-sidenav
.search-field .search-field
.nav-wrapper .nav-wrapper
.input-field .input-field
input#search(type="search" required placeholder="Введите почту покупателя") input#search(type="search" required placeholder="Введите номер заказа")
label.label-icon(for="search") label.label-icon(for="search")
i.material-icons search i.material-icons search
i.material-icons close i.material-icons close
@ -45,56 +45,8 @@ body.has-fixed-sidenav
th Сумма th Сумма
.divider .divider
tbody 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") ul#pagination.pagination.center(data-page="1")
include ./assets/templates/footer.pug include ./assets/templates/footer.pug
include ./assets/scripts.pug include ./assets/scripts.pug

View File

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

View File

@ -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) { async getBuyersOffset(page) {
try { try {
const request = `${this.url}/api/buyers/page/${page}`; 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() { async getIcons() {
try { try {
const request = `${this.url}/api/icons`; const request = `${this.url}/api/icons`;

View File

@ -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;
}

View File

@ -58,4 +58,4 @@ async function useRequest(request) {
return await JSON.parse(response.request.response); 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');