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

161 lines
6.8 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" />
</head>
<body class="mono">
<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">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">
<tr data-id="1">
<td>1</td>
<td>Хачапури</td>
<td>Булка</td>
<td>211.00&#8381;</td>
<td>Вкус: вкусный</td>
<td><img src="./img/item.jpg" style="max-width: 200px; max-height: 200px;" alt="Капучино" />
</td>
<td><button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#modal"
data-type="edit">Edit</button></td>
<td><button type="button" class="btn btn-danger" id="delete-btn">Delete</button></td>
</tr>
<tr data-id="1">
<td>1</td>
<td>Хачапури</td>
<td>Булка</td>
<td>211.00&#8381;</td>
<td>Вкус: вкусный</td>
<td><img src="./img/item.jpg" style="max-width: 200px; max-height: 200px" alt="Капучино" />
</td>
<td><button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#modal"
data-type="edit">Edit</button></td>
<td><button type="button" class="btn btn-danger" id="delete-btn">Delete</button></td>
</tr>
<tr data-id="1">
<td>1</td>
<td>Хачапури</td>
<td>Булка</td>
<td>211.00&#8381;</td>
<td>Вкус: вкусный</td>
<td><img src="./img/item.jpg" style="max-width: 200px; max-height: 200px" alt="Капучино" />
</td>
<td><button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#modal"
data-type="edit">Edit</button></td>
<td><button type="button" class="btn btn-danger" id="delete-btn">Delete</button></td>
</tr>
</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="modal-title fs-5" id="modal-title text-dark">Создать объект</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"> -->
</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">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>