@extends('layouts.master')
@section('css')
    <!-- Internal Data table css -->
    <link href="{{ URL::asset('assets/plugins/datatable/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" />
    <link href="{{ URL::asset('assets/plugins/datatable/css/buttons.bootstrap4.min.css') }}" rel="stylesheet">
    <link href="{{ URL::asset('assets/plugins/datatable/css/responsive.bootstrap4.min.css') }}" rel="stylesheet" />
    <link href="{{ URL::asset('assets/plugins/datatable/css/jquery.dataTables.min.css') }}" rel="stylesheet">
    <link href="{{ URL::asset('assets/plugins/datatable/css/responsive.dataTables.min.css') }}" rel="stylesheet">
    <link href="{{ URL::asset('assets/plugins/select2/css/select2.min.css') }}" rel="stylesheet">

    <!-- Internal Spectrum-colorpicker css -->
    <link href="{{ URL::asset('assets/plugins/spectrum-colorpicker/spectrum.css') }}" rel="stylesheet">

    <!-- Internal Select2 css -->
    <link href="{{ URL::asset('assets/plugins/select2/css/select2.min.css') }}" rel="stylesheet">

@section('title')
    {{ __('home.product-analysis-report') }}@stop
@endsection
@section('page-header')
    <div class="main-parent">
        <!-- breadcrumb -->
        <div class="breadcrumb-header justify-content-between parent-heading">
            <div class="my-auto">
                <div class="d-flex">
                    <h4 class="content-title mb-0 my-auto">{{ __('home.product-analysis-report') }}</h4><span
                        class="text-muted mt-1 tx-13 mr-2 mb-0">
                    </span>
                </div>
            </div>
        </div>
        <!-- breadcrumb -->
    @endsection
   @section('content')
