@model Bookstore.Web.ViewModel.Search.SearchIndexViewModel
@{
    ViewData["Title"] = "Search for books";
}

<div class="panel-body">
    <partial name="_Notification" />

    <h2 class="mb-3">Search for Books</h2>
    
    <form asp-controller="Search" asp-action="Index" method="get">
        <div class="row">
            <div class="col-7">
                <input class="form-control" type="text" name="SearchString" asp-for="SearchString" />
            </div>

            <div class="col-4">
                <select id="selectId" class="form-select" name="SortBy" asp-for="SortBy">
                    <option value="Name">Name</option>
                    <option value="PriceAsc">Price (ascending)</option>
                    <option value="PriceDesc">Price (descending)</option>
                </select>
            </div>

            <div class="col-1">
                <button type="submit" class="btn btn-primary" value="Search">Search</button>
            </div>
        </div>
    </form>

    @if (Model.Books.Count == 0)
    {
        <h3>
            No results found.
        </h3>
    }
    else
    {
        <section class="static about-sec">
            <div class="container">
                <h2>Search Results</h2>

                <div class="recent-book-sec">
                    <div class="row">
                        @foreach (var item in Model.Books)
                        {
                            <div class="col-md-3">
                                <div class="item text-center">
                                    <a asp-controller="Search" asp-action="Details" asp-route-id="@item.BookId">
                                        <img src="@Html.DisplayFor(modelItem => item.ImageUrl)" alt="img" class="book_image_size" onerror="this.onerror=null;this.src='/images/default_c.jpg';" style="width: 135px;height: 200px;">
                                    </a>

                                    <center>
                                        <p class="text-dark">@Html.DisplayFor(modelitem => item.BookName)</p>
                                    </center>

                                    @if (item.Quantity > 0)
                                    {
                                        <h6>
                                            <span class="price">$@item.Price</span>
                                        </h6>
                                    }
                                    else
                                    {
                                        <h6>Out Of Stock</h6>
                                    }

                                    <div class="hover">
                                    </div>
                                </div>
                            </div>
                        }
                    </div>
                </div>

                <div>
                    <partial name="_paginator" />
                </div>
            </div>
        </section>
    }
</div>