@extends('layouts.app')

@section('content')
    <div class="page-wrapper">
        <div class="page-header d-print-none">
            <div class="container-xl">
                <div class="row g-2 align-items-center">
                    <div class="col">
                        <div class="page-pretitle">Claims</div>
                        <h2 class="page-title">Detail Klaim Hak Cipta</h2>
                    </div>
                    <div class="col-auto ms-auto">
                        <div class="btn-list">
                            <a href="{{ route('claims.index') }}" class="btn btn-outline-primary d-none d-sm-inline-block">
                                <i class="ti ti-arrow-left me-2"></i>Kembali
                            </a>

                            {{-- <a href="{{ route('claims.print', $claim) }}" class="btn btn-danger" target="_blank">
                                <i class="fas fa-print"></i> Cetak
                            </a> --}}
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="page-body">
            <div class="container-xl">
                <div class="row row-cards">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header">
                                <h3 class="card-title">
                                    Klaim #{{ Str::limit($claim->id, 8, '') }}
                                </h3>
                            </div>
                            <div class="card-body">
                                <div class="row"> {{-- Added a row to contain the two main columns --}}
                                    <div class="col-md-9"> {{-- Column for general claim details --}}
                                        <div class="datagrid">
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">ID Klaim</div>
                                                <div class="datagrid-content">{{ Str::limit($claim->id, 8, '') }}</div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Status</div>
                                                <div class="datagrid-content">
                                                    @if ($claim->status == 'pending')
                                                        <span class="badge bg-yellow">Dalam Antrian</span>
                                                    @elseif ($claim->status == 'processing')
                                                        <span class="badge bg-green">Sedang Diproses</span>
                                                    @elseif ($claim->status == 'reviewing')
                                                        <span class="badge bg-blue">Sedang Direview</span>
                                                    @elseif ($claim->status == 'success')
                                                        <span class="badge bg-green">Sukses</span>
                                                    @elseif ($claim->status == 'rejected')
                                                        <span class="badge bg-red">Ditolak</span>
                                                    @elseif ($claim->status == 'conflict')
                                                        <span class="badge bg-red">Konflik</span>
                                                    @elseif ($claim->status == 'unclaim')
                                                        <span class="badge bg-red">Unclaim</span>
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Tanggal Pengajuan</div>
                                                <div class="datagrid-content">{{ $claim->created_at->format('d M Y, H:i') }}
                                                </div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Terakhir Diperbarui</div>
                                                <div class="datagrid-content">
                                                    {{ $claim->updated_at->format('d M Y, H:i') }}
                                                </div>
                                            </div>

                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Diajukan Oleh</div>
                                                <div class="datagrid-content">{{ $claim->user->name ?? 'N/A' }}</div>
                                            </div>

                                            {{-- Informasi Artist Claims --}}
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Artis Yang Di Claims</div>
                                                <div class="datagrid-content">{{ $claim->artist_claims ?? 'N/A' }}</div>
                                            </div>

                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Informasi Lagu</div>
                                                <div class="datagrid-content"></div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Judul Lagu</div>
                                                <div class="datagrid-content">{{ $claim->song->title ?? 'N/A' }}</div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Album</div>
                                                <div class="datagrid-content">{{ $claim->song->album->title ?? 'N/A' }}
                                                </div>
                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Tahun Rilis Lagu</div>
                                                <div class="datagrid-content">{{ $claim->song->updated_at ?? 'N/A' }}</div>

                                            </div>
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Link Lagu Yang Diajukan</div>
                                                <div class="datagrid-content">
                                                    @if ($claim->youtube_url)
                                                        <a href="{{ $claim->youtube_url }}"
                                                            target="_blank">{{ Str::limit($claim->youtube_url, 60, '...') }}</a>
                                                    @else
                                                        N/A
                                                    @endif
                                                </div>
                                            </div>

                                            {{-- Informasi ISRC Code --}}
                                            <div class="datagrid-item">
                                                <div class="datagrid-title">Kode ISRC</div>
                                                <div class="datagrid-content">{{ $claim->isrc_code ?? 'N/A' }}</div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-md-3"> {{-- Column for Lyrics --}}
                                        <div class="datagrid">
                                            <div class="datagrid-item"> {{-- No col-x needed here as it's already in a col-3 parent --}}
                                                <div class="datagrid-title">Lirik Lagu</div>
                                                <div class="datagrid-content">
                                                    @if ($claim->lyrics)
                                                        <pre>{{ $claim->lyrics }}</pre>
                                                    @else
                                                        N/A
                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div> {{-- End of row for main content and lyrics --}}

                                @if ($claim->status == 'success')
                                    <div class="alert alert-success mt-4">
                                        <div class="d-flex">
                                            <div>
                                                <i class="ti ti-check me-2"></i>
                                            </div>
                                            <div>
                                                <h4>Klaim Disetujui</h4>
                                                <div class="text-muted">Klaim hak cipta Anda telah disetujui pada
                                                    {{ $claim->updated_at->format('d M Y, H:i') }}. Anda sekarang terdaftar
                                                    sebagai pemilik hak cipta untuk lagu ini di platform kami.</div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="mt-4">
                                        <button class="btn btn-danger"
                                            onclick="confirmUnclaim('{{ $claim->song->title ?? 'N/A' }}', '{{ $claim->id }}')">
                                            <i class="ti ti-x me-2"></i>Batalkan Klaim (Unclaim)
                                        </button>
                                    </div>
                                @elseif ($claim->status == 'rejected')
                                    <div class="alert alert-danger mt-4">
                                        <div class="d-flex">
                                            <div>
                                                <i class="ti ti-alert-triangle me-2"></i>
                                            </div>
                                            <div>
                                                <h4>Klaim Ditolak</h4>
                                                <div class="text-muted">Klaim hak cipta Anda ditolak pada
                                                    {{ $claim->updated_at->format('d M Y, H:i') }}. Silakan periksa alasan
                                                    penolakan di bawah ini.</div>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="mt-3">
                                        <label class="form-label">Alasan Penolakan</label>
                                        <div class="form-control-plaintext text-danger">
                                            {{ $claim->rejection_reason ?? 'Tidak ada alasan penolakan yang diberikan.' }}
                                        </div>
                                    </div>

                                    <div class="mt-4">
                                        <a href="{{ route('claims.create') }}" class="btn btn-primary">
                                            <i class="ti ti-plus me-2"></i>Ajukan Klaim Baru
                                        </a>
                                    </div>
                                @else
                                    <div class="alert alert-info mt-4">
                                        <div class="d-flex">
                                            <div>
                                                <i class="ti ti-hourglass me-2"></i>
                                            </div>
                                            <div>
                                                <h4>Klaim Sedang Diproses</h4>
                                                <div class="text-muted">Klaim hak cipta Anda sedang dalam proses
                                                    peninjauan. Proses ini biasanya membutuhkan waktu 3-5 hari kerja.</div>
                                            </div>
                                        </div>
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>

                    <div class="col-12 mt-3">
                        <div class="card">
                            <div class="card-header">
                                <h3 class="card-title">Riwayat Aktivitas</h3>
                            </div>
                            <div class="card-body">
                                <ul class="timeline">
                                    <li class="timeline-event">
                                        <div class="timeline-event-icon bg-primary-lt">
                                            <i class="ti ti-file-plus"></i>
                                        </div>
                                        <div class="timeline-event-card">
                                            <div class="timeline-event-date">{{ $claim->created_at->format('d M Y') }}
                                            </div>
                                            <h4 class="timeline-event-title">Klaim Diajukan</h4>
                                            <p class="text-muted">{{ $claim->user->name ?? 'Pengguna tidak dikenal' }}
                                                mengajukan klaim hak cipta
                                                untuk lagu "{{ $claim->song->title ?? 'N/A' }}".</p>
                                        </div>
                                    </li>

                                    @if ($claim->status != 'pending' && $claim->status != 'processing' && $claim->status != 'reviewing')
                                        <li class="timeline-event">
                                            <div
                                                class="timeline-event-icon {{ $claim->status == 'success' ? 'bg-green-lt' : 'bg-red-lt' }}">
                                                <i class="ti ti-{{ $claim->status == 'success' ? 'check' : 'x' }}"></i>
                                            </div>
                                            <div class="timeline-event-card">
                                                <div class="timeline-event-date">{{ $claim->updated_at->format('d M Y') }}
                                                </div>
                                                <h4 class="timeline-event-title">
                                                    Status Klaim
                                                    {{ $claim->status == 'success' ? 'Disetujui' : ($claim->status == 'failed' ? 'Ditolak' : 'Unclaimed') }}
                                                </h4>
                                                <p class="text-muted">
                                                    @if ($claim->status == 'success')
                                                        Admin menyetujui klaim hak cipta Anda. Anda sekarang terdaftar
                                                        sebagai pemilik hak cipta untuk lagu ini.
                                                    @elseif ($claim->status == 'rejected')
                                                        Admin menolak klaim hak cipta Anda karena
                                                        {{ $claim->rejection_reason ?? 'alasan tidak ditentukan' }}.
                                                    @elseif ($claim->status == 'conflict')
                                                        Klaim ini mengalami konflik. Silakan hubungi admin untuk informasi
                                                        lebih lanjut.
                                                    @elseif ($claim->status == 'unclaim')
                                                        Anda Berhasil Unclaimed lagu anda. Anda mensetujui berbagi royalti /
                                                        membagikan royalti penuh ke talent.
                                                    @endif
                                                </p>
                                            </div>
                                        </li>
                                    @endif

                                    @if ($claim->status == 'success')
                                        <li class="timeline-event">
                                            <div class="timeline-event-icon bg-blue-lt">
                                                <i class="ti ti-certificate"></i>
                                            </div>
                                            <div class="timeline-event-card">
                                                <div class="timeline-event-date">
                                                    {{ $claim->updated_at->addDays(1)->format('d M Y') }}</div>
                                                <h4 class="timeline-event-title">Sertifikat Diterbitkan</h4>
                                                <p class="text-muted">Sertifikat kepemilikan hak cipta digital telah
                                                    diterbitkan untuk lagu "{{ $claim->song->title ?? 'N/A' }}".</p>
                                                <div class="mt-2">
                                                    @if ($claim->certificate_url)
                                                        <a href="{{ $claim->certificate_url }}"
                                                            class="btn btn-sm btn-outline-primary" target="_blank">
                                                            <i class="ti ti-download me-1"></i>
                                                            Unduh Sertifikat
                                                        </a>
                                                    @else
                                                        Sertifikat belum tersedia.
                                                    @endif
                                                </div>
                                            </div>
                                        </li>
                                    @endif
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        function confirmUnclaim(songTitle, claimId) {
            Swal.fire({
                title: 'Konfirmasi Unclaim',
                html: `<div class="text-center mb-3">
                    <i class="ti ti-alert-triangle text-danger" style="font-size: 3rem;"></i>
                </div>
                <p>Anda yakin ingin membatalkan klaim hak cipta untuk lagu <strong>${songTitle}</strong>?</p>
                <p class="text-danger">Tindakan ini tidak dapat dibatalkan dan Anda harus mengajukan klaim baru jika diperlukan di masa mendatang.</p>`,
                icon: false,
                showCancelButton: true,
                confirmButtonColor: '#d33',
                cancelButtonColor: '#6c757d',
                confirmButtonText: '<i class="ti ti-x me-2"></i>Ya, Batalkan Klaim',
                cancelButtonText: 'Batal',
                customClass: {
                    confirmButton: 'btn btn-danger me-2',
                    cancelButton: 'btn btn-secondary ms-2'
                },
                buttonsStyling: false
            }).then((result) => {
                if (result.isConfirmed) {

                    let csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');


                    if (!csrfToken) {
                        csrfToken = '{{ csrf_token() }}';
                    }

                    fetch(`/claims/${claimId}/unclaim`, {
                            method: 'POST',
                            headers: {
                                'Content-Type': 'application/json',
                                'X-CSRF-TOKEN': csrfToken
                            },
                            body: JSON.stringify({})
                        })
                        .then(response => {

                            if (!response.ok) {
                                return response.json().then(errorData => {

                                    throw new Error(errorData.message ||
                                        `HTTP error! status: ${response.status}`);
                                }).catch(() => {

                                    throw new Error(`HTTP error! status: ${response.status}`);
                                });
                            }
                            return response.json();
                        })
                        .then(data => {
                            if (data.success) {
                                Swal.fire({
                                    title: 'Berhasil!',
                                    text: data.message ||
                                        `Klaim untuk lagu "${songTitle}" telah dibatalkan.`,
                                    icon: 'success',
                                    confirmButtonText: 'OK',
                                    confirmButtonColor: '#206bc4',
                                    customClass: {
                                        confirmButton: 'btn btn-primary'
                                    },
                                    buttonsStyling: false
                                }).then(() => {
                                    window.location.reload();
                                });
                            } else {

                                Swal.fire({
                                    title: 'Gagal!',
                                    text: data.message || 'Terjadi kesalahan saat membatalkan klaim.',
                                    icon: 'error',
                                    confirmButtonText: 'OK',
                                    confirmButtonColor: '#206bc4',
                                    customClass: {
                                        confirmButton: 'btn btn-primary'
                                    },
                                    buttonsStyling: false
                                });
                            }
                        })
                        .catch(error => {
                            console.error('Error:', error);
                            Swal.fire({
                                title: 'Error!',
                                text: error.message ||
                                    'Tidak dapat terhubung ke server. Silakan coba lagi.',
                                icon: 'error',
                                confirmButtonText: 'OK',
                                confirmButtonColor: '#206bc4',
                                customClass: {
                                    confirmButton: 'btn btn-primary'
                                },
                                buttonsStyling: false
                            });
                        });
                }
            });
        }
    </script>
@endsection