@extends('layouts.client')
@section('title')
    {{$title}} 
@endsection
@section('content-clients')
    @if(!empty($productDetail->id))
        <div class="container mt-1" style="padding: 40px 0px 0px;">  
        @else
        <div class="container mt-1" style="padding: 56px 0px 0px;">  
    @endif
        <div class="main-products px-3">
        {{-- đường dẫn --}}
        @if(!empty($productDetail))
            <div class="breadcrumb d-flex align-items-center">
                <a href="{{route('home.index')}}"><i class="fa-solid fa-house"></i></a>
                @if(Route::currentRouteName() == 'home.products.sanpham_id')
                    <span class="separator">></span>
                    <a href="{{route('home.products.sanpham_id',$productDetail->slugDm)}}" class="breadcrumb-link">{{$productDetail->ten_danh_muc}}</a>
                @endif
            </div> 
        @else
            <a href="{{route('home.products.index')}}"><i class="fa-solid fa-house"></i></a>
        @endif

        <div class="row pt-1">
            @include('clients.blocks.categories')
            
            <!-- Danh sách sản phẩm -->
            <div class="col-md-9 product-list">
                <h6>Các Sản Phẩm <span style="color:red">[{{count($productList)}} sp]</span></h6>
                <form action="" method="get" id="filter-form">
                    <div class="row mb-2">
                        <!-- Bộ lọc NSX -->
                        <div class="col-md-3">
                            <label for="nsx" class="form-label">Nhà sản xuất:</label>
                            <select class="form-select filter-select" name="nsx" id="nsx">
                                <option value="">Chọn Nhà Sản Xuất</option>
                                @foreach ($danhMucNsx as $item)
                                    <option value="{{$item->maNSX}}" {{request()->nsx == $item->maNSX ? 'selected' : ''}}>
                                        {{$item->ten_NSX}}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                
                        <!-- Bộ lọc khoảng giá -->
                        <div class="col-md-3">
                            <label for="price_from" class="form-label">Khoảng giá:</label>
                            <div class="d-flex gap-2">
                                <input type="number" class="form-control filter-select" name="price_from" placeholder="Từ" value="{{request()->price_from}}">
                                <input type="number" class="form-control filter-select" name="price_to" placeholder="Đến" value="{{request()->price_to}}">
                            </div>
                        </div>
                
                        <!-- Bộ lọc đánh giá -->
                        <div class="col-md-2">
                            <label for="rating" class="form-label">Đánh giá:</label>
                            <select class="form-select filter-select" name="rating" id="rating">
                                <option value="">Chọn đánh giá</option>
                                <option value="5" {{request()->rating == '5' ? 'selected' : ''}}>5 sao</option>
                                <option value="4" {{request()->rating == '4' ? 'selected' : ''}}>4 sao trở lên</option>
                                <option value="3" {{request()->rating == '3' ? 'selected' : ''}}>3 sao trở lên</option>
                            </select>
                        </div>
                
                        <!-- Bộ lọc thời gian -->
                        <div class="col-md-2">
                            <label for="date_filter" class="form-label">Thời gian:</label>
                            <select class="form-select filter-select" name="date_filter" id="date_filter">
                                <option value="">Chọn thời gian</option>
                                <option value="week" {{request()->date_filter == 'week' ? 'selected' : ''}}>Tuần này</option>
                                <option value="month" {{request()->date_filter == 'month' ? 'selected' : ''}}>Tháng này</option>
                            </select>
                        </div>
                
                        <!-- Nút tìm kiếm -->
                        <div class="col-md-2 d-flex align-items-end">
                            <button class="btn btn-primary w-100" type="submit">Tìm kiếm</button>
                        </div>
                    </div>
                
                    <!-- Sắp xếp -->
                    <div class="row_sort mb-2 text-center d-flex gap-2 align-items-center">
                        <div class="sort-btn">
                            <a href="{{ request()->fullUrlWithQuery(['sort' => 'tangdan']) }}" class="{{ request('sort') == 'tangdan' ? 'active' : '' }} btn btn-sm bg-success text-white">Giá tăng dần</a>
                            <a href="{{ request()->fullUrlWithQuery(['sort' => 'giamdan']) }}" class="{{ request('sort') == 'giamdan' ? 'active' : '' }} btn btn-sm bg-success text-white">Giá giảm dần</a>
                            <a href="{{ request()->fullUrlWithQuery(['sort' => 'moinhat']) }}" class="{{ request('sort') == 'moinhat' ? 'active' : '' }} btn btn-sm bg-success text-white">Mới nhất</a>
                        </div>
                        <div class="col-md-5">
                            <input type="text" class="form-control" name="keyword" placeholder="Tìm kiếm sản phẩm" value="{{ request('keyword') }}">
                        </div>
                    </div>
                
                    <!-- Bộ lọc đang áp dụng -->
                    <div class="applied-filters">
                        <span>Bộ lọc đang áp dụng:</span>
                        @if(request()->has('nsx'))
                            <span class="badge bg-primary">Nhà sản xuất: {{ request()->nsx }}
                                <a href="{{ url()->current() . '?' . http_build_query(request()->except('nsx')) }}">x</a>
                            </span>
                        @endif
                        @if(request()->has('price_from'))
                            <span class="badge bg-primary">Giá từ: {{ request()->price_from }}
                                <a href="{{ url()->current() . '?' . http_build_query(request()->except('price_from')) }}">x</a>
                            </span>
                        @endif
                        @if(request()->has('price_to'))
                            <span class="badge bg-primary">Giá đến: {{ request()->price_to }}
                                <a href="{{ url()->current() . '?' . http_build_query(request()->except('price_to')) }}">x</a>
                            </span>
                        @endif
                        @if(request()->has('rating'))
                            <span class="badge bg-primary">Đánh giá: {{ request()->rating }} sao
                                <a href="{{ url()->current() . '?' . http_build_query(request()->except('rating')) }}">x</a>
                            </span>
                        @endif
                        @if(request()->has('date_filter'))
                            <span class="badge bg-primary">Thời gian: {{ request()->date_filter }}
                                <a href="{{ url()->current() . '?' . http_build_query(request()->except('date_filter')) }}">x</a>
                            </span>
                        @endif
                    </div>
                    
                </form>
                
                <div class="row">
                    @if(!empty($productList) && count($productList) > 0)
                    @foreach ($productList as $product)
                    {{-- {{dd($productList)}} --}}
                        <div class="col-6 col-md-4 col-lg-2" style="padding:0px 2px 0px ">
                            <a href="{{route('home.chi_tiet_sp',$product->slug)}}">
                                <div class="product-item p-2 d-flex flex-column" style="border-radius: 10px; background-color: #fff; transition: transform 0.3s ease;">
                                    <div class="img-container position-relative d-flex justify-content-center align-items-center" style="min-height: 140px;width: auto;overflow: hidden; border:1px solid #ccc;border-radius:20px">
                                        <img src="{{ asset('storage/products/img/' . $product->anh) ?: 'https://via.placeholder.com/150' }}" class="img-fluid" alt="{{ $product->ten_san_pham }}" style="object-fit: cover;padding: 8px;border-radius: 10px;max-height: 120px;width:auto">
                                        <!-- Vệt bóng sáng -->
                                        <div class="shine-effect"></div>
                                        {{-- Kiểm tra trạng thái sản phẩm, nếu hết hàng thì hiển thị--}}
                                        @if($product->so_luong_ton == 0)
                                            <div class="out-of-stock-label position-absolute top-0 start-0 bg-danger text-white px-3 py-1" style="border-radius: 0 0 10px 0; font-weight: bold;">
                                               <h6 class="mb-0" style="font-size: 12px">Hết hàng</h6>
                                            </div>
                                        @elseif(\Carbon\Carbon::now()->month == 11)
                                            <div class="new-product-label1 position-absolute top-0 start-0 text-white px-3 py-1" style="font-weight: bold;">
                                                CHÀO THÁNG 11
                                            </div>
                                        @endif
                                        @if(\Carbon\Carbon::now()->diffInDays($product->created_atSP) <= 2)
                                            <div class="new-product-label position-absolute bottom-0 end-0 text-white px-3 py-1" style="font-weight: bold;font-size: 10px">
                                                SẢN PHẨM MỚI
                                            </div>
                                        @endif
                                        @php
                                            // Giá gốc của sản phẩm
                                            $originalPrice = $product->don_gia;

                                            // Lấy khuyến mãi của sản phẩm, nếu có
                                            $promotion = \App\Models\Admin\ProductPromotion::join('khuyenmai', 'khuyenmai.id', '=', 'sanpham_khuyenmai.khuyenmai_id')
                                                ->where('sanpham_khuyenmai.product_id', $product->maSP)
                                                ->where('khuyenmai.ngay_bat_dau', '<=', now())
                                                ->where('khuyenmai.ngay_ket_thuc', '>=', now())
                                                ->where('khuyenmai.trang_thai', 0)
                                                ->orderBy('khuyenmai.ngay_bat_dau', 'desc')
                                                ->select('khuyenmai.*')
                                                ->first();

                                            // Tính giá khuyến mãi
                                            $price = $originalPrice; // Mặc định là giá gốc
                                            if ($promotion) {
                                                if ($promotion->hinh_thuc_giam_gia == 0) {
                                                    // Giảm theo số tiền
                                                    $price = max(0, $originalPrice - $promotion->gia_tri_khuyen_mai);
                                                } elseif ($promotion->hinh_thuc_giam_gia == 1) {
                                                    // Giảm theo phần trăm
                                                    $price = max(0, $originalPrice * (1 - $promotion->gia_tri_khuyen_mai / 100));
                                                }
                                            }   
                                            // Tính phần trăm giảm giá
                                            $discountPercent = 0;
                                            if ($product->don_gia > 0 && $promotion) {
                                                $discountPercent = (($product->don_gia - $price) / $product->don_gia) * 100;
                                            }
                                        @endphp
                                        {{-- phần trăm giảm giá--}}
                                        @if($discountPercent > 0)
                                            <div class="new-product-label2 position-absolute top-0 end-0 text-red px-1 py-1" style="font-weight: bold;">
                                                <span style="font-size: 12px">-{{ number_format($discountPercent, 0) }}%</span>
                                            </div>
                                        @endif
                                    </div>
                                    <h6 class="mt-2 text-center product-name" style="font-size: 13px">{{ $product->ten_san_pham }}</h6>
                                    <div class="price_star d-flex justify-content-between align-items-center price-container">
                                        <p class="text-muted text-decoration-line-through mb-0 original-price" style="font-size:12px;">
                                            @if($promotion)
                                                {{ number_format($product->don_gia, 0, ',', '.') }}đ
                                            @else
                                                <h6 style="color: white; margin-bottom: 0">hi</h6>
                                            @endif
                                        </p>
                                        <div class="star_danhgia d-flex align-items-center" style="font-size: 10px; color:orange">
                                            @if(request()->routeIs('home.products.index'))
                                                @php
                                                    $ratingAvg = $product->star->avg('rating');
                                                    $countReview = $product->star->count();
                                                @endphp
                                            @else   
                                                @php
                                                    $ratingAvg = \App\Models\Clients\Reviews::where('product_id', $product->maSP)->avg('rating');
                                                    $countReview = \App\Models\Clients\Reviews::where('product_id', $product->maSP)->count();
                                                @endphp
                                            @endif
                                                {{-- Tính trung bình điểm rating của sản phẩm --}}
                                                @php
                                                    
                                                    $fullStars = floor($ratingAvg); // Số lượng ngôi sao đầy đủ
                                                    $hasHalfStar = ($ratingAvg - $fullStars) >= 0.5; // Kiểm tra xem có nửa ngôi sao không
                                                @endphp
                                                {{-- Hiển thị các ngôi sao đầy đủ --}}
                                                @for ($i = 0; $i < $fullStars; $i++)
                                                <i class="fa-solid fa-star"></i>
                                                @endfor

                                                {{-- Hiển thị nửa ngôi sao nếu có --}}
                                                @if ($hasHalfStar)
                                                <i class="fa-solid fa-star-half-alt"></i>
                                                @endif
                                                {{-- Hiển thị tổng số lượng đánh giá --}}
                                                @for ($i = $fullStars + ($hasHalfStar ? 1 : 0); $i < 5; $i++)
                                                    <i class="fa-regular fa-star"></i>
                                                @endfor
                                                <span>({{ $countReview }})</span>
                                           
                                        </div>
                                    </div>
                                    <div class="row d-flex justify-content-between align-items-center">
                                        <div class="col-md-6">
                                           
                                            <p class="text-danger fw-bold" style="font-size: 1rem;">
                                                @if ($promotion)
                                                    <p class="text-danger fw-bold price " style="font-size: 1rem;">
                                                        {{ number_format($price, 0, ',', '.') }}đ
                                                    </p>
                                                @else
                                                    <p class="text-danger fw-bold price " style="font-size: 1rem;">
                                                        {{ number_format($originalPrice, 0, ',', '.') }}đ
                                                    </p>
                                                @endif
                                            </p>
                                        </div>
                                        <div class="col-md-6 text-end viewProduct align-middle">
                                            <i class="fa-regular fa-eye" style="font-size: 11px"></i> 
                                            <span style="font-size: 12px">100</span>
                                        </div>
                                    </div>
                                    <div class="row">
                                        @if($product->so_luong_ton != 0)
                                            <form action="{{ route('home.cart.add', $product->maSP) }}" method="post" class="col-5">
                                                @csrf
                                                <input type="hidden" name="so_luong" value="1">
                                                <button type="submit" class="btn btn-primary btn-xemchitiet"><i class="fa-solid fa-cart-plus"></i></button>
                                            </form>
                                            <form action="{{ route('home.cart.add', $product->maSP) }}" method="post" class="col-7">
                                                @csrf
                                                <input type="hidden" name="so_luong" value="1">
                                                <input type="hidden" name="action" value="buy_now"> <!-- Thêm tham số này -->
                                                <button type="submit" class="btn btn-warning btn-pay">Mua</button>
                                            </form>
                                        @else
                                            <form action="{{-- route('home.cart.add', $product->maSP) --}}" method="get">
                                                @csrf
                                                <button type="submit" class="btn btn-warning btn-xemchitiet-lienhe">Liên hệ</button>
                                            </form>
                                        @endif
                                    </div>
                                </div>
                            </a>
                        </div>
                    @endforeach
                @else
                    <div class="col-12 text-center">
                        <h2>Không có sản phẩm nào!</h2>
                    </div>
                @endif

                </div>
                
                <div class="row">
                    <div style="display: flex; justify-content: center; height: 20px; font-size: 20px;">
                        {{$productList->links()}}
                    </div> 
                </div>
                        
            </div>
            @if(session('msg'))
                <div class="alert alert-success">{{session('msg')}}</div>
            @endif
        </div>
    </div>
@endsection

@section('stylesheet')
    <style>
        body{
            /* background-size: cover; */
            background-attachment: fixed;
            margin: 0; 
        }
        main{
            padding: 10px;
            background-color: white;
            height: 100vh;
            padding-bottom: 50px
        }
        .container.detail_product{
            margin: 10px 0px 50px;
        }
        .price-container {
            min-height: 40px; /* Đặt chiều cao phù hợp với nội dung của bạn */
        }

        /* Kiểm soát hiển thị giá khuyến mãi */
        .original-price {
            display: inline-block;
            visibility: hidden; /* Ẩn giá gốc nếu không có khuyến mãi, nhưng vẫn giữ không gian */
        }

        /* Nếu có khuyến mãi, hiển thị giá gốc với gạch ngang */
        .has-discount .original-price {
            visibility: visible;
            text-decoration: line-through;
            color: #aaa;
        }

        /* Hiển thị giá khuyến mãi */
        .price {
            color: #d9534f; /* Màu đỏ cho giá khuyến mãi */
            font-weight: bold;
        }
    </style>

@endsection