@extends('root')
@section('title', 'Manajemen Intent AI')

@section('content')
<div class="container-fluid">
    @include('components.breadcrumb', [
        'title' => 'Manajemen Intent AI',
        'links' => [
            ['url' => route('client.balasan-otomatis.index'), 'label' => 'Auto Reply'],
            ['url' => route('client.ai-intents.index'), 'label' => 'Intent AI'],
        ],
        'current' => 'Manajemen Intent AI'
    ])
    <div class="d-flex justify-content-between align-items-center mb-4">
        <span></span>
        <a href="{{ route('client.ai-intents.create') }}" class="btn btn-primary shadow-sm">
            <i class="ti ti-plus me-1"></i> Tambah Intent
        </a>
    </div>

    <div class="row row-cards">
                <div class="col-12">
                    <div class="card shadow-sm border-0">
                        <div class="card-header bg-white py-3 border-bottom-0">
                            <div>
                                <h3 class="card-title fw-bold text-dark"><i class="ti ti-target me-2 text-primary"></i>Daftar Intent AI</h3>
                                <p class="text-muted mb-0 small">Intent adalah kategori tujuan/maksud dari pesan pelanggan. AI mendeteksi Intent lalu memicu Automation.</p>
                            </div>
                        </div>

                        <div class="table-responsive">
                            <table class="table table-vcenter card-table table-hover">
                                <thead class="bg-light">
                                    <tr>
                                        <th class="px-4 py-3 text-secondary text-uppercase font-weight-bold" width="20%">Nama Intent</th>
                                        <th class="px-3 py-3 text-secondary text-uppercase font-weight-bold" width="35%">Deskripsi</th>
                                        <th class="px-3 py-3 text-secondary text-uppercase font-weight-bold text-center" width="15%">Data Training</th>
                                        <th class="px-3 py-3 text-secondary text-uppercase font-weight-bold" width="10%">Status</th>
                                        <th class="px-4 py-3 text-secondary text-uppercase font-weight-bold text-end" width="20%">Aksi</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($intents as $intent)
                                        <tr>
                                            <td class="px-4 fw-semibold text-dark">
                                                <span class="badge bg-primary bg-opacity-10 text-primary border border-primary border-opacity-25">{{ $intent->name }}</span>
                                            </td>
                                            <td class="px-3 text-muted small">
                                                {{ Str::limit($intent->description, 80) }}
                                            </td>
                                            <td class="px-3 text-center">
                                                <span class="badge bg-light text-dark border"><i class="ti ti-message-2 me-1"></i>{{ $intent->trainings_count }} frasa</span>
                                            </td>
                                            <td class="px-3">
                                                @if($intent->is_active)
                                                    <span class="status status-success status-indicator-animated"><span class="status-dot"></span> Aktif</span>
                                                @else
                                                    <span class="status status-secondary"><span class="status-dot"></span> Nonaktif</span>
                                                @endif
                                            </td>
                                            <td class="px-4 text-end">
                                                <div class="btn-group">
                                                    <a href="{{ route('client.ai-intents.edit', $intent) }}" class="btn btn-sm btn-white text-primary border shadow-sm" data-bs-toggle="tooltip" title="Edit Intent">
                                                        <i class="ti ti-edit"></i> Edit
                                                    </a>
                                                    <form action="{{ route('client.ai-intents.destroy', $intent) }}" method="POST" class="d-inline" onsubmit="return confirm('Hapus intent secara permanen?');">
                                                        @csrf @method('DELETE')
                                                        <button type="submit" class="btn btn-sm btn-white text-danger border shadow-sm" style="border-top-left-radius: 0; border-bottom-left-radius: 0;" data-bs-toggle="tooltip" title="Hapus">
                                                            <i class="ti ti-trash"></i>
                                                        </button>
                                                    </form>
                                                </div>
                                            </td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="5" class="text-center py-5">
                                                <div class="empty">
                                                    <div class="empty-img text-muted mb-3">
                                                        <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-target-off" width="48" height="48" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                                                            <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                                                            <path d="M11.94 7.94a4 4 0 0 1 4.116 4.123m-.955 3.033a4 4 0 0 1 -5.1 -5.105"></path>
                                                            <path d="M14.99 3.32a9 9 0 0 1 5.69 5.688m-1.392 2.628a9 9 0 0 1 -15.968 3.364m2.625 -1.393a9 9 0 0 1 -2.716 -6.327"></path>
                                                            <path d="M12 12l.01 0"></path>
                                                            <path d="M3 3l18 18"></path>
                                                        </svg>
                                                    </div>
                                                    <p class="empty-title fw-bold text-muted mb-1">Belum ada Intent AI ditemukan</p>
                                                    <p class="empty-subtitle text-muted small">Buat intent baru agar AI dapat mendeteksi maksud pelanggan.</p>
                                                    <div class="empty-action mt-3">
                                                        <a href="{{ route('client.ai-intents.create') }}" class="btn btn-primary shadow-sm">
                                                            <i class="ti ti-plus me-2"></i> Tambah Intent Pertama
                                                        </a>
                                                    </div>
                                                </div>
                                            </td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
    </div>
</div>
@endsection