mirror of
https://github.com/sergeyyarkov/digital-store.git
synced 2026-10-11 18:29:11 +03:00
modal fixes
This commit is contained in:
parent
292f8cadb6
commit
22fe715426
@ -1,5 +1,10 @@
|
||||
const fs = require('fs');
|
||||
|
||||
function checkAuthenticated(req, res, next) {
|
||||
if (req.isAuthenticated()) return next();
|
||||
res.redirect('/admin');
|
||||
}
|
||||
|
||||
module.exports = function(server, db) {
|
||||
server.get('/api/items', async (req, res) => {
|
||||
if (req.query.q) {
|
||||
@ -43,10 +48,14 @@ module.exports = function(server, db) {
|
||||
}
|
||||
});
|
||||
|
||||
server.get('/api/items/search/:query', (req, res) => {
|
||||
const query = req.query.q;
|
||||
console.log(query);
|
||||
})
|
||||
server.get('/api/items/data', checkAuthenticated, async (req, res) => {
|
||||
try {
|
||||
const data = await db.collection('info').find({}).toArray();
|
||||
res.json(data);
|
||||
} catch (error) {
|
||||
res.render('main/404');
|
||||
}
|
||||
});
|
||||
|
||||
server.get('/api/items/:category', async (req, res) => {
|
||||
const items = await db.collection('items').find({category: req.params.category}).toArray(),
|
||||
|
||||
@ -196,7 +196,9 @@ module.exports = function(server, db) {
|
||||
});
|
||||
server.post('/control-panel/items/delete', checkAuthenticated, (req, res) => {
|
||||
try {
|
||||
db.collection('items').deleteOne({"_id": ObjectID(req.body.id)});
|
||||
const id = ObjectID(req.body.id);
|
||||
db.collection('items').deleteOne({"_id": id});
|
||||
db.collection('info').deleteOne({"_id": id});
|
||||
res.redirect('/control-panel/items');
|
||||
} catch (error) {
|
||||
res.render('main/404');
|
||||
@ -209,9 +211,11 @@ module.exports = function(server, db) {
|
||||
title: req.body.title,
|
||||
price: parseFloat(req.body.price),
|
||||
description: req.body.description,
|
||||
category: JSON.parse(req.body.category)
|
||||
category: JSON.parse(req.body.category),
|
||||
info: req.body.data.split(',')
|
||||
}
|
||||
db.collection('items').updateOne({"_id": ObjectID(data.id)}, {$set: {title: data.title, price: data.price, description: data.description, category: data.category.title}});
|
||||
db.collection('items').updateOne({"_id": ObjectID(data.id)}, {$set: {title: data.title, count: data.info.length, price: data.price, description: data.description, category: data.category.title}});
|
||||
db.collection('info').updateOne({"_id": ObjectID(data.id)}, {$set: {title: data.title, data: data.info}});
|
||||
res.redirect('/control-panel/items');
|
||||
} catch (error) {
|
||||
res.render('main/404');
|
||||
|
||||
2
dist/public/css/style.css
vendored
2
dist/public/css/style.css
vendored
@ -149,7 +149,7 @@ hr {
|
||||
background-color: #fff;
|
||||
margin-top: 7rem;
|
||||
padding: 25px;
|
||||
width: 460px;
|
||||
width: 560px;
|
||||
min-height: 230px;
|
||||
}
|
||||
.c_modal-content.editCategory {
|
||||
|
||||
@ -11,25 +11,25 @@
|
||||
i.material-icons close
|
||||
.modal-content__form
|
||||
form(action="/control-panel/categories/update" method="POST")
|
||||
.input-field.id
|
||||
input(style="color: gray;" type="text" name="id" required readonly)
|
||||
.input-field
|
||||
input.id(style="color: gray;" type="text" name="id" required readonly)
|
||||
label ID категории
|
||||
.input-field.originalTitle
|
||||
input(style="color: gray;" type="text" name="originalTitle" required readonly)
|
||||
.input-field
|
||||
input.originalTitle(style="color: gray;" type="text" name="originalTitle" required readonly)
|
||||
label Старое название категории
|
||||
.input-field.title
|
||||
input(type="text" name="title" required)
|
||||
.input-field
|
||||
input.title(type="text" name="title" required)
|
||||
label Новое название категории
|
||||
.input-field.type
|
||||
textarea(class="materialize-textarea" type="text" name="type" required)
|
||||
.input-field
|
||||
textarea.type(class="materialize-textarea" type="text" name="type" required)
|
||||
label Тип аккаунтов
|
||||
.input-field.img
|
||||
select(name="img" required)
|
||||
.input-field
|
||||
select.img(name="img" required)
|
||||
option(value="" disabled selected)
|
||||
| Выберите иконку
|
||||
label(for="img") Иконка
|
||||
.input-field.format
|
||||
input(type="text" name="format" required)
|
||||
.input-field
|
||||
input.format(type="text" name="format" required)
|
||||
label Формат аккаунтов
|
||||
.edit_success
|
||||
button(type="submit" class="btn orange waves-effect" style="width: 100%;height:50px") Редактировать
|
||||
|
||||
@ -21,11 +21,14 @@
|
||||
input.price(id="price" type="text" name="price" required)
|
||||
label(for="price") Цена товара ₽
|
||||
.input-field
|
||||
textarea.description(id="description" class="materialize-textarea" type="text" name="description")
|
||||
textarea.description(id="description" class="materialize-textarea" type="text" name="description" required)
|
||||
label(for="description") Описание товара
|
||||
.input-field
|
||||
select.category(name="category")
|
||||
label Категория
|
||||
.input-field
|
||||
textarea.data(id="data" class="materialize-textarea" type="text" name="data" placeholder="Перечислите аккаунты через запятую." required)
|
||||
label(for="data") Данные товара
|
||||
.edit_success
|
||||
button(type="submit" class="btn orange waves-effect" style="width: 100%;height:50px") Редактировать
|
||||
// Edit Category END
|
||||
|
||||
12
dist/views/admin/items.pug
vendored
12
dist/views/admin/items.pug
vendored
@ -40,21 +40,21 @@ body.has-fixed-sidenav
|
||||
.row
|
||||
form(action="/control-panel/items/create" method="POST")
|
||||
.input-field.col.l6.s12
|
||||
input(id="title" type="text" name="title")
|
||||
input(id="title" type="text" name="title" required)
|
||||
label(for="title") Название товара
|
||||
.input-field.col.l6.s12
|
||||
input(id="price" type="text" name="price")
|
||||
label(for="price") Цена товара ₽
|
||||
input(id="price" type="text" name="price" pattern="([0-9\.]+)" required)
|
||||
label(for="price") Цена товара в рублях ₽
|
||||
.input-field.col.l6.s12
|
||||
textarea(id="description" class="materialize-textarea" type="text" name="description")
|
||||
textarea(id="description" class="materialize-textarea" type="text" name="description" required)
|
||||
label(for="description") Описание товара
|
||||
.input-field.col.l6.s12
|
||||
select#selectCategories(name="category")
|
||||
select#selectCategories(name="category" required)
|
||||
option(value="" disabled selected)
|
||||
| Выберите категорию
|
||||
label Категория товара
|
||||
.input-field.col.s12
|
||||
textarea(class="materialize-textarea" type="text" placeholder="Пречеслите аккаунты в вашем формате через запятую." name="data")
|
||||
textarea(class="materialize-textarea" type="text" placeholder="Пречеслите аккаунты в вашем формате через запятую." name="data" required)
|
||||
label Данные товара
|
||||
.col.s12
|
||||
button(type="submit" class="btn") Добавить товар
|
||||
|
||||
@ -27,13 +27,15 @@ export class ItemsComponent extends Component {
|
||||
|
||||
async getItemsByText(text) {
|
||||
const items = await apiService.getItemsQuery(text),
|
||||
categories = await apiService.getCategories();
|
||||
return renderItems(items, categories);
|
||||
categories = await apiService.getCategories(),
|
||||
data = await apiService.getItemsData();
|
||||
return renderItems(items, categories, data);
|
||||
}
|
||||
|
||||
async getItemsByPage(page) {
|
||||
const items = await apiService.getItemsOffset(page),
|
||||
categories = await apiService.getCategories();
|
||||
return renderItems(items, categories);
|
||||
categories = await apiService.getCategories(),
|
||||
data = await apiService.getItemsData();
|
||||
return renderItems(items, categories, data);
|
||||
}
|
||||
}
|
||||
@ -51,16 +51,16 @@ export class PaginationComponent extends Component {
|
||||
|
||||
// выполняем запрос на сервер и выводим на данные
|
||||
async moveTo(page, insertTo, request) {
|
||||
try {
|
||||
const response = await request(page);
|
||||
|
||||
if (response != '') {
|
||||
this.$el.setAttribute('data-page', page);
|
||||
insertTo.innerHTML = '';
|
||||
this.loader.show();
|
||||
insertTo.insertAdjacentHTML('afterbegin', await request(page));
|
||||
insertTo.insertAdjacentHTML('afterbegin', response);
|
||||
this.loader.hide();
|
||||
} catch (error) {
|
||||
this.loader.hide();
|
||||
this.$el.classList.add('hide');
|
||||
insertTo.parentNode.innerHTML = '<h1>Товаров или категорий в магазине нету.</h1>';
|
||||
} else {
|
||||
insertTo.innerHTML = 'Данных нету.';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -21,7 +21,7 @@ export class deleteItemModal extends Modal {
|
||||
|
||||
openHandler(e) {
|
||||
const data = JSON.parse(e.target.parentNode.parentNode.dataset.info);
|
||||
this.$content.innerHTML = `Вы действительно хотите удалить товар: <br> "${data.title}"?`;
|
||||
this.$content.innerHTML = `Вы действительно хотите удалить товар "${data.title}"? Находящиеся в нем аккаунты будут удалены.`;
|
||||
this.$button.onclick = this.deleteHandler.bind(this, data.id);
|
||||
}
|
||||
|
||||
|
||||
@ -10,24 +10,35 @@ export class editCategoryModal extends Modal {
|
||||
// перепишем метод для перевода ивента open в событие onchange
|
||||
init() {
|
||||
if (this.open) {
|
||||
this.setElems();
|
||||
this.open.addEventListener('change', this.show.bind(this));
|
||||
this.close.addEventListener('click', this.hide.bind(this));
|
||||
this.$el.querySelector('form').addEventListener('submit', this.updateCategory.bind(this));
|
||||
}
|
||||
}
|
||||
|
||||
async openHandler(e) {
|
||||
const data = JSON.parse(e.target.value);
|
||||
this.$el.querySelector('form .id input').value = data.id;
|
||||
this.$el.querySelector('form .originalTitle input').value = data.title[0].toUpperCase() + data.title.slice(1);
|
||||
this.$el.querySelector('form .title input').value = data.title[0].toUpperCase() + data.title.slice(1);
|
||||
this.$el.querySelector('form .type textarea').value = data.type;
|
||||
this.$el.querySelector('form .format input').value = data.format;
|
||||
setElems() {
|
||||
this.$id = this.$el.querySelector('.id');
|
||||
this.$originalTitle = this.$el.querySelector('.originalTitle');
|
||||
this.$title = this.$el.querySelector('.title');
|
||||
this.$type = this.$el.querySelector('.type');
|
||||
this.$format = this.$el.querySelector('.format');
|
||||
this.$img = this.$el.querySelector('.img');
|
||||
}
|
||||
|
||||
const icons = await apiService.getIcons();
|
||||
const icons_html = renderIcons(icons);
|
||||
this.$el.querySelector('form .img select').insertAdjacentHTML('beforeend', icons_html);
|
||||
M.FormSelect.init(this.$el.querySelector('form .img select'));
|
||||
async openHandler(e) {
|
||||
const data = JSON.parse(e.target.value),
|
||||
icons = await apiService.getIcons();
|
||||
|
||||
this.$img.innerHTML = '';
|
||||
this.$id.value = data.id;
|
||||
this.$originalTitle.value = data.title[0].toUpperCase() + data.title.slice(1);
|
||||
this.$title.value = data.title[0].toUpperCase() + data.title.slice(1);
|
||||
this.$type.value = data.type;
|
||||
this.$format.value = data.format;
|
||||
this.$img.insertAdjacentHTML('beforeend', renderIcons(icons));
|
||||
M.FormSelect.init(this.$img);
|
||||
M.textareaAutoResize(this.$type);
|
||||
M.updateTextFields();
|
||||
}
|
||||
|
||||
|
||||
@ -21,6 +21,7 @@ export class editItemModal extends Modal {
|
||||
this.$price = this.$el.querySelector('.price');
|
||||
this.$description = this.$el.querySelector('.description');
|
||||
this.$category = this.$el.querySelector('.category');
|
||||
this.$data = this.$el.querySelector('.data');
|
||||
}
|
||||
|
||||
async openHandler(e) {
|
||||
@ -33,7 +34,10 @@ export class editItemModal extends Modal {
|
||||
this.$price.value = data.price;
|
||||
this.$description.value = data.description;
|
||||
this.$category.insertAdjacentHTML('beforeend', renderCategories(categories));
|
||||
this.$data.value = data.data;
|
||||
M.FormSelect.init(this.$category);
|
||||
M.textareaAutoResize(this.$description);
|
||||
M.textareaAutoResize(this.$data);
|
||||
M.updateTextFields();
|
||||
}
|
||||
}
|
||||
@ -70,6 +70,15 @@ class ApiService {
|
||||
}
|
||||
}
|
||||
|
||||
async getItemsData() {
|
||||
try {
|
||||
const request = `${this.url}/api/items/data`;
|
||||
return useRequest(request);
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
}
|
||||
}
|
||||
|
||||
async getIcons() {
|
||||
try {
|
||||
const request = `${this.url}/api/icons`;
|
||||
|
||||
@ -1,10 +1,13 @@
|
||||
export function renderItems(items, categories) {
|
||||
export function renderItems(items, categories, info) {
|
||||
let html = '';
|
||||
|
||||
categories.forEach(category => {
|
||||
items.forEach(item => {
|
||||
if (item.category.toLowerCase() === category.title.toLowerCase()) html += `<tr data-info='{"id": "${item._id}", "title": "${item.title}", "category": "${item.category}", "price": "${item.price}", "description": "${item.description}"}'><td><img src="../img/service-icons/${category.img}" alt="alt"></td><td>${item.title}</td><td>${item.category[0].toUpperCase() + item.category.slice(1)}</td><td>${new Date(item.date).toLocaleDateString()}</td><td>${item.count}</td><td>${item.price} ₽</td><td><button id="deleteItem" class="btn red">Удалить</button><button id="editItem" class="btn orange">Изменить</button></td></tr>`
|
||||
if (!items.error) {
|
||||
categories.forEach(category => {
|
||||
items.forEach((item, i) => {
|
||||
if (item.category.toLowerCase() === category.title.toLowerCase()) html += `<tr data-info='{"id": "${item._id}", "title": "${item.title}", "category": "${item.category}", "price": "${item.price}", "description": "${item.description}", "data": "${info[i].data}"}'><td><img src="../img/service-icons/${category.img}" alt="alt"></td><td>${item.title}</td><td>${item.category[0].toUpperCase() + item.category.slice(1)}</td><td>${new Date(item.date).toLocaleDateString()}</td><td>${item.count}</td><td>${item.price} ₽</td><td><button id="deleteItem" class="btn red">Удалить</button><button id="editItem" class="btn orange">Изменить</button></td></tr>`
|
||||
});
|
||||
});
|
||||
});
|
||||
} else html += 'Данных нету.';
|
||||
|
||||
return html;
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user