internet-programming/lab2/admin.html
2023-12-08 12:10:55 +04:00

152 lines
8.8 KiB
HTML
Raw Permalink 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" 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/logo.png" alt="logo" width="128">
</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="index.html">Каталог</a>
<a class="nav-link" href="aboutUs.html">О нас</a>
<a class="nav-link" href="paymentAndDelivery.html">Оплата и доставка</a>
<a class="nav-link" href="contacts.html">Контакты</a>
</div>
</div>
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
<div class="navbar-nav">
<a class="btn" href="accountLogin.html">Выйти</a>
<a class="btn" href="basket.html">Корзина</a>
</div>
</div>
</div>
</nav>
</header>
<main class="container-fluid p-2">
<section class="h-100">
<div class="mask d-flex align-items-center h-100 gradient-custom-3">
<div class="container h-100">
<div class="row d-flex justify-content-center align-items-center h-100">
<div class="col-12 col-md-9 col-lg-7 col-xl-6">
<h1 class="text-success text-center font-weight-bold">Панель администратора</h1>
<div class="card" style="border-radius: 15px; border-color:mediumseagreen;">
<div class="card-body p-5">
<h2 class="text-uppercase text-center mb-5">Добавление товара</h2>
<form>
<div class="form-outline mb-4">
<input type="file" name="image" class="form-control" accept="image/*"
onchange="updatePreview(this, 'image-preview')">
<label class="form-label">Фото товара</label>
</div>
<div class="form-outline mb-4">
<input type="text" id="form3Example1cg" class="form-control form-control-lg" />
<label class="form-label" for="form3Example1cg">Название товара</label>
</div>
<div class="form-outline mb-4">
<input type="text" id="form3Example2cg" class="form-control form-control-lg" />
<label class="form-label" for="form3Example2cg">Описание товара</label>
</div>
<div class="form-outline mb-4">
<input id="form3Example2cg" min="0" name="quantity" value="2" type="number"
class="form-control form-control-lg" />
<label class="form-label" for="form3Example3cg">Количество товара</label>
</div>
<div class="form-outline mb-4">
<input type="number" id="form3Example4cg" class="form-control form-control-lg" />
<label class="form-label" for="form3Example4cg">Цена товара</label>
</div>
<div class="d-flex justify-content-center">
<button class="btn btn-block text-body mb-0">Добавить</button>
</div>
</form>
</div>
</div>
</div>
<div class="col-12">
<h1 class="text-success text-center font-weight-bold" style="padding-top: 50px;">Таблица данных</h1>
<div class="table-responsive mt-4">
<table class="table table-bordered">
<thead>
<tr>
<th>Фото</th>
<th>Название</th>
<th>Описание</th>
<th>Количество</th>
<th>Цена</th>
<th></th>
</tr>
</thead>
<tbody id="product-table">
<tr>
<td><img src="Images/rose.jpg" width="50" alt="Товар 1"></td>
<td>Товар 1</td>
<td>Описание товара 1</td>
<td class="d-flex justify-content-center align-items-center">
<input id="form1" min="0" name="quantity" value="2" type="number" class="form-control form-control-sm" style="width: 50px;" />
</td>
<td>1200 рублей</td>
<td class="d-flex justify-content-center align-items-center">
<a href="#!" class="text-muted"><i class="fas fa-xmark fa-lg"></i></a>
</td>
</tr>
<tr>
<td><img src="Images/rose.jpg" width="50" alt="Товар 2"></td>
<td>Товар 2</td>
<td>Описание товара 2</td>
<td class="d-flex justify-content-center align-items-center">
<input id="form1" min="0" name="quantity" value="2" type="number" class="form-control form-control-sm" style="width: 50px;" />
</td>
<td>1000 рублей</td>
<td class="d-flex justify-content-center align-items-center">
<a href="#!" class="text-muted"><i class="fas fa-xmark fa-lg"></i></a>
</td>
</tr>
<tr>
<td><img src="Images/rose.jpg" width="50" alt="Товар 3"></td>
<td>Товар 3</td>
<td>Описание товара 3</td>
<td class="d-flex justify-content-center align-items-center">
<input id="form1" min="0" name="quantity" value="2" type="number" class="form-control form-control-sm" style="width: 50px;" />
</td>
<td>1500 рублей</td>
<td class="d-flex justify-content-center align-items-center">
<a href="#!" class="text-muted"><i class="fas fa-xmark fa-lg"></i></a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
Все права защищены © 2023-2024
</footer>
</body>
</html>