@extends('layouts.app')

@section('title', \App\CPU\translate('Campaigns List'))

@push('css_or_js')
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <link rel="stylesheet" href="{{ asset('assets') }}/css/bootstrap-datepicker.min.css" />

@endpush

@section('content')
    <div id="kt_app_content" class="app-content flex-column-fluid">
        <!--begin::Content container-->
        <div id="kt_app_content_container" class="app-container container-xxxl">
            <div id="kt_app_toolbar" class="app-toolbar py-3 py-lg-6">
                <!--begin::Toolbar container-->
                <div id="kt_app_toolbar_container" class="app-container container-xxxl d-flex flex-stack">
                    <!--begin::Page title-->
                    <div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
                        <!--begin::Title-->
                        <h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">
                            Campaigns List ({{ $contract_result->total() }})</h1>
                        <!--end::Title-->
                        <!--begin::Breadcrumb-->
                        <ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
                            <!--begin::Item-->
                            <li class="breadcrumb-item text-muted">
                                <a href="" class="text-muted text-hover-primary">Dashboard</a>
                            </li>
                            <!--end::Item-->
                            <!--begin::Item-->
                            <li class="breadcrumb-item">
                                <span class="bullet bg-gray-400 w-5px h-2px"></span>
                            </li>
                            <!--end::Item-->
                            <!--begin::Item-->
                            <li class="breadcrumb-item text-muted">Campaigns</li>
                            <!--begin::Item-->
                            <li class="breadcrumb-item">
                                <span class="bullet bg-gray-400 w-5px h-2px"></span>
                            </li>
                            <li class="breadcrumb-item text-muted">{{ \App\CPU\translate('Campaigns List') }}</li>
                            <!--end::Item-->
                        </ul>
                        <!--end::Breadcrumb-->
                    </div>
                    <!--end::Page title-->

                </div>
                <!--end::Toolbar container-->
            </div>


            <!--begin::Card-->
            <div class="card">
                <!-- Data Table Top -->
                <div class="px-3 py-4">
                    <div class="card-body pt-0 row flex-grow-1">
                        <form class="row" action="{{ url()->current() }}" method="GET">
                            <div class="row col-10">
                                <div class="row col-12 align-items-center">
                                    <div class="col-4 d-flex align-items-center position-relative my-1 ">
                                        <select aria-label="Select a Contract Name" id="contract_select"
                                            name="search_contract_name" data-control="select2"
                                            data-placeholder="Contract Name"
                                            class="form-select form-select-sm form-select-solid">
                                            <option value="0" selected disabled>Contract Name</option>
                                            @foreach ($contracts as $contract)
                                                <option value="{{ $contract->id }}">{{ $contract->CONTRACT_NAME }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-4 d-flex align-items-center position-relative my-1 ">
                                        <select aria-label="Select a Customer name" id="customer_select"
                                            name="search_customer_name" data-control="select2"
                                            data-placeholder="Customer Name"
                                            class="form-select form-select-sm form-select-solid ">
                                            <option value="0" selected disabled>Customer Name</option>
                                            @foreach ($customers as $customer)
                                                <option value="{{ $customer->id }}">
                                                    {{ $customer->CUSTOMER_NAME . ' - ' . $customer->CUSTOMER_NUMBER }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-4 d-flex align-items-center position-relative my-1 ">
                                        <select aria-label="Select an Item Code" id="item_select" name="search_item_no"
                                            data-control="select2" data-placeholder="Item No"
                                            class="form-select form-select-sm form-select-solid">
                                            <option value="0" selected disabled>Item No</option>
                                            @foreach ($items as $item)
                                                <option value="{{ $item->id }}">{{ $item->ITEM_NO }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-4 d-flex align-items-center position-relative my-1 ">
                                        <input placeholder="Search Date From"
                                            class="form-control form-control-solid startdate input " type="text"
                                            name="search_start_date" value="{{ $search_start_date }}" readonly="readonly">
                                    </div>
                                    <div class="col-4 d-flex align-items-center position-relative my-1 ">
                                        <input placeholder="Search Date To"
                                            class="form-control form-control-solid enddate input dateSelect" type="text"
                                            name="search_end_date" value="{{ $search_end_date }}" readonly="readonly">
                                    </div>
                                </div>
                            </div>
                            <div class="col-2 justify-content-end">
                                <button type="submit"
                                    class="filterBtn btn btn-sm fw-bold btn-primary bigMainBtn ">Search</button>
                                {{-- <a class="btn btn-sm fw-bold bg-body btn-color-gray-700 btn-active-color-primary bigMainBtn grayColorForLink"
                                    href="{{ route('admin.customer.export') }}">
                                    <!--begin::Export-->
                                    <!--begin::Svg Icon | path: icons/duotune/arrows/arr078.svg-->
                                    <span class="svg-icon svg-icon-2">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <rect opacity="0.3" x="12.75" y="4.25" width="12" height="2"
                                                rx="1" transform="rotate(90 12.75 4.25)" fill="currentColor" />
                                            <path
                                                d="M12.0573 6.11875L13.5203 7.87435C13.9121 8.34457 14.6232 8.37683 15.056 7.94401C15.4457 7.5543 15.4641 6.92836 15.0979 6.51643L12.4974 3.59084C12.0996 3.14332 11.4004 3.14332 11.0026 3.59084L8.40206 6.51643C8.0359 6.92836 8.0543 7.5543 8.44401 7.94401C8.87683 8.37683 9.58785 8.34458 9.9797 7.87435L11.4427 6.11875C11.6026 5.92684 11.8974 5.92684 12.0573 6.11875Z"
                                                fill="currentColor" />
                                            <path opacity="0.3"
                                                d="M18.75 8.25H17.75C17.1977 8.25 16.75 8.69772 16.75 9.25C16.75 9.80228 17.1977 10.25 17.75 10.25C18.3023 10.25 18.75 10.6977 18.75 11.25V18.25C18.75 18.8023 18.3023 19.25 17.75 19.25H5.75C5.19772 19.25 4.75 18.8023 4.75 18.25V11.25C4.75 10.6977 5.19771 10.25 5.75 10.25C6.30229 10.25 6.75 9.80228 6.75 9.25C6.75 8.69772 6.30229 8.25 5.75 8.25H4.75C3.64543 8.25 2.75 9.14543 2.75 10.25V19.25C2.75 20.3546 3.64543 21.25 4.75 21.25H18.75C19.8546 21.25 20.75 20.3546 20.75 19.25V10.25C20.75 9.14543 19.8546 8.25 18.75 8.25Z"
                                                fill="currentColor" />
                                        </svg>
                                    </span>
                                    Export
                                </a> --}}
                                @php
                            $admin_role_id = auth('admin')->user()->admin_role_id;
                            @endphp
                        @if ($admin_role_id != 1)
                        <a class="filterBtn btn btn-sm fw-bold btn-success bigMainBtn " href="#"
                        data-bs-toggle="modal" data-bs-target="#kt_modal_create_app" id="modalOpener"> Create new
                        Contract</a>
                        @endif
                    </div>
                        </form>
                        <!-- End Search -->
                    </div>
                    <!-- End Row -->
                    <br><br>
                    <!-- End Data Table Top -->

                    <div class="card-body pt-0">
                        <div id="kt_customers_table_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer"
                            style="overflow-x:auto">
                            <table class="table align-middle table-row-dashed fs-6 gy-5 dataTable no-footer">
                                <thead>
                                    <tr class="text-start text-gray-400 fw-bold fs-7  gs-0">
                                        <th>
                                            {{ \App\CPU\translate('Sl') }}
                                        </th>
                                        <th>{{ \App\CPU\translate('Contract No') }}</th>
                                        <th>{{ \App\CPU\translate('Contract Name') }}</th>
                                        <th>{{ \App\CPU\translate('Contract Category') }}</th>
                                        <th>{{ \App\CPU\translate('Contract Status') }}</th>
                                        <th>{{ \App\CPU\translate('VENDOR No') }}</th>
                                        <th>{{ \App\CPU\translate('Effective Date From') }}</th>
                                        <th>{{ \App\CPU\translate('Effective Date To') }}</th>
                                        <th>{{ \App\CPU\translate('Created By') }}</th>
                                        <th>{{ \App\CPU\translate('Active Lines') }}</th>
                                        <th class="text-center">
                                            {{ \App\CPU\translate('action') }}
                                        </th>

                                    </tr>
                                </thead>
                                <tbody>

                                    @foreach ($contract_result as $k => $b)
                                        <tr onclick="window.location='{{ route('admin.contract.edit', $b->id) }}'">
                                            <td>{{ $contract_result->firstItem() + $k }}</td>
                                            <td>{{ $b['CONTRACT_NO'] }}</td>
                                            <td>{{ $b['CONTRACT_NAME'] }}</td>
                                            <td>{{ $b['CONTRACT_CATEGORY'] }}</td>
                                            <td>{{ $b['CONTRACT_STATUS'] }}</td>
                                            <td>{{ $b['VENDOR_NO'] }}</td>
                                            <td>{{ $b['START_DATE_ACTIVE'] }}</td>
                                            <td>{{ $b['END_DATE_ACTIVE'] }}</td>
                                            <td>{{ $b->admin->email }}</td>
                                            <td>{{ $b->contract_item_count() }}</td>
                                            <td>
                                                <a href="#"
                                                    class="btn btn-sm btn-icon btn-light btn-active-light-primary"
                                                    data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">
                                                    <!--begin::Svg Icon | path: icons/duotune/general/gen052.svg-->
                                                    <span class="svg-icon svg-icon-2">
                                                        <svg width="24" height="24" viewBox="0 0 24 24"
                                                            fill="none" xmlns="http://www.w3.org/2000/svg">
                                                            <rect x="10" y="10" width="4"
                                                                height="4" rx="2" fill="currentColor" />
                                                            <rect x="17" y="10" width="4"
                                                                height="4" rx="2" fill="currentColor" />
                                                            <rect x="3" y="10" width="4"
                                                                height="4" rx="2" fill="currentColor" />
                                                        </svg>
                                                    </span>
                                                    <!--end::Svg Icon-->
                                                </a>
                                                @if (
                                                    (\App\CPU\Helpers::module_permission_check('contract_management') ||
                                                        \App\CPU\Helpers::module_permission_check('contract_upload_approve')) &&
                                                        $b['CONTRACT_STATUS'] != 'approve')
                                                    <!--begin::Menu-->
                                                    <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-semibold fs-7 w-125px py-4"
                                                        data-kt-menu="true">
                                                        <!--begin::Menu item-->
                                                        <div class="menu-item px-3">
                                                            <a href="{{ route('admin.campaign.edit', [$b['id']]) }}"
                                                                class="menu-link px-3">{{ \App\CPU\translate('Edit') }}</a>
                                                        </div>
                                                        <!--end::Menu item-->
                                                        <!--begin::Menu item-->
                                                        <div class="menu-item px-3">
                                                            <a class="menu-link px-3" id="{{ $b['id'] }}"
                                                                data-kt-redirect="">{{ \App\CPU\translate('Delete') }}</a>
                                                        </div>
                                                        <!--end::Menu item-->
                                                    </div>
                                                @else
                                                    <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-semibold fs-7 w-125px py-4"
                                                        data-kt-menu="true">
                                                        <!--begin::Menu item-->
                                                        <div class="menu-item px-3">
                                                            <a href="{{ route('admin.campaign.edit', [$b['id']]) }}"
                                                                class="menu-link px-3">{{ \App\CPU\translate('View') }}</a>
                                                        </div>
                                                        <!--end::Menu item-->
                                                    </div>
                                            </td>
                                    @endif
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>

                        </div>
                    </div>
                    <div class="table-responsive mt-4">
                        <div class="d-flex justify-content-lg-end">
                            <!-- Pagination -->
                            {{ $contract_result->links() }}
                        </div>
                    </div>
                    @if (count($contract_result) == 0)
                        <div class="text-center p-4">
                            <p class="mb-0">{{ \App\CPU\translate('No_data_to_show') }}</p>
                        </div>
                    @endif
                </div>
            </div>
        </div>
        <!--begin::Modal - Create App-->
        <div class="modal fade" id="kt_modal_create_app" tabindex="-1" aria-hidden="true">
            <!--begin::Modal dialog-->
            <div class="modal-dialog modal-dialog-centered mw-900px">
                <!--begin::Modal content-->
                <div class="modal-content">
                    <!--begin::Modal header-->
                    <div class="modal-header">
                        <!--begin::Modal title-->
                        <h2>Create New Contract</h2>
                        <!--end::Modal title-->
                        <!--begin::Close-->
                        <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                            <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                            <span class="svg-icon svg-icon-1">
                                <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                    xmlns="http://www.w3.org/2000/svg">
                                    <rect opacity="0.5" x="6" y="17.3137" width="16" height="2"
                                        rx="1" transform="rotate(-45 6 17.3137)" fill="currentColor" />
                                    <rect x="7.41422" y="6" width="16" height="2" rx="1"
                                        transform="rotate(45 7.41422 6)" fill="currentColor" />
                                </svg>
                            </span>
                            <!--end::Svg Icon-->
                        </div>
                        <!--end::Close-->
                    </div>
                    <!--end::Modal header-->
                    <!--begin::Modal body-->
                    <div class="modal-body py-lg-10 px-lg-10">
                        <!--begin::Stepper-->
                        <form class="add_new_form" action="{{ route('admin.contract.add-new') }}" method="post"
                            enctype="multipart/form-data">
                            @csrf
                            <div class="flex-row-fluid py-lg-5 px-lg-15">
                                <!--begin::Nav-->
                                <button type="button" class="btn btn-primary" id="btnfile">
                                    <!--begin::Svg Icon | path: icons/duotune/files/fil018.svg-->
                                    <span class="svg-icon svg-icon-2">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <path opacity="0.3" d="M10 4H21C21.6 4 22 4.4 22 5V7H10V4Z"
                                                fill="currentColor"></path>
                                            <path
                                                d="M10.4 3.60001L12 6H21C21.6 6 22 6.4 22 7V19C22 19.6 21.6 20 21 20H3C2.4 20 2 19.6 2 19V4C2 3.4 2.4 3 3 3H9.20001C9.70001 3 10.2 3.20001 10.4 3.60001ZM16 11.6L12.7 8.29999C12.3 7.89999 11.7 7.89999 11.3 8.29999L8 11.6H11V17C11 17.6 11.4 18 12 18C12.6 18 13 17.6 13 17V11.6H16Z"
                                                fill="currentColor"></path>
                                            <path opacity="0.3"
                                                d="M11 11.6V17C11 17.6 11.4 18 12 18C12.6 18 13 17.6 13 17V11.6H11Z"
                                                fill="currentColor"></path>
                                        </svg>
                                    </span>
                                    <!--end::Svg Icon-->Upload Special Deal
                                </button>
                                <span id="fname"></span>
                                <div class="wrapper" style="display:none;">
                                    <input type="file" id="uplodfile" required name="contractfile" />
                                </div>

                                <!--end::Nav-->
                            </div>
                            <!--begin::Aside-->
                            <!--begin::Content-->
                            <div class="flex-row-fluid py-lg-5 px-lg-15">
                                <!--begin::Form-->
                                <!--begin::Step 1-->
                                <div class="current" data-kt-stepper-element="content">
                                    <div class="row w-100">
                                        <!--begin::Input group-->
                                        <div class="col-6 fv-row mb-10">
                                            <!--begin::Label-->
                                            <label class="d-flex align-items-center fs-5 fw-semibold mb-2">
                                                <span class="required">Special Deal Name</span>
                                            </label>
                                            <!--end::Label-->
                                            <!--begin::Input-->
                                            <input type="text" class="form-control form-control-lg form-control-solid"
                                                name="contract_name" placeholder="Contract Name" value="" />
                                            <!--end::Input-->
                                        </div>
                                        <div class="col-6 fv-row mb-10">
                                            <!--begin::Label-->
                                            <label class="d-flex align-items-center fs-5 fw-semibold mb-2">
                                                <span class="required">Special Deal Category</span>
                                            </label>
                                            <!--end::Label-->
                                            <!--begin::Input-->
                                            <input type="text" class="form-control form-control-lg form-control-solid"
                                                name="contract_category" placeholder="Contract Category"
                                                value="" />
                                            <!--end::Input-->
                                        </div>


                                        <div class="col-6 fv-row mb-10" data-kt-calendar="datepicker">
                                            <div id="contractStartDate" class="fv-row mb-9">
                                                <!--begin::Label-->
                                                <label class="fs-6 fw-semibold mb-2 required">Special Deal Effictive From
                                                    Date</label>
                                                <!--end::Label-->
                                                <!--Date picker -->
                                                <input
                                                    class="form-control form-control-solid  input dateSelect contractStartDate"
                                                    type="text" name="start_date" required readonly="readonly">
                                            </div>
                                        </div>
                                        <div class="col-6 fv-row mb-10" data-kt-calendar="datepicker">
                                            <div id="contractEndDate" class="fv-row mb-9">
                                                <!--begin::Label-->
                                                <label class="fs-6 fw-semibold mb-2 required">Special Deal Effictive To
                                                    Date</label>
                                                <!--end::Label-->
                                                <!--Date picker -->

                                                <input id="contractEndDate"
                                                    class="form-control form-control-solid  input dateSelect contractEndDate"
                                                    type="text" name="end_date" required readonly="readonly">
                                            </div>
                                        </div>

                                        <!--end::Input group-->
                                        <div class="col-md-12 form-group justify-content-end" style="max-height:45px;">
                                            <button type="submit" class="btn btn-primary px-4"
                                                id="sendNewContract">{{ \App\CPU\translate('Submit') }}</button>
                                        </div>
                                    </div>
                                </div>
                                <!--end::Step 1-->
                                <!--end::Form-->
                            </div>
                        </form>
                        <!--end::Content-->
                    </div>
                    <!--end::Stepper-->
                </div>
                <!--end::Modal body-->
            </div>
            <!--end::Modal content-->
        </div>
        <!--end::Modal dialog-->
    @endsection

    @push('script')
        <script src="{{ asset('assets') }}/js/bootstrap-datepicker.min.js"></script>
        <script>
            $("#btnfile").click(function() {
                $("#uplodfile").click();
            });

            $("#uplodfile").change(function() {
                var file = $(this).val().replace(/C:\\fakepath\\/ig, '');

                $("#fname").text(file);
            });


            rtl = false;
            if ($('.contractStartDate').length > 0) {
                $('.contractStartDate').datepicker({
                    language: rtl ? 'ar' : 'en',
                    //startDate:'tomorrow',
                    container: "#contractStartDate",
                    clearBtn: true,
                    autoclose: true,
                });
            }
            if ($('.contractEndDate').length > 0) {
                $('.contractEndDate').datepicker({
                    language: rtl ? 'ar' : 'en',
                    //startDate:'tomorrow',
                    container: "#contractEndDate",
                    clearBtn: true,
                    autoclose: true,
                });
                // $('.contractEndDate').datepicker('update', 'tomorrow');
            }
            //datepicker$('.datepicker').datepicker();
            rtl = false;
            if ($('.startdate').length > 0) {
                $('.startdate').datepicker({
                    language: rtl ? 'ar' : 'en',
                    //startDate:'tomorrow',
                    clearBtn: true,
                    autoclose: true,
                });
                $('.startdate').datepicker('update', 'tomorrow');
            }
            if ($('.enddate').length > 0) {
                $('.enddate').datepicker({
                    language: rtl ? 'ar' : 'en',
                    //startDate:'tomorrow',
                    clearBtn: true,
                    autoclose: true,
                });
                $('.enddate').datepicker('update', 'tomorrow');
            }
            @if (isset($search_start_date))
                $('.startdate').datepicker('update', '{{ $search_start_date }}');
            @endif
            @if (isset($search_end_date))
                $('.enddate').datepicker('update', '{{ $search_end_date }}');
            @endif
        </script>

        <script>
            $(document).on('click', '.delete', function() {
                var id = $(this).attr("id");
                Swal.fire({
                    title: '{{ \App\CPU\translate('Are you sure delete this contract') }}?',
                    text: "{{ \App\CPU\translate('You_will_not_be_able_to_revert_this') }}!",
                    type: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: '{{ \App\CPU\translate('Yes') }}, {{ \App\CPU\translate('delete_it') }}!',
                    cancelButtonText: "{{ \App\CPU\translate('cancel') }}",
                    reverseButtons: true
                }).then((result) => {
                    if (result.value) {
                        $.ajaxSetup({
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                            }
                        });
                        $.ajax({
                            url: "{{ route('admin.contract.delete') }}",
                            method: 'POST',
                            data: {
                                id: id
                            },
                            success: function() {
                                toastr.success(
                                    '{{ \App\CPU\translate('Contract deleted successfully') }}'
                                );
                                location.reload();
                            }
                        });
                    }
                })
            });

            $(document).on('change', '.status', function() {
                var id = $(this).attr("id");
                if ($(this).prop("checked") == true) {
                    var status = 1;
                } else if ($(this).prop("checked") == false) {
                    var status = 0;
                }
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    }
                });
                $.ajax({
                    url: "{{ route('admin.contract.status-update') }}",
                    method: 'POST',
                    data: {
                        id: id,
                        status: status
                    },
                    success: function(data) {
                        console.log(data)
                        if (data.success == true) {
                            toastr.success('{{ \App\CPU\translate('Status updated successfully') }}');
                        } else {
                            toastr.error(
                                '{{ \App\CPU\translate('Status updated failed. Item must be approved') }}'
                            );
                            location.reload();
                        }
                    }
                });
            });

            // contract customer
            $(document).on('change', '#contract_select', function() {
                var id = $(this).val();
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    }
                });
                $.ajax({
                    url: "{{ route('admin.contract.customer.filter') }}",
                    method: 'GET',
                    data: {
                        id: id,
                    },
                    success: function(data) {
                        // console.log(data)
                        $('#customer_select').empty();
                        $('#customer_select').append(new Option('customer name', '0', true, true));
                        $('#customer_select>option[value="0"]').prop('disabled', true);
                        $(data).each(function(i, z) {
                            if (i < data.length - 1) {
                                var search_customer_name =
                                    '{{ $_GET['search_customer_name'] ?? '' }}';
                                if (search_customer_name != '' && search_customer_name == z.id) {
                                    $('#customer_select').append(new Option(z.name + " - " + z
                                        .customer_number, z.id, true, true));
                                } else {
                                    $('#customer_select').append(new Option(z.name + " - " + z
                                        .customer_number, z.id, false, true));
                                }
                            } else {
                                $('#customer_select').append(new Option(z.name + " - " + z
                                    .customer_number, z.id, false, true));
                                if (search_customer_name != '' && search_customer_name == z.id) {
                                    $('#customer_select').trigger('change');
                                } else {
                                    $('#customer_select').val(1).trigger('change');

                                }
                            }
                        })
                    }
                });
            });
            // contract ustomer item
            $(document).on('change', '#customer_select', function() {
                var id = $(this).val();
                var contract_id = $('#contract_select').val();
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    }
                });
                $.ajax({
                    url: "{{ route('admin.contract.customer.item.filter') }}",
                    method: 'GET',
                    data: {
                        id: id,
                        contract_id: contract_id,
                    },
                    success: function(data) {
                        $('#item_select').empty();
                        $('#item_select').append(new Option('item code', '0', true, true));
                        $('#item_select>option[value="0"]').prop('disabled', true);
                        $(data).each(function(i, z) {
                            var search_item_no = '{{ $_GET['search_item_no'] ?? '' }}';
                            if (search_item_no != '' && search_item_no == z.id) {
                                $('#item_select').append(new Option(z.item_code, z.id, true, true))
                                $('#item_select').val(1).trigger('change');
                            } else {
                                $('#item_select').append(new Option(z.item_code, z.id, false, true))
                                $('#item_select').val(1).trigger('change');

                            }
                        })
                    }
                });
            });
            $(document).ready(function() {
                var search_contract_name = '{{ $_GET['search_contract_name'] ?? '' }}';
                if (search_contract_name != '') {
                    $('#contract_select>option[value=' + search_contract_name + ']').prop('selected', true);
                    $('#contract_select').trigger('change');
                }
            });
        </script>
    @endpush