bubble/digital-store
1
0
Fork 0
mirror of https://github.com/sergeyyarkov/digital-store.git synced 2026-10-11 10:19:15 +03:00
Code Issues Packages Projects Releases Wiki Activity

items component showing

Browse Source
This commit is contained in:
Sergey Yarkov 2019-12-21 20:44:37 +03:00
parent e40985b168
commit dba4b98260
11 changed files with 98 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
config/server.js
View File

@ -46,6 +46,12 @@ MongoClient.connect(db_config.url, {useNewUrlParser: true, useUnifiedTopology: t
// 404 Redirect
server.use((req, res) => res.status(404).render('main/404'));
server.listen(3000, () => console.log('Listen port 3000...'));
})
.catch((error) => {console.log(error)});
.catch((error) => {
server.get('*', (req, res) => {
res.send('Ошибка соединения с БД. Настройте файл database.js');
});
})
.finally(() => {
server.listen(3000, () => console.log('Listen port 3000...'));
});

8
dist/public/css/style.css vendored
View File

@ -45,6 +45,10 @@ hr {
/* Custom Styles */
.pagination {
padding-bottom: 24px;
}
#notification {
width: 300px;
position: fixed;
@ -700,8 +704,8 @@ footer.main-footer {
margin-top: 8px;
}
.table-buyers, .table-items {
max-height: 365px;
overflow-y: scroll;
max-height: 385px;
overflow-y: hidden;
}
footer.admin-footer{
background-color: #fff;

87
dist/views/admin/items.pug vendored
View File

@ -7,7 +7,7 @@ body.has-fixed-sidenav
.col.s12
h2 Редактирование товаров
.col.s12
.card
#items.card
.card-content
span.card-title Список товаров
.search-field
@ -31,75 +31,22 @@ body.has-fixed-sidenav
.divider
tbody
tr
td
img(src="../img/service-icons/origin.svg", alt="alt")
td Тестовый товар №6
td Origin
td 2019-12-05
td 18
td 145 ₽
td
button.btn.red Удалить
button.btn.orange Изменить
tr
td
img(src="../img/service-icons/origin.svg", alt="alt")
td Тестовый товар №6
td Origin
td 2019-12-05
td 18
td 145 ₽
td
button.btn.red Удалить
button.btn.orange Изменить
tr
td
img(src="../img/service-icons/origin.svg", alt="alt")
td Тестовый товар №6
td Origin
td 2019-12-05
td 18
td 145 ₽
td
button.btn.red Удалить
button.btn.orange Изменить
tr
td
img(src="../img/service-icons/origin.svg", alt="alt")
td Тестовый товар №6
td Origin
td 2019-12-05
td 18
td 145 ₽
td
button.btn.red Удалить
button.btn.orange Изменить
tr
td
img(src="../img/service-icons/origin.svg", alt="alt")
td Тестовый товар №6
td Origin
td 2019-12-05
td 18
td 145 ₽
td
button.btn.red Удалить
button.btn.orange Изменить
tr
td
img(src="../img/service-icons/origin.svg", alt="alt")
td Тестовый товар №6
td Origin
td 2019-12-05
td 18
td 145 ₽
td
button.btn.red Удалить
button.btn.orange Изменить
#loader.progress
.indeterminate
.divider
ul.pagination.center
li.active
a(href="#" class="disabled")
i.material-icons chevron_left
li
a(href="#" class="active") 1
li
a(href="#") 2
li
a(href="#") 3
li
a(href="#" class="disabled")
i.material-icons chevron_right
include ./assets/templates/footer.pug
include ./assets/scripts.pug

5
src/admin/components/categories.component.js
View File

@ -6,7 +6,9 @@ import { renderIcons } from "../templates/icons.template";
export class CategoriesComponent extends Component {
constructor(id) {
super(id);
if (this.$el) {
}
setElems() {
// обозначим все селекты для рендера в них наши категории и киноки в дальнейшем
this.$editSelect = this.$el.querySelector('#edit select');
this.$dellSelect = this.$el.querySelector('#delete select');
@ -23,7 +25,6 @@ export class CategoriesComponent extends Component {
this.$addForm.addEventListener('submit', this.addCategory.bind(this));
this.$dellForm.addEventListener('submit', this.deleteCategory.bind(this));
}
}
async init() {
const categories = await apiService.getCategories();

23
src/admin/components/items.component.js Normal file
View File

@ -0,0 +1,23 @@
import { Component } from "../core/component";
import { apiService } from "../services/api.service";
import { renderItems } from "../templates/items.template";
export class ItemsComponent extends Component {
constructor(id, {loader}) {
super(id);
this.loader = loader;
}
setElems() {
this.$table = this.$el.querySelector('table tbody');
}
async init() {
const categories = await apiService.getCategories();
const items = await apiService.getItems();
const html = renderItems(items, categories);
this.$table.insertAdjacentHTML('afterbegin', html);
this.loader.hide();
}
}

7
src/admin/components/loader.component.js Normal file
View File

@ -0,0 +1,7 @@
import { Component } from "../core/component";
export class LoaderComponent extends Component {
constructor(id) {
super(id);
}
}

4
src/admin/core/component.js
View File

@ -1,12 +1,14 @@
export class Component {
constructor(id) {
this.$el = document.getElementById(id);
this.$el ? this.setElems() : false;
this.$el ? this.init() : false;
}
init() {}
setElems() {}
onShow() {}
onHide() {}

4
src/admin/index.js
View File

@ -1,8 +1,12 @@
import { MaterializeConfig } from "./config/materialize.config.js";
import { CategoriesComponent } from "./components/categories.component.js";
import { editCategoryModal } from "./modals/editCategory.modal.js";
import { ItemsComponent } from "./components/items.component.js";
import { LoaderComponent } from "./components/loader.component.js";
const loader = new LoaderComponent('loader');
const categories = new CategoriesComponent('categories');
const items = new ItemsComponent('items', {loader});
const editCategory = new editCategoryModal('editCategory', 'edit', 'editCategoryClose');
const materialize = new MaterializeConfig();
console.log('Control-Panel v1.0.0');

10
src/admin/templates/items.template.js Normal file
View File

@ -0,0 +1,10 @@
export function renderItems(items, categories) {
let html = '';
categories.forEach(category => {
items.forEach(item => {
if (item.category.toLowerCase() === category.title.toLowerCase()) html += `<tr><td><img src="../img/service-icons/${category.img}" alt="alt"></td><td>${item.title}</td><td>${item.category}</td><td>${new Date(item.date).toLocaleDateString()}</td><td>${item.count}</td><td>${item.price} ₽</td><td><button class="btn red">Удалить</button><button class="btn orange">Изменить</button></td></tr>`
});
});
return html;
}

2
src/main/components/items.component.js
View File

@ -26,7 +26,6 @@ export class ItemsComponent extends Component {
const html = renderItems(categories, fData);
this.insertItems(html);
this.btnColor();
this.loader.hide();
}
}
@ -36,6 +35,7 @@ export class ItemsComponent extends Component {
this.$el.querySelector('#roster').innerHTML = '';
this.loader.hide();
}
onShow() {
this.$el.querySelector('#roster').innerHTML = '';
this.loader.show();

7
src/main/templates/items.template.js
View File

@ -1,16 +1,13 @@
export function renderItems(categories, items) {
const arrayCategories = categories;
const arrayItems = items;
let html = '';
try {
arrayCategories.forEach(category => {
categories.forEach(category => {
html += `<div class="items-category">
<h2 class="small-title">${category.title}</h2>
</div>`;
category.itemsInCategory = 0; // счетчит для отслеживания категорий где нету айтемов
try {
arrayItems.forEach(item => {
items.forEach(item => {
if (item.category.toLowerCase() === category.title.toLowerCase()) {
category.itemsInCategory += 1;
html += `