@extends('frontend.master.master')

@section('content')
    <!-- Layout2 Header Section with Pattern Background -->
    <section class="layout5-header">
        <div class="container">
            <h1 class="layout5-title">{{ $nama_menu }}</h1>
            <p class="layout5-subtitle">Informasi lengkap mengenai {{ $nama_menu }}</p>
        </div>
    </section>

    <!-- Content Section -->
    <section class="layout5-content">
        <div class="container">
            <!-- Cards Grid -->
            <div class="row g-4">
                @forelse ($datas as $item)
                    @php
                        $encryptedId = Crypt::encrypt($item->id);
                        $picturePath = $item->picture ?? 'noimage.png';
                        $webOptimizedPath = public_path('storage/' . $picturePath . '_web.jpg');
                        $imageSrc = file_exists($webOptimizedPath) 
                            ? asset('storage/' . $picturePath . '_web.jpg') 
                            : asset('storage/' . $picturePath);
                    @endphp
                    <div class="col-12 col-md-6" data-aos="fade-up" data-aos-delay="100">
                        <div class="layout5-card">
                            <div class="layout5-card-image">
                                <img src="{{ $imageSrc }}" 
                                     alt="{{ $item->title ?? 'Tidak Ada Konten' }}" 
                                     class="img-fluid">
                            </div>
                            <div class="layout5-card-content">
                                <h3 class="layout5-card-title">
                                    {{ $item->title ?? 'Tidak Ada Konten' }}
                                    @if(isset($isPreview) && $isPreview && isset($item->status))
                                        @if($item->status == 'preview')
                                            <span class="badge bg-info text-white ms-2" style="font-size: 0.65rem;">
                                                <i class="fas fa-eye me-1"></i>
                                                Preview Draft
                                            </span>
                                        @elseif($item->status != 'post')
                                            <span class="badge bg-warning text-dark ms-2" style="font-size: 0.65rem;">
                                                <i class="fas fa-edit me-1"></i>
                                                Draft
                                            </span>
                                        @else
                                            <span class="badge bg-success ms-2" style="font-size: 0.65rem;">
                                                <i class="fas fa-check-circle me-1"></i>
                                                Published
                                            </span>
                                        @endif
                                    @endif
                                </h3>
                                <p class="layout5-card-desc">
                                    {{ Str::limit(strip_tags($item->subtitle ?? $item->description ?? 'Tidak Ada Konten'), 100) }}
                                </p>
                                <div class="layout5-card-meta">
                                    @if(isset($item->date1))
                                        <div class="layout5-meta-item">
                                            <i class="bi bi-calendar3"></i>
                                            <span>
                                                {{ \Carbon\Carbon::parse($item->date1)->format('d F Y') }}
                                                @if(isset($item->date2))
                                                    - {{ \Carbon\Carbon::parse($item->date2)->format('d F Y') }}
                                                @endif
                                            </span>
                                        </div>
                                    @endif
                                </div>
                                <div class="layout5-card-action">
                                    <a href="{{ isset($isPreview) && $isPreview ? route('preview.menu.detail', [
                                            'url' => $url,
                                            'slug' => \Illuminate\Support\Str::slug($item->title ?? 'default-slug'),
                                        ]) : route('layout.detail', [
                                            'url' => $url,
                                            'slug' => \Illuminate\Support\Str::slug($item->title ?? 'default-slug'),
                                        ]) }}?id_data={{ urlencode($encryptedId) }}{{ isset($item->status) && $item->status == 'preview' ? '&preview_mode=temp' : '' }}" 
                                       class="btn-layout5-detail">
                                        Lihat detail
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                @empty
                    <div class="col-12">
                        <div class="layout5-empty text-center py-5">
                            <i class="bi bi-folder-x" style="font-size: 3rem; color: #ccc;"></i>
                            <p class="mt-3 text-muted">Tidak ada data yang ditemukan.</p>
                        </div>
                    </div>
                @endforelse
            </div>

            <!-- Pagination -->
            @if($datas->hasPages())
                <div class="layout5-pagination">
                    <nav class="pagination-nav">
                        {{-- Previous Page Link --}}
                        @if ($datas->onFirstPage())
                            <span class="pagination-link prev disabled">Sebelumnya</span>
                        @else
                            <a href="{{ $datas->previousPageUrl() }}" class="pagination-link prev">Sebelumnya</a>
                        @endif

                        {{-- Pagination Numbers --}}
                        <div class="pagination-numbers">
                            @foreach ($datas->getUrlRange(1, $datas->lastPage()) as $page => $url)
                                @if ($page == $datas->currentPage())
                                    <span class="pagination-link active">{{ $page }}</span>
                                @else
                                    <a href="{{ $url }}" class="pagination-link">{{ $page }}</a>
                                @endif
                            @endforeach
                        </div>

                        {{-- Next Page Link --}}
                        @if ($datas->hasMorePages())
                            <a href="{{ $datas->nextPageUrl() }}" class="pagination-link next">Berikutnya</a>
                        @else
                            <span class="pagination-link next disabled">Berikutnya</span>
                        @endif
                    </nav>
                </div>
            @endif
        </div>
    </section>
@endsection