лабораторные 1-5 и отчеты 1-4
This commit is contained in:
sardq
parent
8b22c33265
commit
c24938fe3d
6
.idea/misc.xml
Normal file
6
.idea/misc.xml
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="ProjectRootManager">
|
||||||
|
<output url="file://$PROJECT_DIR$/out" />
|
||||||
|
</component>
|
||||||
|
</project>
|
||||||
8
.idea/modules.xml
Normal file
8
.idea/modules.xml
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="ProjectModuleManager">
|
||||||
|
<modules>
|
||||||
|
<module fileurl="file://$PROJECT_DIR$/.idea/rep.iml" filepath="$PROJECT_DIR$/.idea/rep.iml" />
|
||||||
|
</modules>
|
||||||
|
</component>
|
||||||
|
</project>
|
||||||
9
.idea/rep.iml
Normal file
9
.idea/rep.iml
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<module type="JAVA_MODULE" version="4">
|
||||||
|
<component name="NewModuleRootManager" inherit-compiler-output="true">
|
||||||
|
<exclude-output />
|
||||||
|
<content url="file://$MODULE_DIR$" />
|
||||||
|
<orderEntry type="inheritedJdk" />
|
||||||
|
<orderEntry type="sourceFolder" forTests="false" />
|
||||||
|
</component>
|
||||||
|
</module>
|
||||||
6
.idea/vcs.xml
Normal file
6
.idea/vcs.xml
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<project version="4">
|
||||||
|
<component name="VcsDirectoryMappings">
|
||||||
|
<mapping directory="" vcs="Git" />
|
||||||
|
</component>
|
||||||
|
</project>
|
||||||
BIN
1 lab/Макеты сайтов Социальная сеть.fig
Normal file
BIN
1 lab/Макеты сайтов Социальная сеть.fig
Normal file
Binary file not shown.
111
2 lab/admin-page.html
Normal file
111
2 lab/admin-page.html
Normal file
@ -0,0 +1,111 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru" class="h-100">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Моя страница</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
<body class="d-flex flex-column h-100">
|
||||||
|
<header>
|
||||||
|
<nav class="navbar navbar-expand-md">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="/">
|
||||||
|
<img src="Images/icon.jpg" alt="logo" width="40">
|
||||||
|
</a>
|
||||||
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||||
|
data-bs-target="#navbarNav"
|
||||||
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
<div class="navbar-collapse collapse justify-content-start" id="navbarNav">
|
||||||
|
<div class="navbar-nav">
|
||||||
|
<a class="nav-link" href="home.html">Главная</a>
|
||||||
|
<a class="nav-link" href="messages.html">Сообщения</a>
|
||||||
|
<a class="nav-link" href="settings.html">Настройки</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid p-2">
|
||||||
|
<h1 class=" text-center font-weight-bold">Панель администратора</h1>
|
||||||
|
<div class="btn-group" role="group">
|
||||||
|
<a class="btn btn-dark" href="page-edit.html">Добавить аккаунт</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 class=" text-center font-weight-bold" style="padding-top: 10px;">Таблица данных</h2>
|
||||||
|
<table id="items-table" class="table table-striped">
|
||||||
|
<thead>
|
||||||
|
<th scope="col">№</th>
|
||||||
|
<th scope="col" class="w-25">Никнейм</th>
|
||||||
|
<th scope="col" class="w-25">Почта</th>
|
||||||
|
<th scope="col" class="w-10">Пароль</th>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="items-update" class="modal fade" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<form id="items-form" class="needs-validation" novalidate>
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h1 class="modal-title fs-5" id="items-update-title"></h1>
|
||||||
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="text-center">
|
||||||
|
<img id="image-preview" src="https://via.placeholder.com/200" class="rounded rounded-circle"
|
||||||
|
alt="placeholder">
|
||||||
|
</div>
|
||||||
|
<input id="items-line-id" type="number" hidden>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label for="item" class="form-label">Товары</label>
|
||||||
|
<select id="item" class="form-select" name="selected" required>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="price">Цена</label>
|
||||||
|
<input id="price" name="price" class="form-control" type="number" value="99.00" min="99.00"
|
||||||
|
step="1.00" required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="stock">Акция</label>
|
||||||
|
<input id="stock" name="price" class="form-control" type="number" value="0" min="0"
|
||||||
|
step="100" required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="count">Количество</label>
|
||||||
|
<input id="count" name="count" class="form-control" type="number" value="0" min="1" step="1"
|
||||||
|
required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="image">Изображение</label>
|
||||||
|
<input id="image" type="file" name="image" class="form-control" accept="image/*">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
|
||||||
|
<button type="submit" class="btn btn-primary">Сохранить</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<script type="module">
|
||||||
|
import validation from "./js/validation";
|
||||||
|
import { linesForm } from "./js/lines";
|
||||||
|
|
||||||
|
/*document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
validation();
|
||||||
|
linesForm();
|
||||||
|
});*/
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
91
2 lab/dialog.html
Normal file
91
2 lab/dialog.html
Normal file
@ -0,0 +1,91 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Диалог</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#FFFFFF; ">
|
||||||
|
<div class = "container">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between" style ="background:black">
|
||||||
|
<img src="images/da.jpg" alt="david" width="60" height="60" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="nickname-avatar">
|
||||||
|
<p>Давид Макаров</p></div>
|
||||||
|
<a href="Messages.html">Назад</a>
|
||||||
|
</div>
|
||||||
|
<div class='chat p-3'>
|
||||||
|
|
||||||
|
|
||||||
|
<div class ="d-flex align-items-end flex-column gap-3">
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">12:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex align-items-start flex-column gap-3">
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class='chat-input'>
|
||||||
|
|
||||||
|
<form method='post' id='chat-form'>
|
||||||
|
|
||||||
|
<input type='text' id='message-text' class='chat-form__input' placeholder='Введите сообщение'>
|
||||||
|
<input type='submit' class='chat-form__submit' value='=>' style = "margin-right:auto">
|
||||||
|
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
186
2 lab/home.html
Normal file
186
2 lab/home.html
Normal file
@ -0,0 +1,186 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Главная</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<main class="d-flex flex-nowrap">
|
||||||
|
<div class ="cl1 text-bg-dark">
|
||||||
|
<div class="filters ">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 text-bg-dark;" style ="width: 280px;">
|
||||||
|
|
||||||
|
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
|
||||||
|
<svg class="bi pe-none me-2" width="40" height="32"><img src="images/icon.jpg" alt="icon" width ="24" height ="24"></svg>
|
||||||
|
<span class="fs-4">Сообщения</span>
|
||||||
|
</a>
|
||||||
|
<hr>
|
||||||
|
<ul class="nav nav-pills flex-column mb-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="Messages.html" class="nav-link active" aria-current="page">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/messages.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
Сообщения
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
Настройки
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
Выход
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class ="cl2 bg-body-tertiary" style ="position:sticky; height:100vh;">
|
||||||
|
<div class="filters">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary" style="width: 3rem;">
|
||||||
|
<a href="/" class="d-block p-3 link-body-emphasis text-decoration-none" title="Icon-only" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<img class="icon" src="images/icon.jpg" alt="icon" width ="32" height ="32">
|
||||||
|
<span class="visually-hidden">Icon</span>
|
||||||
|
</a>
|
||||||
|
<ul class="nav nav-pills nav-flush flex-column mb-auto text-center">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="Messages.html" class="nav-link active py-3 border-bottom rounded-0" aria-current="page" title="Messages" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Home"><img src="images/messages.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link py-3 border-bottom rounded-0" title="Settings" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Settings"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link py-3 border-bottom rounded-0" title="Orders" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Orders"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="filters">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="list-group">
|
||||||
|
<a class="list-group-item list-group-item-action d-flex gap-1 py-2" aria-current="true">
|
||||||
|
<img src="images/da.jpg" alt="twbs" width="40" height="40" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Давид Макаров</h6>
|
||||||
|
<p class="mb-0 opacity-75">Оцените моего</p>
|
||||||
|
<div class = "postImage">
|
||||||
|
<img src="images/da2.jpg" class="img-fluid" alt="Данил" height="200" width="500"></div>
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<input type="image" src="images/like.png" width="20" height="20" alt="Кнопка «input»">
|
||||||
|
<h6 class="mb-0">5</h6>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<img src="images/eye.png" alt="Просмотры" width="20" height="20" >
|
||||||
|
<h6 class="mb-0">2100</h6>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex gap-2 w-50 justify-content-between">
|
||||||
|
<button class="btn btn-dark rounded-pill px-3" type="button">Прокомментировать</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-1">сейчас</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">List group item heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">now</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
56
2 lab/index.html
Normal file
56
2 lab/index.html
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="ru">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Регистрация</title>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container">
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<h3>Регистрация</h3>
|
||||||
|
<label for ="name" class = "control-label center">Введите никнейм</label>
|
||||||
|
<input type = "name" class = "form-control" id = "name" placeholder ="Введите никнейм">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<label for ="email" class = "control-label">Введите почту</label>
|
||||||
|
<input type = "email" class = "form-control" id = "email" placeholder ="Введите почту">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<label for ="pasword" control = "control-label">Введите пароль</label>
|
||||||
|
|
||||||
|
|
||||||
|
<input type = "pasword" class = "form-control" id = "pasword" placeholder ="Введите пароль">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<label for ="paswordConfirm" control = "control-label">Подтвердите пароль</label>
|
||||||
|
<input type = "paswordConfirm" class = "form-control" id = "paswordConfirm" placeholder ="Подтвердите пароль">
|
||||||
|
<a href ="login.html">У вас уже есть профиль?</a>
|
||||||
|
<p></p>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<form action="home.html">
|
||||||
|
<input type = "submit" class = "btn btn-primary" value = "Зарегистрироваться">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
41
2 lab/login.html
Normal file
41
2 lab/login.html
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Логин</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container >
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<h3>Логин</h3>
|
||||||
|
<label for ="name" class = "control-label center">Введите никнейм или почту</label>
|
||||||
|
<input type = "name" class = "form-control" id = "name" placeholder ="Введите никнейм или почту">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<label for ="password" class = "control-label">Введите пароль</label>
|
||||||
|
<input type = "password" class = "form-control" id = "password" placeholder ="Введите пароль">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<a href ="index.html">Нет профиля? Зарегистрироваться</a>
|
||||||
|
<p></p>
|
||||||
|
<div>
|
||||||
|
<form action="home.html">
|
||||||
|
<input type = "submit" class = "btn btn-primary" value = "Войти">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
107
2 lab/messages.html
Normal file
107
2 lab/messages.html
Normal file
@ -0,0 +1,107 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Сообщения</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<main class="d-flex flex-nowrap">
|
||||||
|
<div class ="cl1 text-bg-dark">
|
||||||
|
<div class="filters ">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 text-bg-dark;" style ="width: 280px;">
|
||||||
|
|
||||||
|
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
|
||||||
|
<svg class="bi pe-none me-2" width="40" height="32"><img src="images/icon.jpg" alt="icon" width ="24" height ="24"></svg>
|
||||||
|
<span class="fs-4">Сообщения</span>
|
||||||
|
</a>
|
||||||
|
<hr>
|
||||||
|
<ul class="nav nav-pills flex-column mb-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="home.html" class="nav-link active" aria-current="page">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/home.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
Главная
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
Настройки
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
Выход
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class ="cl2 bg-body-tertiary" style ="position:sticky; height:100vh;">
|
||||||
|
<div class="filters">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary" style="width: 3rem;">
|
||||||
|
<a href="/" class="d-block p-3 link-body-emphasis text-decoration-none" title="Icon-only" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<img class="icon" src="images/icon.jpg" alt="icon" width ="32" height ="32">
|
||||||
|
<span class="visually-hidden">Icon</span>
|
||||||
|
</a>
|
||||||
|
<ul class="nav nav-pills nav-flush flex-column mb-auto text-center">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="home.html" class="nav-link active py-3 border-bottom rounded-0" aria-current="page" title="Home" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Home"><img src="images/home.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link py-3 border-bottom rounded-0" title="Settings" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Settings"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link py-3 border-bottom rounded-0" title="Orders" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Orders"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="filters">
|
||||||
|
</div>
|
||||||
|
<div class = "container-fluid">
|
||||||
|
<div class="list-group">
|
||||||
|
<a href="dialog.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/da.jpg" alt="david" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Давид Макаров</h6>
|
||||||
|
<p class="mb-0 opacity-75">пример</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">now</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="dialog.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/da2.jpg" alt="danil" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Даниил Путинцев</h6>
|
||||||
|
<p class="mb-0 opacity-75">?</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">3d</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
2240
2 lab/package-lock.json
generated
Normal file
2240
2 lab/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
20
2 lab/package.json
Normal file
20
2 lab/package.json
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
{
|
||||||
|
"name": "int-prog",
|
||||||
|
"version": "1 .0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"start": "vite",
|
||||||
|
"serve": "http-server -p 3000 ./",
|
||||||
|
"build": "vite build",
|
||||||
|
"prod": "npm-run-all build serve"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"bootstrap": "5.2.1 ",
|
||||||
|
"@fortawesome/fontawesome-free": "6.2.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"http-server": "14.1 .1 ",
|
||||||
|
"vite": "4.4.9",
|
||||||
|
"npm-run-all": "4.1.5"
|
||||||
|
}
|
||||||
|
}
|
||||||
77
2 lab/page-edit.html
Normal file
77
2 lab/page-edit.html
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
<html lang="ru">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Моя страница</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet" />
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="h-100 d-flex flex-column">
|
||||||
|
<header>
|
||||||
|
<nav class="navbar navbar-expand-md">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="/">
|
||||||
|
<img src="Images/icon.jpg" alt="logo" width="40">
|
||||||
|
</a>
|
||||||
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||||
|
data-bs-target="#navbarNav"
|
||||||
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
<div class="navbar-collapse collapse justify-content-start" id="navbarNav">
|
||||||
|
<div class="navbar-nav">
|
||||||
|
<a class="nav-link" href="home.html">Главная</a>
|
||||||
|
<a class="nav-link" href="messages.html">Сообщения</a>
|
||||||
|
<a class="nav-link" href="settings.html">Настройки</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid p-2">
|
||||||
|
<h1 class=" text-center font-weight-bold">Добавление аккаунта</h1>
|
||||||
|
<div class="text-center">
|
||||||
|
<img id="image-preview" src="https://via.placeholder.com/200" class="rounded rounded-circle"
|
||||||
|
alt="placeholder">
|
||||||
|
</div>
|
||||||
|
<form id="items-form" class="needs-validation" novalidate>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label for="nickname" class="form-label">Никнейм</label>
|
||||||
|
<input id="nickname" name="nickname" class="form-control" type="string"
|
||||||
|
required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="email">Почта</label>
|
||||||
|
<input id="email" name="email" class="form-control" type="string"
|
||||||
|
required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="password">Пароль</label>
|
||||||
|
<input id="password" name="password" class="form-control" type="string"
|
||||||
|
step="1" required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="image">Изображение</label>
|
||||||
|
<input id="image" type="file" name="image" class="form-control" accept="image/*">
|
||||||
|
</div>
|
||||||
|
<a href="admin-page.html" class="btn btn-secondary">Назад</a>
|
||||||
|
<button type="submit" class="btn btn-primary">Сохранить</button>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
<script type="module">
|
||||||
|
import validation from "./js/validation";
|
||||||
|
import { linesPageForm } from "./js/lines"
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
validation();
|
||||||
|
linesPageForm();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
|
||||||
|
</html>
|
||||||
78
2 lab/settings.html
Normal file
78
2 lab/settings.html
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Настройки</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container text-center>
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class ="col-md-5 offset-md-4">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<img src="images/account.png" alt="accound" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<a>Никнейм пользователя</a>
|
||||||
|
</div>
|
||||||
|
<div class ="return">
|
||||||
|
<a href="home.html">Вернуться</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="list-group">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/account.png" alt="account" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Аккаунт</h6>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/private.png" alt="private" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Приватность</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/autentification.png" alt="autentication" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Двухфакторная Аутентификация</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/blacklist.jpg" alt="blacklist" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Черный список</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/plus.png" alt="add" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Добавить аккаунт</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/help.png" alt="help" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Помощь</h6>
|
||||||
|
</a>
|
||||||
|
<a href="admin-page.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/help.png" alt="help" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Панель администратора</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/bell.png" alt="bell" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Уведомления</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/info.png" alt="info" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Информация</h6>
|
||||||
|
</a>
|
||||||
|
<a href="index.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/exit.png" alt="exit" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Выход из аккаунта</h6>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
120
2 lab/style.css
Normal file
120
2 lab/style.css
Normal file
@ -0,0 +1,120 @@
|
|||||||
|
.chat
|
||||||
|
{
|
||||||
|
border:1px solid #333;
|
||||||
|
width:100%;
|
||||||
|
background:#FFFFFF;
|
||||||
|
color:#fff;
|
||||||
|
max-height:85vh;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
#image-preview {
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
.nickname-avatar p
|
||||||
|
{
|
||||||
|
color:#FFFFFF;
|
||||||
|
}
|
||||||
|
.message
|
||||||
|
{
|
||||||
|
|
||||||
|
height: 100%;
|
||||||
|
font-size:200%;
|
||||||
|
background:gray;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.input
|
||||||
|
{
|
||||||
|
font-family:arial;
|
||||||
|
font-size:16px;
|
||||||
|
vertical-align:middle;
|
||||||
|
background:#333;
|
||||||
|
color:#fff;
|
||||||
|
display:inline-block;
|
||||||
|
margin:1px;
|
||||||
|
height:30px;
|
||||||
|
}
|
||||||
|
.chat-form__input
|
||||||
|
{
|
||||||
|
width:79%;
|
||||||
|
}
|
||||||
|
.chat-form__submit
|
||||||
|
{
|
||||||
|
width:18%;
|
||||||
|
}
|
||||||
|
.return a
|
||||||
|
{
|
||||||
|
margin-left:auto;
|
||||||
|
font-size: 20px;
|
||||||
|
height: 44px;
|
||||||
|
width: 180px;
|
||||||
|
vertical-align:middle;
|
||||||
|
background-color:#000000
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.b-example-vr {
|
||||||
|
flex-shrink: 0;
|
||||||
|
width: 1.5rem;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
.cl2
|
||||||
|
{
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
.filters {
|
||||||
|
|
||||||
|
position: -webkit-sticky;
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
.text-center{
|
||||||
|
margin-right:auto;
|
||||||
|
margin-left:auto;
|
||||||
|
}
|
||||||
|
@media (max-width: 700px){
|
||||||
|
.cl1
|
||||||
|
{
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
.cl2
|
||||||
|
{
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
.chat
|
||||||
|
{
|
||||||
|
height: 60vh;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
.list-group button
|
||||||
|
{
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 300px){
|
||||||
|
.list-group a
|
||||||
|
{
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
.list-group h6
|
||||||
|
{
|
||||||
|
font-size: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-group .postImage img
|
||||||
|
{
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
.list-group img
|
||||||
|
{
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-group button
|
||||||
|
{
|
||||||
|
font-size: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
21
3 lab/.eslintrc.json
Normal file
21
3 lab/.eslintrc.json
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
{
|
||||||
|
"env": {
|
||||||
|
"browser": true,
|
||||||
|
"es2021": true
|
||||||
|
},
|
||||||
|
"extends": "airbnb-base",
|
||||||
|
"parserOptions": {
|
||||||
|
"ecmaVersion": 12,
|
||||||
|
"sourceType": "module"
|
||||||
|
},
|
||||||
|
"rules": {
|
||||||
|
"quotes": "off",
|
||||||
|
"indent": "off",
|
||||||
|
"linebreak-style":0,
|
||||||
|
"no-console": "off",
|
||||||
|
"no-use-before-define": "off",
|
||||||
|
"no-alert": "off",
|
||||||
|
"no-restricted-globals": "off",
|
||||||
|
"quote-props": "off"
|
||||||
|
}
|
||||||
|
}
|
||||||
65
3 lab/admin-page.html
Normal file
65
3 lab/admin-page.html
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru" class="h-100">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Моя страница</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
<body class="d-flex flex-column h-100">
|
||||||
|
<header>
|
||||||
|
<nav class="navbar navbar-expand-md">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="/">
|
||||||
|
<img src="Images/icon.jpg" alt="logo" width="40">
|
||||||
|
</a>
|
||||||
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||||
|
data-bs-target="#navbarNav"
|
||||||
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
<div class="navbar-collapse collapse justify-content-start" id="navbarNav">
|
||||||
|
<div class="navbar-nav">
|
||||||
|
<a class="nav-link" href="home.html">Главная</a>
|
||||||
|
<a class="nav-link" href="messages.html">Сообщения</a>
|
||||||
|
<a class="nav-link" href="settings.html">Настройки</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid p-2">
|
||||||
|
<h1 class=" text-center font-weight-bold">Панель администратора</h1>
|
||||||
|
<div class="btn-group" role="group">
|
||||||
|
<a class="btn btn-dark" href="page-edit.html">Добавить аккаунт(страница)</a>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 class=" text-center font-weight-bold" style="padding-top: 10px;">Таблица данных</h2>
|
||||||
|
<table id="items-table" class="table table-striped">
|
||||||
|
<thead>
|
||||||
|
<th scope="col">№</th>
|
||||||
|
<th scope="col" class="w-25">Никнейм</th>
|
||||||
|
<th scope="col" class="w-25">Почта</th>
|
||||||
|
<th scope="col" class="w-10">Пароль</th>
|
||||||
|
<th scope="col"></th>
|
||||||
|
<th scope="col"></th>
|
||||||
|
<th scope="col"></th>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
<script type="module">
|
||||||
|
import validation from "./js/validation";
|
||||||
|
import { drawLinesTable as drawTable } from "./js/lines";
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
validation();
|
||||||
|
drawTable();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
46
3 lab/data.json
Normal file
46
3 lab/data.json
Normal file
File diff suppressed because one or more lines are too long
91
3 lab/dialog.html
Normal file
91
3 lab/dialog.html
Normal file
@ -0,0 +1,91 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Диалог</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#FFFFFF; ">
|
||||||
|
<div class = "container">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between" style ="background:black">
|
||||||
|
<img src="images/da.jpg" alt="david" width="60" height="60" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="nickname-avatar">
|
||||||
|
<p>Давид Макаров</p></div>
|
||||||
|
<a href="Messages.html">Назад</a>
|
||||||
|
</div>
|
||||||
|
<div class='chat p-3'>
|
||||||
|
|
||||||
|
|
||||||
|
<div class ="d-flex align-items-end flex-column gap-3">
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">12:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex align-items-start flex-column gap-3">
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class='chat-input'>
|
||||||
|
|
||||||
|
<form method='post' id='chat-form'>
|
||||||
|
|
||||||
|
<input type='text' id='message-text' class='chat-form__input' placeholder='Введите сообщение'>
|
||||||
|
<input type='submit' class='chat-form__submit' value='=>' style = "margin-right:auto">
|
||||||
|
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
100
3 lab/dist/admin-page.html
vendored
Normal file
100
3 lab/dist/admin-page.html
vendored
Normal file
@ -0,0 +1,100 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="ru" class="h-100">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Моя страница</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script type="module" crossorigin src="/assets/admin_page-df9b9b2d.js"></script>
|
||||||
|
<link rel="modulepreload" crossorigin href="/assets/style-afc16ede.js">
|
||||||
|
<link rel="modulepreload" crossorigin href="/assets/lines-b7354fa1.js">
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
<body class="d-flex flex-column h-100">
|
||||||
|
<header>
|
||||||
|
<nav class="navbar navbar-expand-md">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="/">
|
||||||
|
<img src="/assets/icon-8b2b7123.jpg" alt="logo" width="40">
|
||||||
|
</a>
|
||||||
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||||
|
data-bs-target="#navbarNav"
|
||||||
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
<div class="navbar-collapse collapse justify-content-start" id="navbarNav">
|
||||||
|
<div class="navbar-nav">
|
||||||
|
<a class="nav-link" href="home.html">Главная</a>
|
||||||
|
<a class="nav-link" href="messages.html">Сообщения</a>
|
||||||
|
<a class="nav-link" href="settings.html">Настройки</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid p-2">
|
||||||
|
<h1 class=" text-center font-weight-bold">Панель администратора</h1>
|
||||||
|
<div class="btn-group" role="group">
|
||||||
|
<button id="items-add" class="btn btn-info">Добавить аккаунт (диалог)</button>
|
||||||
|
<a class="btn btn-dark" href="page-edit.html">Добавить аккаунт(страница)</a>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h2 class=" text-center font-weight-bold" style="padding-top: 10px;">Таблица данных</h2>
|
||||||
|
<table id="items-table" class="table table-striped">
|
||||||
|
<thead>
|
||||||
|
<th scope="col">№</th>
|
||||||
|
<th scope="col" class="w-25">Никнейм</th>
|
||||||
|
<th scope="col" class="w-25">Почта</th>
|
||||||
|
<th scope="col" class="w-10">Пароль</th>
|
||||||
|
</thead>
|
||||||
|
<tbody></tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<div id="items-update" class="modal fade" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<form id="items-form" class="needs-validation" novalidate>
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<h1 class="modal-title fs-5" id="items-update-title"></h1>
|
||||||
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
<div class="modal-body">
|
||||||
|
<div class="text-center">
|
||||||
|
<img id="image-preview" src="https://via.placeholder.com/200" class="rounded rounded-circle"
|
||||||
|
alt="placeholder">
|
||||||
|
</div>
|
||||||
|
<input id="items-line-id" type="number" hidden>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label for="item" class="form-label">Аккаунт</label>
|
||||||
|
<select id="item" class="form-select" name="selected" required>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="nickname">Никнейм</label>
|
||||||
|
<input id="nickname" name="nickname" class="form-control" type="string" required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="email">Почта</label>
|
||||||
|
<input id="email" name="email" class="form-control" type="string" required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="password">Пароль</label>
|
||||||
|
<input id="password" name="password" class="form-control" type="string" required>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="modal-footer">
|
||||||
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
|
||||||
|
<button type="submit" class="btn btn-primary">Сохранить</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
3 lab/dist/assets/account-31347f56.png
vendored
Normal file
BIN
3 lab/dist/assets/account-31347f56.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
2
3 lab/dist/assets/admin_page-df9b9b2d.js
vendored
Normal file
2
3 lab/dist/assets/admin_page-df9b9b2d.js
vendored
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
import"./style-afc16ede.js";import{v as o,l as t}from"./lines-b7354fa1.js";document.addEventListener("DOMContentLoaded",()=>{o(),t()});
|
||||||
|
//# sourceMappingURL=admin_page-df9b9b2d.js.map
|
||||||
1
3 lab/dist/assets/admin_page-df9b9b2d.js.map
vendored
Normal file
1
3 lab/dist/assets/admin_page-df9b9b2d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"admin_page-df9b9b2d.js","sources":["../../admin-page.html?html-proxy&index=1.js"],"sourcesContent":["\n import validation from \"./js/validation\";\n import { linesForm } from \"./js/lines\";\n \n document.addEventListener('DOMContentLoaded', () => {\n validation();\n linesForm();\n });\n"],"names":["validation","linesForm"],"mappings":"2EAII,SAAS,iBAAiB,mBAAoB,IAAM,CAChDA,IACAC,GACR,CAAK"}
|
||||||
BIN
3 lab/dist/assets/autentification-fdf59272.png
vendored
Normal file
BIN
3 lab/dist/assets/autentification-fdf59272.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
BIN
3 lab/dist/assets/bell-411ff921.png
vendored
Normal file
BIN
3 lab/dist/assets/bell-411ff921.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
3 lab/dist/assets/blacklist-dcb2f8e9.jpg
vendored
Normal file
BIN
3 lab/dist/assets/blacklist-dcb2f8e9.jpg
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
3 lab/dist/assets/da-2655b12b.jpg
vendored
Normal file
BIN
3 lab/dist/assets/da-2655b12b.jpg
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 253 KiB |
BIN
3 lab/dist/assets/da2-b5470625.jpg
vendored
Normal file
BIN
3 lab/dist/assets/da2-b5470625.jpg
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 177 KiB |
1
3 lab/dist/assets/dialog-bbcda84d.js.map
vendored
Normal file
1
3 lab/dist/assets/dialog-bbcda84d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"dialog-bbcda84d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
||||||
BIN
3 lab/dist/assets/exit-18ba8829.png
vendored
Normal file
BIN
3 lab/dist/assets/exit-18ba8829.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
BIN
3 lab/dist/assets/eye-826654ed.png
vendored
Normal file
BIN
3 lab/dist/assets/eye-826654ed.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
BIN
3 lab/dist/assets/fa-brands-400-3fe890d0.woff2
vendored
Normal file
BIN
3 lab/dist/assets/fa-brands-400-3fe890d0.woff2
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-brands-400-c7ae37d3.ttf
vendored
Normal file
BIN
3 lab/dist/assets/fa-brands-400-c7ae37d3.ttf
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-regular-400-fdc1f753.ttf
vendored
Normal file
BIN
3 lab/dist/assets/fa-regular-400-fdc1f753.ttf
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-regular-400-fe69d948.woff2
vendored
Normal file
BIN
3 lab/dist/assets/fa-regular-400-fe69d948.woff2
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-solid-900-6d53c706.ttf
vendored
Normal file
BIN
3 lab/dist/assets/fa-solid-900-6d53c706.ttf
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-solid-900-d27bc752.woff2
vendored
Normal file
BIN
3 lab/dist/assets/fa-solid-900-d27bc752.woff2
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-v4compatibility-4d73f280.ttf
vendored
Normal file
BIN
3 lab/dist/assets/fa-v4compatibility-4d73f280.ttf
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/fa-v4compatibility-7d1c2ce5.woff2
vendored
Normal file
BIN
3 lab/dist/assets/fa-v4compatibility-7d1c2ce5.woff2
vendored
Normal file
Binary file not shown.
BIN
3 lab/dist/assets/help-dfa41af5.png
vendored
Normal file
BIN
3 lab/dist/assets/help-dfa41af5.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
1
3 lab/dist/assets/home-bbcda84d.js.map
vendored
Normal file
1
3 lab/dist/assets/home-bbcda84d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"home-bbcda84d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
||||||
BIN
3 lab/dist/assets/icon-8b2b7123.jpg
vendored
Normal file
BIN
3 lab/dist/assets/icon-8b2b7123.jpg
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
3 lab/dist/assets/info-6e7e6660.png
vendored
Normal file
BIN
3 lab/dist/assets/info-6e7e6660.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
6
3 lab/dist/assets/lines-b7354fa1.js
vendored
Normal file
6
3 lab/dist/assets/lines-b7354fa1.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
3 lab/dist/assets/lines-b7354fa1.js.map
vendored
Normal file
1
3 lab/dist/assets/lines-b7354fa1.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
1
3 lab/dist/assets/login-bbcda84d.js.map
vendored
Normal file
1
3 lab/dist/assets/login-bbcda84d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"login-bbcda84d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
||||||
BIN
3 lab/dist/assets/messages-220127ec.png
vendored
Normal file
BIN
3 lab/dist/assets/messages-220127ec.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
1
3 lab/dist/assets/messages-bbcda84d.js.map
vendored
Normal file
1
3 lab/dist/assets/messages-bbcda84d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"messages-bbcda84d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
||||||
2
3 lab/dist/assets/page_edit-a29ec6cf.js
vendored
Normal file
2
3 lab/dist/assets/page_edit-a29ec6cf.js
vendored
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
import"./style-afc16ede.js";import{v as a,a as e}from"./lines-b7354fa1.js";document.addEventListener("DOMContentLoaded",()=>{a(),e()});
|
||||||
|
//# sourceMappingURL=page_edit-a29ec6cf.js.map
|
||||||
1
3 lab/dist/assets/page_edit-a29ec6cf.js.map
vendored
Normal file
1
3 lab/dist/assets/page_edit-a29ec6cf.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"page_edit-a29ec6cf.js","sources":["../../page-edit.html?html-proxy&index=1.js"],"sourcesContent":["\n import validation from \"./js/validation\";\n import { linesPageForm } from \"./js/lines\"\n\n document.addEventListener('DOMContentLoaded', () => {\n validation();\n linesPageForm();\n });\n "],"names":["validation","linesPageForm"],"mappings":"2EAIQ,SAAS,iBAAiB,mBAAoB,IAAM,CAChDA,IACAC,GACZ,CAAS"}
|
||||||
BIN
3 lab/dist/assets/private-a09581ce.png
vendored
Normal file
BIN
3 lab/dist/assets/private-a09581ce.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
1
3 lab/dist/assets/registration-bbcda84d.js.map
vendored
Normal file
1
3 lab/dist/assets/registration-bbcda84d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"registration-bbcda84d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
||||||
BIN
3 lab/dist/assets/settings-4cadbde0.png
vendored
Normal file
BIN
3 lab/dist/assets/settings-4cadbde0.png
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
1
3 lab/dist/assets/settings-bbcda84d.js.map
vendored
Normal file
1
3 lab/dist/assets/settings-bbcda84d.js.map
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"file":"settings-bbcda84d.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
||||||
10
3 lab/dist/assets/style-675f72be.css
vendored
Normal file
10
3 lab/dist/assets/style-675f72be.css
vendored
Normal file
File diff suppressed because one or more lines are too long
6
3 lab/dist/assets/style-afc16ede.js
vendored
Normal file
6
3 lab/dist/assets/style-afc16ede.js
vendored
Normal file
File diff suppressed because one or more lines are too long
1
3 lab/dist/assets/style-afc16ede.js.map
vendored
Normal file
1
3 lab/dist/assets/style-afc16ede.js.map
vendored
Normal file
File diff suppressed because one or more lines are too long
93
3 lab/dist/dialog.html
vendored
Normal file
93
3 lab/dist/dialog.html
vendored
Normal file
@ -0,0 +1,93 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<title>Диалог</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
<script type="module" crossorigin src="/assets/style-afc16ede.js"></script>
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
<body style = "background:#FFFFFF; ">
|
||||||
|
<div class = "container">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between" style ="background:black">
|
||||||
|
<img src="/assets/da-2655b12b.jpg" alt="david" width="60" height="60" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="nickname-avatar">
|
||||||
|
<p>Давид Макаров</p></div>
|
||||||
|
<a href="Messages.html">Назад</a>
|
||||||
|
</div>
|
||||||
|
<div class='chat p-3'>
|
||||||
|
|
||||||
|
|
||||||
|
<div class ="d-flex align-items-end flex-column gap-3">
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">12:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class ="d-flex align-items-start flex-column gap-3">
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">13:05</p>
|
||||||
|
</div>
|
||||||
|
<div class = "d-flex message">
|
||||||
|
<p class ="ps-4 pe-4">пример</p>
|
||||||
|
<p class ="fs-5 mt-auto mb-1 ms-1 me-2">15:33</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class='chat-input'>
|
||||||
|
|
||||||
|
<form method='post' id='chat-form'>
|
||||||
|
|
||||||
|
<input type='text' id='message-text' class='chat-form__input' placeholder='Введите сообщение'>
|
||||||
|
<input type='submit' class='chat-form__submit' value='=>' style = "margin-right:auto">
|
||||||
|
|
||||||
|
</form>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
188
3 lab/dist/home.html
vendored
Normal file
188
3 lab/dist/home.html
vendored
Normal file
@ -0,0 +1,188 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<title>Главная</title>
|
||||||
|
<script type="module" crossorigin src="/assets/style-afc16ede.js"></script>
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<main class="d-flex flex-nowrap">
|
||||||
|
<div class ="cl1 text-bg-dark">
|
||||||
|
<div class="filters ">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 text-bg-dark;" style ="width: 280px;">
|
||||||
|
|
||||||
|
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
|
||||||
|
<svg class="bi pe-none me-2" width="40" height="32"><img src="/assets/icon-8b2b7123.jpg" alt="icon" width ="24" height ="24"></svg>
|
||||||
|
<span class="fs-4">Сообщения</span>
|
||||||
|
</a>
|
||||||
|
<hr>
|
||||||
|
<ul class="nav nav-pills flex-column mb-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="Messages.html" class="nav-link active" aria-current="page">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="/assets/messages-220127ec.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
Сообщения
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="/assets/settings-4cadbde0.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
Настройки
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="/assets/exit-18ba8829.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
Выход
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class ="cl2 bg-body-tertiary" style ="position:sticky; height:100vh;">
|
||||||
|
<div class="filters">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary" style="width: 3rem;">
|
||||||
|
<a href="/" class="d-block p-3 link-body-emphasis text-decoration-none" title="Icon-only" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<img class="icon" src="/assets/icon-8b2b7123.jpg" alt="icon" width ="32" height ="32">
|
||||||
|
<span class="visually-hidden">Icon</span>
|
||||||
|
</a>
|
||||||
|
<ul class="nav nav-pills nav-flush flex-column mb-auto text-center">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="Messages.html" class="nav-link active py-3 border-bottom rounded-0" aria-current="page" title="Messages" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Home"><img src="/assets/messages-220127ec.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link py-3 border-bottom rounded-0" title="Settings" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Settings"><img src="/assets/settings-4cadbde0.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link py-3 border-bottom rounded-0" title="Orders" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Orders"><img src="/assets/exit-18ba8829.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="filters">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="list-group">
|
||||||
|
<a class="list-group-item list-group-item-action d-flex gap-1 py-2" aria-current="true">
|
||||||
|
<img src="/assets/da-2655b12b.jpg" alt="twbs" width="40" height="40" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Давид Макаров</h6>
|
||||||
|
<p class="mb-0 opacity-75">Оцените моего</p>
|
||||||
|
<div class = "postImage">
|
||||||
|
<img src="/assets/da2-b5470625.jpg" class="img-fluid" alt="Данил" height="200" width="500"></div>
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<input type="image" src="images/like.png" width="20" height="20" alt="Кнопка «input»">
|
||||||
|
<h6 class="mb-0">5</h6>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<img src="/assets/eye-826654ed.png" alt="Просмотры" width="20" height="20" >
|
||||||
|
<h6 class="mb-0">2100</h6>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex gap-2 w-50 justify-content-between">
|
||||||
|
<button class="btn btn-dark rounded-pill px-3" type="button">Прокомментировать</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-1">сейчас</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">List group item heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">now</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
58
3 lab/dist/index.html
vendored
Normal file
58
3 lab/dist/index.html
vendored
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="ru">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<title>Регистрация</title>
|
||||||
|
<script type="module" crossorigin src="/assets/style-afc16ede.js"></script>
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container">
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<h3>Регистрация</h3>
|
||||||
|
<label for ="name" class = "control-label center">Введите никнейм</label>
|
||||||
|
<input type = "name" class = "form-control" id = "name" placeholder ="Введите никнейм">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<label for ="email" class = "control-label">Введите почту</label>
|
||||||
|
<input type = "email" class = "form-control" id = "email" placeholder ="Введите почту">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<label for ="pasword" control = "control-label">Введите пароль</label>
|
||||||
|
|
||||||
|
|
||||||
|
<input type = "pasword" class = "form-control" id = "pasword" placeholder ="Введите пароль">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<label for ="paswordConfirm" control = "control-label">Подтвердите пароль</label>
|
||||||
|
<input type = "paswordConfirm" class = "form-control" id = "paswordConfirm" placeholder ="Подтвердите пароль">
|
||||||
|
<a href ="login.html">У вас уже есть профиль?</a>
|
||||||
|
<p></p>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<form action="home.html">
|
||||||
|
<input type = "submit" class = "btn btn-primary" value = "Зарегистрироваться">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
43
3 lab/dist/login.html
vendored
Normal file
43
3 lab/dist/login.html
vendored
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<title>Логин</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
<script type="module" crossorigin src="/assets/style-afc16ede.js"></script>
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container" >
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<h3>Логин</h3>
|
||||||
|
<label for ="name" class = "control-label center">Введите никнейм или почту</label>
|
||||||
|
<input type = "name" class = "form-control" id = "name" placeholder ="Введите никнейм или почту">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<label for ="password" class = "control-label">Введите пароль</label>
|
||||||
|
<input type = "password" class = "form-control" id = "password" placeholder ="Введите пароль">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<a href ="index.html">Нет профиля? Зарегистрироваться</a>
|
||||||
|
<p></p>
|
||||||
|
<div>
|
||||||
|
<form action="home.html">
|
||||||
|
<input type = "submit" class = "btn btn-primary" value = "Войти">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
109
3 lab/dist/messages.html
vendored
Normal file
109
3 lab/dist/messages.html
vendored
Normal file
File diff suppressed because one or more lines are too long
74
3 lab/dist/page-edit.html
vendored
Normal file
74
3 lab/dist/page-edit.html
vendored
Normal file
@ -0,0 +1,74 @@
|
|||||||
|
<html lang="ru">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Моя страница</title>
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script type="module" crossorigin src="/assets/page_edit-a29ec6cf.js"></script>
|
||||||
|
<link rel="modulepreload" crossorigin href="/assets/style-afc16ede.js">
|
||||||
|
<link rel="modulepreload" crossorigin href="/assets/lines-b7354fa1.js">
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="h-100 d-flex flex-column">
|
||||||
|
<header>
|
||||||
|
<nav class="navbar navbar-expand-md">
|
||||||
|
<div class="container-fluid">
|
||||||
|
<a class="navbar-brand" href="/">
|
||||||
|
<img src="/assets/icon-8b2b7123.jpg" alt="logo" width="40">
|
||||||
|
</a>
|
||||||
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||||
|
data-bs-target="#navbarNav"
|
||||||
|
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
|
||||||
|
<span class="navbar-toggler-icon"></span>
|
||||||
|
</button>
|
||||||
|
<div class="navbar-collapse collapse justify-content-start" id="navbarNav">
|
||||||
|
<div class="navbar-nav">
|
||||||
|
<a class="nav-link" href="home.html">Главная</a>
|
||||||
|
<a class="nav-link" href="messages.html">Сообщения</a>
|
||||||
|
<a class="nav-link" href="settings.html">Настройки</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<main class="container-fluid p-2">
|
||||||
|
<h1 class=" text-center font-weight-bold">Добавление аккаунта</h1>
|
||||||
|
<div class="text-center">
|
||||||
|
<img id="image-preview" src="https://via.placeholder.com/200" class="rounded rounded-circle"
|
||||||
|
alt="placeholder">
|
||||||
|
</div>
|
||||||
|
<form id="items-form" class="needs-validation" novalidate>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label for="nickname" class="form-label">Никнейм</label>
|
||||||
|
<input id="nickname" name="nickname" class="form-control" type="string"
|
||||||
|
required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="email">Почта</label>
|
||||||
|
<input id="email" name="email" class="form-control" type="string"
|
||||||
|
required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="password">Пароль</label>
|
||||||
|
<input id="password" name="password" class="form-control" type="string"
|
||||||
|
step="1" required>
|
||||||
|
</div>
|
||||||
|
<div class="mb-2">
|
||||||
|
<label class="form-label" for="image">Изображение</label>
|
||||||
|
<input id="image" type="file" name="image" class="form-control" accept="image/*">
|
||||||
|
</div>
|
||||||
|
<a href="admin-page.html" class="btn btn-secondary">Назад</a>
|
||||||
|
<button type="submit" class="btn btn-primary">Сохранить</button>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
|
||||||
|
</html>
|
||||||
80
3 lab/dist/settings.html
vendored
Normal file
80
3 lab/dist/settings.html
vendored
Normal file
@ -0,0 +1,80 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<title>Настройки</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
<script type="module" crossorigin src="/assets/style-afc16ede.js"></script>
|
||||||
|
<link rel="stylesheet" href="/assets/style-675f72be.css">
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container text-center">
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class ="col-md-5 offset-md-4">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<img src="/assets/account-31347f56.png" alt="accound" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<a>Никнейм пользователя</a>
|
||||||
|
</div>
|
||||||
|
<div class ="return">
|
||||||
|
<a href="home.html">Вернуться</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="list-group">
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/account-31347f56.png" alt="account" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Аккаунт</h6>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/private-a09581ce.png" alt="private" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Приватность</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/autentification-fdf59272.png" alt="autentication" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Двухфакторная Аутентификация</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/blacklist-dcb2f8e9.jpg" alt="blacklist" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Черный список</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAIACAMAAADDpiTIAAAAA3NCSVQICAjb4U/gAAAACXBIWXMAAA9uAAAPbgHe8QlzAAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAYlQTFRF////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAeR+wnAAAAIJ0Uk5TAAECAwQFBggJCgsMDhIUFRYYGh0eICElJicrLC0uLzEyND4/QEFDREVHSE1OUFJVWVphYmlxcnN5ent9foGEiYyNj5CRk5SVnaChoqOkpaanq6yur7K3uLm6vL/AwsTHyMnKy8zNzs/Q0tna3N3e3+Dh4+Ts7e7v8PLz9PX3+fz9/mYINYgAAAkrSURBVHja7d1tWxTXAcfhWUOgYpFKKbRFhJT4QARchVK0khJNtYXCVg1WpTTQqhBaqUolzQpkdz55X1SToKA8zLw4c+7fN/B/7utymZndSZIoa+jsK49OVOZWqtWVucrEaLmvsyHOJWKseWhqPX2r9amhZtsUv9bh2c10lzZnh1stVOQaR+Zr6TurzY802qmglcpP0j20erFkqyJ25mG6xx6fs1bhOnU33Uf3eyxWqFona+m+qs+csFpx6n6a7rvnvXYrSkMv0wO0ccFyhah0tZ4eqPq4PwcK0NFb6YG77dpg8LUvpYdoqd2CYde2lh6qtTYbhlzTYnrIFpusGHAz6aGbsWK4jaUZNGbHUBuoZQGgNmDJMOuqpplU7bJliLWsphm12mLNALuWZtZ1a4bXz7ayA7DVYc/gmk4zrGLP0OqpZwmg3mvRwLqXZtoDi4bV2TTj+m0aUqVHWQNYPmLVgDqfZt6gVQNqMnsA01YNp4YX2QNY9+3RcDqd5tAZuwbT53kA+L1dg+lZHgCe2TWUetJc6rVsII3nA2DcsoG0nA+AZcuGUWkrHwBbvigURsfTnDpu2yA6mReAbtsGUX9eANwRDKNLeQG4ZNsgupwXgCu2DaIbeQG4adsgupMXgDu2DaIv8wKwYNsgWs4LgEuBAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAgAASAABIAAEAACAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABIAAEgAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMC2jnX2lUcnKnMLQbSRF4CNMP79f/3zZ7+5+PHPj2V0+L+8vPBNqgCr/v233Yc8/A9+9dm/DBlyq9dPNxz09Evn//gfC4bf+p8Gjxzk/M8+sl1RWjq37+PvuWe2InXv1L6Ov2O6brNiVZv86Z6Pv+XalsGK1+bvfry38+9aNVYx++cv9nL+A1VLFbX/9r///Mdqdipu3/76PcffNGOkYveHxnedf9uihYre336y+/m3r9mn+D1t2+38jy5ZJ4b+8aNdrv3fsk0cVXYGcNUysXR5p/MfcvU3muqDb59/90u7xFP15Jvn3/rUKjH179Y3AEzaJK4mt5//KReAI6u2/QGBv1gktu7+8PzP2CO+zvzgEtBDc8TXw9J3AMrWiLHy6/NvfGKMGHvy+s7wiC3ibOQVgHlTxNn8q4uArgFEWu3/lwOHLRFrw0mSJMmsIWJtNkmSpHnTELG22ZwkyZAd4m0oSZIpM8TbVJI0rJsh3tYbkk4rxFxn0meEmOtzIyjuysmoEWJuNJkwQsxNJBUjxFwlmTNCzM0lK0aIuZXED8JEXRWA2AH4LyDqVnwIjLs5fwbGXcWFoLibcCk47kbdDIq7stvBcdfngZC46/RIWNStN3goNOqmPBYed0O+GBJ1m82+GhZ1s74cGnfDvh4eda++Hu4HImJt3k/ExN3rn4hp9J64KFv97vVBF40RYxe//6HIx9aIr8ff/1Bkcs4c8bXtjeL37RFb97e/Ld77YiKr3rP9hQHeGBpZM2+8MeTEc5vE1PMTb740qHfDKvG00fv2a8Mu+BgQTfULO704cNwwsTS+86tjb1smjm6Xdn53bLOXR0fRUrPXx8fcWnuya22L9il6i23JO2pyQajgzTQl727MA2IFrjaWvLcBPxpT2KoDyR7q8oBQQVvtSvZUy/UtYxWvrWstyV7rqLguXLDq0x3Jfup9YLMida8n2W/9y2YrSo/OJgfoyOD017YLvxeT50vJAfvw7A0PigTds89PNySH66NPv/JHQZBtLY/3JJlUOt79yfCVm18sLAdRbj94sBHGv//LOzcuX+o/ebyURFpun14XYl0UAAAAAAAAAAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAgAASAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAkAACAABIAAEgAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAQAAJAAAgAASAABIAAEAACQAAIAAEgAASAABAAAkAACAABIAAEgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAChCC3kBmLNtEH2RF4CKbYPoZl4AJmwbRFfyAjBq2yAazgtA2bZB9EleAPpsG0TdeQHotG0QHc8LwDHbBlFpK5/z/8a0gfSVC4Fx92k+AK5YNpA+ygdAl2VD6Xke5//ErsF0Iw8A1+waTGfzAPCxXYPpw6+zP/8XH9g1nKazBzBl1YAazB7AoFUD6kjmj4UtH7FqSPVnDaDfpmH1INvzf2DRwOqtZ3n+9V6LhlYlSwAeBw2vjgxvCm912DO8rmcH4Lo1A6xlNavzX22xZoh1VbM5/6r7wIE2UMvi/GsDlgy1sSwAjNkx3GYOf/4zVgy4psXDnv9ikxVDrm3tcOe/1mbDsGtfOsz5L7VbMPSabx/8/G8dtV/4lcYPeF+ofrVkvUJ0YeMg5/9yyHJFqfcAXxR42m234nRiZp//DdQmW61WqHru7+f8756yWOE693ivx//wjLWKWOninm4QPyn78F/UGkfm33ODsDY/0minItc6PLu52+lvzg776BdBzUNT62+f/vrUULNtYqmhs688OlGZW6lWV+YqE6Plvs6GOJf4H++SDhzDLyXiAAAAAElFTkSuQmCC" alt="add" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Добавить аккаунт</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/help-dfa41af5.png" alt="help" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Помощь</h6>
|
||||||
|
</a>
|
||||||
|
<a href="admin-page.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/help-dfa41af5.png" alt="help" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Панель администратора</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/bell-411ff921.png" alt="bell" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Уведомления</h6>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/info-6e7e6660.png" alt="info" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Информация</h6>
|
||||||
|
</a>
|
||||||
|
<a href="index.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="/assets/exit-18ba8829.png" alt="exit" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<h6 class="mb-0">Выход из аккаунта</h6>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
186
3 lab/home.html
Normal file
186
3 lab/home.html
Normal file
@ -0,0 +1,186 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Главная</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<main class="d-flex flex-nowrap">
|
||||||
|
<div class ="cl1 text-bg-dark">
|
||||||
|
<div class="filters ">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 text-bg-dark;" style ="width: 280px;">
|
||||||
|
|
||||||
|
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
|
||||||
|
<svg class="bi pe-none me-2" width="40" height="32"><img src="images/icon.jpg" alt="icon" width ="24" height ="24"></svg>
|
||||||
|
<span class="fs-4">Сообщения</span>
|
||||||
|
</a>
|
||||||
|
<hr>
|
||||||
|
<ul class="nav nav-pills flex-column mb-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="Messages.html" class="nav-link active" aria-current="page">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/messages.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
Сообщения
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
Настройки
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
Выход
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class ="cl2 bg-body-tertiary" style ="position:sticky; height:100vh;">
|
||||||
|
<div class="filters">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary" style="width: 3rem;">
|
||||||
|
<a href="/" class="d-block p-3 link-body-emphasis text-decoration-none" title="Icon-only" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<img class="icon" src="images/icon.jpg" alt="icon" width ="32" height ="32">
|
||||||
|
<span class="visually-hidden">Icon</span>
|
||||||
|
</a>
|
||||||
|
<ul class="nav nav-pills nav-flush flex-column mb-auto text-center">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="Messages.html" class="nav-link active py-3 border-bottom rounded-0" aria-current="page" title="Messages" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Home"><img src="images/messages.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link py-3 border-bottom rounded-0" title="Settings" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Settings"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link py-3 border-bottom rounded-0" title="Orders" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Orders"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="filters">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="list-group">
|
||||||
|
<a class="list-group-item list-group-item-action d-flex gap-1 py-2" aria-current="true">
|
||||||
|
<img src="images/da.jpg" alt="twbs" width="40" height="40" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Давид Макаров</h6>
|
||||||
|
<p class="mb-0 opacity-75">Оцените моего</p>
|
||||||
|
<div class = "postImage">
|
||||||
|
<img src="images/da2.jpg" class="img-fluid" alt="Данил" height="200" width="500"></div>
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<input type="image" src="images/like.png" width="20" height="20" alt="Кнопка «input»">
|
||||||
|
<h6 class="mb-0">5</h6>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<img src="images/eye.png" alt="Просмотры" width="20" height="20" >
|
||||||
|
<h6 class="mb-0">2100</h6>
|
||||||
|
</div>
|
||||||
|
<div class="d-flex gap-2 w-50 justify-content-between">
|
||||||
|
<button class="btn btn-dark rounded-pill px-3" type="button">Прокомментировать</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-1">сейчас</small>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">List group item heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">now</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="https://github.com/twbs.png" alt="twbs" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Third heading</h6>
|
||||||
|
<p class="mb-0 opacity-75">Some placeholder content in a paragraph.</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">1w</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
BIN
3 lab/images/account.png
Normal file
BIN
3 lab/images/account.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
3 lab/images/arrow.png
Normal file
BIN
3 lab/images/arrow.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.2 KiB |
BIN
3 lab/images/autentification.png
Normal file
BIN
3 lab/images/autentification.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
BIN
3 lab/images/bell.png
Normal file
BIN
3 lab/images/bell.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
3 lab/images/blacklist.jpg
Normal file
BIN
3 lab/images/blacklist.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
3 lab/images/da.jpg
Normal file
BIN
3 lab/images/da.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 253 KiB |
BIN
3 lab/images/da2.jpg
Normal file
BIN
3 lab/images/da2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 177 KiB |
BIN
3 lab/images/exit.png
Normal file
BIN
3 lab/images/exit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.0 KiB |
BIN
3 lab/images/eye.png
Normal file
BIN
3 lab/images/eye.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
BIN
3 lab/images/favicon.ico
Normal file
BIN
3 lab/images/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 34 KiB |
BIN
3 lab/images/help.png
Normal file
BIN
3 lab/images/help.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.4 KiB |
BIN
3 lab/images/home.png
Normal file
BIN
3 lab/images/home.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
BIN
3 lab/images/icon.jpg
Normal file
BIN
3 lab/images/icon.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
BIN
3 lab/images/info.png
Normal file
BIN
3 lab/images/info.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.4 KiB |
BIN
3 lab/images/ko.jpg
Normal file
BIN
3 lab/images/ko.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 112 KiB |
BIN
3 lab/images/like.png
Normal file
BIN
3 lab/images/like.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.1 KiB |
BIN
3 lab/images/messages.png
Normal file
BIN
3 lab/images/messages.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
3 lab/images/nMNCr34SFoE.jpg
Normal file
BIN
3 lab/images/nMNCr34SFoE.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 164 KiB |
BIN
3 lab/images/pa.jpg
Normal file
BIN
3 lab/images/pa.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 183 KiB |
BIN
3 lab/images/plus.png
Normal file
BIN
3 lab/images/plus.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.0 KiB |
BIN
3 lab/images/private.png
Normal file
BIN
3 lab/images/private.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
3 lab/images/settings.png
Normal file
BIN
3 lab/images/settings.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
3 lab/images/да3.jpg
Normal file
BIN
3 lab/images/да3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
BIN
3 lab/images/ил.jpg
Normal file
BIN
3 lab/images/ил.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 88 KiB |
56
3 lab/index.html
Normal file
56
3 lab/index.html
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="ru">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Регистрация</title>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container">
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<h3>Регистрация</h3>
|
||||||
|
<label for ="name" class = "control-label center">Введите никнейм</label>
|
||||||
|
<input type = "name" class = "form-control" id = "name" placeholder ="Введите никнейм">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<label for ="email" class = "control-label">Введите почту</label>
|
||||||
|
<input type = "email" class = "form-control" id = "email" placeholder ="Введите почту">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
|
||||||
|
<label for ="pasword" control = "control-label">Введите пароль</label>
|
||||||
|
|
||||||
|
|
||||||
|
<input type = "pasword" class = "form-control" id = "pasword" placeholder ="Введите пароль">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<label for ="paswordConfirm" control = "control-label">Подтвердите пароль</label>
|
||||||
|
<input type = "paswordConfirm" class = "form-control" id = "paswordConfirm" placeholder ="Подтвердите пароль">
|
||||||
|
<a href ="login.html">У вас уже есть профиль?</a>
|
||||||
|
<p></p>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<form action="home.html">
|
||||||
|
<input type = "submit" class = "btn btn-primary" value = "Зарегистрироваться">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
76
3 lab/js/lines-rest-api.js
Normal file
76
3 lab/js/lines-rest-api.js
Normal file
@ -0,0 +1,76 @@
|
|||||||
|
const serverUrl = "http://localhost:8081";
|
||||||
|
|
||||||
|
function createLineObject(itemName, itemEmail, itemPassword, image) {
|
||||||
|
return {
|
||||||
|
nickname: itemName,
|
||||||
|
email: itemEmail,
|
||||||
|
password: itemPassword,
|
||||||
|
image,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getAllLines() {
|
||||||
|
const response = await fetch(`${serverUrl}/lines`);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw response.statusText;
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getLine(id) {
|
||||||
|
const response = await fetch(`${serverUrl}/lines/${id}`);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw response.statusText;
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function createLine(itemName, itemEmail, itemPassword, image) {
|
||||||
|
const itemObject = createLineObject(itemName, itemEmail, itemPassword, image);
|
||||||
|
|
||||||
|
const options = {
|
||||||
|
method: "POST",
|
||||||
|
body: JSON.stringify(itemObject),
|
||||||
|
headers: {
|
||||||
|
"Accept": "application/json",
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch(`${serverUrl}/lines`, options);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw response.statusText;
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function updateLine(id, itemName, itemEmail, itemPassword, image) {
|
||||||
|
const itemObject = createLineObject(itemName, itemEmail, itemPassword, image);
|
||||||
|
|
||||||
|
const options = {
|
||||||
|
method: "PUT",
|
||||||
|
body: JSON.stringify(itemObject),
|
||||||
|
headers: {
|
||||||
|
"Accept": "application/json",
|
||||||
|
"Content-Type": "application/json",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch(`${serverUrl}/lines/${id}`, options);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw response.statusText;
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function deleteLine(id) {
|
||||||
|
const options = {
|
||||||
|
method: "DELETE",
|
||||||
|
};
|
||||||
|
|
||||||
|
const response = await fetch(`${serverUrl}/lines/${id}`, options);
|
||||||
|
if (!response.ok) {
|
||||||
|
throw response.statusText;
|
||||||
|
}
|
||||||
|
return response.json();
|
||||||
|
}
|
||||||
49
3 lab/js/lines-ui.js
Normal file
49
3 lab/js/lines-ui.js
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
// таблица
|
||||||
|
export const cntrls = {
|
||||||
|
table: document.querySelector("#items-table tbody"),
|
||||||
|
form: document.getElementById("items-form"),
|
||||||
|
lineId: document.getElementById("items-line-id"),
|
||||||
|
nickname: document.getElementById("nickname"),
|
||||||
|
email: document.getElementById("email"),
|
||||||
|
password: document.getElementById("password"),
|
||||||
|
image: document.getElementById("image"),
|
||||||
|
imagePreview: document.getElementById("image-preview"),
|
||||||
|
};
|
||||||
|
|
||||||
|
export const imagePlaceholder = "https://via.placeholder.com/200";
|
||||||
|
|
||||||
|
function createTableAnchor(icon, callback) {
|
||||||
|
const i = document.createElement("i");
|
||||||
|
i.classList.add("fa-solid", icon);
|
||||||
|
const a = document.createElement("a");
|
||||||
|
a.href = "#";
|
||||||
|
a.appendChild(i);
|
||||||
|
a.onclick = (event) => {
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
callback();
|
||||||
|
};
|
||||||
|
const td = document.createElement("td");
|
||||||
|
td.appendChild(a);
|
||||||
|
return td;
|
||||||
|
}
|
||||||
|
function createTableColumn(value) {
|
||||||
|
const td = document.createElement("td");
|
||||||
|
td.textContent = value;
|
||||||
|
return td;
|
||||||
|
}
|
||||||
|
|
||||||
|
export function createTableRow(item, index, editPageCallback, deleteCallback) {
|
||||||
|
const rowNumber = document.createElement("th");
|
||||||
|
rowNumber.scope = "row";
|
||||||
|
rowNumber.textContent = index + 1;
|
||||||
|
const row = document.createElement("tr");
|
||||||
|
row.id = `line-${item.id}`;
|
||||||
|
row.appendChild(rowNumber);
|
||||||
|
row.appendChild(createTableColumn(item.nickname));
|
||||||
|
row.appendChild(createTableColumn(item.email));
|
||||||
|
row.appendChild(createTableColumn(item.password));
|
||||||
|
row.appendChild(createTableAnchor("fa-pen-to-square", editPageCallback));
|
||||||
|
row.appendChild(createTableAnchor("fa-trash", deleteCallback));
|
||||||
|
return row;
|
||||||
|
}
|
||||||
209
3 lab/js/lines.js
Normal file
209
3 lab/js/lines.js
Normal file
@ -0,0 +1,209 @@
|
|||||||
|
// модуль с логикой
|
||||||
|
import {
|
||||||
|
createLine, getLine, deleteLine, getAllLines, updateLine,
|
||||||
|
} from "./lines-rest-api";
|
||||||
|
import {
|
||||||
|
cntrls, createTableRow, imagePlaceholder,
|
||||||
|
} from "./lines-ui";
|
||||||
|
|
||||||
|
export async function drawLinesTable() {
|
||||||
|
console.info("Try to load data");
|
||||||
|
if (!cntrls.table) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// вызов метода REST API для получения всех записей
|
||||||
|
const data = await getAllLines();
|
||||||
|
// очистка содержимого table
|
||||||
|
// удаляется все, что находится между тегами <table></table>
|
||||||
|
// но не атрибуты
|
||||||
|
cntrls.table.innerHTML = "";
|
||||||
|
// цикл по результату ответа от сервера
|
||||||
|
// используется лямбда-выражение
|
||||||
|
// (item, index) => {} аналогично function(item, index) {}
|
||||||
|
data.forEach((item, index) => {
|
||||||
|
cntrls.table.appendChild(
|
||||||
|
createTableRow(
|
||||||
|
item,
|
||||||
|
index,
|
||||||
|
// функции передаются в качестве параметра
|
||||||
|
// это очень удобно, так как аргументы функций доступны только
|
||||||
|
// в данном месте кода и не передаются в сервисные модули
|
||||||
|
() => location.assign(`page-edit.html?id=${item.id}`),
|
||||||
|
() => removeLine(item.id),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async function addLine(itemName, itemEmail, itemPassword, image) {
|
||||||
|
console.info("Try to add item");
|
||||||
|
// вызов метода REST API для добавления записи
|
||||||
|
const data = await createLine(itemName, itemEmail, itemPassword, image);
|
||||||
|
console.info("Added");
|
||||||
|
console.info(data);
|
||||||
|
// загрузка и заполнение table
|
||||||
|
drawLinesTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function editLine(id, itemName, itemEmail, itemPassword, image) {
|
||||||
|
console.info("Try to update item");
|
||||||
|
// вызов метода REST API для обновления записи
|
||||||
|
const data = await updateLine(id, itemName, itemEmail, itemPassword, image);
|
||||||
|
console.info("Updated");
|
||||||
|
console.info(data);
|
||||||
|
// загрузка и заполнение table
|
||||||
|
drawLinesTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function removeLine(id) {
|
||||||
|
if (!confirm("Do you really want to remove this item?")) {
|
||||||
|
console.info("Canceled");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
console.info("Try to remove item");
|
||||||
|
// вызов метода REST API для удаления записи
|
||||||
|
const data = await deleteLine(id);
|
||||||
|
console.info(data);
|
||||||
|
// загрузка и заполнение table
|
||||||
|
drawLinesTable();
|
||||||
|
}
|
||||||
|
|
||||||
|
// функция для получения содержимого файла в виде base64 строки
|
||||||
|
// https://ru.wikipedia.org/wiki/Base64
|
||||||
|
async function readFile(file) {
|
||||||
|
const reader = new FileReader();
|
||||||
|
|
||||||
|
// создание Promise-объекта для использования функции
|
||||||
|
// с помощью await (асинхронно) без коллбэков (callback)
|
||||||
|
// https://learn.javascript.ru/promise
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
// 2. "Возвращаем" содержимое когда файл прочитан
|
||||||
|
// через вызов resolve
|
||||||
|
// Если не использовать Promise, то всю работу по взаимодействию
|
||||||
|
// с REST API пришлось бы делать в обработчике (callback) функции
|
||||||
|
// onloadend
|
||||||
|
reader.onloadend = () => {
|
||||||
|
const fileContent = reader.result;
|
||||||
|
// Здесь могла бы быть работа с REST API
|
||||||
|
// Чтение заканчивает выполняться здесь
|
||||||
|
resolve(fileContent);
|
||||||
|
};
|
||||||
|
// 3. Возвращаем ошибку
|
||||||
|
reader.onerror = () => {
|
||||||
|
// Или здесь в случае ошибки
|
||||||
|
reject(new Error("oops, something went wrong with the file reader."));
|
||||||
|
};
|
||||||
|
// Шаг 1. Сначала читаем файл
|
||||||
|
// Чтение начинает выполняться здесь
|
||||||
|
reader.readAsDataURL(file);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// функция для обновления блока с превью выбранного изображения
|
||||||
|
async function updateImagePreview() {
|
||||||
|
// получение выбранного файла
|
||||||
|
// возможен выбор нескольких файлов, поэтому необходимо получить только первый
|
||||||
|
const file = cntrls.image.files[0];
|
||||||
|
// чтение содержимого файла в виде base64 строки
|
||||||
|
const fileContent = await readFile(file);
|
||||||
|
console.info("base64 ", fileContent);
|
||||||
|
// обновление атрибута src для тега img с id image-preview
|
||||||
|
cntrls.imagePreview.src = fileContent;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Функция для обработки создания и редактирования элементов таблицы через страницу page-edit.html
|
||||||
|
// Если хотите делать через модальное окно, то удалите эту функцию
|
||||||
|
// eslint-disable-next-line import/prefer-default-export
|
||||||
|
export async function linesPageForm() {
|
||||||
|
console.info("linesPageForm");
|
||||||
|
|
||||||
|
// загрузка и заполнение select со списком товаров
|
||||||
|
drawLinesTable();
|
||||||
|
// func1 = (id) => {} аналогично function func1(id) {}
|
||||||
|
const goBack = () => location.assign("/admin-page.html");
|
||||||
|
|
||||||
|
// Вызов функции обновления превью изображения при возникновении
|
||||||
|
// события onchange в тэге input с id image
|
||||||
|
cntrls.image.addEventListener("change", () => updateImagePreview());
|
||||||
|
|
||||||
|
// получение параметров GET-запроса из URL
|
||||||
|
// параметры перечислены после символа ? (?id=1&color=black&...)
|
||||||
|
const urlParams = new URLSearchParams(location.search);
|
||||||
|
|
||||||
|
// получение значения конкретного параметра (id)
|
||||||
|
// указан только при редактировании
|
||||||
|
const currentId = urlParams.get("id");
|
||||||
|
// если id задан
|
||||||
|
if (currentId) {
|
||||||
|
try {
|
||||||
|
// вызов метода REST API для получения записи по первичному ключу(id)
|
||||||
|
const line = await getLine(currentId);
|
||||||
|
// заполнение формы для редактирования
|
||||||
|
cntrls.nickname.value = line.nickname;
|
||||||
|
cntrls.email.value = line.email;
|
||||||
|
cntrls.password.value = line.password;
|
||||||
|
// заполнение превью
|
||||||
|
// Если пользователь выбрал изображение, то оно загружается
|
||||||
|
// в тэг image с id image - preview
|
||||||
|
// иначе устанавливается заглушка, адрес которой указан в imagePlaceholder
|
||||||
|
cntrls.imagePreview.src = line.image ? line.image : imagePlaceholder;
|
||||||
|
} catch {
|
||||||
|
// в случае ошибки происходит возврат к page4
|
||||||
|
goBack();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// обработчик события отправки формы
|
||||||
|
// возникает при нажатии на кнопку (button) с типом submit
|
||||||
|
// кнопка должна находится внутри тега form
|
||||||
|
cntrls.form.addEventListener("submit", async (event) => {
|
||||||
|
console.info("Form onSubmit");
|
||||||
|
// отключение стандартного поведения формы при отправке
|
||||||
|
// при отправке страница обновляется и JS перестает работать
|
||||||
|
event.preventDefault();
|
||||||
|
event.stopPropagation();
|
||||||
|
// если форма не прошла валидацию, то ничего делать не нужно
|
||||||
|
if (!cntrls.form.checkValidity()) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let imageBase64 = "";
|
||||||
|
// Получение выбранного пользователем изображения в виде base64 строки
|
||||||
|
// Если пользователь ничего не выбрал, то не нужно сохранять в БД
|
||||||
|
// дефолтное изображение
|
||||||
|
if (cntrls.imagePreview.src !== imagePlaceholder) {
|
||||||
|
// Загрузка содержимого атрибута src тэга img с id image-preview
|
||||||
|
// Здесь выполняется HTTP запрос с типом GET
|
||||||
|
const result = await fetch(cntrls.imagePreview.src);
|
||||||
|
// Получение из HTTP-ответа бинарного содержимого
|
||||||
|
const blob = await result.blob();
|
||||||
|
// Получение base64 строки для файла
|
||||||
|
// Здесь выполняется Promise из функции readFile
|
||||||
|
// Promise позволяет писать линейный код для работы с асинхронными методами
|
||||||
|
// без использования обработчиков (callback) с помощью await
|
||||||
|
imageBase64 = await readFile(blob);
|
||||||
|
}
|
||||||
|
|
||||||
|
// если значение параметра запроса не задано,
|
||||||
|
// то необходимо выполнить добавление записи
|
||||||
|
// иначе обновление записи
|
||||||
|
if (!currentId) {
|
||||||
|
await addLine(
|
||||||
|
cntrls.nickname.value,
|
||||||
|
cntrls.email.value,
|
||||||
|
cntrls.password.value,
|
||||||
|
imageBase64,
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
await editLine(
|
||||||
|
currentId,
|
||||||
|
cntrls.nickname.value,
|
||||||
|
cntrls.email.value,
|
||||||
|
cntrls.password.value,
|
||||||
|
imageBase64,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
// возврат к странице page4
|
||||||
|
goBack();
|
||||||
|
});
|
||||||
|
}
|
||||||
25
3 lab/js/validation.js
Normal file
25
3 lab/js/validation.js
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
// модуль используется для валидации форма на странице
|
||||||
|
|
||||||
|
function validation() {
|
||||||
|
// поиск всех форма с классом .needs-validation
|
||||||
|
const forms = document.querySelectorAll("form.needs-validation");
|
||||||
|
|
||||||
|
for (let i = 0; i < forms.length; i += 1) {
|
||||||
|
const form = forms[i];
|
||||||
|
// для каждой формы добавляется обработчик события отправки
|
||||||
|
form.addEventListener("submit", (event) => {
|
||||||
|
// если форма не прошла валидацию
|
||||||
|
// то выключить стандартное действие
|
||||||
|
if (!form.checkValidity()) {
|
||||||
|
event.preventDefault();
|
||||||
|
// предотвращает распространение preventDefault
|
||||||
|
// на другие объекты
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
|
// добавляет к форме класс was-validated
|
||||||
|
form.classList.add("was-validated");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default validation;
|
||||||
14
3 lab/jsconfig.json
Normal file
14
3 lab/jsconfig.json
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "Node",
|
||||||
|
"target": "ES2020",
|
||||||
|
"jsx": "preserve",
|
||||||
|
"strictNullChecks": true,
|
||||||
|
"strictFunctionTypes": true
|
||||||
|
},
|
||||||
|
"exclude": [
|
||||||
|
"node_modules",
|
||||||
|
"**/node_modules/*"
|
||||||
|
]
|
||||||
|
}
|
||||||
41
3 lab/login.html
Normal file
41
3 lab/login.html
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Логин</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body style = "background:#CDECDE">
|
||||||
|
<main>
|
||||||
|
<div class ="container" >
|
||||||
|
<form role = "form" class = "form-horizontal">
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<h3>Логин</h3>
|
||||||
|
<label for ="name" class = "control-label center">Введите никнейм или почту</label>
|
||||||
|
<input type = "name" class = "form-control" id = "name" placeholder ="Введите никнейм или почту">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<label for ="password" class = "control-label">Введите пароль</label>
|
||||||
|
<input type = "password" class = "form-control" id = "password" placeholder ="Введите пароль">
|
||||||
|
</div>
|
||||||
|
<div class = "form-group col-md-3 text-center">
|
||||||
|
<a href ="index.html">Нет профиля? Зарегистрироваться</a>
|
||||||
|
<p></p>
|
||||||
|
<div>
|
||||||
|
<form action="home.html">
|
||||||
|
<input type = "submit" class = "btn btn-primary" value = "Войти">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
107
3 lab/messages.html
Normal file
107
3 lab/messages.html
Normal file
@ -0,0 +1,107 @@
|
|||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
|
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
|
||||||
|
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
|
||||||
|
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
|
||||||
|
<link rel="stylesheet" href="./style.css">
|
||||||
|
<title>Сообщения</title>
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<main class="d-flex flex-nowrap">
|
||||||
|
<div class ="cl1 text-bg-dark">
|
||||||
|
<div class="filters ">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 text-bg-dark;" style ="width: 280px;">
|
||||||
|
|
||||||
|
<a href="/" class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
|
||||||
|
<svg class="bi pe-none me-2" width="40" height="32"><img src="images/icon.jpg" alt="icon" width ="24" height ="24"></svg>
|
||||||
|
<span class="fs-4">Сообщения</span>
|
||||||
|
</a>
|
||||||
|
<hr>
|
||||||
|
<ul class="nav nav-pills flex-column mb-auto">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="home.html" class="nav-link active" aria-current="page">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/home.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
Главная
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
Настройки
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link text-white">
|
||||||
|
<svg class="bi pe-none me-2" width="16" height="16"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
Выход
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class ="cl2 bg-body-tertiary" style ="position:sticky; height:100vh;">
|
||||||
|
<div class="filters">
|
||||||
|
<div class="d-flex flex-column flex-shrink-0 bg-body-tertiary" style="width: 3rem;">
|
||||||
|
<a href="/" class="d-block p-3 link-body-emphasis text-decoration-none" title="Icon-only" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<img class="icon" src="images/icon.jpg" alt="icon" width ="32" height ="32">
|
||||||
|
<span class="visually-hidden">Icon</span>
|
||||||
|
</a>
|
||||||
|
<ul class="nav nav-pills nav-flush flex-column mb-auto text-center">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a href="home.html" class="nav-link active py-3 border-bottom rounded-0" aria-current="page" title="Home" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Home"><img src="images/home.png" alt="home" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="settings.html" class="nav-link py-3 border-bottom rounded-0" title="Settings" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Settings"><img src="images/settings.png" alt="settings" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="login.html" class="nav-link py-3 border-bottom rounded-0" title="Orders" data-bs-toggle="tooltip" data-bs-placement="right">
|
||||||
|
<svg class="bi pe-none" width="24" height="24" role="img" aria-label="Orders"><img src="images/exit.png" alt="exit" width ="24" height ="24"></svg>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="filters">
|
||||||
|
</div>
|
||||||
|
<div class = "container-fluid">
|
||||||
|
<div class="list-group">
|
||||||
|
<a href="dialog.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/da.jpg" alt="david" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Давид Макаров</h6>
|
||||||
|
<p class="mb-0 opacity-75">пример</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">now</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<a href="dialog.html" class="list-group-item list-group-item-action d-flex gap-3 py-3" aria-current="true">
|
||||||
|
<img src="images/da2.jpg" alt="danil" width="32" height="32" class="rounded-circle flex-shrink-0">
|
||||||
|
<div class="d-flex gap-2 w-100 justify-content-between">
|
||||||
|
<div>
|
||||||
|
<h6 class="mb-0">Даниил Путинцев</h6>
|
||||||
|
<p class="mb-0 opacity-75">?</p>
|
||||||
|
</div>
|
||||||
|
<small class="opacity-50 text-nowrap">3d</small>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
4700
3 lab/package-lock.json
generated
Normal file
4700
3 lab/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
26
3 lab/package.json
Normal file
26
3 lab/package.json
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
{
|
||||||
|
"name": "int-prog",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"vite": "vite",
|
||||||
|
"serve": "http-server -p 3000 ./",
|
||||||
|
"build": "vite build",
|
||||||
|
"rest": "json-server --watch data.json -p 8081",
|
||||||
|
"dev": "npm-run-all --parallel rest vite",
|
||||||
|
"prod": "npm-run-all build --parallel serve rest"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"bootstrap": "5.2.1 ",
|
||||||
|
"@fortawesome/fontawesome-free": "6.2.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"vite": "4.4.9",
|
||||||
|
"eslint": "8.50.0",
|
||||||
|
"eslint-config-airbnb-base": "15.0.0",
|
||||||
|
"eslint-plugin-import": "2.28.1",
|
||||||
|
"http-server": "14.1.1",
|
||||||
|
"json-server": "0.17.4",
|
||||||
|
"npm-run-all": "4.1.5"
|
||||||
|
}
|
||||||
|
}
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user