@extends('layouts.admin')
@section('title', '考題商品管理')
@section('content')
<div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-6">
    <p class="text-gray-500 dark:text-gray-400 text-sm">管理供 App 考生購買下載的 PDF 考題商品</p>
    <a href="{{ route('admin.exam-products.create') }}" class="px-4 py-2 bg-green-600 text-white rounded-lg text-sm hover:bg-green-700 font-medium">+ 新增考題商品</a>
</div>

@if(session('success'))
<div class="mb-4 px-4 py-3 rounded-lg border bg-green-50 dark:bg-green-900/20 border-green-200 dark:border-green-800 text-green-700 dark:text-green-300 text-sm">{{ session('success') }}</div>
@endif

<div class="bg-white dark:bg-slate-900 rounded-xl shadow-lg border border-gray-100 dark:border-slate-800 overflow-hidden">
    <table class="w-full text-sm">
        <thead class="bg-gray-50 dark:bg-slate-800/60 text-gray-500 dark:text-gray-400">
            <tr>
                <th class="text-left px-4 py-3 font-semibold">標題</th>
                <th class="text-left px-4 py-3 font-semibold">科目</th>
                <th class="text-right px-4 py-3 font-semibold">價格</th>
                <th class="text-center px-4 py-3 font-semibold">庫存</th>
                <th class="text-center px-4 py-3 font-semibold">檔案</th>
                <th class="text-center px-4 py-3 font-semibold">狀態</th>
                <th class="text-center px-4 py-3 font-semibold">已購買</th>
                <th class="text-right px-4 py-3 font-semibold">操作</th>
            </tr>
        </thead>
        <tbody class="divide-y divide-gray-100 dark:divide-slate-800">
            @forelse($products as $product)
            <tr class="hover:bg-gray-50 dark:hover:bg-slate-800/40">
                <td class="px-4 py-3">
                    <div class="font-medium text-gray-900 dark:text-white">{{ $product->title }}</div>
                </td>
                <td class="px-4 py-3 text-gray-500 dark:text-gray-400">
                    {{ $product->subjects->pluck('name')->join('、') ?: '—' }}
                </td>
                <td class="px-4 py-3 text-right text-gray-900 dark:text-white">
                    @if($product->isDiscountActive())
                        <span class="line-through text-gray-400 text-xs">{{ number_format($product->price, 0) }}</span>
                        <span class="text-red-600 dark:text-red-400 font-semibold">{{ number_format($product->discount_price, 0) }}</span>
                    @else
                        {{ number_format($product->price, 0) }}
                    @endif
                </td>
                <td class="px-4 py-3 text-center text-gray-500 dark:text-gray-400">
                    {{ $product->stock_quantity !== null ? $product->activatedCount() . ' / ' . $product->stock_quantity : '不限量' }}
                </td>
                <td class="px-4 py-3 text-center">
                    @if($product->files->isNotEmpty())
                        <span class="text-green-600 dark:text-green-400">{{ $product->files->count() }} 個</span>
                    @else
                        <span class="text-red-500">未上傳</span>
                    @endif
                </td>
                <td class="px-4 py-3 text-center">
                    <form action="{{ route('admin.exam-products.toggle-publish', $product) }}" method="POST" class="inline">
                        @csrf
                        <button type="submit" class="px-2.5 py-1 rounded-full text-xs font-medium {{ $product->is_published ? 'bg-green-100 text-green-700 dark:bg-green-900/30 dark:text-green-300' : 'bg-gray-100 text-gray-600 dark:bg-slate-800 dark:text-gray-400' }}">
                            {{ $product->is_published ? '已上架' : '未上架' }}
                        </button>
                    </form>
                </td>
                <td class="px-4 py-3 text-center">
                    <a href="{{ route('admin.exam-products.purchases', $product) }}" class="text-blue-600 dark:text-blue-400 hover:underline">{{ $product->paid_purchases_count }} 人</a>
                </td>
                <td class="px-4 py-3 text-right space-x-2">
                    <a href="{{ route('admin.exam-products.subjects.index', $product) }}" class="text-purple-600 dark:text-purple-400 hover:underline">科目</a>
                    <a href="{{ route('admin.exam-products.codes.index', $product) }}" class="text-indigo-600 dark:text-indigo-400 hover:underline">序號</a>
                    <a href="{{ route('admin.exam-products.edit', $product) }}" class="text-blue-600 dark:text-blue-400 hover:underline">編輯</a>
                    <form action="{{ route('admin.exam-products.destroy', $product) }}" method="POST" class="inline" onsubmit="return confirm('確定刪除此考題商品？')">
                        @csrf @method('DELETE')
                        <button type="submit" class="text-red-600 dark:text-red-400 hover:underline">刪除</button>
                    </form>
                </td>
            </tr>
            @empty
            <tr><td colspan="8" class="px-4 py-10 text-center text-gray-400">尚未建立任何考題商品</td></tr>
            @endforelse
        </tbody>
    </table>
</div>

<div class="mt-4">{{ $products->links() }}</div>
@endsection