<div class="container-fluid">
    {{-- عرض الأخطاء --}}
    @if (count($errors) > 0)
        <div class="alert alert-danger mg-b-20">
            <strong>خطأ!</strong>
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <div class="row">
        <div class="col-xl-12">
            <div class="card mg-b-20">
                <div class="card-header pb-0">
                </div>

                <div class="card-body">
                    {{-- فورم البحث --}}
                    <form action="{{ url(LaravelLocalization::getCurrentLocale() . '/product-analysis-report') }}" method="POST" autocomplete="off">
                        @csrf
                        <div class="row mt-3">
                            <div class="col-lg-3">
                                <label>{{ __('report.fromdate') }}</label>
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <div class="input-group-text"><i class="fas fa-calendar-alt"></i></div>
                                    </div>
                                    <input class="form-control fc-datepicker" name="start_at" value="{{ $start_at ?? date('Y-m-d') }}" placeholder="YYYY-MM-DD" type="text" required>
                                </div>
                            </div>

                            <div class="col-lg-3">
                                <label>{{ __('report.todate') }}</label>
                                <div class="input-group">
                                    <div class="input-group-prepend">
                                        <div class="input-group-text"><i class="fas fa-calendar-alt"></i></div>
                                    </div>
                                    <input class="form-control fc-datepicker" name="end_at" value="{{ $end_at ?? date('Y-m-d') }}" placeholder="YYYY-MM-DD" type="text" required>
                                </div>
                            </div>

                            <div class="col-lg-4">
                                <label>{{ __('users.branch') }}</label>
                                <select class="form-control select2" name="branch" required>
                                    @if(Auth()->user()->branchs_id == 1)
                                        <option value="all">{{ __('users.allbranchs') }}</option>
                                    @endif
                                    @foreach (App\Models\branchs::get() as $branch)
                                        @if(Auth()->user()->branchs_id == 1 || Auth()->user()->branchs_id == $branch->id)
                                            <option value="{{ $branch->id }}" {{ isset($branch_id) && $branch_id == $branch->id ? 'selected' : '' }}>
                                                {{ $branch->name }}
                                            </option>
                                        @endif
                                    @endforeach
                                </select>
                            </div>

                           <div class="col-lg-2">
                                <label>&nbsp;</label>
                                <div class="d-flex shadow-sm" style="gap: 8px;">
                                    <button class="btn btn-primary btn-block" style="border-top-left-radius: 0; border-bottom-left-radius: 0;">
                                        <i class="las la-search"></i> {{ __('home.search') }}
                                    </button>

                                    <a href="{{ url()->current() }}" class="btn btn-secondary" title="Reset Filters"
                                    style="border-top-right-radius: 0; border-bottom-right-radius: 0; display: flex; align-items: center;">
                                        <i class="las la-sync-alt" style="font-size: 1.2rem;"></i>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </form>

                    <hr>

                    {{-- مكان ظهور النتائج --}}
                @if(isset($products))

                    {{-- عرض إحصائية سريعة --}}
                    <div class="alert alert-info d-flex justify-content-between align-items-center mg-b-20">
                        <span><i class="fas fa-info-circle"></i>    {{ __('home.total_products_count') }}: <strong>{{ $totalCount }}</strong></span>

                        @if(isset($exportData))
                            <input type="hidden" id="hidden_export_data" value="{{ $exportData }}">
                        @endif
                        {{-- زر الإكسيل يظهر دائماً سواء الداتا كبيرة أو صغيرة --}}
                        <button type="button" class="btn btn-export-excel" onclick="exportToExcelSmart()">
                            <span>{{ __('home.export_excel') }}</span>
                            <img src="https://img.icons8.com/color/24/000000/microsoft-excel-2019--v1.png" class="excel-icon" alt="excel-icon">
                        </button>
                    </div>

                    {{-- حالة 1: العدد أكثر من 20 - لا نعرض الجدول لسرعة المتصفح --}}
                    @if(isset($showExportOnly) && $showExportOnly)
                        <div class="card bd-primary mg-t-20">
                            <div class="card-body text-center py-5">
                                <i class="fas fa-exclamation-triangle text-warning fa-3x mg-b-20"></i>
                          <h4 class="text-danger">
                                    {{ __('home.data_too_large') }} ({{ $totalCount }} {{ __('home.products') }})
                                </h4>

                                <p class="text-muted">
                                    {{ __('home.download_excel_note') }}
                                </p>
                            </div>
                        </div>

                        {{-- جدول مخفي تماماً لاستخدامه في التصدير إذا كنت تعتمد على JS --}}
                        <table id="reportTable" style="display:none;">
                           <thead>
                                <tr>
                                    <th>{{ __('home.part_number') }}</th>
                                    <th>{{ __('home.product_group') }}</th>
                                    <th>{{ __('home.brand') }}</th>
                                    <th>{{ __('home.type') }}</th>
                                    <th>{{ __('home.name') }}</th>
                                    <th>{{ __('home.branch') }}</th>
                                    <th>{{ __('home.available_qty') }}</th>
                                    <th>{{ __('home.average_cost') }}</th>
                                    <th>{{ __('home.selling_price') }}</th>
                                    <th>{{ __('home.sales_2026') }}</th>
                                    <th>{{ __('home.returns') }}</th>
                                    <th>{{ __('home.replacement') }}</th>
                                    <th>{{ __('home.foreign_price') }}</th>
                                </tr>
                            </thead>
                        </table>

                    {{-- حالة 2: العدد 20 أو أقل - نعرض الجدول كاملاً --}}
                    @else
                        <div class="table-responsive mt-3">
                            <table class="table table-bordered table-striped text-center align-middle" id="reportTable">
                            <thead class="table-dark">
                                    <tr>
                                        <th class="border-bottom-0">{{ __('home.part_number') }}</th>
                                                                            <th>{{ __('home.product_group') }}</th>

                                        <th class="border-bottom-0">{{ __('home.brand') }}</th>
                                        <th class="border-bottom-0">{{ __('home.type') }}</th>
                                        <th class="border-bottom-0">{{ __('home.name') }}</th>
                                        <th class="border-bottom-0">{{ __('home.branch') }}</th>
                                        <th class="border-bottom-0">{{ __('home.available_qty') }}</th>
                                        <th class="border-bottom-0">{{ __('home.average_cost') }}</th>
                                        <th class="border-bottom-0">{{ __('home.selling_price') }}</th>
                                        <th class="border-bottom-0">{{ __('home.sales_2025') }}</th>
                                        <th class="border-bottom-0">{{ __('home.sales_2026') }}</th>
                                        <th class="border-bottom-0">{{ __('home.replacement') }}</th>
                                        <th class="border-bottom-0">{{ __('home.foreign_price') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($products as $item)
                                    <tr>
                                        <td class="font-weight-bold">{{ $item['part_number'] }}</td>
                                        <td class="font-weight-bold">{{ $item['product_group_data']['group_ar'] ??$item['product_group_data']['group_en']?? __('home.notdata')}}</td>
                                        <td>{{ $item['brand'] }}</td>
                                        <td>{{ $item['type'] }}</td>
                                        <td class="text-start" style="min-width: 200px;">{{ $item['name'] }}</td>
                                        <td><span class="badge badge-light">{{ $item['branch'] }}</span></td>
                                        <td class="text-primary font-weight-bold">{{ $item['available_qty'] }}</td>
                                        <td>{{ number_format($item['average_cost'], 2) }}</td>
                                        <td>{{ number_format($item['selling_price'], 2) }}</td>
                                        <td class="table-info">{{ $item['sales_2025'] }}</td> {{-- لون مختلف لسنة 2025 --}}
                                        <td class="table-success">{{ $item['sales_2026'] }}</td> {{-- لون مختلف لسنة 2026 --}}
                                        <td>{{ $item['refnumber'] ?? '-' }}</td>
                                        <td>{{ number_format($item['last_foreign_price'], 2) }}</td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="12" class="text-center">  {{ __('home.no_matching_data') }}</td>
                                    </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    @endif
                @endif
                </div> {{-- نهاية card-body --}}
            </div> {{-- نهاية card --}}
        </div>
    </div>
</div>
@endsection
@section('js')
    <!-- Internal Data tables -->
    <script src="{{ URL::asset('assets/plugins/datatable/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.dataTables.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/responsive.dataTables.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/jquery.dataTables.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.bootstrap4.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.bootstrap4.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/jszip.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/pdfmake.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/vfs_fonts.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.html5.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.print.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/buttons.colVis.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/dataTables.responsive.min.js') }}"></script>
    <script src="{{ URL::asset('assets/plugins/datatable/js/responsive.bootstrap4.min.js') }}"></script>
    <!--Internal  Datatable js -->
    <script src="{{ URL::asset('assets/js/table-data.js') }}"></script>

    <!--Internal  Datepicker js -->
    <script src="{{ URL::asset('assets/plugins/jquery-ui/ui/widgets/datepicker.js') }}"></script>
    <!--Internal  jquery.maskedinput js -->
    <script src="{{ URL::asset('assets/plugins/jquery.maskedinput/jquery.maskedinput.js') }}"></script>
    <!--Internal  spectrum-colorpicker js -->
    <script src="{{ URL::asset('assets/plugins/spectrum-colorpicker/spectrum.js') }}"></script>
    <!-- Internal Select2.min js -->
    <script src="{{ URL::asset('assets/plugins/select2/js/select2.min.js') }}"></script>
    <!--Internal Ion.rangeSlider.min js -->
    <script src="{{ URL::asset('assets/plugins/ion-rangeslider/js/ion.rangeSlider.min.js') }}"></script>
    <!--Internal  jquery-simple-datetimepicker js -->
    <script src="{{ URL::asset('assets/plugins/amazeui-datetimepicker/js/amazeui.datetimepicker.min.js') }}"></script>
    <!-- Ionicons js -->
    <script src="{{ URL::asset('assets/plugins/jquery-simple-datetimepicker/jquery.simple-dtpicker.js') }}"></script>
    <!--Internal  pickerjs js -->
    <script src="{{ URL::asset('assets/plugins/pickerjs/picker.min.js') }}"></script>
    <!-- Internal form-elements js -->
    <script src="{{ URL::asset('assets/js/form-elements.js') }}"></script>
    <script>
        var date = $('.fc-datepicker').datepicker({
            dateFormat: 'yy-mm-dd'
        }).val();
    </script>

<script>
function exportToExcelSmart() {
    let html = "";
    let hiddenData = document.getElementById("hidden_export_data");

    if (hiddenData) {
        // الحالة 1: العدد كبير - نبني جدول "افتراضي" في الذاكرة من الـ JSON
        let data = JSON.parse(hiddenData.value);
        html = `<table border="1"><thead><tr>
            <th>Part Number</th><th>Brand</th><th>Type</th><th>Name</th><th>Branch</th>
            <th>Available QTY</th><th>Average Cost</th><th>Selling Price</th>
            <th>Sales (2026)</th><th>Returns</th><th>Replicment</th><th>Foreign Price</th>
        </tr></thead><tbody>`;

        data.forEach(item => {
            html += `<tr>
                <td>${item.part_number}</td><td>${item.brand}</td><td>${item.type}</td><td>${item.name}</td><td>${item.branch}</td>
                <td>${item.available_qty}</td><td>${item.average_cost}</td><td>${item.selling_price}</td>
                <td>${item.total_sales}</td><td>${item.total_returns}</td><td>${item.refnumber}</td><td>${item.last_foreign_price}</td>
            </tr>`;
        });
        html += `</tbody></table>`;
    } else {
        // الحالة 2: العدد قليل - نأخذ الجدول الموجود في الصفحة
        html = document.getElementById("reportTable").outerHTML;
    }

    // التصدير مع دعم اللغة العربية (UTF-8 BOM)
    let blobData = ['\ufeff' + html];
    let blob = new Blob(blobData, { type: 'application/vnd.ms-excel' });
    let url = window.URL.createObjectURL(blob);
    let a = document.createElement("a");
    a.href = url;
    a.download = "Product_Analysis_Report.xls";
    a.click();
}
</script>




@endsection