@extends('frontend.master.master')

@section('content')
    <!-- Layout7 Header Section with Pattern Background -->
    <section class="layout7-header">
        <div class="container">
            <h1 class="layout7-title">{{ $nama_menu }}</h1>
            <p class="layout7-subtitle">Ikuti kegiatan dan program tahunan yang PT Multi Spunindo Jaya selenggarakan</p>
        </div>
    </section>

    <!-- Content Section with Pattern Body Background -->
    <section class="layout7-content">
        <div class="container">
            <!-- Filter Tabs -->
            <div class="layout7-tabs mb-4">
                <a href="?filter=program" class="layout7-tab {{ request('filter', 'program') == 'program' ? 'active' : '' }}">Program</a>
                <a href="?filter=fasilitas" class="layout7-tab {{ request('filter') == 'fasilitas' ? 'active' : '' }}">Fasilitas</a>
            </div>

            <!-- Cards Grid - 3 columns on desktop -->
            <div class="row g-4">
                @forelse ($datas as $item)
                    @php
                        $encryptedId = Crypt::encrypt($item->id);
                    @endphp
                    <div class="col-12 col-md-6 col-lg-4" data-aos="fade-up" data-aos-delay="100">
                        <div class="layout7-card">
                            <div class="layout7-card-image">
                                @php
                                    // Check for multifoto/gallery_photos
                                    $galleryField = $item->multifoto ?? $item->gallery_photos ?? null;
                                    $gallery = is_string($galleryField) ? json_decode($galleryField, true) : $galleryField;
                                    if(!is_array($gallery)) $gallery = [];
                                    
                                    // Determine image source - use web-optimized version if exists
                                    if(!empty($gallery)) {
                                        $imagePath = $gallery[0];
                                    } else {
                                        $imagePath = $item->picture ?? 'noimage.png';
                                    }
                                    $webOptimizedPath = public_path('storage/' . $imagePath . '_web.jpg');
                                    $imageSrc = file_exists($webOptimizedPath) 
                                        ? asset('storage/' . $imagePath . '_web.jpg') 
                                        : asset('storage/' . $imagePath);
                                @endphp
                                <img src="{{ $imageSrc }}" 
                                     alt="{{ $item->title ?? 'Tidak Ada Konten' }}" 
                                     class="img-fluid">
                            </div>
                            <div class="layout7-card-content">
                                <h3 class="layout7-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>
                                        @endif
                                    @endif
                                </h3>
                                <p class="layout7-card-desc">
                                    {{ Str::limit(strip_tags($item->description ?? 'Tidak Ada Konten'), 100) }}
                                </p>
                                <div class="layout7-card-action">
                                    <a href="{{ isset($isPreview) && $isPreview ? route('preview.menu.detail', [
                                            'url' => $url,
                                            'slug' => \Illuminate\Support\Str::slug($item->title ?? 'Tidak Ada Konten'),
                                        ]) : route('layout.detail', [
                                            'url' => $url,
                                            'slug' => \Illuminate\Support\Str::slug($item->title ?? 'Tidak Ada Konten'),
                                        ]) }}?id_data={{ urlencode($encryptedId) }}{{ isset($item->status) && $item->status == 'preview' ? '&preview_mode=temp' : '' }}" 
                                       class="btn-layout7-detail">
                                        Lihat detail
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                @empty
                    <div class="col-12">
                        <div class="layout7-empty">
                            <i class="bi bi-folder-x"></i>
                            <p>Tidak ada {{ request('filter', 'program') }} yang ditemukan.</p>
                        </div>
                    </div>
                @endforelse
            </div>

            <!-- Pagination -->
            @if($datas->hasPages())
                <div class="layout7-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