@extends('layouts.admin')

@section('header', 'Daftar Testimoni')

@section('content')

<!-- Global Admin Photo Setting -->
<div class="bg-white rounded-xl shadow-md p-6 mb-6">
    <h3 class="text-lg font-bold text-gray-800 mb-4 pb-2 border-b">Pengaturan Global Balasan Admin</h3>
    <form action="{{ route('admin.reviews.updateGlobalPhoto') }}" method="POST" enctype="multipart/form-data" class="flex flex-col md:flex-row items-center gap-6">
        @csrf
        
        <div class="flex-shrink-0">
            @if(isset($globalAdminPhoto) && $globalAdminPhoto)
                <div class="relative group">
                    <img src="{{ $globalAdminPhoto }}" alt="Admin Global Photo" class="w-20 h-20 rounded-full object-cover border-4 border-yellow-100 shadow-sm">
                </div>
            @else
                <div class="w-20 h-20 rounded-full bg-gray-200 flex items-center justify-center text-gray-400 border-4 border-gray-100">
                    <i class="fas fa-user-shield text-3xl"></i>
                </div>
            @endif
        </div>

        <div class="flex-1 w-full">
            <label class="block text-sm font-medium text-gray-700 mb-2">Foto Profil Admin (Global)</label>
            
            @if($errors->has('admin_photo'))
                <div class="text-red-500 text-sm mb-2">
                    {{ $errors->first('admin_photo') }}
                </div>
            @endif
            @if(session('error'))
                <div class="text-red-500 text-sm mb-2">
                    {{ session('error') }}
                </div>
            @endif

            <div class="flex items-center gap-3">
                <input type="file" name="admin_photo" accept="image/*" class="block w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-sm file:font-semibold file:bg-yellow-50 file:text-yellow-700 hover:file:bg-yellow-100 transition border border-gray-200 rounded-full">
                <button type="submit" class="bg-yellow-500 text-white px-4 py-2 rounded-lg hover:bg-yellow-600 transition shadow text-sm whitespace-nowrap">
                    <i class="fas fa-upload mr-1"></i> Simpan Foto
                </button>
            </div>
            <p class="text-xs text-gray-500 mt-2">Foto ini akan digunakan sebagai foto profil default pada balasan admin jika tidak ada foto spesifik yang diatur pada testimoni.</p>
        </div>
    </form>
</div>

