Admin dashboard page

This commit is contained in:
Sergey Yarkov 2019-12-08 17:29:11 +03:00
parent dcb3d7e0b6
commit 2c80e7ba67
13 changed files with 285 additions and 13 deletions

View File

@ -164,6 +164,7 @@ function myOrdersRoute(req, res) {
function controlPanelRoute(req, res) {
res.render('admin/control-panel', {
name: req.user.name,
email: req.user.email,
title: 'Digital-Store | Панель управления сайтом'
});
}

View File

@ -34,6 +34,20 @@
width: 100%;
}
}
@media (min-width: 993px) {
header .navbar-fixed nav.navbar {
width: calc(100% - 300px);
left: 300px;
}
body.has-fixed-sidenav {
padding-left: 300px;
}
main.admin-main .container, footer.admin-footer .container {
width: 90%;
}
}
@media (min-width: 768px) {
.items .items-list__info {
min-width: 435px;

View File

@ -305,7 +305,7 @@ hr {
}
/* Header */
header {
header.main-header {
position: fixed;
right: 0;
left: 0;
@ -316,7 +316,6 @@ header {
nav {
background-color: #26A69A;
font-weight: 300;
box-shadow: none;
}
.nav-wrapper .brand-logo {
@ -335,8 +334,8 @@ nav {
}
header nav,
main,
footer .container {
main.main-section,
footer.main-footer .container {
padding-left: 90px;
padding-right: 90px;
}
@ -346,7 +345,7 @@ footer .container {
.category,
.filter,
.purchase,
.background {
.main-section .background {
background-color: #fff;
border-radius: 4px;
margin-bottom: 1rem;
@ -504,7 +503,7 @@ footer .container {
}
.background {
.main-section .background {
background-color: #fff;
padding: 40px;
margin: 40px 0;
@ -643,7 +642,7 @@ footer .container {
}
/* Footer */
footer {
footer.main-footer {
margin-top: 4rem;
background-color: #25998f;
padding-top: 10px;
@ -670,4 +669,68 @@ footer {
}
.login-form__content button {
width: 100%;
}
.sidenav .collapsible-header, .sidenav.fixed .collapsible-header, .sidenav li>a {
padding: 0 20px;
}
.nav-wrapper .brand-logo {
padding: 0 5px 0px 15px;
}
.sidenav .user-view {
padding: 10px 32px 0px;
}
.admin-main {
margin-top: 20px;
}
.admin-main h2 {
margin: 23px 0px 20px 0px;
}
.admin-header nav.navbar {
padding-left: 10px;
}
.card .card-content .card-title {
font-size: 16px;
}
.card .card-content h3 {
margin-top: 8px;
}
.buyers {
max-height: 365px;
overflow-y: scroll;
}
footer.admin-footer{
background-color: #fff;
border-top: 1px solid #e0e0e0;
color: #444;
padding: 70px 0 10px;
margin: 0;
}
.admin-footer ul li a {
color: #999;
font-size: .9rem;
font-weight: 300;
margin: 5px 0;
}
.admin-footer h5 {
font-size: 1.64rem;
line-height: 110%;
margin: 1.0933333333rem 0 .656rem 0;
}
.admin-footer ul li {
margin-bottom: 5px;
}
.admin-footer ul li.github-icons {
margin-top: 10px;
}
.admin-footer ul li.github-icons span:nth-child(1) {
margin-left: 0;
}
.admin-footer ul li.github-icons span {
margin-left: 5px;
}
.modal .modal-content p {
margin-top: 10px;
}
.modal .modal-content h4 {
margin-bottom: 10px;
}

BIN
dist/public/img/admin/avatar-user.jpg vendored Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

9
dist/views/admin/assets/scripts.pug vendored Normal file
View File

@ -0,0 +1,9 @@
script(async defer src="https://buttons.github.io/buttons.js")
// Maretialize JS
script(src='https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js')
script.
document.addEventListener('DOMContentLoaded', function () {
M.Sidenav.init(document.querySelectorAll('.sidenav'));
M.Collapsible.init(document.querySelectorAll('.collapsible'));
M.Modal.init(document.querySelectorAll('.modal'));
});

View File

@ -0,0 +1,17 @@
footer.page-footer.admin-footer
.container
.row(style="padding: 7px;")
.col.l6
h5 О панели управления
ul
li
a(href="#help" class="modal-trigger") Помощь
li
a(href="#news" class="modal-trigger") Новости
.col.l6
h5 Поддержать проект
ul
li.github-icons
a(class="github-button" href="https://github.com/sergeyyarkov/digital-store" data-size="large" data-show-count="true" aria-label="Star ntkme/github-buttons on GitHub") Star
a(class="github-button" href="https://github.com/sergeyyarkov/digital-store/fork" data-icon="octicon-repo-forked" data-size="large" data-show-count="true" aria-label="Fork ntkme/github-buttons on GitHub") Fork
a(class="github-button" href="https://github.com/sergeyyarkov/digital-store/issues" data-icon="octicon-issue-opened" data-size="large" data-show-count="true" aria-label="Fork ntkme/github-buttons on GitHub") Issue

View File

@ -0,0 +1,67 @@
header.admin-header
form(id="logout" action="/logout?_method=DELETE" method="POST")
.navbar-fixed
nav.navbar.white
.nav-wrapper
a(href="#" data-target="slide-out" class="sidenav-trigger" style="color: #000;")
i.material-icons menu
a(href="#" class="brand-logo grey-text text-darken-4") Главная
ul#slide-out.sidenav.sidenav-fixed.control-panel
li
.user-view
.background
img(src="./img/admin/background-user.jpg", alt="#")
span(style="padding-top: 5px;padding-bottom:10px;display:block;").white-text Control Panel v1.0.0
a(href="#")
img(class="circle" src="./img/admin/avatar-user.jpg", alt="alt")
a(href="#")
span.white-text.name #{name}
a(href="#")
span.white-text.email #{email}
li
a(href="#" class="subheader") Управление аккаунтом
li
a(href="#" class="waves-effect" onclick="document.getElementById('logout').submit()") Выйти
i.material-icons exit_to_app
li
.divider
li
a(href="#" class="subheader") Управление сайтом
li.no-padding
ul.collapsible
li
a(href="#" class="collapsible-header waves-effect")
i.material-icons edit
| Редактирование
.collapsible-body
ul
li
a(href="#items")
i.material-icons list
| Товары
li
a(href="#categories")
i.material-icons category
| Категории
li
a(href="#categories")
i.material-icons visibility
| Контент на сайте
li
a(href="#administrators")
i.material-icons supervisor_account
| Администраторы
ul.collapsible
li
a(href="#" class="collapsible-header waves-effect")
i.material-icons build
| Настройки
.collapsible-body
ul
li
a(href="#items")
i.material-icons storage
| База данных
//- Модальные окна
include ./modals/help.pug
include ./modals/news.pug

View File

@ -0,0 +1,7 @@
#help.modal
.modal-content
h4 Помощь
.divider
p Текст для помощи
.modal-footer
a(href="#" class="modal-close waves-effect waves-green btn-flat") Закрыть

View File

@ -0,0 +1,7 @@
#news.modal
.modal-content
h4 Обновление v1.0.0
.divider
p Текст по UPD
.modal-footer
a(href="#" class="modal-close waves-effect waves-green btn-flat") Закрыть

View File

@ -1,5 +1,92 @@
include ../assets/head.pug
h1 Control-Panel
h3 Привет #{name}
form(action="/logout?_method=DELETE" method="POST")
button(type="submit") Выйти
body.has-fixed-sidenav
include ./assets/templates/header.pug
main.admin-main
.container
.row
.col.s12
h2 Статистика
.col.l4.m6.s12
.card
.card-content
span.card-title Сумма проданных товаров
.divider
h3 0 ₽
.col.l4.m6.s12
.card
.card-content
span.card-title Кол-во проданных товаров
.divider
h3 0
.col.l4.s12
.card
.card-content
span.card-title Общее кол-во товаров на сайте
.divider
h3 0
.col.s12
.card
.card-content
span.card-title Список покупателей
.buyers
table.striped
thead
tr
th Почта
th Способ оплаты
th Дата оплаты
th Сумма
.divider
tbody
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 ₽
tr
td test@gmail.com
td Qiwi
td 2019-12-05
td 145 ₽
include ./assets/templates/footer.pug
include ./assets/scripts.pug

View File

@ -1,4 +1,4 @@
footer
footer.main-footer
span © 2019 Digital Store | Все права защищены.
.waves-effect.waves-light.pulse.cart-btn(id="cartOpen")
i.material-icons shopping_cart

View File

@ -1,5 +1,5 @@
- var currentPage = pageName;
header#header
header#header.main-header
nav
// Menu-Mobile Button
a.sidenav-trigger(href='#' data-target='slide-out')