diff --git a/config/server.js b/config/server.js
index 55c3614..8479849 100644
--- a/config/server.js
+++ b/config/server.js
@@ -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...'));
+ });
diff --git a/dist/public/css/style.css b/dist/public/css/style.css
index f867ff2..a46aa95 100644
--- a/dist/public/css/style.css
+++ b/dist/public/css/style.css
@@ -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;
diff --git a/dist/views/admin/items.pug b/dist/views/admin/items.pug
index 55d67ae..4f199dc 100644
--- a/dist/views/admin/items.pug
+++ b/dist/views/admin/items.pug
@@ -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
\ No newline at end of file
diff --git a/src/admin/components/categories.component.js b/src/admin/components/categories.component.js
index 6cf0cfa..a20016a 100644
--- a/src/admin/components/categories.component.js
+++ b/src/admin/components/categories.component.js
@@ -6,23 +6,24 @@ import { renderIcons } from "../templates/icons.template";
export class CategoriesComponent extends Component {
constructor(id) {
super(id);
- if (this.$el) {
- // обозначим все селекты для рендера в них наши категории и киноки в дальнейшем
- this.$editSelect = this.$el.querySelector('#edit select');
- this.$dellSelect = this.$el.querySelector('#delete select');
- this.$iconsSelect = this.$el.querySelector('#icons select');
- this.$dellIconsSelect = this.$el.querySelector('#dellIcon select');
+ }
- // формы
- this.$dellIconFrom = this.$el.querySelector('#dellIcon');
- this.$addForm = this.$el.querySelector('#addCategory');
- this.$dellForm = this.$el.querySelector('#dellCategory');
-
- // добавим ивенты на наши формы
- this.$dellIconFrom.addEventListener('submit', this.dellIcon.bind(this));
- this.$addForm.addEventListener('submit', this.addCategory.bind(this));
- this.$dellForm.addEventListener('submit', this.deleteCategory.bind(this));
- }
+ setElems() {
+ // обозначим все селекты для рендера в них наши категории и киноки в дальнейшем
+ this.$editSelect = this.$el.querySelector('#edit select');
+ this.$dellSelect = this.$el.querySelector('#delete select');
+ this.$iconsSelect = this.$el.querySelector('#icons select');
+ this.$dellIconsSelect = this.$el.querySelector('#dellIcon select');
+
+ // формы
+ this.$dellIconFrom = this.$el.querySelector('#dellIcon');
+ this.$addForm = this.$el.querySelector('#addCategory');
+ this.$dellForm = this.$el.querySelector('#dellCategory');
+
+ // добавим ивенты на наши формы
+ this.$dellIconFrom.addEventListener('submit', this.dellIcon.bind(this));
+ this.$addForm.addEventListener('submit', this.addCategory.bind(this));
+ this.$dellForm.addEventListener('submit', this.deleteCategory.bind(this));
}
async init() {
diff --git a/src/admin/components/items.component.js b/src/admin/components/items.component.js
new file mode 100644
index 0000000..09d8805
--- /dev/null
+++ b/src/admin/components/items.component.js
@@ -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();
+ }
+}
\ No newline at end of file
diff --git a/src/admin/components/loader.component.js b/src/admin/components/loader.component.js
new file mode 100644
index 0000000..99a74ee
--- /dev/null
+++ b/src/admin/components/loader.component.js
@@ -0,0 +1,7 @@
+import { Component } from "../core/component";
+
+export class LoaderComponent extends Component {
+ constructor(id) {
+ super(id);
+ }
+}
\ No newline at end of file
diff --git a/src/admin/core/component.js b/src/admin/core/component.js
index c34f72e..aed6951 100644
--- a/src/admin/core/component.js
+++ b/src/admin/core/component.js
@@ -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() {}
diff --git a/src/admin/index.js b/src/admin/index.js
index 476a77d..4dba58c 100644
--- a/src/admin/index.js
+++ b/src/admin/index.js
@@ -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');
\ No newline at end of file
diff --git a/src/admin/templates/items.template.js b/src/admin/templates/items.template.js
new file mode 100644
index 0000000..cdb62e3
--- /dev/null
+++ b/src/admin/templates/items.template.js
@@ -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 += ` | ${item.title} | ${item.category} | ${new Date(item.date).toLocaleDateString()} | ${item.count} | ${item.price} ₽ | |
`
+ });
+ });
+ return html;
+}
\ No newline at end of file
diff --git a/src/main/components/items.component.js b/src/main/components/items.component.js
index 8d3e51b..d273575 100644
--- a/src/main/components/items.component.js
+++ b/src/main/components/items.component.js
@@ -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();
diff --git a/src/main/templates/items.template.js b/src/main/templates/items.template.js
index 04bc8d7..a59ff3d 100644
--- a/src/main/templates/items.template.js
+++ b/src/main/templates/items.template.js
@@ -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 += `
${category.title}
`;
category.itemsInCategory = 0; // счетчит для отслеживания категорий где нету айтемов
try {
- arrayItems.forEach(item => {
+ items.forEach(item => {
if (item.category.toLowerCase() === category.title.toLowerCase()) {
category.itemsInCategory += 1;
html += `