<div class="bg-white rounded-xl shadow-md p-6">
    <div class="flex flex-col md:flex-row justify-between items-center mb-6 gap-4">
        <h3 class="text-lg font-bold text-gray-800">Daftar Testimoni per Kategori</h3>
        <a href="{{ route('admin.reviews.create') }}" class="bg-yellow-500 text-white px-4 py-2 rounded-lg hover:bg-yellow-600 transition shadow-lg flex items-center gap-2">
            <i class="fas fa-plus"></i> Tambah Testimoni
        </a>
    </div>

    @if(session('success'))
        <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative mb-4" role="alert">
            <span class="block sm:inline">{{ session('success') }}</span>
        </div>
    @endif

    @php
        $hasReviews = false;
    @endphp

    @foreach($categories as $category)
        @php
            $reviews = $category->products->flatMap->reviews->sortByDesc('position');
        @endphp
        
        @if($reviews->count() > 0)
            @php $hasReviews = true; @endphp
            <div class="mb-8">
                <div class="flex items-center gap-2 mb-4 pb-2 border-b border-gray-200">
                     @if($category->image)
                        <img src="{{ $category->image }}" alt="" class="w-8 h-8 object-cover rounded">
                     @endif
                     <h4 class="text-xl font-bold text-gray-800">{{ $category->name }}</h4>
                     <span class="bg-gray-100 text-gray-600 text-xs px-2 py-1 rounded-full">{{ $reviews->count() }} Testimoni</span>
                </div>
                
                <div class="overflow-x-auto border rounded-lg">
                    <table class="w-full text-sm text-left text-gray-500">
                        <thead class="text-xs text-gray-700 uppercase bg-gray-50 border-b">
                            <tr>
                                <th scope="col" class="px-6 py-3">Member</th>
                                <th scope="col" class="px-6 py-3">Produk</th>
                                <th scope="col" class="px-6 py-3">Rating</th>
                                <th scope="col" class="px-6 py-3">Komentar</th>
                                <th scope="col" class="px-6 py-3 text-center">Aksi</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($reviews as $review)
                            <tr class="bg-white border-b hover:bg-gray-50">
                                <td class="px-6 py-4">
                                    <div class="flex items-center gap-3">
                                        @if($review->profile_photo)
                                            <img src="{{ $review->profile_photo }}" alt="" class="w-8 h-8 rounded-full object-cover">
                                        @else
                                            <div class="w-8 h-8 bg-yellow-100 rounded-full flex items-center justify-center text-yellow-700 font-bold text-xs">
                                                {{ substr($review->user->name ?? '?', 0, 1) }}
                                            </div>
                                        @endif
                                        <span class="font-medium text-gray-900">{{ $review->user->name ?? 'Guest' }}</span>
                                    </div>
                                </td>
                                <td class="px-6 py-4">
                                    @if($review->product)
                                        <a href="{{ route('auction.show', $review->product->id) }}" target="_blank" class="text-blue-600 hover:underline">
                                            {{ Str::limit($review->product->name, 30) }}
                                        </a>
                                    @else
                                        <span class="text-gray-400 italic">Umum</span>
                                    @endif
                                </td>
                                <td class="px-6 py-4">
                                    <div class="flex text-yellow-400 text-xs">
                                        @for($i=1; $i<=5; $i++)
                                            <i class="fas fa-star {{ $i <= $review->rating ? '' : 'text-gray-300' }}"></i>
                                        @endfor
                                    </div>
                                </td>
                                <td class="px-6 py-4">
                                    <p class="truncate max-w-xs" title="{{ $review->comment }}">{{ $review->comment }}</p>
                                </td>
                                <td class="px-6 py-4 text-center">
                                    <div class="flex justify-center gap-2">
                                        <form action="{{ route('admin.reviews.moveUp', $review->id) }}" method="POST" class="inline">
                                            @csrf
                                            <button type="submit" class="text-gray-500 hover:text-gray-800" title="Naikkan Posisi">
                                                <i class="fas fa-arrow-up"></i>
                                            </button>
                                        </form>
                                        <form action="{{ route('admin.reviews.moveDown', $review->id) }}" method="POST" class="inline">
                                            @csrf
                                            <button type="submit" class="text-gray-500 hover:text-gray-800" title="Turunkan Posisi">
                                                <i class="fas fa-arrow-down"></i>
                                            </button>
                                        </form>
                                        <a href="{{ route('admin.reviews.edit', $review->id) }}" class="text-blue-600 hover:text-blue-900 ml-2" title="Edit">
                                            <i class="fas fa-edit"></i>
                                        </a>
                                        <form action="{{ route('admin.reviews.destroy', $review->id) }}" method="POST" onsubmit="return confirm('Yakin ingin menghapus testimoni ini?');" class="inline">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="text-red-600 hover:text-red-900" title="Hapus">
                                                <i class="fas fa-trash"></i>
                                            </button>
                                        </form>
                                    </div>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        @endif
    @endforeach

    {{-- General Reviews --}}
    @if($generalReviews->count() > 0)
        @php $hasReviews = true; @endphp
        <div class="mb-8">
            <div class="flex items-center gap-2 mb-4 pb-2 border-b border-gray-200">
                 <h4 class="text-xl font-bold text-gray-800">Umum / Tanpa Produk</h4>
                 <span class="bg-gray-100 text-gray-600 text-xs px-2 py-1 rounded-full">{{ $generalReviews->count() }} Testimoni</span>
            </div>
            <div class="overflow-x-auto border rounded-lg">
                <table class="w-full text-sm text-left text-gray-500">
                    <thead class="text-xs text-gray-700 uppercase bg-gray-50 border-b">
                        <tr>
                            <th scope="col" class="px-6 py-3">Member</th>
                            <th scope="col" class="px-6 py-3">Produk</th>
                            <th scope="col" class="px-6 py-3">Rating</th>
                            <th scope="col" class="px-6 py-3">Komentar</th>
                            <th scope="col" class="px-6 py-3 text-center">Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($generalReviews as $review)
                        <tr class="bg-white border-b hover:bg-gray-50">
                            <td class="px-6 py-4">
                                <div class="flex items-center gap-3">
                                    @if($review->profile_photo)
                                        <img src="{{ $review->profile_photo }}" alt="" class="w-8 h-8 rounded-full object-cover">
                                    @else
                                        <div class="w-8 h-8 bg-yellow-100 rounded-full flex items-center justify-center text-yellow-700 font-bold text-xs">
                                            {{ substr($review->user->name ?? '?', 0, 1) }}
                                        </div>
                                    @endif
                                    <span class="font-medium text-gray-900">{{ $review->user->name ?? 'Guest' }}</span>
                                </div>
                            </td>
                            <td class="px-6 py-4">
                                <span class="text-gray-400 italic">Umum</span>
                            </td>
                            <td class="px-6 py-4">
                                <div class="flex text-yellow-400 text-xs">
                                    @for($i=1; $i<=5; $i++)
                                        <i class="fas fa-star {{ $i <= $review->rating ? '' : 'text-gray-300' }}"></i>
                                    @endfor
                                </div>
                            </td>
                            <td class="px-6 py-4">
                                <p class="truncate max-w-xs" title="{{ $review->comment }}">{{ $review->comment }}</p>
                            </td>
                            <td class="px-6 py-4 text-center">
                                <div class="flex justify-center gap-2">
                                    <form action="{{ route('admin.reviews.moveUp', $review->id) }}" method="POST" class="inline">
                                        @csrf
                                        <button type="submit" class="text-gray-500 hover:text-gray-800" title="Naikkan Posisi">
                                            <i class="fas fa-arrow-up"></i>
                                        </button>
                                    </form>
                                    <form action="{{ route('admin.reviews.moveDown', $review->id) }}" method="POST" class="inline">
                                        @csrf
                                        <button type="submit" class="text-gray-500 hover:text-gray-800" title="Turunkan Posisi">
                                            <i class="fas fa-arrow-down"></i>
                                        </button>
                                    </form>
                                    <a href="{{ route('admin.reviews.edit', $review->id) }}" class="text-blue-600 hover:text-blue-900 ml-2" title="Edit">
                                        <i class="fas fa-edit"></i>
                                    </a>
                                    <form action="{{ route('admin.reviews.destroy', $review->id) }}" method="POST" onsubmit="return confirm('Yakin ingin menghapus testimoni ini?');" class="inline">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="text-red-600 hover:text-red-900" title="Hapus">
                                            <i class="fas fa-trash"></i>
                                        </button>
                                    </form>
                                </div>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    @endif
    
    @if(!$hasReviews)
        <div class="flex flex-col items-center justify-center py-12 text-gray-500">
            <i class="fas fa-comment-slash text-4xl text-gray-300 mb-3"></i>
            <p>Belum ada testimoni.</p>
        </div>
    @endif
</div>
@endsection