@extends('backoffice.layouts.app')
@section('content')
    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center py-4">
        <div class="d-block mb-4 mb-md-0">
            <nav aria-label="breadcrumb" class="d-none d-md-inline-block">
                <ol class="breadcrumb breadcrumb-dark breadcrumb-transparent">
                    <li class="breadcrumb-item">
                        <a href="{{ route('admin.dashboard') }}">
                            <svg class="icon icon-xxs" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                                xmlns="http://www.w3.org/2000/svg">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                    d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6">
                                </path>
                            </svg>
                        </a>
                    </li>
                    <li class="breadcrumb-item"><a href="{{ route('admin.products.brands') }}">Products Brands</a></li>
                    <li class="breadcrumb-item active" aria-current="page">List</li>
                </ol>
            </nav>
            <h2 class="h4">Products Brands</h2>
        </div>
        <div class="btn-toolbar mb-2 mb-md-0">
            {{-- <div class="btn-group ms-2 ms-lg-3">
                <form action="">
                    <div class="input-group me-2 me-lg-3 fmxw-400">
                        <span class="input-group-text">
                            <svg class="icon icon-xs" x-description="Heroicon name: solid/search"
                                xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"
                                aria-hidden="true">
                                <path fill-rule="evenodd"
                                    d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z"
                                    clip-rule="evenodd"></path>
                            </svg>
                        </span>
                        <input type="text" name="search" class="form-control" placeholder="Search orders"
                            value="{{ $search }}">
                        <input type="submit" value="Search" class="btn btn-primary">
                    </div>
                </form>
            </div> --}}
            <a href="{{ route('admin.product.brand.create') }}" class="btn btn-sm btn-gray-800 d-inline-flex align-items-center">
                <svg class="icon icon-xs me-2" fill="none" stroke="currentColor" viewBox="0 0 24 24"
                    xmlns="http://www.w3.org/2000/svg">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6">
                    </path>
                </svg>
                Add New
            </a>
        </div>
    </div>
    <div class="card card-body border-0 shadow table-wrapper table-responsive">
        <table class="table table-hover table-bordered pt-4" id="dataTablesTable">
            <thead>
                <tr>
                    <th class="border-gray-200">#</th>
                    {{-- <th class="border-gray-200">Thumbnail</th> --}}
                    <th class="border-gray-200">Title (EN)</th>
                    <th class="border-gray-200">Title (AR)</th>
                    <th class="border-gray-200">Modify Date</th>
                    <th class="border-gray-200">Status</th>
                    <th class="border-gray-200 text-center">Action</th>
                </tr>
            </thead>
            <tbody>
                @if (count($brands))
                    @foreach ($brands as $index => $item)
                        <tr>
                            <td>
                                <a href="your-page-url" class="fw-bold text-center">{{ $index + 1 }}</a>
                            </td>
                            {{-- <td>
                                @if (empty($item->thumbnail))
                                    <img src="{{ asset('wasm-flower-dummy.jpg') }}" class="img-fluid" width="80"
                                        height="60">
                                @else
                                    <img src="{{ asset('uploads/products/category/' . $item->thumbnail) }}" class="img-fluid"
                                        width="80" height="60">
                                @endif
                            </td> --}}
                            <td><span class="fw-normal">{{ $item->title_en ?? '' }}</span></td>
                            <td><span class="fw-normal">{{ $item->title_ar ?? '' }}</span></td>
                            <td><span
                                    class="fw-normal">{{ \Carbon\Carbon::parse($item->created_at)->format('d-m-Y') ?? '' }}</span>
                            </td>
                            <td>
                                @if ($item->status == 1)
                                    <span class="fw-bold text-success">Active</span>
                                @else
                                    <span class="fw-bold text-danger">Inactive</span>
                                @endif
                            </td>
                            <td class="mx-auto text-center">
                                <a href="{{ route('admin.product.brand.edit', $item->slug) }}"
                                    class="icon-shape icon-xs icon-shape-success rounded">
                                    <span class="fas fa-edit mx-auto"
                                        style="text-decoration: none !important; background: transparent !important; color: #10B981 !important;"></span>
                                </a>
                            </td>
                        </tr>
                    @endforeach
                @endif
            </tbody>
        </table>
        {{-- <div class="card-footer px-3 border-0 d-flex flex-column flex-lg-row align-items-center justify-content-between">
            <nav aria-label="Page navigation example">
                <ul class="pagination mb-0">
                    <!-- Previous Page Link -->
                    @if ($brands->onFirstPage())
                        <li class="page-item disabled">
                            <span class="page-link">Previous</span>
                        </li>
                    @else
                        <li class="page-item">
                            <a class="page-link" href="{{ $brands->previousPageUrl() }}">Previous</a>
                        </li>
                    @endif

                    <!-- Page Numbers -->
                    @foreach ($brands->getUrlRange(1, $brands->lastPage()) as $page => $url)
                        <li class="page-item {{ $page == $brands->currentPage() ? 'active' : '' }}">
                            <a class="page-link" href="{{ $url }}">{{ $page }}</a>
                        </li>
                    @endforeach

                    <!-- Next Page Link -->
                    @if ($brands->hasMorePages())
                        <li class="page-item">
                            <a class="page-link" href="{{ $brands->nextPageUrl() }}">Next</a>
                        </li>
                    @else
                        <li class="page-item disabled">
                            <span class="page-link">Next</span>
                        </li>
                    @endif
                </ul>
            </nav>

            <!-- Pagination Summary -->
            <div class="fw-normal small mt-4 mt-lg-0">
                Showing <b>{{ $brands->firstItem() }}</b> to <b>{{ $brands->lastItem() }}</b> of
                <b>{{ $brands->total() }}</b> entries
            </div>
        </div> --}}
    </div>
@endsection