@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="'1'"
                                :pageTitle="$page_title"
                                :permission="'Letters - Outgoing Letter'"
                                :buttonLabel="__('global.add')"
                                :buttonClass="'addNewDodumentBtn'"
                                :totalCount="$taqibiLetters->total()"
                            />
                            
                            <div class="mt-3">
                                <div class="accordion" id="searchFilterArea">
                                    <div class="accordion-item">
                                        <h2 class="accordion-header" id="searchFilterHeading">
                                            <button class="accordion-button fw-medium" type="button" data-bs-toggle="collapse" data-bs-target="#searchCollapse" aria-expanded="true" aria-controls="searchCollapse">
                                                <i class="fas fa-search" style="padding-{{ app()->getLocale() == 'en' ? 'right' : 'left' }}:0.35rem;"></i> 
                                                <span>{{ __('global.search')}}</span>
                                            </button>
                                        </h2>
                                        <div id="searchCollapse" class="accordion-collapse collapse" aria-labelledby="searchFilterHeading" data-bs-parent="#searchFilterArea">
                                            <div class="accordion-body">
                                                <div class="text-muted">
                                                    <form action="{{ route('letter.taqibi.list') }}" method="GET" id="search-filter" style="display: grid">
                                                        @csrf
                                                        <div class="search-filter">
                                                            <div class="row mb-3">
                                                                <div class="col-md-3">
                                                                    <input type="text" class="form-control" name="term_searh_name" id="term_searh_id" placeholder="{{ __('global.search') }}">
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <input type="text" class="form-control datepickers" autocomplete="off" name="sdate" id="sdate" placeholder="{{ __('letters.date_from') }}">
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <input type="text" class="form-control datepickers" autocomplete="off" name="edate" id="edate" placeholder="{{ __('letters.date_to') }}">
                                                                </div>
                                                                <div class="col-md-2">
                                                                    <select class="form-control select2" name="pagination_searh_name" id="pagination_searh_id">
                                                                        <option value="" disabled="" selected="" data-select2-id="8">25</option>
                                                                        <option value="25">25</option>
                                                                        <option value="50">50</option>
                                                                        <option value="100">100</option>
                                                                        <option value="250">250</option>
                                                                        <option value="500">500</option>
                                                                        <option value="all">همه</option>
                                                                    </select>
                                                                </div>
                                                            </div>
                                                            <div class="row mb-3">
                                                                <div class="col-md-3">
                                                                    <select class="form-control select2" name="letter_receiver" id="letter_receiver">
                                                                        <option value="">{{ __('letters.sender_department') }}</option>
                                                                        @foreach ($organization as $org)
                                                                            <option value="{{ $org->id }}">{{ $org->name }}</option>
                                                                        @endforeach
                                                                    </select>
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <select name="letter_type" class="select2" id="letter_type">
                                                                        <option value="">@lang('letters.letter_type')</option>
                                                                        <option value="متحدالمال">@lang('letters.motahedulmal')</option>
                                                                        <option value="عادی">@lang('letters.normal')</option>
                                                                        <option value="احکام">@lang('letters.decrees')</option>
                                                                        <option value="پیشنهاد">@lang('letters.proposal')</option>
                                                                        <option value="استعلام">@lang('letters.inquiry')</option>
                                                                        <option value="عریضه">@lang('letters.petition')</option>
                                                                    </select>
                                                                </div>
                                                                <div class="col-md-3">
                                                                    <select name="executions" id="executions" class="select2">
                                                                        <option value="">@lang('letters.executions')</option>
                                                                        <option value="تحت کار">@lang('letters.in_process')</option>
                                                                        <option value="معذرت خواسته شد">@lang('letters.apology_requested')</option>
                                                                        <option value="اجراء شد">@lang('letters.complete')</option>
                                                                    </select>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-md-12">
                                                            <div class="row">
                                                                <div class="col-md-12">
                                                                    <button type="submit" class="btn btn-primary">{{ __('global.search')}}</button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <!-- end Search -->
                            </div>
                            <div class="card">
                                <div class="card-body pe-0 ps-0" id="data_content">
                                    @include('dnekcab.nimda.letter.taqibi.list')
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- end page title -->
        </div> <!-- container-fluid -->
    </div>
    <!-- confirm main directorate modal srate -->
    <div class="modal fade" id="execution-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">
                <div class="modal-header">
                    <h4 class="modal-title" style="font-size: 18px !important; font-weight: bold;">{{ __('letters.edit_taqibi_form') }}</h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body p-1 pt-0" style="overflow-y: scroll; overflow-x: hidden; max-height: 700px;"></div>
            </div>
        </div>
    </div>
    <!-- confirm main directorate modal end -->
@endsection
<script>
    function executionModal(lid)
    {
        $.ajax({
            url: "{{ route('letter.taqibi.edit') }}",
            method: "GET",
            data: {
                lid: lid,
            },
            success: function(response) {
                $("#execution-modal .modal-body").html(response);
                $("#execution-modal").modal('show');
            },
            error: function(xhr) {
                // Handle errors
                toastr.error('Error');
            }
        });
    }
    function updateTaqibiLetter(counter)
    {
        let isValid = true;
        // Array of input selectors
        let fields = ['#execution_desc_' + counter, '#execution_' + counter, '#execution_date_' + counter];

        fields.forEach(function (selector) {
            let input = $(selector);
            if (input.val().trim() === '') {
                input.css('border', '1px solid red');
                isValid = false;
            } else {
                input.css('border', '');
            }
        });

        if (!isValid) {
            return;
        }

        $("#execution-letter-update-" + counter).submit();
    }

</script>