@extends('admin.layout')
@section('title', 'Batch Logs — Bulk Thumbnail')

@section('content')
<div class="toolbar">
    <h2 style="font-size:18px; color:#fff;">📋 Batch Logs</h2>
    <a href="{{ route('admin.bulk-thumbnails.index') }}" class="btn btn-secondary">← Back</a>
</div>

{{-- Batch Info --}}
<div class="card" style="margin-bottom:20px;">
    <div style="display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px;">
        <div>
            <span style="font-size:11px; color:#666;">Batch ID</span>
            <div style="font-size:12px; color:#6fafdf; font-family:monospace;">{{ $batch->batch_id }}</div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Status</span>
            <div>
                <span class="badge {{ $batch->status === 'completed' ? 'badge-ready' : ($batch->status === 'cancelled' ? 'badge-disabled' : 'badge-encoding') }}">
                    {{ $batch->status }}
                </span>
            </div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Mode</span>
            <div style="color:#fff;">{{ $batch->mode }}</div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Total</span>
            <div style="color:#fff; font-size:16px; font-weight:700;">{{ $batch->total_videos }}</div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Success</span>
            <div style="color:#6fbf6f; font-size:16px; font-weight:700;">{{ $batch->success_count }}</div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Failed</span>
            <div style="color:#bf6f6f; font-size:16px; font-weight:700;">{{ $batch->failed_count }}</div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Started</span>
            <div style="font-size:12px; color:#888;">{{ $batch->started_at?->format('Y-m-d H:i:s') ?? '—' }}</div>
        </div>
        <div>
            <span style="font-size:11px; color:#666;">Finished</span>
            <div style="font-size:12px; color:#888;">{{ $batch->finished_at?->format('Y-m-d H:i:s') ?? '—' }}</div>
        </div>
    </div>
</div>

{{-- Log Table --}}
<table>
    <thead>
        <tr>
            <th>#</th>
            <th>Video</th>
            <th>Status</th>
            <th>Thumbnail</th>
            <th>Error</th>
            <th>Duration</th>
            <th>Time</th>
        </tr>
    </thead>
    <tbody>
        @forelse($logs as $log)
        <tr>
            <td style="font-size:12px; color:#555;">{{ $log->id }}</td>
            <td>
                <span style="color:#6fafdf;">{{ Str::limit($log->video_title, 50) }}</span>
                <div style="font-size:11px; color:#555;">ID: {{ $log->video_id }}</div>
            </td>
            <td>
                @switch($log->status)
                    @case('success')
                        <span class="badge badge-ready">✅ success</span>
                        @break
                    @case('failed')
                        <span class="badge badge-failed">❌ failed</span>
                        @break
                    @case('skipped')
                        <span class="badge badge-disabled">⏭ skipped</span>
                        @break
                    @case('processing')
                        <span class="badge badge-encoding">⚙️ processing</span>
                        @break
                    @default
                        <span class="badge" style="background:#222; color:#555;">pending</span>
                @endswitch
            </td>
            <td>
                @if($log->thumbnail_path)
                    <code style="font-size:11px; color:#6fbf6f;">{{ Str::limit($log->thumbnail_path, 30) }}</code>
                @else
                    <span class="text-muted">—</span>
                @endif
            </td>
            <td>
                @if($log->error_message)
                    <span class="text-error" title="{{ $log->error_message }}">{{ Str::limit($log->error_message, 50) }}</span>
                @else
                    <span class="text-muted">—</span>
                @endif
            </td>
            <td style="font-size:12px; color:#888;">
                @if($log->duration_ms)
                    {{ number_format($log->duration_ms) }}ms
                @else
                    —
                @endif
            </td>
            <td style="font-size:12px; color:#555;">
                {{ $log->updated_at->format('H:i:s') }}
            </td>
        </tr>
        @empty
        <tr>
            <td colspan="7" style="text-align:center; color:#555; padding:24px;">Belum ada log.</td>
        </tr>
        @endforelse
    </tbody>
</table>

@if($logs->hasPages())
<div class="pagination" style="margin-top:16px;">
    {{ $logs->links('pagination::simple-default') }}
</div>
@endif

<style>
    .card {
        background: #1a1a1a;
        border-radius: 8px;
        padding: 20px;
        border: 1px solid #2a2a2a;
    }
</style>
@endsection