@extends('admin.layout')

@section('title', 'Detail Invoice #' . $invoice->invoice_number)

@section('content')
<div class="container-fluid">
    <!-- Header -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h1 class="h3 mb-0 text-gray-800">Detail Invoice #{{ $invoice->invoice_number }}</h1>
            <p class="mb-0 text-muted">Informasi lengkap invoice dan booking terkait</p>
        </div>
        <div>
            <a href="{{ route('admin.invoices.index') }}" class="btn btn-secondary">
                <i class="fas fa-arrow-left"></i> Kembali
            </a>
            <a href="{{ route('admin.invoices.edit', $invoice) }}" class="btn btn-warning">
                <i class="fas fa-edit"></i> Edit
            </a>
            <a href="{{ route('admin.invoices.download', $invoice) }}" class="btn btn-success">
                <i class="fas fa-download"></i> Download PDF
            </a>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-8">
            <!-- Invoice Details -->
            <div class="card shadow mb-4">
                <div class="card-header py-3 d-flex justify-content-between align-items-center">
                    <h6 class="m-0 font-weight-bold text-primary">Informasi Invoice</h6>
                    <div>
                        @php
                            $statusColors = [
                                'draft' => 'secondary',
                                'sent' => 'info',
                                'paid' => 'success',
                                'overdue' => 'danger',
                                'cancelled' => 'dark'
                            ];
                            $statusLabels = [
                                'draft' => 'Draft',
                                'sent' => 'Terkirim',
                                'paid' => 'Dibayar',
                                'overdue' => 'Terlambat',
                                'cancelled' => 'Dibatalkan'
                            ];
                        @endphp
                        <span class="badge badge-{{ $statusColors[$invoice->status] ?? 'secondary' }} badge-lg">
                            {{ $statusLabels[$invoice->status] ?? ucfirst($invoice->status) }}
                        </span>
                    </div>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>No. Invoice:</strong></td>
                                    <td>{{ $invoice->invoice_number }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Tanggal Invoice:</strong></td>
                                    <td>{{ $invoice->created_at->format('d F Y') }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Tanggal Jatuh Tempo:</strong></td>
                                    <td>
                                        @if($invoice->due_date)
                                            {{ \Carbon\Carbon::parse($invoice->due_date)->format('d F Y') }}
                                            @if($invoice->status !== 'paid' && \Carbon\Carbon::parse($invoice->due_date)->isPast())
                                                <span class="badge badge-danger ml-2">Terlambat</span>
                                            @endif
                                        @else
                                            <span class="text-muted">Tidak ditentukan</span>
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <td><strong>Status:</strong></td>
                                    <td>
                                        <select class="form-control form-control-sm status-select" 
                                                data-invoice-id="{{ $invoice->id }}" 
                                                data-current-status="{{ $invoice->status }}" 
                                                style="width: auto; display: inline-block;">
                                            <option value="draft" {{ $invoice->status == 'draft' ? 'selected' : '' }}>Draft</option>
                                            <option value="sent" {{ $invoice->status == 'sent' ? 'selected' : '' }}>Terkirim</option>
                                            <option value="paid" {{ $invoice->status == 'paid' ? 'selected' : '' }}>Dibayar</option>
                                            <option value="overdue" {{ $invoice->status == 'overdue' ? 'selected' : '' }}>Terlambat</option>
                                            <option value="cancelled" {{ $invoice->status == 'cancelled' ? 'selected' : '' }}>Dibatalkan</option>
                                        </select>
                                    </td>
                                </tr>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>Total Amount:</strong></td>
                                    <td class="text-success font-weight-bold">
                                        Rp {{ number_format($invoice->total_amount, 0, ',', '.') }}
                                    </td>
                                </tr>
                                <tr>
                                    <td><strong>Dibuat:</strong></td>
                                    <td>{{ $invoice->created_at->format('d F Y H:i') }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Terakhir Update:</strong></td>
                                    <td>{{ $invoice->updated_at->format('d F Y H:i') }}</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    
                    @if($invoice->notes)
                        <div class="mt-3">
                            <strong>Catatan:</strong>
                            <div class="bg-light p-3 rounded mt-2">
                                {{ $invoice->notes }}
                            </div>
                        </div>
                    @endif
                </div>
            </div>

            <!-- Booking Information -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">Informasi Booking</h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>Booking Code:</strong></td>
                                    <td>
                                        <span class="badge badge-info">{{ $invoice->booking->booking_code }}</span>
                                        <a href="{{ route('admin.bookings') }}" 
                                           class="btn btn-sm btn-outline-primary ml-2">
                                            <i class="fas fa-external-link-alt"></i> Lihat Semua Booking
                                        </a>
                                    </td>
                                </tr>
                                <tr>
                                    <td><strong>Nama Tamu:</strong></td>
                                    <td>{{ $invoice->booking->guest_name }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Email:</strong></td>
                                    <td>{{ $invoice->booking->guest_email }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Telepon:</strong></td>
                                    <td>{{ $invoice->booking->guest_phone }}</td>
                                </tr>
                            </table>
                        </div>
                        <div class="col-md-6">
                            <table class="table table-borderless">
                                <tr>
                                    <td><strong>Hotel:</strong></td>
                                    <td>{{ $invoice->booking->room->hotel->name ?? 'N/A' }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Kamar:</strong></td>
                                    <td>{{ $invoice->booking->room->name }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Check-in:</strong></td>
                                    <td>{{ \Carbon\Carbon::parse($invoice->booking->check_in_date)->format('d F Y') }}</td>
                                </tr>
                                <tr>
                                    <td><strong>Check-out:</strong></td>
                                    <td>{{ \Carbon\Carbon::parse($invoice->booking->check_out_date)->format('d F Y') }}</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Invoice Items -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">Rincian Tagihan</h6>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-bordered">
                            <thead class="thead-light">
                                <tr>
                                    <th>Deskripsi</th>
                                    <th>Periode</th>
                                    <th class="text-right">Jumlah</th>
                                </tr>
                            </thead>
                            <tbody>
                                <!-- Room Charges -->
                                <tr>
                                    <td>
                                        <strong>{{ $invoice->booking->room->name }}</strong>
                                        <br>
                                        <small class="text-muted">{{ $invoice->booking->room->hotel->name ?? 'N/A' }}</small>
                                    </td>
                                    <td>
                                        {{ \Carbon\Carbon::parse($invoice->booking->check_in_date)->format('d M Y') }} - 
                                        {{ \Carbon\Carbon::parse($invoice->booking->check_out_date)->format('d M Y') }}
                                        <br>
                                        <small class="text-muted">
                                            {{ \Carbon\Carbon::parse($invoice->booking->check_in_date)->diffInDays(\Carbon\Carbon::parse($invoice->booking->check_out_date)) }} malam
                                        </small>
                                    </td>
                                    <td class="text-right">
                                        Rp {{ number_format($invoice->booking->room_total, 0, ',', '.') }}
                                    </td>
                                </tr>
                                
                                <!-- Additional Services -->
                                @if($invoice->booking->roomServices && $invoice->booking->roomServices->count() > 0)
                                    @foreach($invoice->booking->roomServices as $service)
                                        <tr>
                                            <td>
                                                <strong>{{ $service->service_name }}</strong>
                                                <br>
                                                <small class="text-muted">Layanan Tambahan</small>
                                            </td>
                                            <td>
                                                <small class="text-muted">Qty: {{ $service->quantity }}</small>
                                            </td>
                                            <td class="text-right">
                                                Rp {{ number_format($service->total_price, 0, ',', '.') }}
                                            </td>
                                        </tr>
                                    @endforeach
                                @endif
                                
                                <!-- Total -->
                                <tr class="table-active">
                                    <td colspan="2" class="text-right"><strong>Total:</strong></td>
                                    <td class="text-right">
                                        <strong class="text-success">
                                            Rp {{ number_format($invoice->total_amount, 0, ',', '.') }}
                                        </strong>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-lg-4">
            <!-- Quick Actions -->
            <div class="card shadow mb-4">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">Aksi Cepat</h6>
                </div>
                <div class="card-body">
                    <div class="d-grid gap-2">
                        <a href="{{ route('admin.invoices.download', $invoice) }}" 
                           class="btn btn-success btn-block">
                            <i class="fas fa-download"></i> Download PDF
                        </a>
                        
                        <button type="button" class="btn btn-secondary btn-block" 
                                onclick="sendInvoiceEmail({{ $invoice->id }})">
                            <i class="fas fa-envelope"></i> Kirim Invoice via Email
                        </button>
                        
                        @if($invoice->status !== 'paid')
                            <button type="button" class="btn btn-info btn-block" 
                                    onclick="markAsPaid({{ $invoice->id }})">
                                <i class="fas fa-check"></i> Tandai Sudah Dibayar
                            </button>
                        @endif
                        
                        @if($invoice->status === 'draft')
                            <button type="button" class="btn btn-primary btn-block" 
                                    onclick="markAsSent({{ $invoice->id }})">
                                <i class="fas fa-paper-plane"></i> Tandai Terkirim
                            </button>
                        @endif
                        
                        <a href="{{ route('admin.invoices.edit', $invoice) }}" 
                           class="btn btn-warning btn-block">
                            <i class="fas fa-edit"></i> Edit Invoice
                        </a>
                        
                        <button type="button" class="btn btn-danger btn-block" 
                                onclick="deleteInvoice({{ $invoice->id }}, '{{ $invoice->invoice_number }}')">
                            <i class="fas fa-trash"></i> Hapus Invoice
                        </button>
                    </div>
                </div>
            </div>

            <!-- Invoice Statistics -->
            <div class="card shadow">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">Statistik</h6>
                </div>
                <div class="card-body">
                    <div class="text-center">
                        <div class="mb-3">
                            <h4 class="text-success">Rp {{ number_format($invoice->total_amount, 0, ',', '.') }}</h4>
                            <small class="text-muted">Total Invoice</small>
                        </div>
                        
                        @if($invoice->due_date)
                            <div class="mb-3">
                                @php
                                    $daysUntilDue = \Carbon\Carbon::now()->diffInDays(\Carbon\Carbon::parse($invoice->due_date), false);
                                @endphp
                                
                                @if($invoice->status === 'paid')
                                    <span class="badge badge-success">Sudah Dibayar</span>
                                @elseif($daysUntilDue < 0)
                                    <span class="badge badge-danger">Terlambat {{ abs($daysUntilDue) }} hari</span>
                                @elseif($daysUntilDue == 0)
                                    <span class="badge badge-warning">Jatuh tempo hari ini</span>
                                @else
                                    <span class="badge badge-info">{{ $daysUntilDue }} hari lagi</span>
                                @endif
                            </div>
                        @endif
                        
                        <div class="small text-muted">
                            <div>Dibuat: {{ $invoice->created_at->format('d M Y') }}</div>
                            <div>Update: {{ $invoice->updated_at->format('d M Y') }}</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Delete Confirmation Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Konfirmasi Hapus</h5>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <p>Apakah Anda yakin ingin menghapus invoice <strong id="invoice-number-text"></strong>?</p>
                <p class="text-danger"><small>Tindakan ini tidak dapat dibatalkan.</small></p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Batal</button>
                <form id="delete-form" method="POST" style="display: inline;">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-danger">Hapus</button>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
$(document).ready(function() {
    // Handle status change
    $('.status-select').change(function() {
        const invoiceId = $(this).data('invoice-id');
        const newStatus = $(this).val();
        const currentStatus = $(this).data('current-status');
        const selectElement = $(this);
        
        if (newStatus === currentStatus) {
            return;
        }
        
        updateInvoiceStatus(invoiceId, newStatus, selectElement, currentStatus);
    });
});

function updateInvoiceStatus(invoiceId, newStatus, selectElement, currentStatus) {
    $.ajax({
        url: `/admin/invoices/${invoiceId}/status`,
        method: 'PATCH',
        data: {
            status: newStatus,
            _token: '{{ csrf_token() }}'
        },
        success: function(response) {
            if (response.success) {
                selectElement.data('current-status', newStatus);
                
                Swal.fire({
                    icon: 'success',
                    title: 'Berhasil!',
                    text: response.message,
                    timer: 2000,
                    showConfirmButton: false
                }).then(() => {
                    location.reload();
                });
            } else {
                selectElement.val(currentStatus);
                Swal.fire({
                    icon: 'error',
                    title: 'Gagal!',
                    text: response.message
                });
            }
        },
        error: function(xhr) {
            selectElement.val(currentStatus);
            Swal.fire({
                icon: 'error',
                title: 'Error!',
                text: 'Terjadi kesalahan saat mengupdate status.'
            });
        }
    });
}

function markAsPaid(invoiceId) {
    Swal.fire({
        title: 'Konfirmasi',
        text: 'Tandai invoice ini sebagai sudah dibayar?',
        icon: 'question',
        showCancelButton: true,
        confirmButtonColor: '#28a745',
        cancelButtonColor: '#6c757d',
        confirmButtonText: 'Ya, Sudah Dibayar',
        cancelButtonText: 'Batal'
    }).then((result) => {
        if (result.isConfirmed) {
            updateInvoiceStatus(invoiceId, 'paid', $('.status-select'), $('.status-select').data('current-status'));
        }
    });
}

function markAsSent(invoiceId) {
    Swal.fire({
        title: 'Konfirmasi',
        text: 'Tandai invoice ini sebagai sudah terkirim?',
        icon: 'question',
        showCancelButton: true,
        confirmButtonColor: '#17a2b8',
        cancelButtonColor: '#6c757d',
        confirmButtonText: 'Ya, Sudah Terkirim',
        cancelButtonText: 'Batal'
    }).then((result) => {
        if (result.isConfirmed) {
            updateInvoiceStatus(invoiceId, 'sent', $('.status-select'), $('.status-select').data('current-status'));
        }
    });
}

function sendInvoiceEmail(invoiceId) {
    // Get guest email from the page
    const guestEmail = '{{ $invoice->booking->guest_email }}';
    
    // Confirm sending to guest email
    Swal.fire({
        title: 'Kirim Invoice via Email',
        text: `Kirim invoice ke email tamu: ${guestEmail}?`,
        icon: 'question',
        showCancelButton: true,
        confirmButtonColor: '#007bff',
        cancelButtonColor: '#6c757d',
        confirmButtonText: 'Ya, Kirim Email',
        cancelButtonText: 'Batal'
    }).then((result) => {
        if (result.isConfirmed) {
            // Show loading
            Swal.fire({
                title: 'Mengirim Email...',
                text: 'Mohon tunggu sebentar',
                allowOutsideClick: false,
                didOpen: () => {
                    Swal.showLoading()
                }
            });

            // Send AJAX request
            $.ajax({
                url: `/admin/invoices/${invoiceId}/send-email`,
                method: 'POST',
                data: {
                    email: guestEmail,
                    _token: $('meta[name="csrf-token"]').attr('content')
                },
                success: function(response) {
                    Swal.fire({
                        title: 'Berhasil!',
                        text: `Invoice berhasil dikirim ke ${guestEmail}`,
                        icon: 'success',
                        confirmButtonColor: '#28a745'
                    });
                },
                error: function(xhr) {
                    let errorMessage = 'Terjadi kesalahan saat mengirim email.';
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMessage = xhr.responseJSON.message;
                    }
                    Swal.fire({
                        title: 'Error!',
                        text: errorMessage,
                        icon: 'error',
                        confirmButtonColor: '#dc3545'
                    });
                }
            });
        }
    });
}

function deleteInvoice(invoiceId, invoiceNumber) {
    $('#invoice-number-text').text(invoiceNumber);
    $('#delete-form').attr('action', `/admin/invoices/${invoiceId}`);
    $('#deleteModal').modal('show');
}
</script>
@endpush