@extends('layouts.admin.master')

@section('title')
    Edit Reservation
@endsection

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col">
                <!-- Page Header -->
                <div class="card dashboard-custom-card mb-3">
                    <div class="card-body">
                        <div class="custom-card-header d-flex justify-content-between align-items-center">
                            <h4 class="mb-0">Edit Reservation</h4>
                            <div>
                                <a href="{{ route('reservation.details', $reservation->id) }}" class="btn btn-sm btn-info">
                                    <i class="fas fa-eye"></i> View Details
                                </a>
                                <a href="{{ route('pending-reservation.index') }}" class="btn btn-sm btn-secondary">
                                    <i class="fas fa-arrow-left"></i> Back to List
                                </a>
                            </div>
                        </div>
                    </div>
                </div>

                <form action="{{ route('reservation.update', $reservation->id) }}" method="POST" id="editReservationForm">
                    @csrf
                    @method('PUT')

                    <!-- General Information -->
                    <div class="card mb-4">
                        <div class="card-header">
                            <h5 class="card-title mb-0 w-100">General Information</h5>
                            <p class="text-muted small mb-0">View the general information of the reservation.</p>
                        </div>
                        <div class="card-body">
                            <table class="table table-sm table-bordered table-striped" style="font-size: 0.875rem;">
                                <tbody>
                                <tr>
                                    <th width="30%">Registration Type</th>
                                    <td>{{ ucfirst($reservation->registration_type) }}</td>
                                </tr>
                                <tr>
                                    <th>Event Name</th>
                                    <td>{{ $reservation->event->name ?? 'N/A' }}</td>
                                </tr>
                                <tr>
                                    <th>Event Date</th>
                                    <td>
                                        @if ($reservation->eventDate)
                                            {{ \Carbon\Carbon::parse($reservation->eventDate->start_date_time)->format('d M Y, h:i A') }}
                                            -
                                            {{ \Carbon\Carbon::parse($reservation->eventDate->end_date_time)->format('d M Y, h:i A') }}
                                        @else
                                            N/A
                                        @endif
                                    </td>
                                </tr>
                                <tr>
                                    <th>User Name</th>
                                    <td>{{ $reservation->user->name ?? 'N/A' }}</td>
                                </tr>
                                <tr>
                                    <th>Payment Status</th>
                                    <td>
                                        @if ($reservation->payment_status === 'success')
                                            <span class="badge bg-success">Success</span>
                                        @else
                                            <span class="badge bg-warning text-dark">Pending</span>
                                        @endif
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <!-- Editable Participant Details -->
                    @php
                        $invoice = is_string($reservation->invoice) ? json_decode($reservation->invoice, true) : $reservation->invoice;
                        $eventDate = $reservation->eventDate;
                    @endphp

                    <div class="card mb-4">
                        <div class="card-header">
                            <h5 class="card-title mb-0 w-100">Edit Participant Details</h5>
                            <p class="text-muted small mb-0">Update the participant counts below. Fees will be recalculated automatically.</p>
                        </div>
                        <div class="card-body">

                            <div class="table-responsive">
                                <table class="table table-sm table-bordered" style="font-size: 0.875rem;">
                                    <thead>
                                        <tr>
                                            <th width="40%">Participant Type</th>
                                            <th class="text-end" style="width: 25%">Fee (BDT)</th>
                                            <th class="text-center" style="width: 10%">No. of Participants</th>
                                            <th class="text-end" style="width: 25%">Subtotal</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                    <tr>
                                        <td>Alumni</td>
                                        <td class="text-end fee-rate" data-fee-type="alumni">{{ number_format($eventDate->fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="alumni" class="form-control form-control-sm participant-count" 
                                                   data-type="alumni" data-rate="{{ $eventDate->fee ?? 0 }}"
                                                   value="{{ $reservation->alumni ?? 0 }}" min="0" readonly>
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="alumni">
                                            {{ number_format(
                                                ($invoice['alumni_fee'] ?? 0) * ($reservation->alumni ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Spouse</td>
                                        <td class="text-end fee-rate" data-fee-type="spouse">{{ number_format($eventDate->spouse_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="spouse" class="form-control form-control-sm participant-count" 
                                                   data-type="spouse" data-rate="{{ $eventDate->spouse_fee ?? 0 }}"
                                                   value="{{ $reservation->spouse ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="spouse">
                                            {{ number_format(
                                                ($invoice['spouse_fee'] ?? 0) * ($reservation->spouse ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Children (5–12)</td>
                                        <td class="text-end fee-rate" data-fee-type="children_5_to_12">{{ number_format($eventDate->children_5_to_12_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="children_5_to_12" class="form-control form-control-sm participant-count" 
                                                   data-type="children_5_to_12" data-rate="{{ $eventDate->children_5_to_12_fee ?? 0 }}"
                                                   value="{{ $reservation->children_5_to_12 ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="children_5_to_12">
                                            {{ number_format(
                                                ($invoice['children_5_to_12_fee'] ?? 0) * ($reservation->children_5_to_12 ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Children (Below 5)</td>
                                        <td class="text-end fee-rate" data-fee-type="children_below_5">{{ number_format($eventDate->children_below_5_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="children_below_5" class="form-control form-control-sm participant-count" 
                                                   data-type="children_below_5" data-rate="{{ $eventDate->children_below_5_fee ?? 0 }}"
                                                   value="{{ $reservation->children_below_5 ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="children_below_5">
                                            {{ number_format(
                                                ($invoice['children_below_5_fee'] ?? 0) * ($reservation->children_below_5 ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Children (Above 12)</td>
                                        <td class="text-end fee-rate" data-fee-type="children_above_12">{{ number_format($eventDate->children_above_12_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="children_above_12" class="form-control form-control-sm participant-count" 
                                                   data-type="children_above_12" data-rate="{{ $eventDate->children_above_12_fee ?? 0 }}"
                                                   value="{{ $reservation->children_above_12 ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="children_above_12">
                                            {{ number_format(
                                                ($invoice['children_above_12_fee'] ?? 0) * ($reservation->children_above_12 ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Driver</td>
                                        <td class="text-end fee-rate" data-fee-type="driver">{{ number_format($eventDate->driver_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="driver" class="form-control form-control-sm participant-count" 
                                                   data-type="driver" data-rate="{{ $eventDate->driver_fee ?? 0 }}"
                                                   value="{{ $reservation->driver ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="driver">
                                            {{ number_format(
                                                ($invoice['driver_fee'] ?? 0) * ($reservation->driver ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Maid</td>
                                        <td class="text-end fee-rate" data-fee-type="maid">{{ number_format($eventDate->maid_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="maid" class="form-control form-control-sm participant-count" 
                                                   data-type="maid" data-rate="{{ $eventDate->maid_fee ?? 0 }}"
                                                   value="{{ $reservation->maid ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="maid">
                                            {{ number_format(
                                                ($invoice['maid_fee'] ?? 0) * ($reservation->maid ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>Other Guests</td>
                                        <td class="text-end fee-rate" data-fee-type="other_guest">{{ number_format($eventDate->other_guest_fee ?? 0, 2) }}</td>
                                        <td class="text-center">
                                            <input type="number" name="other_guest" class="form-control form-control-sm participant-count" 
                                                   data-type="other_guest" data-rate="{{ $eventDate->other_guest_fee ?? 0 }}"
                                                   value="{{ $reservation->other_guest ?? 0 }}" min="0">
                                        </td>
                                        <td class="text-end subtotal-display" data-fee-type="other_guest">
                                            {{ number_format(
                                                ($invoice['other_guest_fee'] ?? 0) * ($reservation->other_guest ?? 0)
                                            , 2) }}
                                        </td>
                                    </tr>
                                    </tbody>
                                        <tfoot>
                                        <tr>
                                            <th colspan="3" class="text-end">Total Amount:</th>
                                            <th class="text-end" id="total-amount">
                                                {{ number_format(($invoice['total'] ?? 0), 2) }}</th>
                                        </tr>
                                    </tfoot>
                                </table>
                            </div>

                            <!-- Special Requirements -->
                            <div class="mb-3">
                                <label for="special_requirements" class="form-label">Special Requirements</label>
                                <textarea name="special_requirements" id="special_requirements" 
                                          class="form-control" rows="3">{{ $reservation->special_requirements }}</textarea>
                            </div>

                            <!-- Action Buttons -->
                            <div class="d-flex justify-content-end gap-2">
                                <a href="{{ route('reservation.details', $reservation->id) }}" class="btn btn-secondary">
                                    <i class="fas fa-times"></i> Cancel
                                </a>
                                <button type="submit" class="btn btn-primary ml-2">
                                    <i class="fas fa-save"></i> Update Reservation
                                </button>
                            </div>
                        </div>
                    </div>
                </form>

            </div>
        </div>
    </div>
@endsection

@push('js')
<script>
    $(document).ready(function() {
        
        // Function to format number with 2 decimal places
        function formatCurrency(amount) {
            return parseFloat(amount).toFixed(2).replace(/\B(?=(\d{3})+(?!\d))/g, ',');
        }

        // Function to update subtotal for a specific participant type
        function updateSubtotal(input) {
            const type = input.data('type');
            const rate = parseFloat(input.data('rate')) || 0;
            const count = parseInt(input.val()) || 0;
            const subtotal = count * rate;
            
            // Update the subtotal display
            const subtotalCell = $('.subtotal-display[data-fee-type="' + type + '"]');
            subtotalCell.text(formatCurrency(subtotal));
            
            // Update total amount
            updateTotalAmount();
        }
        
        // Function to calculate and update total amount
        function updateTotalAmount() {
            let total = 0;
            $('.subtotal-display').each(function() {
                const subtotalText = $(this).text().replace(/,/g, '');
                const subtotalValue = parseFloat(subtotalText) || 0;
                total += subtotalValue;
            });
            
            $('#total-amount').text(formatCurrency(total));
        }

        // Get all editable participant inputs
        const editableInputs = $('.participant-count:not([readonly])');
        
        // Log each input details
        editableInputs.each(function(index) {
            const $input = $(this);
        });

        // Listen for changes on participant count inputs (exclude readonly inputs like Alumni)
        editableInputs.on('input change keyup', function() {
            const $this = $(this);
            // Prevent negative values
            if ($this.val() < 0) {
                $this.val(0);
            }
            
            // Update the subtotal for this participant type
            updateSubtotal($this);
        });

        // Form submission
        $('#editReservationForm').on('submit', function(e) {
            e.preventDefault();
            
            const submitBtn = $(this).find('button[type="submit"]');
            const originalText = submitBtn.html();
            submitBtn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Updating...');
            
            $.ajax({
                url: $(this).attr('action'),
                method: 'POST',
                data: $(this).serialize(),
                success: function(response) {
                    if (response.success) {
                        toastr.success(response.message);
                        setTimeout(function() {
                            window.location.href = response.redirect;
                        }, 1500);
                    } else {
                        toastr.error(response.message || 'An error occurred');
                        submitBtn.prop('disabled', false).html(originalText);
                    }
                },
                error: function(xhr) {
                    let errorMsg = 'An error occurred while updating the reservation.';
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMsg = xhr.responseJSON.message;
                    }
                    toastr.error(errorMsg);
                    submitBtn.prop('disabled', false).html(originalText);
                }
            });
        });
    });
</script>
@endpush