Int_Prog/лаб3/lab3/admin.html
2024-01-19 01:24:45 +04:00

131 lines
5.4 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="ru">
<head>
<title></title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Bootstrap -->
<link rel="stylesheet" href="./node_modules/bootstrap/dist/css/bootstrap.min.css" />
<script defer src="node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- Normalize -->
<link rel="stylesheet" href="./node_modules/normalize.css/normalize.css" />
<!-- Styles -->
<link href="css/style.css" rel="stylesheet" />
<script type="module" src="/scripts/admin.js"></script>
</head>
<body>
<header class="header">
<nav class="navbar navbar-expand-md">
<div class="container align-items-baseline">
<a class="gold-color fs-4" href="index.html">Хмели-Сунели</a>
<button class="navbar-toggler bg-light" type="button" data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ms-auto p-2 p-md-0 mt-2 navbar-my-border d-md-flex gap-3">
<li class="nav-item">
<a class="gold-color" href="index.html">Меню</a>
</li>
<li class="nav-item">
<a class="gold-color" href="about.html">О нас</a>
</li>
<li class="nav-item">
<a class="gold-color" href="cart.html">Корзина</a>
</li>
<li class="nav-item">
<a class="gold-color" href="admin.html">Админка</a>
</li>
<li class="nav-item">
<a class="gold-color" href="login.html">Войти</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<main>
<div class="container">
<strong class="d-block fw-bold mb-4 title">Админка</strong>
<button type="button" class="btn btn-primary mb-2" data-bs-toggle="modal" data-bs-target="#modal"
data-type="add">Добавить объект</button>
<div class="table-responsive">
<table class="table table-bordered">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Name</th>
<th scope="col">Category</th>
<th scope="col">Restaurant Type</th>
<th scope="col">Price</th>
<th scope="col">Info</th>
<th scope="col">Photo</th>
<th scope="col">Edit</th>
<th scope="col">Delete</th>
</tr>
</thead>
<tbody id="parent">
</tbody>
</table>
</div>
</div>
<div class="modal fade" id="modal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-scrollable">
<div class="modal-content">
<div class="modal-header">
<h1 class="fs-5" id="modal-title">Создать объект</h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<form id="modal-form">
<div class="mb-3 d-flex align-items-center justify-content-center">
<img src="/img/placeholder.png" alt="" id="object-preview-photo" style="max-width: 200px; max-height: 200px;">
</div>
<div class="mb-3">
<label for="message-text" class="col-form-label">Name:</label>
<input class="form-control" id="object-name" />
</div>
<div class="mb-3">
<label for="message-text" class="col-form-label">Category:</label>
<select class="form-select" id="object-category" aria-label="Default select example">
<option selected disabled>Выберите категорию</option>
</select>
</div>
<div class="mb-3">
<label for="message-text" class="col-form-label">Restaurant type:</label>
<select class="form-select" id="object-restaurant-type" aria-label="Default select example">
<option selected disabled>Выберите тип кухни:</option>
</select>
</div>
<div class="mb-3">
<label for="message-text" class="col-form-label">Price:</label>
<input class="form-control" id="object-price" type="number" min="0" />
</div>
<div class="mb-3">
<label for="message-text" class="col-form-label">Info:</label>
<textarea class="form-control" id="object-info"></textarea>
</div>
<div class="mb-3">
<label for="message-text" class="col-form-label">Photo:</label>
<input type="file" class="form-control" id="object-photo" accept="image/*">
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
<button type="button" class="btn btn-primary" id="submit-button">Создать</button>
</div>
</div>
</div>
</div>
</main>
</body>
</html>