@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/responsive.bootstrap4.min.css') }}" rel="stylesheet" />
<link href="{{ URL::asset('assets/plugins/select2/css/select2.min.css') }}" rel="stylesheet">

<style>
    .filter-card {
        background-color: #f8fafc;
        border: 1px solid #e2e8f0;
        border-radius: 8px;
        padding: 18px 20px 10px;
        margin-bottom: 20px;
    }
    .filter-card .form-group {
        margin-bottom: 12px;
    }
    .filter-card label {
        font-size: 13px;
        font-weight: 600;
        color: #475569;
        margin-bottom: 6px;
    }
    .table-custom thead th {
        background-color: #f1f5f9 !important;
        color: #334155 !important;
        font-weight: 700;
        border-bottom: 2px solid #cbd5e1 !important;
        vertical-align: middle;
    }
    .table-custom tbody tr:hover {
        background-color: #f8fafc;
    }
    .stats-badge {
        background-color: #e0f2fe;
        color: #0369a1;
        font-weight: 600;
        border-radius: 6px;
        padding: 6px 12px;
        font-size: 13px;
    }
    .pagination-toolbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 10px;
        padding-top: 15px;
        border-top: 1px solid #e2e8f0;
    }
</style>
@endsection

@section('title')
{{ __('report.stockquantity') }}
@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 text-primary font-weight-bold">{{ __('report.stockquantity') }}</h4>
            <span class="text-muted mt-1 tx-13 mr-2 mb-0">/ {{ __('home.report') ?? 'تقرير' }}</span>
        </div>
    </div>
</div>
@endsection

@section('content')

@if (count($errors) > 0)
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <strong>خطأ!</strong>
    <ul class="mb-0 mt-1">
        @foreach ($errors->all() as $error)
        <li>{{ $error }}</li>
        @endforeach
    </ul>
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>
</div>
@endif

