@extends('layouts.master')
@section('css')
<link href="{{ URL::asset('assets/plugins/datatable/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" />
<link href="{{ URL::asset('assets/plugins/select2/css/select2.min.css') }}" rel="stylesheet">
<style>
    :root {
        --sp-primary: #1e293b;
        --sp-accent: #419BB2;
        --sp-bg: #f8fafc;
        --sp-surface: #ffffff;
        --sp-border: #e2e8f0;
        --sp-text: #0f172a;
        --sp-radius: 10px;
        --sp-radius-sm: 8px;
    }
    body {
        background-color: var(--sp-bg) !important;
    }
    .custom-card {
        background: var(--sp-surface);
        border-radius: var(--sp-radius);
        border: 1px solid var(--sp-border);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
        overflow: hidden;
    }
    .custom-card-header {
        background: #ffffff;
        padding: 16px 22px;
        border-bottom: 1px solid var(--sp-border);
        display: flex;
        align-items: center;
        gap: 8px;
    }
    .custom-card-title {
        color: var(--sp-primary);
        font-weight: 700;
        font-size: 16px;
        margin: 0;
    }
    .form-label-custom {
        color: var(--sp-primary);
        font-weight: 600;
        font-size: 13.5px;
        margin-bottom: 8px;
        display: flex;
        align-items: center;
        gap: 6px;
    }
    .form-label-custom i {
        color: var(--sp-accent);
    }
    .card-body select.form-control,
    .card-body input.form-control {
        border-radius: var(--sp-radius-sm) !important;
        border: 1px solid #cbd5e1 !important;
        height: 44px;
        font-weight: 600;
        padding: 8px 14px;
        color: #1e293b;
        transition: all 0.2s ease;
    }
    .card-body select.form-control:focus,
    .card-body input.form-control:focus {
        border-color: var(--sp-accent) !important;
        box-shadow: 0 0 0 3px rgba(65, 155, 178, 0.18) !important;
        outline: none;
    }
    .section-divider {
        border-top: 1px dashed var(--sp-border);
        margin: 26px 0;
    }
    /* زر اختيار منتج */
    .btn-choose-product {
        background: #fff8ec;
        border: 1.5px dashed #f0a92e;
        color: #b8760a;
        font-weight: 700;
        border-radius: var(--sp-radius-sm);
        padding: 12px 28px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        transition: all 0.2s ease;
    }
    .btn-choose-product:hover:not(.disabled) {
        background: #fdeecb;
        color: #915c05;
    }
    .btn-choose-product.disabled {
        opacity: .5;
        pointer-events: none;
        cursor: not-allowed;
    }
    /* تنسيق الجدول الاحترافي */
    .table-professional {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
        margin-top: 4px;
    }
    .table-professional thead th {
        background-color: var(--sp-primary) !important;
        color: #ffffff !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        padding: 12px 8px !important;
        border: none !important;
        text-align: center;
    }
    .table-professional tbody td {
        padding: 12px 10px;
        border-top: 1px solid var(--sp-border);
        vertical-align: middle;
        text-align: center;
        color: #334155;
        font-weight: 600;
        background: #fff;
    }
    .table-professional tbody tr:hover td {
        background-color: #f7fbfc;
    }
    .btn-remove {
        color: #dc3545;
        background: #fff5f5;
        border: 1px solid #ffc9c9;
        border-radius: 6px;
        padding: 6px 12px;
        cursor: pointer;
    }
    .btn-remove:hover {
        background: #dc3545;
        color: #fff;
    }
    .empty-products-hint {
        text-align: center;
        color: #94a3b8;
        font-weight: 600;
        font-size: 13px;
        padding: 18px 0;
    }
    /* أزرار الحفظ */
    .btn-action-save {
        background-color: var(--sp-primary);
        border-color: var(--sp-primary);
        color: #fff !important;
        font-weight: 700;
        border-radius: var(--sp-radius-sm);
        padding: 11px 34px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }
    .btn-action-save:hover {
        background-color: #0f172a;
    }
    .btn-action-draft {
        background-color: #ffffff;
        border: 1.5px solid #cbd5e1;
        color: #475569 !important;
        font-weight: 700;
        border-radius: var(--sp-radius-sm);
        padding: 11px 30px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
    }
    .btn-action-draft:hover {
        background-color: #f1f5f9;
    }
    .btn-print-action {
        background-color: var(--sp-accent);
        border-color: var(--sp-accent);
        color: #ffffff !important;
        font-weight: 700;
        border-radius: var(--sp-radius-sm);
        padding: 10px 30px;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        text-decoration: none !important;
    }
    .btn-print-action:hover {
        background-color: #358296;
        color: #fff !important;
    }
    .alert {
        border-radius: 8px !important;
        border: none !important;
        font-weight: 600 !important;
    }
