PIAPS_CW/WebApp/Pages/Index.cshtml

81 lines
3.2 KiB
Plaintext
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.

@using Contracts.ViewModels
@model List<ProductViewModel>
@{
ViewData["Title"] = "Home page";
}
<!-- Шапка -->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="#">Catalog</a>
<div class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Категории
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="dropdown-item" href="#">Пистолеты</a>
<a class="dropdown-item" href="#">Револьверы</a>
<a class="dropdown-item" href="#">Винтовки</a>
</div>
</li>
</ul>
<form method="get">
<div class="form-inline col-lg-12">
<input class="form-control mr-sm-2" type="search" placeholder="Поиск" name="search" value="">
<button class="btn btn-outline-success" type="submit"><i class="fas fa-search"></i></button>
</div>
</form>
<div class="form-group">
<form method="get" m>
<input type="range" step="100" min="0" max="10000" value="50000" class="custom-range" id="priceFrom">
<label for="priceFrom">От: <span id="priceLabelFrom">50 000</span> руб.</label>
</form>
<form method="get">
<input type="range" step="100" min="0" max="100000" value="50000" class="custom-range" id="priceTo">
<label for="priceTo">До: <span id="priceLabelTo">50 000</span> руб.</label>
</form>
</div>
</div>
</nav>
<!-- Таблица товаров -->
<table class="table">
<thead>
<tr>
<th scope="col">#</th>
<th scope="col">Название</th>
<th scope="col">Цена</th>
<th scope="col">Изображение</th>
</tr>
</thead>
<tbody>
@foreach (var weapon in Model)
{
<tr>
<th scope="row">@Model.IndexOf(weapon)</th>
<td>@weapon.Name</td>
<td>@weapon.Price руб.</td>
<td><img src="@weapon" alt="@weapon.Name" style="width:100px;height:100px;"></td>
</tr>
}
</tbody>
</table>
@section Scripts {
<script>
document.getElementById("priceFrom").addEventListener("input", function () {
var price = this.value;
document.getElementById("priceLabelFrom").textContent = price + " руб.";
// Здесь должен быть код для фильтрации товаров по цене
});
document.getElementById("priceTo").addEventListener("input", function () {
var price = this.value;
document.getElementById("priceLabelTo").textContent = price + " руб.";
// Здесь должен быть код для фильтрации товаров по цене
});
</script>
}