@extends('companyuser::layouts.master')
@section('title', __('companyuser::sidebar.Requisitions'))
@section('extra-styles')
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/filter.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/style-svgFont.css') }}">
    <script src="{{ asset('js/app.js') }}" defer></script>
@endsection
{{-- didnt read --}}
@push('extra-styles')
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/filter.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/plugins/input-dropdown/input-dropdown.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/css/plugins/range/range.css') }}">
@endpush
@push('extra-scripts')
    <script src="{{ asset('assets/js/plugins/range/balance-range.js') }}"></script>
    <script src="{{ asset('assets/js/plugins/input-dropdown/input-dropdown.js') }}"></script>
@endpush
<style>
    .swal2-container.swal2-center{
        z-index: 99999999;
    }
    .select2 {
        width: 100% !important;
    }
    a.disabled {
        pointer-events: none;
        cursor: default;
    }
    .table td,
    .table th {
        font-size: 0.8rem !important;
    }
    a.disabled-delete,
    a.disabled-delete:hover {
        background-color: #a7a7a7 !important;
        border-color: #a7a7a7 !important;
    }
    /* Styles for requisitions with deleted products */
    .requisition-warning-row {
        background-color: #fff3cd !important;
    }
    .requisition-warning-row td {
        background-color: #fff3cd !important;
    }
    .warning-indicator {
        color: #856404;
        font-size: 1rem !important;
        cursor: help;
    }
    .warning-indicator:hover {
        color: #d39e00;
    }
</style>
@if (app()->getlocale() == 'en')
    <style>
        div.dataTables_filter {
            display: inline-block;
            width: 50%;
            vertical-align: middle;
            text-align: right;
        }

        #requisitions_table_filter {
            width: 100%;
        }
    </style>
@endif
@section('breadcrumb')
    <div class="row breadcrumbs-top">
        <div class="breadcrumb-wrapper col-xs-12">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a>@lang('companyuser::sidebar.Inventory')</a></li>
                <li class="breadcrumb-item active"><a href="#">@lang('companyuser::sidebar.Requisitions')</a></li>
            </ol>
        </div>
    </div>
@endsection