<div class="row">
    <div class="col-xl-12">
        <div class="card custom-card">
            <div class="card-body">

                {{-- استخراج بيانات الفلتر الحالية --}}
                @php
                    $parsedBranch = $branchdata ?? '-';
                    $display = 1;
                    $currentQty = $quantity ?? 1;
                    $locationVal = '-';

                    if (!empty($branchdata) && str_contains($branchdata, '/')) {
                        $exploded = explode('/', $branchdata);
                        $parsedBranch = $exploded[0] ?? '-';
                        $display = $exploded[1] ?? 1;
                        $currentQty = $exploded[2] ?? 1;
                        $locationVal = $exploded[3] ?? '-';
                    }

                    $branchSelected = ($parsedBranch != '-') ? App\Models\branchs::find($parsedBranch) : null;
                    $avtSaleRate = App\Models\Avt::find(2);
                @endphp

                <!-- صندوق الفلاتر والبحث -->
                <div class="filter-card">
                    <form action="{{ url(Mcamara\LaravelLocalization\Facades\LaravelLocalization::getCurrentLocale() . '/stockquantity') }}" method="POST" autocomplete="off">
                        @csrf
                        <input type="hidden" id="avtValue" name="avtValue" value="{{ $avtSaleRate->AVT ?? 0 }}">

                        <div class="row align-items-end">
                            <div class="col-lg-3 col-md-6 form-group">
                                <label for="branch">{{ __('users.branch') }}</label>
                                <select class="form-control select2" name="branch" id="branch" required>
                                    <option value="-" {{ $parsedBranch == '-' ? 'selected' : '' }}>{{ __('users.allbranchs') }}</option>
                                    @foreach (App\Models\branchs::get() as $branch)
                                        <option value="{{ $branch->id }}" {{ $parsedBranch == $branch->id ? 'selected' : '' }}>
                                            {{ $branch->name }}
                                        </option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-lg-3 col-md-6 form-group">
                                <label for="choosequantitytodisplay">{{ __('home.choosequantitytodisplay') }}</label>
                                <select class="form-control" name="choosequantitytodisplay" id="choosequantitytodisplay" required>
                                    <option value="==" {{ $display == '==' ? 'selected' : '' }}>{{ __('home.morethen0') }}</option>
                                    <option value="<=" {{ $display == '<=' ? 'selected' : '' }}>{{ __('home.lessthen') }}</option>
                                    <option value=">=" {{ $display == '>=' ? 'selected' : '' }}>{{ __('home.morethen1') }}</option>
                                </select>
                            </div>

                            <div class="col-lg-2 col-md-6 form-group">
                                <label for="quantity">{{ __('home.quantity') }}</label>
                                <input type="number" class="form-control" id="quantity" name="quantity" value="{{ $currentQty }}" min="0" required>
                            </div>

                            <div class="col-lg-2 col-md-6 form-group">
                                <label for="Location">{{ __('home.Location') }}</label>
                                <input type="text" class="form-control" id="Location" name="Location" value="{{ $locationVal }}">
                            </div>

                            <div class="col-lg-2 col-md-12 form-group">
                                <button type="submit" class="btn btn-primary btn-block">
                                    <i class="las la-search ml-1"></i> {{ __('home.search') }}
                                </button>
                            </div>
                        </div>
                    </form>
                </div>

                @if (isset($products))
                    <!-- شريط أدوات الجدول (بحث سريع، إحصائيات، طباعة) -->
                    <div class="d-flex justify-content-between align-items-center flex-wrap mb-3">
                        <div class="col-lg-4 col-md-6 p-0 mb-2 mb-md-0">
                            <div class="input-group">
                                <div class="input-group-prepend">
                                    <span class="input-group-text bg-white border-left-0"><i class="las la-search text-muted"></i></span>
                                </div>
                                <input dir="auto" type="text" class="form-control border-right-0" id="searchaboutproduct" placeholder="{{ __('home.Search By Name or Product Number') }}" onkeyup="searchaboutproductfunction()">
                            </div>
                        </div>

                        <div class="d-flex align-items-center gap-2">
                            <span class="stats-badge mr-2">
                                <i class="las la-boxes"></i> {{ __('pagination.numberofproducts') }}: <strong>{{ $products->total() }}</strong>
                            </span>
                            <a class="btn btn-outline-success" target="_blank" href="{{ url('/printstockquantity/' . $parsedBranch . '/' . $display . '/' . $currentQty . '/' . ($locationVal ?: '-')) }}">
                                <i class="mdi mdi-printer ml-1"></i> {{ __('home.print') }}
                            </a>
                        </div>
                    </div>

                    <!-- جدول المنتجات -->
                    <div class="table-responsive border rounded">
                        <table class="table table-custom table-striped text-center mb-0" id="SearchProductTable" width="100%">
                            <thead>
                                <tr>
                                    <th style="width: 5%">#</th>
                                    <th style="width: 15%">{{ __('home.productNo') }}</th>
                                    <th style="width: 30%">{{ __('home.productname') }}</th>
                                    <th style="width: 12%">{{ __('home.productlocation') }}</th>
                                    <th style="width: 13%">{{ __('home.saleprice') }}</th>
                                    <th style="width: 10%">{{ __('home.stock') }}</th>
                                    <th style="width: 15%">{{ __('home.totalwithTax') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($products as $index => $product)
                                    <tr id="{{ $product->id }}">
                                        <td>{{ $products->firstItem() + $index }}</td>
                                        <td dir="ltr"><span class="badge badge-light px-2 py-1 tx-12 font-weight-bold">{{ $product->Product_Code }}</span></td>
                                        <td class="text-right font-weight-semibold">{{ $product->product_name }}</td>
                                        <td><span class="badge badge-secondary-light">{{ $product->Product_Location ?: '-' }}</span></td>
                                        <td dir="ltr" class="font-weight-bold">{{ number_format($product->purchasingـprice, 2) }}</td>
                                        <td>
                                            <span class="badge {{ $product->numberofpice > 0 ? 'badge-success' : 'badge-danger' }} px-2 py-1">
                                                {{ $product->numberofpice }}
                                            </span>
                                        </td>
                                        <td dir="ltr" class="text-primary font-weight-bold">
                                            {{ number_format($product->purchasingـprice * $product->numberofpice, 2) }}
                                        </td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="7" class="text-center py-4 text-muted">
                                            <i class="las la-inbox tx-30 d-block mb-1"></i>
                                            {{ __('home.nodata') ?? 'لا توجد بيانات مطابقة لبحثك' }}
                                        </td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    <!-- شريط الترقيم والانتقال بين الصفحات -->
                    <div class="pagination-toolbar mt-3">
                        <div class="text-muted tx-13">
                            {{ __('pagination.numberofpages') }}: <strong>{{ $products->perPage() }}</strong> في الصفحة
                        </div>

                        <div class="d-flex align-items-center">
                            <input type="hidden" id="previousPagevalue" value="{{ $products->previousPageUrl() }}">
                            <input type="hidden" id="nextPageValue" value="{{ $products->nextPageUrl() }}">

                            <button id="previousPage" class="btn btn-sm btn-outline-primary px-3 mr-2" {{ !$products->previousPageUrl() ? 'disabled' : '' }}>
                                <i class="las la-angle-right"></i> {{ __('pagination.previous') }}
                            </button>

                            <span class="badge badge-primary px-3 py-2 tx-13 mx-1">
                                {{ $products->currentPage() }} / {{ $products->lastPage() }}
                            </span>

                            <button id="nextPage" class="btn btn-sm btn-outline-primary px-3 ml-2" {{ !$products->nextPageUrl() ? 'disabled' : '' }}>
                                {{ __('pagination.next') }} <i class="las la-angle-left"></i>
                            </button>
                        </div>
                    </div>
                @endif

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

@section('js')
<script src="{{ URL::asset('assets/plugins/select2/js/select2.min.js') }}"></script>
<script>
    $(document).ready(function() {
        if ($('.select2').length) {
            $('.select2').select2({ width: '100%' });
        }

        // إخفاء التنبيهات تلقائياً
        setTimeout(function() {
            $('.alert').fadeOut(400);
        }, 4000);

        // دالة موحدة لتوليد صفوف الجدول وتجنب التكرار
        window.renderTableRows = function(data) {
            $('#previousPagevalue').val(data.prev_page_url || '');
            $('#nextPageValue').val(data.next_page_url || '');

            $('#previousPage').prop('disabled', !data.prev_page_url);
            $('#nextPage').prop('disabled', !data.next_page_url);

            let tbody = $('#SearchProductTable tbody');
            tbody.empty();

            if (!data.data || data.data.length === 0) {
                tbody.append(`
                    <tr>
                        <td colspan="7" class="text-center py-4 text-muted">
                            <i class="las la-inbox tx-30 d-block mb-1"></i> لا توجد نتائج
                        </td>
                    </tr>
                `);
                return;
            }

            let startCounter = (data.current_page - 1) * data.per_page;

            data.data.forEach((product, idx) => {
                let cost = parseFloat(product.purchasingـprice || 0);
                let qty = parseFloat(product.numberofpice || 0);
                let total = (cost * qty).toFixed(2);
                let badgeClass = qty > 0 ? 'badge-success' : 'badge-danger';

                tbody.append(`
                    <tr id="${product.id}">
                        <td>${startCounter + idx + 1}</td>
                        <td dir="ltr"><span class="badge badge-light px-2 py-1 tx-12 font-weight-bold">${product.Product_Code || ''}</span></td>
                        <td class="text-right font-weight-semibold">${product.product_name || ''}</td>
                        <td><span class="badge badge-secondary-light">${product.Product_Location || '-'}</span></td>
                        <td dir="ltr" class="font-weight-bold">${cost.toLocaleString(undefined, {minimumFractionDigits: 2})}</td>
                        <td><span class="badge ${badgeClass} px-2 py-1">${qty}</span></td>
                        <td dir="ltr" class="text-primary font-weight-bold">${total}</td>
                    </tr>
                `);
            });
        };

        // بحث مباشر بالاسم أو الكود
        let debounceTimer;
        window.searchaboutproductfunction = function() {
            clearTimeout(debounceTimer);
            debounceTimer = setTimeout(function() {
                let searchtext = $('#searchaboutproduct').val().trim();
                let branchId = $('#branch').val();

                if (searchtext === '') {
                    location.reload();
                    return;
                }

                $.ajax({
                    url: "{{ URL::to('search_stockquantityPagination') }}/" + encodeURIComponent(searchtext) + "/" + branchId,
                    type: "GET",
                    dataType: "json",
                    success: function(data) {
                        renderTableRows(data);
                    }
                });
            }, 300);
        };

        // التنقل للصفحة التالية
        $("#nextPage").click(function() {
            let nextUrl = $('#nextPageValue').val();
            if (nextUrl) {
                loadPaginationData(nextUrl);
            }
        });

        // التنقل للصفحة السابقة
        $("#previousPage").click(function() {
            let prevUrl = $('#previousPagevalue').val();
            if (prevUrl) {
                loadPaginationData(prevUrl);
            }
        });

        function loadPaginationData(fullUrl) {
            let pageParam = fullUrl.split('page=')[1];
            let display = $('#choosequantitytodisplay').val();
            let branch = $('#branch').val();
            let qty = $('#quantity').val();

            $.ajax({
                url: "{{ URL::to('stockquantityPagination') }}/" + branch + "/" + display + "/" + qty + "?page=" + pageParam,
                type: "GET",
                dataType: "json",
                success: function(data) {
                    renderTableRows(data);
                }
            });
        }
    });
</script>
@endsection