@extends('admin.layouts.master')

@section('css')
    @include('admin.helper.tablecss')
    <style>
        .stats-card {
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        .profit-amount {
            font-size: 1.5em;
            font-weight: bold;
        }
    </style>
@endsection

@section('page-header')
    <div class="breadcrumb-header justify-content-between">
        <div class="my-auto">
            <div class="d-flex">
                <h4 class="content-title mb-0 my-auto">أرباح التجار</h4>
            </div>
        </div>
    </div>
@endsection

@section('content')
    <div id="vendorProfitsPage">
        <div class="card mb-3">
            <div class="card-body">
                <div class="row">
                    <div class="col-md-4">
                        <label class="font-weight-bold">التاجر</label>
                        <select id="vendorFilter" class="form-control select2">
                            <option value="">— اختر تاجر —</option>
                            @foreach ($vendors as $v)
                                <option value="{{ $v->id }}">{{ $v->user->name ?? 'Vendor #' . $v->id }}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-2">
                        <label class="font-weight-bold">رقم الطلب</label>
                        <input type="number" id="orderIdFilter" class="form-control" />
                    </div>
                    <div class="col-md-2">
                        <label class="font-weight-bold">من تاريخ</label>
                        <input type="date" id="dateFromFilter" class="form-control" />
                    </div>
                    <div class="col-md-2">
                        <label class="font-weight-bold">إلى تاريخ</label>
                        <input type="date" id="dateToFilter" class="form-control" />
                    </div>
                    <div class="col-md-2 d-flex align-items-end">
                        <button class="btn btn-success mr-2" id="applyFilters"><x-lucide-filter width="20" height="20" /> تطبيق</button>
                        <button class="btn btn-secondary" id="resetFilters"><x-lucide-x width="20" height="20" /> إلغاء</button>
                    </div>
                </div>
            </div>
        </div>

        <div class="row mb-4">
            <div class="col-6 mx-auto">
                <div class="card stats-card bg-warning text-white">
                    <div class="card-body d-flex justify-content-between">
                        <div>
                            <h6 class="text-white">إجمالي الأرباح</h6>
                            <h2 class="profit-amount"><span id="totalProfitValue">0</span></h2>
                            <small><span id="profitPercentage">0%</span> من الإيرادات</small>
                        </div>
                        <div class="align-self-center"><x-lucide-trending-up class="opacity-7" width="48" height="48" /></div>
                    </div>
                </div>
            </div>
        </div>

        <div class="card">
            <div class="card-body">
                <div class="table-responsive">
                    <table id="vendorProfitsTable" class="table table-sm text-md-nowrap" data-page-length="25">
                        <thead>
                            <tr>
                                <th>#</th>
                                <th>المستخدم</th>
                                <th>رقم الطلب</th>
                                <th>السعر قبل ربح التاجر</th>
                                <th>الإجمالي</th>
                                <th>نسبة التاجر</th>
                                <th>ربح قبل (إجمالي)</th>
                                <th>قيمة الخصومات/الضرائب (النسبة)</th>
                                <th>ربح بعد (إجمالي)</th>
                                <th>التاريخ</th>
                                <th>العمليات</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                </div>
            </div>
        </div>

        @include('admin.vendors.modals.transaction-details')
    </div>
@endsection

@section('js')
    @include('admin.helper.tablescripts')
    <script>
        $(function() {
            $('.select2').select2();
            const urlParams = new URLSearchParams(window.location.search);
            const preselectVendorId = urlParams.get('vendor_id');
            if (preselectVendorId) {
                $('#vendorFilter').val(preselectVendorId).trigger('change');
            }

            let table = $('#vendorProfitsTable').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: "{{ route('admin.vendors.profits.table') }}",
                    data: function(d) {
                        d.vendor_id = $('#vendorFilter').val();
                        d.order_id = $('#orderIdFilter').val();
                        d.date_from = $('#dateFromFilter').val();
                        d.date_to = $('#dateToFilter').val();
                    }
                },
                columns: [{
                        data: 'id',
                        name: 'id'
                    },
                    {
                        data: 'user',
                        name: 'user'
                    },
                    {
                        data: 'order_info',
                        name: 'order_info',
                        orderable: false
                    },
                    {
                        data: 'base_total',
                        name: 'base_total',
                        orderable: false
                    },
                    {
                        data: 'final_price',
                        name: 'final_price'
                    },
                    {
                        data: 'vendor_percent',
                        name: 'vendor_percent'
                    },
                    {
                        data: 'vendor_profit_before',
                        name: 'vendor_profit_before',
                        orderable: false
                    },
                    {
                        data: 'vendor_adjustments',
                        name: 'vendor_adjustments',
                        orderable: false
                    },
                    {
                        data: 'vendor_profit',
                        name: 'vendor_profit',
                        orderable: false
                    },
                    {
                        data: 'created_at',
                        name: 'created_at'
                    },
                    {
                        data: 'action',
                        name: 'action',
                        orderable: false,
                        searchable: false
                    },
                ],
                responsive: true,
                autoWidth: false,
                order: [
                    [0, 'desc']
                ]
            });

            function loadStats() {
                $.get("{{ route('admin.vendors.profits.stats') }}", {
                    vendor_id: $('#vendorFilter').val(),
                    order_id: $('#orderIdFilter').val(),
                    date_from: $('#dateFromFilter').val(),
                    date_to: $('#dateToFilter').val(),
                }).done(function(res) {
                    if (res.success) {
                        $('#totalProfitValue').text(parseFloat(res.stats.total_profit));
                        $('#profitPercentage').text(parseFloat(res.stats.profit_percentage).toFixed(2) +
                            '%');
                    }
                });
            }

            $('#applyFilters').on('click', function() {
                table.ajax.reload();
                loadStats();
            });
            $('#resetFilters').on('click', function() {
                $('#orderIdFilter').val('');
                $('#dateFromFilter').val('');
                $('#dateToFilter').val('');
                table.ajax.reload();
                loadStats();
            });
            $('#vendorFilter').on('change', function() {
                table.ajax.reload();
                loadStats();
            });

            // show transaction modal
            $(document).on('click', '.show-transaction', function() {
                let id = $(this).attr('value');
                $.post("{{ route('admin.vendors.profits.show') }}", {
                        id: id,
                        _token: '{{ csrf_token() }}'
                    })
                    .done(function(res) {
                        if (res.success) {
                            // reuse modal filler from vendors transactions view
                            $('#transactionId').text(res.transaction.id);
                            $('#transactionUser').text(res.transaction.user);
                            $('#transactionVendorPercent').text(res.transaction.vendor_percent + '%');
                            $('#transactionVendorProfit').text(res.transaction.vendor_profit);
                            // يمكن لاحقاً عرض تفاصيل قبل/بعد في عناصر إضافية بالmodal إذا لزم
                            $('#transactionUserTax').text(res.transaction.price_after_user_tax || '—');
                            $('#transactionGameTax').text(res.transaction.price_after_game_tax || '—');
                            $('#transactionProductTax').text(res.transaction.price_after_product_tax ||
                                '—');
                            $('#transactionUserDiscount').text(res.transaction
                                .price_after_user_discount || '—');
                            $('#transactionGameDiscount').text(res.transaction
                                .price_after_game_discount || '—');
                            $('#transactionProductDiscount').text(res.transaction
                                .price_after_product_discount || '—');
                            $('#transactionFinalPrice').text(res.transaction.final_price || '—');
                            $('#transactionTotalPrice').text(res.transaction.total_price || '—');
                            $('#transactionCurrency').text(res.transaction.currency || '—');
                            $('#transactionOrderId').text(res.transaction.order_id || '—');
                            $('#transactionCreatedAt').text(res.transaction.created_at);
                            $('#transactionDetailsModal').modal('show');
                        } else {
                            Swal.fire('خطأ', res.error, 'error');
                        }
                    }).fail(function() {
                        Swal.fire('خطأ', 'تعذر تحميل التفاصيل', 'error');
                    });
            });

            // initial load
            setTimeout(function() {
                $('button#applyFilters').trigger('click');
            }, 100);
        });
    </script>
@endsection