</style>
@endsection
@section('title') {{__('home.send_product_from_other_branch_other')}} @stop
@section('page-header')
<br>
@endsection
@section('content')
{{-- عرض أخطاء التحقق إن وجدت --}}
@if ($errors->any())
<div class="alert alert-danger">
    <ul class="mb-0">
        @foreach ($errors->all() as $error)
        <li>{{ $error }}</li>
        @endforeach
    </ul>
</div>
@endif
@if (session()->has('productupdatedlocation'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
    <strong>{{ session()->get('productupdatedlocation') }}</strong>
    <button type="button" class="close" data-dismiss="alert">&times;</button>
</div>
@endif

@php
    // قيمة الفرع المرسل الافتراضية: old() بعد خطأ تحقق، ثم المسودة، ثم فرع المستخدم
    $selectedBranchFrom = old('branch_from_id', isset($draftMovement) ? $draftMovement->branch_from : ($branchId ?? null));
    $selectedBranchTo   = old('branch', isset($draftMovement) ? $draftMovement->branch_to : null);
    $branchesList       = App\Models\branchs::get();
@endphp

<div class="row">
    <div class="col-xl-12">
        <div class="custom-card">
            <div class="custom-card-header">
                <i class="las la-exchange-alt tx-20 text-primary"></i>
                <h5 class="custom-card-title">{{__('home.send_product_from_other_branch_other')}}</h5>
            </div>
            <div class="card-body p-4 p-md-5">
                <form id="movementForm"
                    action="{{ url(Mcamara\LaravelLocalization\Facades\LaravelLocalization::getCurrentLocale().'/create_sendProduct') }}"
                    method="POST">
                    {{ csrf_field() }}
                    {{-- إذا كنا نقوم بتعديل مسودة مسترجعة، نرسل الـ ID الخاص بها --}}
                    @if(isset($draftMovement))
                    <input type="hidden" name="draft_id" value="{{ $draftMovement->id }}">
                    @endif
                    {{-- حقل مخفي لتحديد حالة الإرسال (مسودة draft أو مكتملة completed) --}}
                    <input type="hidden" name="status" id="movement_status" value="completed">

                    <div class="row">
                        {{-- ✅ الفرع المرسل: name واحد فقط = branch_from_id --}}
                        <div class="col-lg-4 col-md-6 mb-3">
                            <label class="form-label-custom"><i class="las la-store-alt"></i>
                                {{ __('home.choosebranch_sender') ?? 'اختر الفرع المرسل' }} <span class="text-danger">*</span></label>
                            <select name="branch_from_id" id="branch_from_id"
                                class="form-control select2" required style="width:100%;">
                                <option value="">{{ __('home.Select_Sending_Branch') ?? 'اختر الفرع المرسل' }}</option>
                                @foreach ($branchesList as $section)
                                <option value="{{ $section->id }}" {{ $selectedBranchFrom == $section->id ? 'selected' : '' }}>
                                    {{ $section->name }}
                                </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="col-lg-4 col-md-6 mb-3">
                            <label class="form-label-custom"><i class="las la-warehouse"></i>
                                {{ __('home.choosebranch_reciver') }} <span class="text-danger">*</span></label>
                            <select name="branch" id="branchs_id"
                                class="form-control select2" required style="width:100%;">
                                <option value="">{{ __('home.Select_Receiving_Branch') }}</option>
                                @foreach ($branchesList as $section)
                                <option value="{{ $section->id }}" {{ $selectedBranchTo == $section->id ? 'selected' : '' }}>
                                    {{ $section->name }}
                                </option>
                                @endforeach
                            </select>
                        </div>

                        <div class="col-lg-4 col-md-6 mb-3">
                            <label class="form-label-custom"><i class="las la-user-tag"></i>
                                {{ __('home.chooseemployeereciver') }} <span class="text-danger">*</span></label>
                            <select name="employeereciver" id="employeereciver" class="form-control select2"
                                required style="width:100%;">
                                <option value="">{{ __('home.choose_employee_placeholder') ?? 'اختر الموظف المستلم' }}</option>
                                {{-- إذا كانت مسودة قادمة، نضع الموظف المخزن كخيار افتراضي لحين تحديثه بالـ Ajax --}}
                                @if(isset($draftMovement))
                                @php $savedUser = \App\Models\User::find($draftMovement->user_to); @endphp
                                @if($savedUser)
                                <option value="{{ $savedUser->id }}" selected>{{ $savedUser->name }}</option>
                                @endif
                                @endif
                            </select>
                        </div>
                    </div>

                    <div class="section-divider"></div>

                    <div class="d-flex justify-content-center mb-4">
                        <a class="btn-choose-product" id="chooseProductBtn" href="javascript:void(0)"
                            onclick="openProductSearchModal()">
                            <i class="las la-plus-circle tx-18"></i> {{ __('home.chooose product') }}
                        </a>
                    </div>

                    <div class="table-responsive">
                        <table class="table-professional">
                            <thead>
                                <tr>
                                    <th style="width:5%">#</th>
                                    <th>{{ __('home.product') }}</th>
                                    <th style="width:15%">{{ __('home.quantity') }}</th>
                                    <th style="width:20%">{{ __('home.thecostProduct') }}</th>
                                    <th style="width:12%">{{ __('home.operations') }}</th>
                                </tr>
                            </thead>
                            <tbody id="products_body">
                                {{-- استرجاع وعرض منتجات المسودة تلقائياً إن وجدت --}}
                                @if(isset($draftItems) && count($draftItems) > 0)
                                @foreach($draftItems as $item)
                                <tr>
                                    <td class="row-index"></td>
                                    <td>
                                        {{ $item->product->product_name ?? $item->product->name ?? 'منتج غير معروف' }}
                                        <input type="hidden" name="products[]" value="{{ $item->product_id }}">
                                    </td>
                                    <td>
                                        <input type="number" min="0.01" step="any" name="quantities[]"
                                            class="form-control" value="{{ $item->quantity }}"
                                            style="width:100px; margin:auto; height:38px;">
                                    </td>
                                    <td>
                                        {{ $item->cost_per_each_withoud_tax }}
                                        <input type="hidden" name="prices[]" value="{{ $item->cost_per_each_withoud_tax }}">
                                    </td>
                                    <td>
                                        <button type="button" class="btn-remove remove-row"><i class="las la-trash"></i></button>
                                    </td>
                                </tr>
                                @endforeach
                                @endif
                            </tbody>
                        </table>
                        <div class="empty-products-hint" id="emptyProductsHint"
                            @if(isset($draftItems) && count($draftItems) > 0) style="display:none" @endif>
                            <i class="las la-box-open tx-22"></i><br>
                            {{ __('home.no_products_selected_yet') ?? 'لم يتم اختيار أي منتج بعد، اضغط "اختيار منتج" بالأعلى' }}
                        </div>
                    </div>

                    <div class="d-flex justify-content-center align-items-center mt-5" style="gap: 12px;">
                        <button type="button" id="draftBtn" class="btn-action-draft"
                            onclick="submitMovementForm('draft')">
                            <i class="las la-file-alt tx-16"></i> {{ __('home.Save_As_Draft') }}
                        </button>
                        <button type="button" id="submitBtn" class="btn-action-save"
                            onclick="submitMovementForm('completed')">
                            <i class="las la-save tx-16"></i> {{ __('home.save_data') }}
                        </button>
                    </div>
                </form>

                {{-- زر الطباعة (يظهر فقط إذا كان هناك رقم فاتورة) --}}
                @if(session()->has('saved_movement_id') || (isset($data) && !empty($data)))
                @php
                $invoiceId = session()->get('saved_movement_id') ?? $data;
                @endphp
                <div class="d-flex justify-content-center mt-4">
                    <form
                        action="{{ url(Mcamara\LaravelLocalization\Facades\LaravelLocalization::getCurrentLocale() .'/print_Transfer_items') }}"
                        method="POST" target="_blank" class="m-0">
                        {{ csrf_field() }}
                        <input type="number" name="sprint_invoice_number" value="{{ $invoiceId }}" hidden>
                        <button type="submit" class="btn-print-action">
                            <i class="las la-print tx-18"></i> {{ __('home.print') }}
                        </button>
                    </form>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="SearchProduct" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-xl">
        <div class="modal-content" style="border-radius: 12px; overflow:hidden;">
            <div class="modal-body p-4">
                <input type="text" class="form-control mb-3" placeholder="{{ __('home.searchaboutproduct') }}"
                    id="searchaboutproduct" style="height:44px;border-radius:8px;">
                <div id="ajax_responce_serarchDiv"></div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('js')
<script>
    // نصوص مشتركة للترجمة
    const txtSelectSendingBranchFirst = @json(__('home.Select_Sending_Branch_First') ?? 'من فضلك اختر الفرع المرسل أولاً');
    const txtConfirmClearProducts     = @json(__('home.changing_sender_branch_clears_products') ?? 'تغيير الفرع المرسل سيحذف المنتجات المختارة حالياً، هل تريد المتابعة؟');
    const txtProductAlreadyAdded      = @json(__('home.product_already_added') ?? 'المنتج مضاف بالفعل في الجدول');
    const txtSameBranch               = @json(__('home.same_branch_not_allowed') ?? 'لا يمكن أن يكون الفرع المرسل هو نفسه الفرع المستقبل');
    const txtSelectReceivingBranch    = @json(__('home.Select_Receiving_Branch') ?? 'اختر الفرع المستقبل');
    const txtSelectReceivingEmployee  = @json(__('home.Select_Receiving_Employee') ?? 'اختر الموظف المستلم');
    const txtInvalidQuantity          = @json(__('home.invalid_quantity') ?? 'من فضلك أدخل كمية صحيحة أكبر من صفر لكل منتج');
    const currentSavedUser            = @json(isset($draftMovement) ? (string) $draftMovement->user_to : (string) old('employeereciver', ''));

    // نحتفظ بآخر قيمة للفرع المرسل لنرجع لها لو المستخدم ألغى التغيير
    let lastBranchFrom = null;
    let searchTimer = null;

    function getEmployeesByBranch() {
        let branchId = $('#branchs_id').val();
        let employeeSelect = $('#employeereciver');
        let txtLoading = @json(__('home.Loading_Employees'));
        let txtError = @json(__('home.Error_Loading_Data'));
        let txtSelectBranchFirst = @json(__('home.Select_Branch_First'));

        employeeSelect.empty();
        if (!branchId) {
            employeeSelect.append(new Option(txtSelectBranchFirst, '')).trigger('change');
            return;
        }
        employeeSelect.append(new Option(txtLoading, '')).trigger('change');

        $.ajax({
            url: "{{ URL::to('get-branch-employees') }}/" + branchId,
            type: "GET",
            dataType: "json",
            success: function(data) {
                employeeSelect.empty();
                employeeSelect.append(new Option(txtSelectReceivingEmployee, ''));
                $.each(data, function(key, value) {
                    let selected = String(currentSavedUser) === String(value.id);
                    employeeSelect.append(new Option(value.name, value.id, selected, selected));
                });
                employeeSelect.trigger('change');
            },
            error: function() {
                employeeSelect.empty();
                employeeSelect.append(new Option(txtError, '')).trigger('change');
            }
        });
    }

    // يمنع اختيار نفس الفرع مرسل ومستقبل في نفس الوقت
    function syncBranchOptions() {
        let from = $('#branch_from_id').val();
        let to = $('#branchs_id').val();
        $('#branch_from_id option').prop('disabled', false);
        $('#branchs_id option').prop('disabled', false);
        if (to) {
            $('#branch_from_id option[value="' + to + '"]').prop('disabled', true);
        }
        if (from) {
            $('#branchs_id option[value="' + from + '"]').prop('disabled', true);
        }
        toggleChooseProductButton();
    }

    // عند تغيير الفرع المرسل: المنتجات المختارة من مخزون فرع آخر، فيجب تفريغ الجدول
    function onBranchFromChange() {
        let newValue = $('#branch_from_id').val();
        if (newValue === lastBranchFrom) return;

        if ($('#products_body tr').length > 0) {
            if (confirm(txtConfirmClearProducts)) {
                $('#products_body').empty();
                $('#emptyProductsHint').show();
            } else {
                // المستخدم ألغى: نرجع للفرع السابق بدون إعادة إطلاق الحدث
                $('#branch_from_id').val(lastBranchFrom).trigger('change.select2');
                return;
            }
        }
        lastBranchFrom = newValue;
        syncBranchOptions();
    }

    function onBranchToChange() {
        syncBranchOptions();
        getEmployeesByBranch();
    }

    function toggleChooseProductButton() {
        if ($('#branch_from_id').val()) {
            $('#chooseProductBtn').removeClass('disabled');
        } else {
            $('#chooseProductBtn').addClass('disabled');
        }
    }

    function renumberRows() {
        $('#products_body tr').each(function(i) {
            $(this).find('td:first').text(i + 1);
        });
    }

    function openProductSearchModal() {
        if (!$('#branch_from_id').val()) {
            alert(txtSelectSendingBranchFirst);
            return;
        }
        $('#SearchProduct').modal('show');
    }

    $(document).ready(function() {
        if ($.fn.select2) {
            $('.select2').select2();
        }

        // ربط الأحداث هنا (يعمل مع select2 ومع الـ select العادي)
        $('#branch_from_id').on('change', onBranchFromChange);
        $('#branchs_id').on('change', onBranchToChange);

        // جلب الـ draft_id من رابط المتصفح إن وجد
        let urlParams = new URLSearchParams(window.location.search);
        let draftId = urlParams.get('draft_id');
        if (draftId) {
            if ($('input[name="draft_id"]').length === 0) {
                $('#movementForm').prepend($('<input>', { type: 'hidden', name: 'draft_id', value: draftId }));
            } else {
                $('input[name="draft_id"]').val(draftId);
            }
            let cleanUrl = window.location.protocol + "//" + window.location.host + window.location.pathname;
            window.history.replaceState({ path: cleanUrl }, '', cleanUrl);
        }

        lastBranchFrom = $('#branch_from_id').val();
        if ($('#branchs_id').val()) {
            getEmployeesByBranch();
        }
        syncBranchOptions();
        renumberRows();

        // بحث مع تأخير بسيط بدل طلب مع كل ضغطة زر
        $('#searchaboutproduct').on('keyup', function() {
            clearTimeout(searchTimer);
            searchTimer = setTimeout(searchaboutproductfunction, 300);
        });
    });

    function submitMovementForm(status) {
        let txtSelectProduct = @json(__('home.Please_Select_At_Least_One_Product'));
        let txtSavingDraft = @json(__('home.Saving_Draft'));
        let txtSavingFinal = @json(__('home.Saving_Final'));

        let from = $('#branch_from_id').val();
        let to = $('#branchs_id').val();

        if (!from) {
            alert(txtSelectSendingBranchFirst);
            return;
        }
        if (!to) {
            alert(txtSelectReceivingBranch);
            return;
        }
        if (from === to) {
            alert(txtSameBranch);
            return;
        }
        if (!$('#employeereciver').val()) {
            alert(txtSelectReceivingEmployee);
            return;
        }
        if ($('#products_body tr').length === 0) {
            alert(txtSelectProduct);
            return;
        }
        let invalidQty = false;
        $('input[name="quantities[]"]').each(function() {
            let q = parseFloat($(this).val());
            if (isNaN(q) || q <= 0) invalidQty = true;
        });
        if (invalidQty) {
            alert(txtInvalidQuantity);
            return;
        }

        $('#movement_status').val(status);
        $('#submitBtn, #draftBtn').prop('disabled', true);
        if (status === 'draft') {
            $('#draftBtn').html('<i class="fa fa-spinner fa-spin"></i> ' + txtSavingDraft);
        } else {
            $('#submitBtn').html('<i class="fa fa-spinner fa-spin"></i> ' + txtSavingFinal);
        }
        $('#movementForm').submit();
    }

    $('#SearchProduct').on('show.bs.modal', function() {
        $('#searchaboutproduct').val('');
        searchaboutproductfunction();
    });

    function searchaboutproductfunction() {
        let searchtext = $('#searchaboutproduct').val();
        let branch_from = $('#branch_from_id').val();
        if (!branch_from) {
            alert(txtSelectSendingBranchFirst);
            $('#SearchProduct').modal('hide');
            return;
        }
        if (searchtext.trim() == '') {
            searchtext = "1";
        }
        $.ajax({
            url: "{{ URL::to('searchChooseProductpaginatenew') }}/" + encodeURIComponent(searchtext) + "/" + branch_from,
            type: 'get',
            success: function(data) {
                $("#ajax_responce_serarchDiv").html(data);
            }
        });
    }

    function chooseProduct(id, name, sale_price) {
        if ($('#products_body input[name="products[]"][value="' + id + '"]').length > 0) {
            alert(txtProductAlreadyAdded);
            return;
        }
        $('#emptyProductsHint').hide();

        let row = $('<tr>');
        row.append($('<td>'));
        row.append($('<td>').text(name).append($('<input>', { type: 'hidden', name: 'products[]', value: id })));
        row.append($('<td>').append($('<input>', {
            type: 'number', min: '0.01', step: 'any', name: 'quantities[]',
            class: 'form-control', value: 1, style: 'width:100px; margin:auto; height:38px;'
        })));
        row.append($('<td>').text(sale_price).append($('<input>', { type: 'hidden', name: 'prices[]', value: sale_price })));
        row.append($('<td>').html('<button type="button" class="btn-remove remove-row"><i class="las la-trash"></i></button>'));

        $('#products_body').append(row);
        renumberRows();
        $('#SearchProduct').modal('hide');
    }

    $(document).on('click', '.remove-row', function() {
        $(this).closest('tr').remove();
        renumberRows();
        if ($('#products_body tr').length === 0) {
            $('#emptyProductsHint').show();
        }
    });
</script>
@endsection