@extends('layouts.master')

@section('title', 'Log Notifikasi WhatsApp')
@section('page-title', 'Log Notifikasi WhatsApp')

@section('content')
    <div class="d-flex justify-content-between align-items-center mb-3">
        <div>
            <h4 class="mb-1">Log Notifikasi WhatsApp</h4>
            <small class="text-muted">Riwayat semua pesan WA yang dikirim aplikasi (termasuk salinan CC).</small>
        </div>
        <div>
            <a href="{{ route('whatsapp.setting') }}" class="btn btn-outline-secondary">
                <i class="bx bx-cog"></i> Pengaturan & Tes
            </a>
        </div>
    </div>

    <form class="row g-2 mb-3" method="get">
        <div class="col-md-3">
            <label class="form-label mb-0">Tag</label>
            <select name="tag" class="form-select">
                <option value="">Semua</option>
                @foreach ($tagOptions as $k => $v)
                    <option value="{{ $k }}" @selected($tag === $k)>{{ $v }}</option>
                @endforeach
            </select>
        </div>
        <div class="col-md-3">
            <label class="form-label mb-0">Status</label>
            <select name="status" class="form-select">
                <option value="">Semua</option>
                @foreach (['success', 'http_error', 'exception'] as $st)
                    <option value="{{ $st }}" @selected($status === $st)>{{ $st }}</option>
                @endforeach
            </select>
        </div>
        <div class="col-md-3">
            <label class="form-label mb-0">Target</label>
            <input type="text" name="target" value="{{ $target }}" class="form-control"
                placeholder="Cari nomor (62...)">
        </div>
        <div class="col-md-3 d-flex align-items-end">
            <button class="btn btn-outline-primary me-2">
                <i class="bx bx-filter-alt"></i> Filter
            </button>
            <a href="{{ route('whatsapp.logs.index') }}" class="btn btn-outline-secondary">
                Reset
            </a>
        </div>
    </form>

    <div class="card">
        <div class="card-body table-responsive">
            <table class="table table-sm align-middle">
               <thead>
    <tr>
        <th>Waktu</th>
        <th>Context</th>
        <th>Tag</th>
        <th>Target</th>
        <th>Status</th>
        <th>HTTP</th>
        <th>Pesan</th>
        <th>Aksi</th>
    </tr>
</thead>
               <tbody>
    @forelse ($logs as $log)
        @php
            $canResend = $log->direction === 'outbound' && $log->target && $log->message;
        @endphp
        <tr>
            <td>{{ $log->created_at?->format('d-m-Y H:i') }}</td>
            <td>{{ $log->context }}</td>
            <td>{{ $log->tag }}</td>
            <td>
                {{ $log->target }}<br>
                <small class="text-muted">{{ $log->raw_target }}</small>
            </td>
            <td>{{ $log->status }}</td>
            <td>{{ $log->http_code }}</td>
            <td style="max-width: 420px;">
                <details>
                    <summary class="text-muted" style="cursor: pointer;">Lihat pesan</summary>
                    <pre class="mb-0" style="white-space: pre-wrap;">{{ $log->message }}</pre>
                </details>
            </td>
            <td class="text-nowrap">
                @if ($canResend)
                    <form action="{{ route('whatsapp.log.resend', $log->id) }}"
                          method="post"
                          class="d-inline"
                          onsubmit="return confirm('Kirim ulang pesan ini ke {{ $log->target }}?');">
                        @csrf
                        <button type="submit" class="btn btn-sm btn-outline-primary">
                            <i class="bx bx-refresh"></i> Kirim Ulang
                        </button>
                    </form>
                @else
                    <span class="text-muted small">-</span>
                @endif
            </td>
        </tr>
    @empty
        <tr>
            <td colspan="8" class="text-center text-muted">
                Belum ada log WhatsApp.
            </td>
        </tr>
    @endforelse
</tbody>
            </table>

            {{ $logs->withQueryString()->links() }}
        </div>
    </div>
@endsection

@section('scripts')
    
@endsection