@extends('layouts.app')

@section('content')
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1>تفاصيل الطلب #{{ $order->id }}</h1>
        <div>
            <a href="{{ route('orders.index') }}" class="btn btn-secondary">
                <i class="fas fa-arrow-right"></i> العودة للطلبات
            </a>
            @if(in_array($order->status, ['pending', 'preparing']))
                <a href="{{ route('orders.edit', $order) }}" class="btn btn-primary">
                    <i class="fas fa-edit"></i> تعديل الطلب
                </a>
            @endif
            @if($order->payment_status != 'paid')
                <a href="{{ route('payments.create', $order) }}" class="btn btn-success">
                    <i class="fas fa-money-bill-wave"></i> دفع
                </a>
            @endif
        </div>
    </div>
    
    <div class="row">
        <div class="col-md-8">
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="card-title">المنتجات</h5>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-hover">
                            <thead>
                                <tr>
                                    <th>#</th>
                                    <th>المنتج</th>
                                    <th>السعر</th>
                                    <th>الكمية</th>
                                    <th>الإجمالي</th>
                                    <th>الحالة</th>
                                    <th>ملاحظات</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($order->items as $item)
                                    <tr>
                                        <td>{{ $loop->iteration }}</td>
                                        <td>{{ $item->product->name }}</td>
                                        <td>{{ number_format($item->unit_price, 2) }}</td>
                                        <td>{{ $item->quantity }}</td>
                                        <td>{{ number_format($item->total_price, 2) }}</td>
                                        <td>
                                            <span class="status-badge 
                                                @switch($item->status)
                                                    @case('pending')
                                                        status-pending
                                                        @break
                                                    @case('preparing')
                                                        status-preparing
                                                        @break
                                                    @case('ready')
                                                        status-completed
                                                        @break
                                                    @case('served')
                                                        status-completed
                                                        @break
                                                    @case('cancelled')
                                                        status-cancelled
                                                        @break
                                                @endswitch
                                            ">
                                                @switch($item->status)
                                                    @case('pending')
                                                        قيد الانتظار
                                                        @break
                                                    @case('preparing')
                                                        قيد التحضير
                                                        @break
                                                    @case('ready')
                                                        جاهز
                                                        @break
                                                    @case('served')
                                                        تم التقديم
                                                        @break
                                                    @case('cancelled')
                                                        ملغي
                                                        @break
                                                @endswitch
                                            </span>
                                            
                                            @if(in_array($order->status, ['pending', 'preparing']))
                                                <div class="dropdown d-inline-block ms-1">
                                                    <button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" id="itemStatusDropdown{{ $item->id }}" data-bs-toggle="dropdown" aria-expanded="false">
                                                        تغيير
                                                    </button>
                                                    <ul class="dropdown-menu" aria-labelledby="itemStatusDropdown{{ $item->id }}">
                                                        <li>
                                                            <a class="dropdown-item update-item-status" href="#" data-item-id="{{ $item->id }}" data-status="pending">
                                                                قيد الانتظار
                                                            </a>
                                                        </li>
                                                        <li>
                                                            <a class="dropdown-item update-item-status" href="#" data-item-id="{{ $item->id }}" data-status="preparing">
                                                                قيد التحضير
                                                            </a>
                                                        </li>
                                                        <li>
                                                            <a class="dropdown-item update-item-status" href="#" data-item-id="{{ $item->id }}" data-status="ready">
                                                                جاهز
                                                            </a>
                                                        </li>
                                                        <li>
                                                            <a class="dropdown-item update-item-status" href="#" data-item-id="{{ $item->id }}" data-status="served">
                                                                تم التقديم
                                                            </a>
                                                        </li>
                                                        <li>
                                                            <a class="dropdown-item update-item-status" href="#" data-item-id="{{ $item->id }}" data-status="cancelled">
                                                                ملغي
                                                            </a>
                                                        </li>
                                                    </ul>
                                                </div>
                                            @endif
                                        </td>
                                        <td>{{ $item->notes ?? '-' }}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                            <tfoot>
                                <tr>
                                    <th colspan="4" class="text-end">المجموع:</th>
                                    <th>{{ number_format($order->total_amount, 2) }}</th>
                                    <th colspan="2"></th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end">الخصم:</th>
                                    <th>{{ number_format($order->discount, 2) }}</th>
                                    <th colspan="2"></th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end">الضريبة:</th>
                                    <th>{{ number_format($order->tax, 2) }}</th>
                                    <th colspan="2"></th>
                                </tr>
                                <tr>
                                    <th colspan="4" class="text-end">الإجمالي:</th>
                                    <th>{{ number_format($order->final_amount, 2) }}</th>
                                    <th colspan="2"></th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
            
            @if($order->payments->count() > 0)
                <div class="card mb-4">
                    <div class="card-header">
                        <h5 class="card-title">المدفوعات</h5>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive">
                            <table class="table table-hover">
                                <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>المبلغ</th>
                                        <th>طريقة الدفع</th>
                                        <th>الحالة</th>
                                        <th>التاريخ</th>
                                        <th>الإجراءات</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($order->payments as $payment)
                                        <tr>
                                            <td>{{ $payment->id }}</td>
                                            <td>{{ number_format($payment->amount, 2) }}</td>
                                            <td>
                                                @switch($payment->payment_method)
                                                    @case('cash')
                                                        <i class="fas fa-money-bill-wave"></i> نقداً
                                                        @break
                                                    @case('credit_card')
                                                        <i class="fas fa-credit-card"></i> بطاقة ائتمان
                                                        @break
                                                    @case('debit_card')
                                                        <i class="fas fa-credit-card"></i> بطاقة خصم
                                                        @break
                                                    @case('mobile_payment')
                                                        <i class="fas fa-mobile-alt"></i> دفع إلكتروني
                                                        @break
                                                @endswitch
                                            </td>
                                            <td>
                                                <span class="status-badge {{ $payment->payment_status == 'completed' ? 'status-completed' : ($payment->payment_status == 'refunded' ? 'status-cancelled' : 'status-pending') }}">
                                                    @switch($payment->payment_status)
                                                        @case('completed')
                                                            مكتمل
                                                            @break
                                                        @case('failed')
                                                            فاشل
                                                            @break
                                                        @case('refunded')
                                                            مسترجع
                                                            @break
                                                    @endswitch
                                                </span>
                                            </td>
                                            <td>{{ $payment->created_at->format('Y-m-d H:i') }}</td>
                                            <td>
                                                <div class="btn-group">
                                                    <a href="{{ route('payments.show', $payment) }}" class="btn btn-sm btn-info">
                                                        <i class="fas fa-eye"></i>
                                                    </a>
                                                    <button type="button" class="btn btn-sm btn-success print-receipt" data-payment-id="{{ $payment->id }}">
                                                        <i class="fas fa-print"></i>
                                                    </button>
                                                    @if($payment->payment_status == 'completed')
                                                        <button type="button" class="btn btn-sm btn-danger refund-payment" data-payment-id="{{ $payment->id }}">
                                                            <i class="fas fa-undo"></i>
                                                        </button>
                                                    @endif
                                                </div>
                                                
                                                <form id="print-form-{{ $payment->id }}" action="{{ route('payments.print', $payment) }}" method="POST" class="d-none">
                                                    @csrf
                                                </form>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            @endif
        </div>
        
        <div class="col-md-4">
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="card-title">معلومات الطلب</h5>
                </div>
                <div class="card-body">
                    <div class="mb-3">
                        <label class="form-label fw-bold">رقم الطلب:</label>
                        <p>{{ $order->id }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">الطاولة:</label>
                        <p>{{ $order->table ? $order->table->name : ($order->is_external_order ? 'طلب خارجي ' . ($order->car_number ? '(سيارة: ' . $order->car_number . ')' : '') : 'غير محدد') }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">العميل:</label>
                        <p>{{ $order->customer_name ?? 'غير محدد' }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">النادل:</label>
                        <p>{{ $order->user->name }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">تاريخ الطلب:</label>
                        <p>{{ $order->created_at->format('Y-m-d H:i') }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">حالة الطلب:</label>
                        <div class="d-flex align-items-center">
                            <span class="status-badge status-{{ $order->status }} me-2">
                                @switch($order->status)
                                    @case('pending')
                                        قيد الانتظار
                                        @break
                                    @case('preparing')
                                        قيد التحضير
                                        @break
                                    @case('completed')
                                        مكتمل
                                        @break
                                    @case('cancelled')
                                        ملغي
                                        @break
                                @endswitch
                            </span>
                            
                            @if(!in_array($order->status, ['completed', 'cancelled']))
                                <div class="dropdown">
                                    <button class="btn btn-sm btn-outline-secondary dropdown-toggle" type="button" id="orderStatusDropdown" data-bs-toggle="dropdown" aria-expanded="false">
                                        تغيير
                                    </button>
                                    <ul class="dropdown-menu" aria-labelledby="orderStatusDropdown">
                                        <li>
                                            <a class="dropdown-item update-order-status" href="#" data-order-id="{{ $order->id }}" data-status="pending">
                                                قيد الانتظار
                                            </a>
                                        </li>
                                        <li>
                                            <a class="dropdown-item update-order-status" href="#" data-order-id="{{ $order->id }}" data-status="preparing">
                                                قيد التحضير
                                            </a>
                                        </li>
                                        <li>
                                            <a class="dropdown-item update-order-status" href="#" data-order-id="{{ $order->id }}" data-status="completed">
                                                مكتمل
                                            </a>
                                        </li>
                                        <li>
                                            <a class="dropdown-item update-order-status" href="#" data-order-id="{{ $order->id }}" data-status="cancelled">
                                                ملغي
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            @endif
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">حالة الدفع:</label>
                        <p>
                            <span class="status-badge {{ $order->payment_status == 'paid' ? 'status-completed' : ($order->payment_status == 'partially_paid' ? 'status-preparing' : 'status-pending') }}">
                                @switch($order->payment_status)
                                    @case('pending')
                                        غير مدفوع
                                        @break
                                    @case('partially_paid')
                                        مدفوع جزئياً
                                        @break
                                    @case('paid')
                                        مدفوع
                                        @break
                                @endswitch
                            </span>
                        </p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">ملاحظات:</label>
                        <p>{{ $order->notes ?? 'لا توجد ملاحظات' }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">المبلغ المدفوع:</label>
                        <p>{{ number_format($order->payments->where('payment_status', 'completed')->sum('amount'), 2) }}</p>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">المبلغ المتبقي:</label>
                        <p>{{ number_format($order->final_amount - $order->payments->where('payment_status', 'completed')->sum('amount'), 2) }}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Refund Modal -->
<div class="modal fade" id="refundModal" tabindex="-1" aria-labelledby="refundModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="refundModalLabel">استرجاع المدفوعات</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form id="refundForm" action="" method="POST">
                @csrf
                <div class="modal-body">
                    <div class="mb-3">
                        <label for="refund_reason" class="form-label">سبب الاسترجاع <span class="text-danger">*</span></label>
                        <textarea class="form-control" id="refund_reason" name="refund_reason" rows="3" required></textarea>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">إلغاء</button>
                    <button type="submit" class="btn btn-danger">تأكيد الاسترجاع</button>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    $(document).ready(function() {
        // Update order status
        $('.update-order-status').click(function(e) {
            e.preventDefault();
            
            const orderId = $(this).data('order-id');
            const status = $(this).data('status');
            
            if (confirm('هل أنت متأكد من تغيير حالة الطلب؟')) {
                $.ajax({
                    url: `{{ url('/') }}/orders/${orderId}/status`,
                    type: 'POST',
                    data: {
                        status: status,
                        _token: $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function(response) {
                        if (response.success) {
                            location.reload();
                        }
                    },
                    error: function(error) {
                        console.error('Error updating order status:', error);
                        alert('حدث خطأ أثناء تحديث حالة الطلب');
                    }
                });
            }
        });
        
        // Update item status
        $('.update-item-status').click(function(e) {
            e.preventDefault();
            
            const itemId = $(this).data('item-id');
            const status = $(this).data('status');
            
            $.ajax({
                url: `{{ url('/') }}/order-items/${itemId}/status`,
                type: 'POST',
                data: {
                    status: status,
                    _token: $('meta[name="csrf-token"]').attr('content')
                },
                success: function(response) {
                    if (response.success) {
                        location.reload();
                    }
                },
                error: function(error) {
                    console.error('Error updating item status:', error);
                    alert('حدث خطأ أثناء تحديث حالة المنتج');
                }
            });
        });
        
        // Print receipt
        $('.print-receipt').click(function() {
            const paymentId = $(this).data('payment-id');
            $(`#print-form-${paymentId}`).submit();
        });
        
        // Refund payment
        $('.refund-payment').click(function() {
            const paymentId = $(this).data('payment-id');
            $('#refundForm').attr('action', `/payments/${paymentId}/refund`);
            $('#refundModal').modal('show');
        });
    });
</script>
@endpush