mirror of
https://github.com/sergeyyarkov/digital-store.git
synced 2026-10-11 10:19:15 +03:00
fixed items component
This commit is contained in:
parent
6a577b8dc4
commit
a50caef3ce
3
dist/public/css/style.css
vendored
3
dist/public/css/style.css
vendored
@ -89,7 +89,7 @@ hr {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
z-index: 99999999;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
@ -514,6 +514,7 @@ footer.main-footer .container {
|
||||
.items-list__name {
|
||||
max-width: 525px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.items-list__name,
|
||||
|
||||
2
dist/public/js/admin.js
vendored
2
dist/public/js/admin.js
vendored
File diff suppressed because one or more lines are too long
14
dist/views/admin/control-panel.pug
vendored
14
dist/views/admin/control-panel.pug
vendored
@ -2,6 +2,16 @@ include ./assets/head.pug
|
||||
body.has-fixed-sidenav
|
||||
include ./assets/templates/header.pug
|
||||
main.admin-main
|
||||
#loader.loader-fullscreen.hide
|
||||
.loader-fullscreen__wrap
|
||||
.preloader-wrapper.big.active
|
||||
.spinner-layer.spinner-green-only
|
||||
.circle-clipper.left
|
||||
.circle
|
||||
.gap-patch
|
||||
.circle
|
||||
.circle-clipper.right
|
||||
.circle
|
||||
.container
|
||||
.row
|
||||
.col.s12
|
||||
@ -45,9 +55,7 @@ body.has-fixed-sidenav
|
||||
th Сумма
|
||||
th Информация о покупке
|
||||
.divider
|
||||
tbody
|
||||
#loader.progress
|
||||
.indeterminate
|
||||
tbody
|
||||
ul#pagination.pagination.center(data-page="1")
|
||||
include ./assets/templates/modals/bill_data.pug
|
||||
include ./assets/templates/footer.pug
|
||||
|
||||
12
dist/views/admin/items.pug
vendored
12
dist/views/admin/items.pug
vendored
@ -2,6 +2,16 @@ include ./assets/head.pug
|
||||
body.has-fixed-sidenav
|
||||
include ./assets/templates/header.pug
|
||||
main.admin-main
|
||||
#loader.loader-fullscreen.hide
|
||||
.loader-fullscreen__wrap
|
||||
.preloader-wrapper.big.active
|
||||
.spinner-layer.spinner-green-only
|
||||
.circle-clipper.left
|
||||
.circle
|
||||
.gap-patch
|
||||
.circle
|
||||
.circle-clipper.right
|
||||
.circle
|
||||
.container
|
||||
.row
|
||||
.col.s12
|
||||
@ -32,8 +42,6 @@ body.has-fixed-sidenav
|
||||
|
||||
.divider
|
||||
tbody
|
||||
#loader.progress
|
||||
.indeterminate
|
||||
ul#pagination.pagination.center(data-page="1")
|
||||
.divider
|
||||
.items-add
|
||||
|
||||
@ -57,6 +57,15 @@ module.exports = function(server, db) {
|
||||
}
|
||||
});
|
||||
|
||||
server.get('/api/items/id/:id', async (req, res) => {
|
||||
try {
|
||||
const item = await db.collection('items').findOne({_id: ObjectID(req.params.id)})
|
||||
res.json(item)
|
||||
} catch {
|
||||
res.status(500).render('main/404');
|
||||
}
|
||||
});
|
||||
|
||||
server.get('/api/items/page/:page', async (req, res) => {
|
||||
try {
|
||||
const page = parseInt(req.params.page),
|
||||
@ -77,6 +86,15 @@ module.exports = function(server, db) {
|
||||
}
|
||||
});
|
||||
|
||||
server.get('/api/items/data/:id', checkAuthenticated, async (req, res) => {
|
||||
try {
|
||||
const data = await db.collection('info').findOne({_id: ObjectID(req.params.id)});
|
||||
res.json(data)
|
||||
} catch {
|
||||
res.status(500).render('main/404');
|
||||
}
|
||||
})
|
||||
|
||||
server.get('/api/buyers', checkAuthenticated, async (req, res) => {
|
||||
try {
|
||||
const buyers = await db.collection('buyers').find({}).toArray();
|
||||
|
||||
@ -25,7 +25,7 @@ const content = new ContentComponent('content');
|
||||
const administrator = new AdministratorComponent('administrator');
|
||||
|
||||
// Modals
|
||||
const itemEdit = new ItemEditModal('editItemModal', 'edit', 'editItemClose');
|
||||
const itemEdit = new ItemEditModal('editItemModal', 'edit', 'editItemClose', {loader});
|
||||
const itemDelete = new ItemDeleteModal('deleteItemModal', 'edit', 'deleteItemClose');
|
||||
const categoryEdit = new CategoryEditModal('editCategoryModal', 'editCategory_select', 'editCategoryClose');
|
||||
const billData = new BillDataModal('billDataModal', 'dashboard', 'billDataClose');
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
import { Modal } from "../core/modal";
|
||||
import { apiService } from "../services/api.service";
|
||||
import axios from "axios";
|
||||
|
||||
export class ItemDeleteModal extends Modal {
|
||||
@ -19,10 +20,16 @@ export class ItemDeleteModal extends Modal {
|
||||
this.$button = this.$el.querySelector('.delete-item');
|
||||
}
|
||||
|
||||
openHandler(e) {
|
||||
const data = JSON.parse(e.target.parentNode.parentNode.dataset.info);
|
||||
this.$content.innerHTML = `Вы действительно хотите удалить товар "${data.title}"? Находящиеся в нем аккаунты будут удалены.`;
|
||||
this.$button.onclick = this.deleteHandler.bind(this, data.id);
|
||||
async openHandler(e) {
|
||||
try {
|
||||
const id = e.target.parentNode.parentNode.dataset.id,
|
||||
item = await apiService.getItemById(id);
|
||||
|
||||
this.$content.innerHTML = `Вы действительно хотите удалить товар "${item.title}"? Находящиеся в нем аккаунты будут удалены.`;
|
||||
this.$button.onclick = this.deleteHandler.bind(this, item._id);
|
||||
} catch (error) {
|
||||
alert('Произошла ошибка, попробуйте обновить страницу.')
|
||||
}
|
||||
}
|
||||
|
||||
async deleteHandler(id) {
|
||||
|
||||
@ -3,8 +3,9 @@ import { apiService } from "../services/api.service";
|
||||
import { renderCategories } from "../templates/categories.template";
|
||||
|
||||
export class ItemEditModal extends Modal {
|
||||
constructor(id, open, close) {
|
||||
constructor(id, open, close, {loader}) {
|
||||
super(id, open, close);
|
||||
this.loader = loader
|
||||
}
|
||||
|
||||
show(e) {
|
||||
@ -25,19 +26,28 @@ export class ItemEditModal extends Modal {
|
||||
}
|
||||
|
||||
async openHandler(e) {
|
||||
const data = JSON.parse(e.target.parentNode.parentNode.dataset.info),
|
||||
categories = await apiService.getCategories();
|
||||
try {
|
||||
this.loader.show();
|
||||
const id = e.target.parentNode.parentNode.dataset.id,
|
||||
item = await apiService.getItemById(id),
|
||||
data = await apiService.getDataById(id),
|
||||
categories = await apiService.getCategories();
|
||||
item.data = data.data
|
||||
|
||||
this.$category.innerHTML = `<option value='{"title": "${data.category}"}' selected>Оставить прежнюю</option>`;
|
||||
this.$id.value = data.id;
|
||||
this.$title.value = data.title;
|
||||
this.$price.value = data.price;
|
||||
this.$description.value = data.description;
|
||||
this.$category.innerHTML = `<option value='{"title": "${item.category}"}' selected>Оставить прежнюю</option>`;
|
||||
this.$id.value = item._id;
|
||||
this.$title.value = item.title;
|
||||
this.$price.value = item.price;
|
||||
this.$description.value = item.description;
|
||||
this.$category.insertAdjacentHTML('beforeend', renderCategories(categories));
|
||||
this.$data.value = data.data;
|
||||
this.$data.value = item.data;
|
||||
M.FormSelect.init(this.$category);
|
||||
M.textareaAutoResize(this.$description);
|
||||
M.textareaAutoResize(this.$data);
|
||||
M.updateTextFields();
|
||||
M.updateTextFields();
|
||||
this.loader.hide();
|
||||
} catch (error) {
|
||||
alert('Произошла ошибка, обновите страницу')
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -56,6 +56,24 @@ class ApiService {
|
||||
}
|
||||
}
|
||||
|
||||
async getItemById(id) {
|
||||
try {
|
||||
const request = `${this.url}/api/items/id/${id}`;
|
||||
return useRequest(request);
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
async getDataById(id) {
|
||||
try {
|
||||
const request = `${this.url}/api/items/data/${id}`;
|
||||
return useRequest(request);
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
async getItemsOne(category, sorting) {
|
||||
try {
|
||||
if (sorting) {
|
||||
|
||||
@ -3,7 +3,7 @@ export function renderItems(items, categories, info) {
|
||||
return categories.map(category => {
|
||||
return items.map((item, i) => {
|
||||
if (item.category.toLowerCase() === category.title.toLowerCase()) {
|
||||
return `<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>`;
|
||||
return `<tr data-id="${item._id}"><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 style="display: flex"><button id="deleteItem" class="btn red">Удалить</button><button id="editItem" class="btn orange">Изменить</button></td></tr>`;
|
||||
}
|
||||
}).join('');
|
||||
}).join('');
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user