@extends('admin.layouts.app')

@section('title', 'Products')
@section('page_title', 'Products')

@section('content')

<div class="page-heading">
    <div>
        <h2>Manage Products</h2>
        <p>Review, approve, renew, update status or remove marketplace listings.</p>
    </div>
</div>


{{-- SUCCESS MESSAGE --}}
@if(session('success'))
    <div class="alert alert-success" style="margin-bottom:20px;">
        {{ session('success') }}
    </div>
@endif


{{-- FILTERS --}}
<div class="filters-card">

    <form method="GET"
          action="{{ route('admin.products.index') }}"
          class="filters-form">

        <div class="form-field">
            <label for="search">Search</label>

            <input
                id="search"
                name="search"
                class="form-control"
                value="{{ request('search') }}"
                placeholder="Product, brand or seller"
            >
        </div>


        <div class="form-field">
            <label for="approval">Approval</label>

            <select id="approval"
                    name="approval"
                    class="form-control">

                <option value="">All</option>

                <option value="approved"
                    {{ request('approval') === 'approved' ? 'selected' : '' }}>
                    Approved
                </option>

                <option value="pending"
                    {{ request('approval') === 'pending' ? 'selected' : '' }}>
                    Pending
                </option>

            </select>
        </div>


        <div class="form-field">
            <label for="status">Status</label>

            <select id="status"
                    name="status"
                    class="form-control">

                <option value="">All</option>

                <option value="available"
                    {{ request('status') === 'available' ? 'selected' : '' }}>
                    Available
                </option>

                <option value="sold"
                    {{ request('status') === 'sold' ? 'selected' : '' }}>
                    Sold
                </option>

            </select>
        </div>


        <div class="form-field">
            <label for="category">Category</label>

            <select id="category"
                    name="category"
                    class="form-control">

                <option value="">All</option>

                @foreach($categories as $category)

                    <option value="{{ $category }}"
                        {{ request('category') === $category ? 'selected' : '' }}>

                        {{ $category }}

                    </option>

                @endforeach

            </select>
        </div>


        <button type="submit"
                class="button button-primary">
            Filter
        </button>

    </form>

</div>


