@extends('lay.dnekcab.retsam')

@section('title')
  {{ $page_title }}
@endsection

@section('page-content')

    <div class="page-content">
        <div class="container-fluid">

            <!-- start page title -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-body list-heading">
                            <!-- card-header -->
                            <!--cenario 1: only header, 2:header and add button, 3:header and print, other:header , add button and prin. type:both[pdf,excel], type:[pdf], type:[excel] -->
                            <x-card-header 
                                :scenario="'2'"
                                :pageTitle="$page_title"
                                :permission="'Items - Add Custodians'"
                                :buttonLabel="__('global.add')"
                                :buttonClass="'addNewCustodianBtn'"
                                :totalCount="$custodian->total()"
                                :modal="'add-custodians-modal'"
                            />

                            <div class="mt-3">
                                {{-- Search --}}
                                <x-search-filter 
                                    :rows="1" 
                                    :inputs-per-row="2" 
                                    :col-md-classes="[ ['col-md-10','col-md-2'] ]" 
                                    :input-config="[
                                        [
                                            ['type' => 'text'],
                                            ['type' => 'select', 'options' => $paginationArray]
                                        ]
                                    ]"
                                    :names="[
                                        [
                                            'term_searh_name',
                                            'pagination_searh_name',
                                        ]
                                    ]"
                                    :ids="[
                                        [
                                            'term_searh_id',
                                            'pagination_searh_id',
                                        ]
                                    ]"
                                    :placeholders="[
                                        [
                                            __('global.search'),
                                            key($paginationArray) ? key($paginationArray) : __('global.pagination')
                                        ]
                                    ]"
                                    form-action="{{ route('items.custodians.list') }}"
                                    report-type="both" 
                                    :lang="$lang"
                                />

                                                
                                <!-- end Search -->
                            </div>

                            <div class="card">
                                <div class="card-body pe-0 ps-0" id="data_content">
                                    @include('dnekcab.nimda.items.custodians.list')
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <!-- end page title -->

        </div> <!-- container-fluid -->
    </div>
    <!-- Add Unit  modal -->
    <div class="modal fade" id="add-custodians-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
        <div class="modal-dialog modal-md">
            <div class="modal-content">
                <form id="custodian-form" action="{{ route('items.custodians.store') }}" method="POST">
                    @csrf
                    <div class="modal-header">
                        <h5 class="modal-title">{{ __('items.custodian.custodian_form') }}</h5>
                        <button type="button" class="btn-close confrim-m{{ app()->getLocale() == 'en' ? 'l' : 'r' }}" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <div class="col-md-12">
                            <label class="form-label">{{ __('items.custodian.select_custodian') }}</label>
                            <select name="custodian" id="custodian" class="form-control select2">
                                <option value="0">{{ __('global.select') }}</option>
                                @foreach ($allEmployee as $employee)
                                    <option value="{{ $employee->id }}">
                                        @if($employee->id != 1)
                                            {{ @$employee->name }} {{ @$employee->last_name }} | {{ @$employee->designation->name }} | {{ @$employee->id_number }}
                                        @endif
                                    </option>
                                @endforeach
                            </select>
                        </div>
                        <div class="col-md-12 mt-2">
                            <div class="col-md-12">
                                <label class="form-label">{{ __('items.custodian.job_type') }} <span class="required">*</span></label>
                                <input type="text" class="form-control" name="job_type" id="job_type"/>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary"class="btn-close" data-bs-dismiss="modal" aria-label="Close">{{ __('global.cancel') }}</button>
                        <button type="button" class="btn btn-primary" onclick="addCustodian('custodian-form')">{{ __('global.submit') }}</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection
<style>
    .select2-container {
        z-index: 9999;
    }
</style>
@section('js')
<script type="text/javascript">
    function addCustodian(formID)
    {
        let custodian = $("#custodian").val();
        let jobType = $("#job_type").val();
        if(custodian == "0"){
            $("#"+formID+" .select2-selection").css("border", "1px solid #F00");
            return;
        }else{
            $("#"+formID+" .select2-selection").css("border", "");
        }

        if(jobType == ""){
            $("#job_type").css("border", "1px solid #F00");
            return;
        }else{
            $("#job_type").css("border", "");
        }
        $("#"+formID).submit();
    }
</script>
@endsection