@section('content')
    @if (checkAddonAvailability(request()->get('tenant_current_subscription')->id, \Modules\Tenant\Enums\SystemAddonEnum::INVENTORY_MODULE))
        <section>
            <div class="container-fluid">
                <div class="headBtns mx-1 fixed-btns">
                    <div class="btn-group pull-right">
                        @can('inventory.requisitions.create')
                            <a type="button" data-toggle="dropdown" aria-haspopup="true" class="bg-transparent"
                                style="font-size: inherit; border:none;" aria-expanded="false" title="{{ __('Add') }}">
                                <span class="icon-Add action-icon"></span>
                            </a>
                            <div class="dropdown-menu" id="saveAndCreate">
                                @if(auth()->user()->can('inventory.requisitions.inbound.create') || auth()->user()->adjustRolesLikeOwnerPermissions())
                                <a class="dropdown-item" href="{{ route('company.requisitions.create', ['subdomain' => $subdomain, 'type' => \Modules\Inventory\Enums\RequisitionTypeEnum::INBOUND]) }}">{{ __('inventory::requisitions.inbound') }}</a>
                                @endif
                                @if(auth()->user()->can('inventory.requisitions.outbound.create') || auth()->user()->adjustRolesLikeOwnerPermissions())
                                <a class="dropdown-item" href="{{ route('company.requisitions.create', ['subdomain' => $subdomain, 'type' => \Modules\Inventory\Enums\RequisitionTypeEnum::OUTBOUND]) }}">{{ __('inventory::requisitions.outbound') }}</a>
                                @endif
                                @if(auth()->user()->can('inventory.requisitions.transfer.create') || auth()->user()->adjustRolesLikeOwnerPermissions())
                                <a class="dropdown-item" href="{{ route('company.requisitions.create', ['subdomain' => $subdomain, 'type' => \Modules\Inventory\Enums\RequisitionTypeEnum::TRANSFER]) }}">{{ __('inventory::requisitions.transfer') }}</a>
                                @endif
                            </div>
                        @endcan
                    </div>
                    {{-- @can('sales.customers.export') --}}
                    <div class="mb-1 pull-left">
                        {{-- <a href="{{route('company.requisition.export', ['subdomain' => $subdomain, 'status' => request('status'), 'from' => request('from'), 'to' => request('to')]+request()->all())}}" class="{{ !count($requisitions) ? 'disabled' : '' }} pull-left"
                            title="@lang('reports::reports.download_excel')">
                            <span class="icon-Excel action-icon"></span>
                        </a> --}}
                        <a href="{{route('company.requisition.exporting-pdf', ['subdomain' => $subdomain,'to_export' => 1 ] + request()->all() )}}" class="{{!count($requisitions) ? 'disabled' : ''}} pull-left" title="@lang('reports::reports.Download_Pdf')">
                            <span class="icon-Pdf action-icon"></span>
                        </a>
                        <a href="{{route('company.requisition.print-requisitions-list', ['subdomain' => $subdomain ,'to_export' => 1  ] + request()->all() )}}" class="{{ !count($requisitions) ? 'disabled' : '' }} pull-left" target="_blank"
                            title="@lang('Print')">
                            <span class="icon-Print action-icon"></span>
                        </a>
                    </div>
                    {{-- @endcan --}}
                </div>
                <div class="row mt-1">
                    <div class="col-md-12 mb-2">
                        <div>
                            <button class="btn btn-primary w-100 filterbtn" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                                <div class="d-flex justify-content-between">
                                    <span>@lang('Filter') </span><i class="fa fa-angle-down"></i>
                                </div>
                            </button>
                        </div>
                        <div class="collapse filter-collapse filter-section-collapse" id="collapseExample">
                            <form action="{{ route('company.requisitions.index', ['subdomain' => $subdomain]) }}" method="GET" class="form form-horizontal striped-rows form-bordered dev-form-validate" novalidate>
                                <div class="card card-body mb-0">
                                    <div class="row g-3">
                                        <div class="col-md-12 mt-2">
                                            <div class="form-group">
                                                <label for="warehouse_id" class="form-label">@lang('inventory::requisitions.warehouse')</label>
                                                <select name="warehouse_id" class="w-100 py-1 form-control select2-tag h-45" style="width:100%">
                                                    @if (auth()->user()->adjustRolesLikeOwnerPermissions())
                                                        <option value="">{{ __('All') }}</option>
                                                    @endif
                                                    @foreach ($warehouses as $warehouse)
                                                        <option value="{{ $warehouse->id }}" {{ request('warehouse_id') == $warehouse->id ? 'selected' : '' }}>{{ $warehouse['title_' . app()->getLocale()] }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row g-3">
                                        <div class="col-lg-6 mt-2">
                                            <div class="form-group">
                                                <label for="type" class="form-label">@lang('inventory::requisitions.type')</label>
                                                    <select name="type" id="type" class="form-control" aria-label="@lang('inventory::requisitions.type')">
                                                    @if (auth()->user()->adjustRolesLikeOwnerPermissions())
                                                        <option value="" {{ !request('type') ? 'selected' : '' }}>@lang('All')</option>
                                                    @endif

                                                    @foreach (\Modules\Inventory\Enums\RequisitionTypeEnum::TYPE_MAPPING as $type)
                                                        @php
                                                            $typeString = \Modules\Inventory\Enums\RequisitionTypeEnum::toString($type);
                                                            $permission = "inventory.requisitions.$type.view";
                                                        @endphp

                                                        @if(auth()->user()->can($permission) || auth()->user()->adjustRolesLikeOwnerPermissions())
                                                            <option value="{{ $type }}" {{ request('type') == $type ? 'selected' : '' }}>
                                                                {{ $typeString }}
                                                            </option>
                                                        @endif
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-lg-6 mt-2">
                                            <div class="form-group">
                                                <label for="created_by" class="form-label">@lang('inventory::requisitions.created_by')</label>
                                                <select name="created_by" class="form-control select2-tag" aria-label="@lang('inventory::requisitions.created_by')">
                                                    <option value="">{{ __('All') }}</option>
                                                    <option value="{{ auth()->user()->id }}" {{ request('created_by') == auth()->user()->id ? 'selected' : '' }}>@lang('accounting::assets.You')</option>
                                                    @foreach ($users as $user)
                                                        <option value="{{ $user->id }}" {{ request('created_by') == $user->id ? 'selected' : '' }}>{{ $user->uname }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row g-3">
                                        <div class="col-lg-6 mt-2">
                                            <div class="form-group">
                                                <label for="date_from" class="form-label">@lang('sales::invoices.Date')</label>
                                                <div class="row g-2">
                                                    <div class="col-md-6 w-50-ipad-portrait mb-half">
                                                        <x-date-picker
                                                            name="date_from"
                                                            id="date_from"
                                                            :value="request('date_from')"
                                                            input-class="h-45"
                                                            :is-invalid="$errors->has('date_from')"
                                                        />
                                                        @error('date_from')
                                                            <div class="invalid-feedback text text-danger" role="alert">
                                                                <p>{{ $message }}</p>
                                                            </div>
                                                        @enderror
                                                    </div>
                                                    <div class="col-md-6 w-50-ipad-portrait mb-half">
                                                        <x-date-picker
                                                            name="date_to"
                                                            id="date_to"
                                                            :value="request('date_to')"
                                                            :min-date="request('date_from')"
                                                            input-class="h-45"
                                                            :is-invalid="$errors->has('date_to')"
                                                        />
                                                        @error('date_to')
                                                            <div class="invalid-feedback text text-danger" role="alert">
                                                                <p>{{ $message }}</p>
                                                            </div>
                                                        @enderror
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-lg-6 mt-2">
                                            <div class="form-group">
                                                <label for="status" class="form-label">@lang('sales::customers.Status')</label>
                                                <select name="status" id="status" class="form-control" aria-label="@lang('sales::customers.Status')">
                                                    <option value="" {{ !request('status') ? 'selected' : '' }}>@lang('All')</option>
                                                    @foreach (\Modules\Inventory\Enums\RequisitionStatusEnum::STATUS_MAPPING as $status)
                                                        <option value="{{ $status }}" {{ request('status') == $status ? 'selected' : '' }}>{{ \Modules\Inventory\Enums\RequisitionStatusEnum::toString($status) }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="text-left mt-2">
                                        <button type="submit" class="btn btn-info mr-1 mb-1 p-5">
                                            <img src="{{ asset('assets/images/Done.png') }}" alt="done" width="35px">
                                        </button>
                                        <button type="reset" id="reset" class="btn btn-warning mb-1 p-5">
                                            <span class="icon-Delete f-32"></span>
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                @include('companyuser::errors.all')
                @include('companyuser::errors.lists')
                <div>
                    <section id="configuration">
                        <div class="row">
                            <div class="col-xs-12">
                                <div class="card">
                                    <div class="card-body collapse in">
                                        <table class="table table-striped table-responsive" style="width:100%;display: inline-table;border-collapse: collapse !important;" id="requisitions_table">
                                            <thead>
                                                <tr>
                                                    <th>@lang('inventory::requisitions.reference_id')</th>
                                                    <th>@lang('inventory::requisitions.type')</th>
                                                    <th>@lang('inventory::requisitions.created_by')</th>
                                                    <th>@lang('inventory::requisitions.date_of_creation')</th>
                                                    <th>@lang('inventory::requisitions.status')</th>
                                                    <th style="width: 20%;">@lang('inventory::requisitions.warehouse')</th>
                                                    <th>{{ __('Actions') }}</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                            </tbody>
                                        </table>
                                        {{---------------- Delete Requisition popup------------------------------}}
                                        <div class="modal fade" id="deleteRequisitionModal" tabindex="-1" role="dialog" aria-labelledby="deleteRequisitionModalLabel">
                                            <div class="modal-dialog" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                        <h4 class="modal-title" id="deleteRequisitionModalLabel">@lang('Delete')</h4>
                                                    </div>
                                                    <div class="modal-body">
                                                        <p>@lang('inventory::requisitions.delete confirmation message')</p>
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-default mx-1" data-dismiss="modal">@lang('Cancel')</button>
                                                        <span class="@if(app()->getlocale() == 'ar') pull-right @else pull-left @endif mx-1">
                                                            <form action="" method="POST" class="form delete-form" id="deleteRequisition">
                                                                @csrf
                                                                @method('delete')
                                                                <button type="submit" class="btn btn-primary" id="deleteRequisitionBtn">@lang('Delete')</button>
                                                            </form>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        {{---------------- Update Requisition Status popup -------------------------------}}
                                        <div class="modal fade" id="updateRequisitionStatusModal" tabindex="-1" role="dialog" aria-labelledby="updateRequisitionStatusModalLabel">
                                            <div class="modal-dialog" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                        <h4 class="modal-title" id="updateRequisitionStatusModalLabel">@lang('inventory::requisitions.update_status_header')</h4>
                                                    </div>
                                                    <div class="modal-body">
                                                        <p>@lang('inventory::requisitions.update_status_message')</p>
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-default mx-1" data-dismiss="modal">@lang('Cancel')</button>
                                                        <span class="@if(app()->getlocale() == 'ar') pull-right @else pull-left @endif mx-1">
                                                            <form action="" method="POST" class="form update-status-form" id="updateRequisitionStatus">
                                                                @csrf
                                                                @method('put')
                                                                <button type="submit" class="btn btn-primary" id="updateRequisitionStatusBtn">@lang('Update')</button>
                                                            </form>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        {{---------------- Convert Requisition popup -------------------------------}}
                                        <div class="modal fade" id="convertRequisitionModal" tabindex="-1" role="dialog" aria-labelledby="convertRequisitionModalLabel">
                                            <div class="modal-dialog" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                        </button>
                                                        <h4 class="modal-title" id="convertRequisitionModalLabel">@lang('inventory::requisitions.convert_header')</h4>
                                                    </div>
                                                    <div class="modal-body">
                                                        <p id="convertRequisitionModalMessage" class="mb-0"></p>
                                                    </div>
                                                    <div class="modal-footer">
                                                        <button type="button" class="btn btn-default mx-1" data-dismiss="modal">@lang('Cancel')</button>
                                                        <a href="#" class="btn btn-primary mx-1" id="confirmConvertRequisitionBtn">@lang('inventory::requisitions.Convert')</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </section>
    @else
        <div class="col-md-12" style="padding: 8px;margin-bottom:15px">
            @include('companyuser::components.addon-not-available', ['addon' => __('companyuser::addons.inventory_module')])
        </div>
    @endif
@endsection

@section('extra_scripts')
    <script>
        gtag('event', 'web_inventory_requisitions_list');
        console.log('web_inventory_requisitions_list event');
        const loggedInUserId = {{ auth()->id() }};
    </script>
    <script src="{{ asset('vendor/sweetalert/sweetalert.all.js') }}"></script>
    <script>
        window.addEventListener('DOMContentLoaded', function() {
            $(document).ready(function() {
                // Handle form submission via action buttons
                $('.form-submit-button').click(function() {
                    const action = $(this).attr('action-value'); // Get action value
                    $('#action-type').val(action); // Set hidden input
                    $('#update_settings_form').submit(); // Submit the form
                });

                // Delete popup
                $(document).on('click', '.delete-button', function() {
                    $("#deleteRequisition").attr("action", $(this).attr('data-url'));
                });

                // Update status popup
                $(document).on('click', '.update-status-button', function() {
                    $("#updateRequisitionStatus").attr("action", $(this).attr('data-url'));
                });

                // Reset filter dropdowns
                $(document).on('touchstart click', '#reset', function(e) {
                    e.preventDefault();
                    $('.filter-collapse .form-control').val("");
                    $('.filter-collapse .select2-tag').val(null).trigger('change');
                });
                var requisitionTypes = @json(trans('inventory::requisitions'));

                var translations = {
                    view: @json(__('View')),
                    edit:  @json(__('Edit')),
                    print: @json(__('inventory::requisitions.Print')),
                    download: @json(__('inventory::requisitions.Download')),
                    approve:  @json(__('inventory::requisitions.Approve')),
                    decline: @json(__('inventory::requisitions.Decline')),
                    convert_invoice:  @json(__('inventory::requisitions.ConvertToInvoice')),
                    convert_bill:  @json(__('inventory::requisitions.ConvertToBill')),
                    delete:  @json(__('inventory::requisitions.Delete')),
                };


                $('#requisitions_table').DataTable({
                    processing: true,
                    serverSide: true,
                    search: true,
                    responsive: true,
                    ordering: true,
                    paging: true,
                    ajax: {
                        url: "{{ route('company.requisitions.index', $subdomain) }}",
                        data: {!! json_encode(request()->all()) !!},
                        dataSrc: function(json) {

                            return json.data;
                        }
                    },
                    columns: [
                        {
                            "data": "reference",
                            "render": function(data, type, row, meta) {
                                let reference_html = `<a href="${row.show_url}" target="_blank">${data}</a>`;
                                // Add warning indicator for deleted products
                                if (row.has_deleted_products) {
                                    reference_html = `
                                        <i class="fa fa-exclamation-triangle warning-indicator mr-2"
                                           data-toggle="tooltip"
                                           title="@lang('inventory::requisitions.has_deleted_products')"
                                           data-placement="top"></i>
                                    ` + reference_html;
                                }
                                return reference_html;
                            }
                        },
                        {
                            "data": "type",
                            "render": function(data, type, row) {
                                return requisitionTypes[data] ? requisitionTypes[data] :
                                '#';
                            }
                        },
                        {
                            "data": "created_by.uname",
                            "render": function (data, type, row) {
                                if (!row.created_by) {
                                    return "@lang('accounting::assets.System')";
                                } else if (row.created_by.id === loggedInUserId) {
                                    return "@lang('accounting::assets.You')";
                                } else {
                                    return row.created_by.uname;
                                }
                            }
                        },
                        {
                            "data": "formatted_date",
                        },
                        {
                            "data": "status",
                            "render": function(data, type, row) {
                                return requisitionTypes[data] ? requisitionTypes[data] :
                                '#';
                            }
                        },
                        {
                            "data": "warehouse",
                            "render": function(data, type, row) {
                                let localLang = "{{ app()->getLocale() }}";
                                if (row.type == 'transfer') {
                                    return (row.from_warehouse["title_" + localLang] ? row.from_warehouse["title_" + localLang] : '#') +
                                        ' -> ' +
                                        (row.warehouse["title_" + localLang] ? row.warehouse["title_" + localLang] : '#');
                                } else if  (row.type == 'outbound') {
                                    return row.from_warehouse && row.from_warehouse["title_" + localLang] ?
                                        row.from_warehouse["title_" + localLang] : '#';
                                } else if  (row.type == 'inbound'){
                                    return row.warehouse && row.warehouse["title_" + localLang] ?
                                        row.warehouse["title_" + localLang] : '#';
                                }
                            }
                        },
                        {
                            "data": null,
                            "render": function(data, type, row, meta) {
                                // Check if requisition has deleted products
                                let hasDeletedProducts = row.has_deleted_products || false;
                                let canBeAccepted = row.can_be_accepted !== false;
                                let canBeConvertedToInvoice = row.can_be_converted_to_invoice !== false;
                                let canBeConvertedToBill = row.can_be_converted_to_bill !== false;

                                let action_html = '';
                                @if (auth()->user()->adjustRolesLikeOwnerPermissions())
                                    action_html += `
                                        ${(row.type === 'outbound' && row.status === 'accepted' && canBeConvertedToInvoice) ? `
                                        <a href="${row.create_invoice_from_requisition_url}" data-id="${row.id}" data-convert-type="invoice" class='btn btni rounded-circle font-small-2 btn-primary btn-xs text-white convert-requisition' data-toggle="tooltip" title="${translations.convert_invoice}">
                                            <i class="fa fa-arrow-right"></i>
                                        </a>
                                        ` : ''}`;
                                    action_html += `
                                        ${(row.type === 'inbound' && row.status === 'accepted' && canBeConvertedToBill) ? `
                                        <a href="${row.create_bill_from_requisition_url}" data-convert-type="bill" class='btn btni rounded-circle font-small-2 btn-success btn-xs text-white convert-requisition' data-toggle="tooltip" title="${translations.convert_bill}">
                                            <i class="fa fa-arrow-right"></i>
                                        </a>
                                        ` : ''}`;
                                    action_html +=`
                                        ${(row.type === 'inbound' && row.status !== 'converted') ? `
                                            ${canBeAccepted ? `
                                                <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-success btn-xs text-white ${row.status == 'accepted' ? 'd-none' : ''}" data-url="${row.accept_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.approve}">
                                                    <i class="fa fa-check"></i>
                                                </a>
                                                ` : ''}
                                                <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-danger btn-xs text-white ${(row.status == 'rejected' || row.status == 'accepted') ? 'd-none' : ''}" data-url="${row.reject_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.decline}">
                                                    <i class="fa fa-times"></i>
                                                </a>
                                            ` : ''}
                                        `;
                                    action_html +=`
                                        ${(row.type === 'outbound' && row.status !== 'converted') ? `
                                            ${canBeAccepted ? `
                                                <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-success btn-xs text-white ${row.status == 'accepted' ? 'd-none' : ''}" data-url="${row.accept_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.approve}">
                                                    <i class="fa fa-check"></i>
                                                </a>
                                                ` : ''}
                                                <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-danger btn-xs text-white ${(row.status == 'rejected' || row.status == 'accepted') ? 'd-none' : ''}" data-url="${row.reject_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.decline}">
                                                    <i class="fa fa-times"></i>
                                                </a>
                                            ` : ''}
                                        `;
                                    action_html +=`
                                        ${(row.type === 'transfer' && row.status !== 'converted') ? `
                                            ${canBeAccepted ? `
                                                <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-success btn-xs text-white ${row.status == 'accepted' ? 'd-none' : ''}" data-url="${row.accept_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.approve}">
                                                    <i class="fa fa-check"></i>
                                                </a>
                                                ` : ''}
                                                <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-danger btn-xs text-white ${(row.status == 'rejected' || row.status == 'accepted') ? 'd-none' : ''}" data-url="${row.reject_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.decline}">
                                                    <i class="fa fa-times"></i>
                                                </a>
                                            ` : ''}
                                        `;

                                    action_html += (row.status != 'accepted' && row.status != 'converted') ? `
                                        <a data-requisition-id="${row.id}" class='btn btni rounded-circle font-small-2 btn-info btn-xs btn-edit text-white edit-requisition' data-toggle="tooltip" title="${translations.edit}">
                                            <i class="fa fa-pencil"></i>
                                        </a>` : '';


                                    action_html += (row.status != 'accepted' && row.status != 'converted') ? `
                                        <a href="#" target="_blank" class="btn btni rounded-circle font-small-2 btn-sm  btn-danger delete-button text-white" data-toggle="modal" data-target="#deleteRequisitionModal" data-url="${row.destroy_url}" title="@lang('Delete')"><i class="fa fa-trash"></i></a>
                                        ` : '';
                                @else
                                    @can('inventory.requisitions.outbound.convert-to-bill')
                                        action_html += `
                                            ${(row.type === 'outbound' && row.status === 'accepted' && canBeConvertedToInvoice) ? `
                                                <a href="${row.create_invoice_from_requisition_url}" data-id="${row.id}" data-convert-type="invoice" class='btn btni rounded-circle font-small-2 btn-primary btn-xs text-white convert-requisition' data-toggle="tooltip" title="${translations.convert_invoice}">
                                                    <i class="fa fa-arrow-right"></i>
                                                </a>
                                                ` : ''}`;
                                    @endcan
                                    @can('inventory.requisitions.inbound.convert-to-bill')
                                        action_html += `
                                            ${(row.type === 'inbound' && row.status === 'accepted' && canBeConvertedToBill) ? `
                                            <a href="${row.create_bill_from_requisition_url}" data-convert-type="bill" class='btn btni rounded-circle font-small-2 btn-success btn-xs text-white convert-requisition' data-toggle="tooltip" title="${translations.convert_bill}">
                                                <i class="fa fa-arrow-right"></i>
                                            </a>
                                            ` : ''}`;
                                    @endcan
                                    @can('inventory.requisitions.inbound.approve')
                                        action_html +=`
                                            ${(row.type === 'inbound' && row.status !== 'converted') ? `
                                                ${canBeAccepted ? `
                                                    <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-success btn-xs text-white ${row.status == 'accepted' ? 'd-none' : ''}" data-url="${row.accept_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.approve}">
                                                        <i class="fa fa-check"></i>
                                                    </a>
                                                    ` : ''}
                                                    <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-danger btn-xs text-white ${(row.status == 'rejected' || row.status == 'accepted') ? 'd-none' : ''}" data-url="${row.reject_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.decline}">
                                                        <i class="fa fa-times"></i>
                                                    </a>
                                                ` : ''}
                                            `;
                                    @endcan
                                    @can( 'inventory.requisitions.outbound.approve')
                                        action_html +=`
                                            ${(row.type === 'outbound' && row.status !== 'converted') ? `
                                                ${canBeAccepted ? `
                                                    <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-success btn-xs text-white ${row.status == 'accepted' ? 'd-none' : ''}" data-url="${row.accept_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.approve}">
                                                        <i class="fa fa-check"></i>
                                                    </a>
                                                    ` : ''}
                                                    <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-danger btn-xs text-white ${(row.status == 'rejected' || row.status == 'accepted') ? 'd-none' : ''}" data-url="${row.reject_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.decline}">
                                                        <i class="fa fa-times"></i>
                                                    </a>
                                                ` : ''}
                                            `;
                                    @endcan
                                    @can( 'inventory.requisitions.transfer.approve')
                                        action_html +=`
                                            ${(row.type === 'transfer' && row.status !== 'converted') ? `
                                                ${canBeAccepted ? `
                                                    <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-success btn-xs text-white ${row.status == 'accepted' ? 'd-none' : ''}" data-url="${row.accept_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.approve}">
                                                        <i class="fa fa-check"></i>
                                                    </a>
                                                    ` : ''}
                                                    <a href="#" class="btn btni rounded-circle font-small-2 update-status-button btn-danger btn-xs text-white ${(row.status == 'rejected' || row.status == 'accepted') ? 'd-none' : ''}" data-url="${row.reject_url}" data-toggle="modal" data-target="#updateRequisitionStatusModal" title="${translations.decline}">
                                                        <i class="fa fa-times"></i>
                                                    </a>
                                                ` : ''}
                                            `;
                                    @endcan
                                    @can('inventory.requisitions.inbound.edit')
                                        action_html += (row.type === 'inbound' && row.status != 'accepted' && row.status != 'converted') ? `
                                            <a data-requisition-id="${row.id}" class='btn btni rounded-circle font-small-2 btn-info btn-xs btn-edit text-white edit-requisition' data-toggle="tooltip" title="${translations.edit}">
                                                <i class="fa fa-pencil"></i>
                                            </a>` : '';
                                    @endcan
                                    @can('inventory.requisitions.inbound.delete')
                                        action_html += (row.type === 'inbound' && row.status != 'accepted' && row.status != 'converted') ? `
                                            <a href="#" target="_blank" class="btn btni rounded-circle font-small-2 btn-sm  btn-danger delete-button text-white" data-toggle="modal" data-target="#deleteRequisitionModal" data-url="${row.destroy_url}" title="@lang('Delete')"><i class="fa fa-trash"></i></a>
                                            ` : '';
                                    @endcan
                                    @can('inventory.requisitions.outbound.edit')
                                        action_html += (row.type === 'outbound' && row.status != 'accepted' && row.status != 'converted') ? `
                                            <a data-requisition-id="${row.id}" class='btn btni rounded-circle font-small-2 btn-info btn-xs btn-edit text-white edit-requisition' data-toggle="tooltip" title="${translations.edit}">
                                                <i class="fa fa-pencil"></i>
                                            </a>` : '';
                                    @endcan
                                    @can('inventory.requisitions.outbound.delete')
                                        action_html += (row.type === 'outbound' && row.status != 'accepted' && row.status != 'converted') ? `
                                            <a href="#" target="_blank" class="btn btni rounded-circle font-small-2 btn-sm  btn-danger delete-button text-white" data-toggle="modal" data-target="#deleteRequisitionModal" data-url="${row.destroy_url}" title="@lang('Delete')"><i class="fa fa-trash"></i></a>
                                            ` : '';
                                    @endcan
                                    @can('inventory.requisitions.transfer.edit')
                                        action_html += (row.type === 'transfer' && row.status != 'accepted' && row.status != 'converted') ? `
                                            <a data-requisition-id="${row.id}" class='btn btni rounded-circle font-small-2 btn-info btn-xs btn-edit text-white edit-requisition' data-toggle="tooltip" title="${translations.edit}">
                                                <i class="fa fa-pencil"></i>
                                            </a>` : '';
                                    @endcan
                                    @can('inventory.requisitions.transfer.delete')
                                        action_html += (row.type === 'transfer' && row.status != 'accepted' && row.status != 'converted') ? `
                                            <a href="#" target="_blank" class="btn btni rounded-circle font-small-2 btn-sm  btn-danger delete-button text-white" data-toggle="modal" data-target="#deleteRequisitionModal" data-url="${row.destroy_url}" title="@lang('Delete')"><i class="fa fa-trash"></i></a>
                                            ` : '';
                                    @endcan
                                @endif
                                action_html += `
                                        <a href="${row.print_url}" target="_blank" class="btn btni rounded-circle font-small-2 btn-sm  btn-primary text-white" data-toggle="tooltip" title="${translations.print}">
                                            <i class="fa fa-print"></i>
                                        </a>
                                        <a href="${row.download_url}" download class="btn btni rounded-circle font-small-2 btn-sm  btn-primary text-white" data-toggle="tooltip" title="${translations.download}">
                                            <i class="fa fa-file-pdf-o"></i>
                                        </a>
                                    `;
                                return action_html;
                            }
                        }
                    ],
                    "columnDefs": [{
                            "searchable": false,
                            "targets": [0, 4, 5, 6]
                        },
                        {
                            "orderable": false,
                            "targets": [2, 3, 5, 6]
                        }
                    ],
                    rowCallback: function(row, data) {
                        // Highlight entire row if it has deleted products
                        if (data.has_deleted_products) {
                            $(row).addClass('requisition-warning-row');
                        }
                    },
                    language: {
                        "url": "{{ App::isLocale('ar') ? 'https://cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Arabic.json' : '' }}"
                    }
                });

                // Initialize tooltips for warning indicators
                $(document).on('mouseenter', '[data-toggle="tooltip"]', function() {
                    $(this).tooltip('show');
                });
                $(document).on('mouseleave', '[data-toggle="tooltip"]', function() {
                    $(this).tooltip('hide');
                });

                // Handle actions (show, edit, delete)
                $(document).on('click', '.show-requisition', function() {
                    const requisitionId = $(this).data('requisition-id');
                    const
                        url =
                        "{{ route('company.requisition.show', ['subdomain' => $subdomain, 'requisition' => ':id']) }}"
                        .replace(':id', requisitionId);
                    window.location.href = url;
                });
                $(document).on('click', '.edit-requisition', function() {
                    const requisitionId = $(this).data('requisition-id');
                    const
                        url =
                        "{{ route('company.requisition.edit', ['subdomain' => $subdomain, 'requisition' => ':id']) }}"
                        .replace(':id', requisitionId);
                    window.location.href = url;
                });

                $('body').on('click', '.cant-be-converted-to-invoice', function(e) {
                    let item = $(this);
                    let event = e;
                    let requisition_id = $(this).data('id');
                    // Fetch issues with the requisition
                    $.ajax({
                        url: `{{ route('inventory.entity.convert-to-invoice-issues', ['type' => 'Modules\Inventory\Models\Requisition', 'id' => ':id']) }}`.replace(':id', requisition_id),
                        method: 'GET',
                        headers: {
                            'Accept-Language': '{{ LaravelLocalization::getCurrentLocale() }}'
                        },
                        success: function(response) {
                            if (Object.keys(response).length > 0) {
                                let message = `
                                    <ul style="padding: 25px 0;margin: 0;text-align: {{ LaravelLocalization::getCurrentLocale() === 'ar' ? 'right' : 'left' }};direction: {{ LaravelLocalization::getCurrentLocale() === 'ar' ? 'rtl' : 'ltr' }};">
                                        ${(response.quantity_issue?.length > 0) ? '<li>@lang("inventory::inventory.quantity_issues")</li>' : ''}
                                        ${(response.quantity_issue?.length > 0) ? response.quantity_issue?.map(issue => `<li style="background-color: #f8d7da;padding: 10px;border-radius: 5px;margin-bottom: 5px;">${issue}</li>`).join('') : ''}
                                        <br />
                                        ${(response.cost_center_issue?.length > 0) ? '<li>@lang("inventory::inventory.cost_center_issues")</li>' : ''}
                                        ${(response.cost_center_issue?.length > 0) ? response.cost_center_issue?.map(issue => `<li style="background-color: #f8d7da;padding: 10px;border-radius: 5px;margin-bottom: 5px;">${issue}</li>`).join('') : ''}
                                    </ul>
                                    <br />
                                    <p>@lang("inventory::inventory.edit_requisition_to_fix_issues")</p>
                                `;
                                Swal.fire({
                                    title: "@lang('inventory::inventory.cannot_convert_to_invoice')",
                                    html: message,
                                    icon: 'warning',
                                    button: '@lang("sales::invoices.close")',
                                    // footer: '<a href="#">@lang("inventory::inventory.why_this_issue")</a>'
                                });
                            }
                        }
                    });
                });

                $(document).on('click', '.delete-requisition', function() {
                    const requisitionId = $(this).data('requisition-id');
                    const
                        url =
                        "{{ route('company.requisition.destroy', ['subdomain' => $subdomain, 'requisition' => ':id']) }}"
                        .replace(':id', requisitionId);
                    $('#delete-form').attr('action', url);
                });

                // Conversion confirmation (messages are in lang files)
                const convertConfirmTranslations = {
                    invoice: @json(__('inventory::requisitions.convert_confirmation_invoice')),
                    bill: @json(__('inventory::requisitions.convert_confirmation_bill')),
                };

                // Show modal confirmation on convert actions
                $(document).on('click', '.convert-requisition', function(e) {
                    e.preventDefault();
                    const url = $(this).attr('href');
                    const type = $(this).data('convert-type');

                    // Set message text
                    $('#convertRequisitionModalMessage').text(convertConfirmTranslations[type] ?? convertConfirmTranslations.bill);
                    // Attach target url to confirm button
                    $('#confirmConvertRequisitionBtn').attr('href', url);

                    // Show modal
                    $('#convertRequisitionModal').modal('show');
                });

                // Handle confirm convert button
                $(document).on('click', '#confirmConvertRequisitionBtn', function (e) {
                    e.preventDefault();
                    const url = $(this).attr('href');
                    if (url) {
                        window.location.href = url;
                    }
                });
            });
        });
    </script>
@endsection