{{-- PRODUCTS TABLE --}}
<section class="panel-card">

    <div class="table-wrapper">

        <table class="admin-table">

            <thead>

            <tr>
                <th>Product</th>
                <th>Seller</th>
                <th>Price</th>
                <th>Approval</th>
                <th>Listing Time</th>
                <th>Status</th>
                <th>Actions</th>
            </tr>

            </thead>


            <tbody>

            @forelse($products as $product)

                @php

                    /*
                    |--------------------------------------------------------------------------
                    | PRODUCT IMAGE
                    |--------------------------------------------------------------------------
                    */

                    $images = is_array($product->images)
                        ? $product->images
                        : json_decode($product->images ?? '[]', true);

                    $firstImage = is_array($images)
                        ? ($images[0] ?? null)
                        : null;


                    /*
                    |--------------------------------------------------------------------------
                    | EXPIRATION SYSTEM
                    |--------------------------------------------------------------------------
                    */

                    $expiresAt = $product->expires_at;


                    /*
                     * Product is expired when:
                     *
                     * is_active = false
                     *
                     * OR
                     *
                     * expires_at does not exist
                     *
                     * OR
                     *
                     * current date >= expires_at
                     */

                    $isExpired =
                        !$product->is_active
                        || !$expiresAt
                        || now()->greaterThanOrEqualTo($expiresAt);


                    /*
                    |--------------------------------------------------------------------------
                    | DAYS LEFT
                    |--------------------------------------------------------------------------
                    */

                    $daysLeft = $expiresAt && !$isExpired
                        ? max(
                            0,
                            (int) ceil(
                                now()->diffInHours($expiresAt, false) / 24
                            )
                        )
                        : 0;


                    /*
                    |--------------------------------------------------------------------------
                    | PRICE
                    |--------------------------------------------------------------------------
                    */

                    $displayPrice =
                        $product->discount_price
                        ?: $product->price;

                @endphp


                <tr>


                    {{-- PRODUCT --}}
                    <td>

                        <div class="table-product">

                            @if($firstImage)

                                <img
                                    src="{{ asset('storage/' . $firstImage) }}"
                                    alt="{{ $product->title }}"
                                    loading="lazy"
                                >

                            @else

                                <div class="avatar">
                                    P
                                </div>

                            @endif


                            <div>

                                <strong>
                                    {{ \Illuminate\Support\Str::limit($product->title, 32) }}
                                </strong>

                                <div style="
                                    color:#64748b;
                                    font-size:11px;
                                    margin-top:3px;
                                ">
                                    {{ $product->category ?: 'No category' }}
                                </div>

                            </div>

                        </div>

                    </td>


                    {{-- SELLER --}}
                    <td>

                        <strong>
                            {{ optional($product->user)->name ?: 'Deleted user' }}
                        </strong>

                        <div style="
                            color:#64748b;
                            font-size:11px;
                            margin-top:3px;
                        ">
                            {{ optional($product->user)->email }}
                        </div>

                    </td>


                    {{-- PRICE --}}
                    <td>

                        <strong>
                            ${{ number_format($displayPrice, 2) }}
                        </strong>

                        @if(
                            $product->discount_price
                            && $product->price
                            && $product->discount_price < $product->price
                        )

                            <div style="
                                color:#94a3b8;
                                font-size:11px;
                                text-decoration:line-through;
                                margin-top:3px;
                            ">
                                ${{ number_format($product->price, 2) }}
                            </div>

                        @endif

                    </td>


                    {{-- APPROVAL --}}
                    <td>

                        @if($product->is_approved)

                            <span class="badge badge-success">
                                Approved
                            </span>

                        @else

                            <span class="badge badge-warning">
                                Pending
                            </span>

                        @endif

                    </td>


                    {{-- LISTING TIME --}}
                    <td>

                        @if($isExpired)

                            <span class="badge badge-danger">
                                Expired
                            </span>


                            @if($expiresAt)

                                <div style="
                                    color:#64748b;
                                    font-size:11px;
                                    margin-top:6px;
                                ">
                                    Expired:
                                    {{ $expiresAt->format('M d, Y') }}
                                </div>

                            @else

                                <div style="
                                    color:#64748b;
                                    font-size:11px;
                                    margin-top:6px;
                                ">
                                    No expiration date
                                </div>

                            @endif


                        @else

                            <span class="badge badge-success">
                                {{ $daysLeft }} days left
                            </span>


                            <div style="
                                color:#64748b;
                                font-size:11px;
                                margin-top:6px;
                            ">
                                Until
                                {{ $expiresAt->format('M d, Y') }}
                            </div>

                        @endif

                    </td>


                    {{-- PRODUCT STATUS --}}
                    <td>

                        @if($isExpired)

                            <span class="badge badge-danger">
                                Expired
                            </span>


                        @elseif($product->status === 'sold')

                            <span class="badge badge-danger">
                                Sold
                            </span>


                        @else

                            <span class="badge badge-success">
                                Active
                            </span>

                        @endif

                    </td>


                    {{-- ACTIONS --}}
                    <td>

                        <div class="action-row">


                            {{-- VIEW --}}
                            <a
                                href="{{ route('admin.products.show', $product) }}"
                                class="button button-secondary">

                                View

                            </a>


                            {{-- APPROVE / UNAPPROVE --}}
                            <form
                                method="POST"
                                action="{{ route('admin.products.toggle-approval', $product) }}">

                                @csrf
                                @method('PATCH')


                                <button
                                    type="submit"
                                    class="button {{ $product->is_approved ? 'button-warning' : 'button-primary' }}">

                                    {{ $product->is_approved ? 'Unapprove' : 'Approve' }}

                                </button>

                            </form>


                            {{-- SOLD / AVAILABLE --}}
                            <form
                                method="POST"
                                action="{{ route('admin.products.toggle-status', $product) }}">

                                @csrf
                                @method('PATCH')


                                <button
                                    type="submit"
                                    class="button button-secondary">

                                    {{ $product->status === 'sold'
                                        ? 'Available'
                                        : 'Sold'
                                    }}

                                </button>

                            </form>



                            {{-- ========================================================= --}}
                            {{-- ADMIN FREE 15 DAY RENEWAL --}}
                            {{-- ========================================================= --}}

                            @if($isExpired)

                                <form
                                    method="POST"
                                    action="{{ route('admin.products.renew-free', $product) }}"
                                    onsubmit="return confirm('Give this product another 15 free days?')">

                                    @csrf
                                    @method('PATCH')


                                    <button
                                        type="submit"
                                        class="button button-primary">

                                        +15 Days

                                    </button>

                                </form>

                            @endif



                            {{-- DELETE --}}
                            <form
                                method="POST"
                                action="{{ route('admin.products.destroy', $product) }}"
                                onsubmit="return confirmDelete('Delete this product permanently?')">

                                @csrf
                                @method('DELETE')


                                <button
                                    type="submit"
                                    class="button button-danger">

                                    Delete

                                </button>

                            </form>


                        </div>

                    </td>

                </tr>


            @empty

                <tr>

                    <td
                        colspan="7"
                        class="empty-state">

                        No products found.

                    </td>

                </tr>

            @endforelse

            </tbody>

        </table>

    </div>


    {{-- PAGINATION --}}
    <div class="pagination-wrap">

        {{ $products->links() }}

    </div>

</section>


<style>

    /*
    |--------------------------------------------------------------------------
    | EXPIRATION BUTTON
    |--------------------------------------------------------------------------
    */

    .action-row {
        display: flex;
        flex-wrap: wrap;
        gap: 7px;
        align-items: center;
    }


    .action-row form {
        margin: 0;
    }


    /*
    |--------------------------------------------------------------------------
    | BADGES
    |--------------------------------------------------------------------------
    */

    .badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 6px 10px;
        border-radius: 999px;
        font-size: 11px;
        font-weight: 800;
        white-space: nowrap;
    }


    .badge-success {
        background: #dcfce7;
        color: #15803d;
    }


    .badge-warning {
        background: #fef3c7;
        color: #b45309;
    }


    .badge-danger {
        background: #fee2e2;
        color: #b91c1c;
    }


    /*
    |--------------------------------------------------------------------------
    | PRODUCT IMAGE
    |--------------------------------------------------------------------------
    */

    .table-product {
        display: flex;
        align-items: center;
        gap: 12px;
        min-width: 180px;
    }


    .table-product img {
        width: 52px;
        height: 52px;
        flex-shrink: 0;
        border-radius: 12px;
        object-fit: cover;
        background: #f1f5f9;
    }


    .table-product .avatar {
        width: 52px;
        height: 52px;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        background: #eef2ff;
        color: #4f46e5;
        font-weight: 900;
    }


    /*
    |--------------------------------------------------------------------------
    | MOBILE
    |--------------------------------------------------------------------------
    */

    @media(max-width: 900px) {
 
        .action-row {
            min-width: 280px;
        }

    }

</style>

@endsection