@extends('lay.dnekcab.retsam')

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

@section('css')
    <style>
        select{
            background-position: left .75rem center !important;
            padding: 10px !important;
        }
        .form-label{
            font-weight: bold;
        }
        .incoming-letter p{
            font-weight: normal !important;
        }
        .incoming-letter select{
            background-position: left 0.5em center;
            padding: 7px 10px;
        }
        #confirm-modal button i, #share-letter-modal button i{
            position: relative; top: 3px;
        }
        .share-to-expert-section{
            display: none;
        }
        .select2-container {
            z-index: 9999;
        }
        /* استایل‌های اصلی برای پنل بوت‌استرپ */
        .panel {
            margin-bottom: 20px;
            background-color: #fff;
            border: 1px solid #ddd;
            border-radius: 4px;
            box-shadow: 0 1px 1px rgba(0,0,0,.05);
        }

        .panel-heading {
            padding: 10px 15px;
            border-bottom: 1px solid #ddd;
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
            font-size: 16px;
            font-weight: bold;
            background-color: #f5f5f5;
            color: #333;
        }

        .panel-body {
            padding: 15px;
        }

        .panel-default {
            border-color: #ddd;
        }

        .panel-default > .panel-heading {
            background-color: #f5f5f5;
            border-color: #ddd;
        }

        .panel-default > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #ddd;
        }

        .panel-footer {
            padding: 10px 15px;
            background-color: #f5f5f5;
            border-top: 1px solid #ddd;
            border-bottom-right-radius: 3px;
            border-bottom-left-radius: 3px;
        }
        @media print {
            .no-print {
                display: none !important;
            }
            .print-section {
                display: block !important;
            }
            .modal {
                position: relative !important;
                display: block !important;
                overflow: visible !important;
            }
            .modal, .modal-backdrop {
                display: none !important;
            }
        }

        @media screen {
            .print-section {
                display: none;
            }
        }

        #print-section{
            width: 100%;
            margin: 0 auto;
            text-align: center;
        }
        #logo img{
            width: 200px;
        }
        #letter-details-model .modal-header{
            background-image: linear-gradient(#272727, #3f3f3f, #272727);
            padding: 10px 20px
        }
        #letter-details-model h5{
            font-size: 20px;
            color: #FFF;
        }
        #letter-details-model .modal-header button{
            background: transparent;
            color: #FFF;
            outline: none !important;
            border: 0;
            font-size: 33px;
            padding: 0;
            margin: 0;
            position: absolute;
            left: 18px;
        }
        .answer-to .select2-container{
            z-index: 99;
        }
        .letter-footer td{
            padding-top: 10px;
        }
        .letter-footer span{
            font-size: 12px;
        }
        .note-editor .note-toolbar .note-color-all .note-dropdown-menu, .note-popover .popover-content .note-color-all .note-dropdown-menu {
            min-width: 342px !important;
        }
        .note-editor .note-toolbar .note-para .note-dropdown-menu, .note-popover .popover-content .note-para .note-dropdown-menu {
            min-width: 248px !important;
        }
        
        button[title="More Color"]::after {
            content: "▼"; /* یا "\f0d7" با Font Awesome */
            position: absolute;
            right: 4px;
            top: 51%;
            transform: translateY(-50%);
            font-size: 10px;
            pointer-events: none;
        }
        .note-toolbar button:hover {
            color: #000;
        }
        .note-editor {
            border-radius: 0 !important;
            box-shadow: none !important;
            margin-bottom: 0 !important;
        }
        .note-editor:hover {
            box-shadow: none !important;
            transform: translateY(0px) !important;
        }
        .note-editable p{
            margin-bottom: 3px !important;
        }
        p {
            margin-bottom: 0;
        }
        
        #view-section, #view-section label, #view-section p{
            font-size: 20px !important;
        }
        .select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
            margin-left: 20px !important;
        }
    </style>
@endsection
@section('page-content')
    <div class="page-content no-print">
        <div class="container-fluid">

            <!-- start page title -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="card p-2">
                        <div class="card-header p-0" style="border: 1px solid #EEE">
                            <div class="d-flex justify-content-between align-items-center">
                                <ol class="breadcrumb align-items-center m-0">
                                    <li class="breadcrumb-item">
                                        <a href="{{ route('dashboard') }}">
                                            <i class="fa fa-list mx-1" style="position: relative; top: 2px"></i> {{ __('global.dashboard') }}
                                        </a>
                                    </li>
                                    <li class="breadcrumb-item active">
                                        <i class="fas fa-angle-double-left mx-1" style="position: relative; top: 3px"></i> {{ __('global.document_relation') }}
                                    </li>
                                </ol>
                                <div class="d-flex gap-1 px-2">
                                    @if(
                                        auth()->user()->hasRole('Super Admin') || 
                                        (auth()->user()->hasPermissionTo('Letters - Incoming Letter edit') && $letterInfo->main_dir_first_confirm_status === 'pending')
                                    )
                                        <button type="button" style="padding: 4px 6px !important" onclick="showHideSection('edit-section', 'view-section');" class="btn btn-primary btn-sm edit-btn">
                                            <i class="fa fa-pen"></i> {{ __('global.update') }}
                                        </button>
                                    @endif
                                    <a href="{{ route('letter.incoming.list') }}" type="button" style="padding: 4px 6px !important" class="btn btn-outline-secondary btn-sm">
                                        {{ __('global.back') }} <i class="fa fa-arrow-circle-left"></i>
                                    </a>                                    
                                </div>
                            </div>
                        </div>
                        <div class="card-body incoming-letter">
                            <div id="view-section">
                                <div class="row mt-1">
                                    <div class="col-md-6">
                                        <div class="row">
                                            {{-- entry number --}}
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.entry_number')</label><br>
                                                <p>{{ $letterInfo->number }}</p>
                                            </div>
                                            {{-- entry date --}}
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.entry_date')</label><br>
                                                <p>{{ getHijriDate($letterInfo->date) }}</p>
                                            </div>
                                        </div>
                                        <div class="row">
                                            {{-- letter number --}}
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.letter_number')</label><br>
                                                <p>{{ $letterInfo->maktub_number }}</p>
                                            </div>
                                            {{-- letter date --}}
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.letter_date')</label><br>
                                                <p>{{ getHijriDate($letterInfo->maktub_date) }}</p>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        {{-- letter description --}}
                                        <label for="description" class="form-label">@lang('letters.description')</label><br>
                                        <p>{{ $letterInfo->description }}</p>
                                    </div>
                                </div>
                                <hr>
                                <div class="row mt-3">
                                    <!-- Sender -->
                                    <div class="col-md-3">
                                        <label class="form-label">@lang('letters.sender')</label>
                                        <p>{{ @$letterInfo->senderDepartment->name }}</p>
                                    </div>
                                    <!-- Sender Department -->
                                    <div class="col-md-3">
                                        <label class="form-label">@lang('letters.sender_department')</label><br>
                                        <p>{{ $letterInfo->to }}</p>
                                    </div>
                                    <!-- Letter Type -->
                                    <div class="col-md-3">
                                        <label class="form-label">@lang('letters.letter_type')</label><br>
                                        <p>{{ $letterInfo->letter_type }} @if($letterInfo->letter_type == 'احکام')<span style="color: rgb(33, 47, 241)" title="@lang('letters.save_number')">({{ $letterInfo->save_number }})</span>@endif</p>
                                    </div>
                                </div>
                                <hr>
                                <div class="row mt-3">
                                    <div class="col-md-6">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.answer_to')</label><br>
                                                <p>
                                                    @if($letterInfo->answer_to != '')
                                                        <a href="{{ route('letter.outgoing.view', ['id' => encryption($letterInfo->answerTo->id)]) }}" target="_blank">
                                                            {{ $letterInfo->answerTo->number }} - {{ getYear($letterInfo->answerTo->date) }} - ({{ $letterInfo->answerTo->recipients->pluck('name')->implode(' - ') }})
                                                        </a>
                                                    @endif
                                                </p>
                                            </div>
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.related_book')</label><br>
                                                <p>{{ $letterInfo->archive }}</p>
                                            </div>
                                        </div>
                                        <div class="row mt-3">
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.reffered')</label><br>
                                                <p>{{ $letterInfo->reffered }}</p>
                                            </div>
                                            <div class="col-md-6">
                                                <label class="form-label">@lang('letters.attachment')</label><br>
                                                @if ($letterInfo->file)
                                                    <a href="{{ asset($letterInfo->file) }}" download><p>Download File</p></a>
                                                @endif
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        {{-- letter description --}}
                                        <label class="form-label">@lang('letters.activity_description')</label><br>
                                        <p>{{ $letterInfo->execution_details }}</p>
                                    </div>
                                </div>
                                <hr>
                                <div class="row py-2 pb-0" style="border-top: 1px solid #CCC; border-bottom: 1px solid #CCC">
                                    <label class="form-label">
                                        <i class="fa fa-info-circle"></i> {{ __('letters.letter_process_steps') }}
                                    </label>
                                </div>
                                {{-- main directorate actions start --}}
                                <div class="row p-2">
                                    @if($letterInfo->main_dir_first_confirm_status != 'pending')
                                        @php
                                            $actionUser = \App\Models\User::find($letterInfo->main_dir_first_confirm_by);
                                            $date = \Carbon\Carbon::parse($letterInfo->main_dir_first_confirm_at != null ? $letterInfo->main_dir_first_confirm_at : '');
                                        @endphp
                                        <div style="border: 1px solid #5bbb6c">
                                            <div onclick="collapsePanel(this)" class="row text-dark mb-0 px-0 alert alert-success" style="cursor: pointer">
                                                <div class="col-md-8 d-flex align-items-center">
                                                    <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                         alt="{{ $actionUser->name }}" style="width:40px; height:40px;" class="avatar-title bg-primary rounded-circle">
                                                    
                                                    <div class="mx-2">
                                                        <div>{{ $actionUser->employee->name ?? '' }} {{ $actionUser->employee->last_name ?? '' }}</div>
                                                        <div>
                                                            <small>{{ __('letters.directorate_resources_administration') }}</small>
                                                            <small><i class="fas fa-angle-double-left" style="color: #2828ff"></i></small>
                                                            <small>{{ $actionUser->employee->designation->name ?? '' }}</small>
                                                        </div>
                                                    </div>
                                                </div>
                                                
                                                <div class="col-md-4 text-start">
                                                    <h6 class="mb-1" key="t-your-order">@if($letterInfo->main_dir_first_confirm_status == 'approved') Confirmed @else Rejected @endif</h6>
                                                    <div class="font-size-12">
                                                        <p class="mb-0">
                                                            <i class="mdi mdi-clock-outline"></i> 
                                                            <span key="t-min-ago">{{ formatVertaDate($date->timestamp) }}</span>
                                                        </p>
                                                    </div>
                                                </div>
                                            </div>
                                            
                                            @if($letterInfo->office_dir_second_confirm_status != 'pending')
                                                <div class="row py-2 pb-0 px-2">
                                                    <div class="panel panel-default px-0">
                                                        <div class="panel-heading" onclick="collapsePanel(this)" style="cursor: pointer">
                                                            {{-- ارسال سند به آمر اداری توسط رییس منابع و اداره --}}
                                                            @if($letterInfo->main_dir_second_confirm_status == 'pending')
                                                            <i class="fa fa-landmark"></i> {{ __('letters.main_directorate_second_confrim') }}
                                                                @if(checkMainDirectoratePermissions())
                                                                    <button type="button" class="btn btn-success text-dark fw-bold btn-sm float-start" onclick="secondConfirmMainDirModal()">
                                                                        <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                                    </button>
                                                                @endif
                                                            @endif
                                                            @if($letterInfo->main_dir_second_confirm_status != 'pending')
                                                                @if($letterInfo->administrative_manager_by != '')
                                                                    @php
                                                                        $actionUser = \App\Models\User::find($letterInfo->administrative_manager_by);
                                                                    @endphp
                                                                    <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                    alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                @else
                                                                    <i class="fa fa-landmark"></i>
                                                                @endif
                                                                {{ $letterInfo->administrativeManager->name }} {{ $letterInfo->administrativeManager->last_name }} ({{ $letterInfo->administrativeManager->designation->name }})
                                                                @php
                                                                    $date = \Carbon\Carbon::parse($letterInfo->main_dir_second_confirm_at != null ? $letterInfo->main_dir_second_confirm_at : '');
                                                                @endphp
                                                                <button key="t-min-ago" class="btn btn-default btn-sm float-start">
                                                                    <i class="fa fa-check"></i> {{ formatVertaDate($date->timestamp) }}
                                                                </button>
                                                            @endif
                                                        </div>
                                                        @if($letterInfo->main_dir_second_confirm_status != 'pending')
                                                            <div class="panel-body">
                                                                <div class="col-md-12 p-2 mb-2" style="border: 1px solid #EEE;">
                                                                    @if($letterInfo->administrative_manager_status == 'pending')
                                                                        {{-- شریک نمودن سند به مدیر عمومی تحریرات توسط آمر اداری منابع و اداره --}}
                                                                        <i class="fa fa-reply"></i> {{ __('letters.share_latter_to_editorial_manager') }}
                                                                        @if(checkResourceDirAdministrativeManagerPermissions())
                                                                            <button type="button" class="btn btn-success btn-sm text-dark fw-bold float-start" onclick="administrativeManagerModal()" style="margin-top: -2px">
                                                                                <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                                            </button>
                                                                        @endif
                                                                    @endif
                                                                    {{-- show share button --}}
                                                                    @if($letterInfo->administrative_manager_status != 'pending')
                                                                        @php
                                                                            $actionUser = \App\Models\User::find($letterInfo->editorial_manager_id);
                                                                        @endphp
                                                                        <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                        alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                        {{ @$letterInfo->editorialManager->name." ".@$letterInfo->editorialManager->last_name." (".@$letterInfo->editorialManager->designation->name.")" ?? 'نامشخص' }} 
                                                                        @if($letterInfo->editorial_manager_status == 'pending')
                                                                            {{-- شریک نمودن سند به کارمند تحریرات توسط مدیر تحریرات --}}
                                                                            @if(checkResourceDirEditorialManamgerPermissions())
                                                                                <button type="button" class="btn btn-success btn-sm text-dark fw-bold float-start" title="{{ __('letters.share_latter_to_editorial_employee') }}" onclick="shareLatterToEditorialEmployeeModal()" style="margin-top: -2px">
                                                                                    <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                                                </button>
                                                                            @endif
                                                                        @else
                                                                            <hr class="my-2" style="border-top: 3px double #CCC">
                                                                            <div class="col-md-12 px-4">
                                                                                @php
                                                                                    $actionUser = \App\Models\User::find($letterInfo->editorial_employee_id);
                                                                                @endphp
                                                                                <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                                alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                                {{ @$letterInfo->editorialEmployee->name." ".@$letterInfo->editorialEmployee->last_name." (".@$letterInfo->editorialEmployee->designation->name.")" ?? 'نامشخص' }} 
                                                                                @if($letterInfo->editorial_employee_status == 'pending')
                                                                                    {{-- ایجاد و نوشتن نامه توسط کارمند تحریرات --}}
                                                                                    {{-- @if(checkResourceDirEditorialEmployeePermissions()) --}}
                                                                                    @if($letterInfo->editorial_employee_id == auth()->id())
                                                                                        <button type="button" class="btn btn-info btn-sm text-dark fw-bold float-start" onclick="createLetterModal()" style="margin-top: -2px">
                                                                                            <i class="fas fa-pen"></i> {{ __('letters.create_letter') }}
                                                                                        </button>
                                                                                    @endif
                                                                                @else
                                                                                    <button type="button" class="btn btn-primary btn-sm fw-bold float-start" onclick="printPDFLetter('{{ encryption($letterInfo->id) }}')">
                                                                                        <i class="fa fa-print"></i> {{ __('global.print') }}
                                                                                    </button>
                                                                                    @if($letterInfo->editorial_employee_id == auth()->id())
                                                                                        <button type="button" class="btn btn-primary btn-sm fw-bold float-start ms-1" onclick="editLetterModal()">
                                                                                            <i class="fa fa-pen"></i> {{ __('global.edit') }}
                                                                                        </button>
                                                                                    @endif
                                                                                    <hr>
                                                                                    <label class="form-label">{{ __('letters.department') }}</label>
                                                                                    {!! $letterInfo->letter_recipient !!}
                                                                                    <label class="form-label">{{ __('letters.shared_subject') }}</label>
                                                                                    <p>{!! $letterInfo->editorial_subject !!}</p>
                                                                                    <label class="form-label">{{ __('letters.letter_text') }}</label>
                                                                                    {!! $letterInfo->editorial_text !!}
                                                                                    <label>{{ __('letters.copy_to') }}</label><br>
                                                                                    @if($letterInfo->copy_to)
                                                                                        @php
                                                                                            $copyToArray = explode('^', $letterInfo->copy_to);
                                                                                        @endphp
                                                                                        @foreach($copyToArray as $index => $copyTo)
                                                                                            <span>{{ $index + 1 }}. {{ $copyTo }}</span><br>
                                                                                        @endforeach
                                                                                    @endif
                                                                                    <br>
                                                                                    <p class="mb-0">
                                                                                        {{-- {{ $letterInfo->moqamInfo->name." ".$letterInfo->moqamInfo->last_name." ".$letterInfo->moqamInfo->designation->name }} --}}
                                                                                        @if($letterInfo->moqam_id == 2)
                                                                                            <span>مولوی عبدالله عزام</span><br>
                                                                                            <span>د ریاست الوزراء اقتصادي معاونیت</span><br>
                                                                                            <span>د مقام د دفتر عمومی ریس</span>
                                                                                        @elseif($letterInfo->moqam_id == 3)
                                                                                            <span>مولوی ذبیح الله ناصر</span><br>
                                                                                            <span>د ریاست الوزراء اقتصادي معاونیت</span><br>
                                                                                            <span>معاون رییس دفتر</span>
                                                                                        @endif
                                                                                    </p>
                                                                                    <hr>
                                                                                    @php
                                                                                        $date = \Carbon\Carbon::parse($letterInfo->editorial_employee_at != null ? $letterInfo->editorial_employee_at : '');
                                                                                    @endphp
                                                                                    <label style="font-weight: normal;">{{ formatVertaDate($date->timestamp) }}</label>
                                                                                @endif
                                                                            </div>
                                                                        @endif
                                                                    @endif
                                                                </div>
                                                            </div>
                                                        @endif
                                                    </div>
                                                </div>
                                            @endif
                                        </div>
                                    @else
                                        <div class="col">
                                            @if(checkMainDirectoratePermissions())
                                                <label class="form-label">{{ __('letters.directorate_resources_administration') }}</label>
                                                <i class="fas fa-angle-double-left" style="color: #2828ff"></i>
                                                <label class="form-label mb-0">{{ __('items.request_form.waiting_for_confirm_or_reject') }}</label><br>
                                                <button type="button" class="btn btn-success text-dark" onclick="confirmMainDirectorateModal('first', '{{ encryption($letterInfo->id) }}')">
                                                    <i class="fa fa-check-circle"></i> {{ __('items.request_form.do_confirm') }}
                                                </button>
                                            @endif
                                        </div>
                                    @endif
                                </div>
                                {{-- main directorate actions end --}}

                                {{-- office directorate actions start --}}
                                <div class="row p-2">
                                    @if($letterInfo->main_dir_first_confirm_status != 'pending')
                                        @if($letterInfo->office_dir_first_confirm_status != 'pending')
                                            @php
                                                $actionUser = \App\Models\User::find($letterInfo->office_dir_first_confirm_by);
                                                $date = \Carbon\Carbon::parse($letterInfo->office_dir_first_confirm_at != null ? $letterInfo->office_dir_first_confirm_at : '');
                                            @endphp
                                            <div style="border: 1px solid #5bbb6c">
                                                <div onclick="collapsePanel(this)" class="row text-dark mb-0 px-0 alert alert-success" style="cursor: pointer">
                                                    <div class="col-md-8 d-flex align-items-center">
                                                        <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                            alt="{{ $actionUser->name }}" style="width:40px; height:40px;" class="avatar-title bg-primary rounded-circle">
                                                        <div class="mx-2">
                                                            <div>{{ $actionUser->employee->name ?? '' }} {{ $actionUser->employee->last_name ?? '' }}</div>
                                                            <div>
                                                                <small>{{ __('letters.main_directore') }}</small>
                                                                <small><i class="fas fa-angle-double-left" style="color: #2828ff"></i></small>
                                                                <small>{{ $actionUser->employee->designation->name ?? '' }}</small>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    
                                                    <div class="col-md-4 text-start">
                                                        <h6 class="mb-1" key="t-your-order">@if($letterInfo->office_dir_first_confirm_status == 'shared') Confirmed @else Rejected @endif</h6>
                                                        <div class="font-size-12">
                                                            <p class="mb-0">
                                                                <i class="mdi mdi-clock-outline"></i> 
                                                                <span key="t-min-ago">{{ formatVertaDate($date->timestamp) }}</span>
                                                            </p>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="row py-2 pb-0 px-2">
                                                    <div class="col mb-2">
                                                        <label class="mb-0">{{ __('letters.office_remarks') }}</label><br>
                                                        {{ $letterInfo->office_dir_first_remarks }}
                                                    </div>
                                                    @php $officeSecondFlag = true; @endphp
                                                    @foreach($letterInfo->directorateInfo as $dir)
                                                        <div class="panel panel-default px-0">
                                                            <div class="panel-heading" onclick="collapsePanel(this)" style="cursor: pointer">
                                                                @if($dir->dir_first_confirm_status != 'pending')
                                                                    @php
                                                                        $actionUser = \App\Models\User::find($dir->dir_first_confirm_by);
                                                                        $date = \Carbon\Carbon::parse($dir->dir_first_confirm_by_at != null ? $dir->dir_first_confirm_by_at : '');
                                                                    @endphp
                                                                    <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                    alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                @else
                                                                    <i class="fa fa-home"></i>
                                                                @endif

                                                                {{ $dir->directorate->name }} @if($dir->dir_first_confirm_by != 'pending') ({{ $actionUser->employee->name ?? '' }} {{ $actionUser->employee->last_name ?? '' }} {{ $actionUser->employee->designation->name ?? '' }}) @endif
                                                                @if($dir->expert_opinion_confirm_status != 'pending')
                                                                    @if($dir->dir_second_confirm_status == 'pending')
                                                                        @if(checkDirectoratePermissions($dir->directorate_id))
                                                                            <button class="btn btn-primary btn-sm float-start" onclick="confirmDirectorateFromDepActionsModal({{ $dir->directorate_id }})" title="{{ __('letters.confirm_from_dep_and_expert_actions') }}">
                                                                                <i class="fa fa-check-circle"></i> {{ __('letters.confirm') }}
                                                                            </button>
                                                                        @endif
                                                                        @php $officeSecondFlag = false; @endphp
                                                                    @else
                                                                        @php
                                                                            $date = \Carbon\Carbon::parse($dir->dir_second_confirm_at != null ? $dir->dir_second_confirm_at : '');
                                                                        @endphp
                                                                        <button key="t-min-ago" class="btn btn-default btn-sm float-start">
                                                                            <i class="fa fa-check"></i> {{ formatVertaDate($date->timestamp) }}
                                                                        </button>
                                                                    @endif
                                                                @else
                                                                    @php $officeSecondFlag = false; @endphp
                                                                @endif
                                                                @if($dir->dir_first_confirm_status == 'pending')
                                                                    {{-- check directorate permission --}}
                                                                    @if(checkDirectoratePermissions($dir->directorate_id))
                                                                        {{-- directorate first confirmation (share to department) button --}}
                                                                        <button type="button" class="btn btn-success text-dark fw-bold btn-sm float-start" onclick="directorateActionStatusModal('{{ encryption($letterInfo->id) }}', {{$dir->directorate_id}})">
                                                                            <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                                        </button>
                                                                        @php $officeSecondFlag = false; @endphp
                                                                    @endif
                                                                @endif
                                                            </div>
                                                            <div class="panel-body pb-0">
                                                                @if($dir->dir_first_confirm_status != 'pending')
                                                                    @foreach($dir->sharedDepartments as $dep)
                                                                        <div class="col-md-12 p-2 mb-2" style="border: 1px solid #EEE;">
                                                                            @if($dep->dep_first_confirm_status !== 'pending')
                                                                                @php
                                                                                    $actionUser = \App\Models\User::find($dep->dep_first_confirm_by);
                                                                                @endphp
                                                                                <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                                alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                            @else
                                                                                <i class="fa fa-user"></i>
                                                                            @endif
                                                                            {{ $dep->department->name }} 
                                                                            @if($dep->dep_first_confirm_status == 'pending')
                                                                                @if(checkDirectorateAmerPermissions($dir->directorate_id, $dep->department_id))
                                                                                    <button type="button" class="btn btn-success btn-sm text-dark fw-bold float-start" onclick="expertActionStatusModal('{{ encryption($letterInfo->id) }}', {{$dep->directorate_id}}, {{$dep->department_id}})" style="margin-top: -2px">
                                                                                        <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                                                    </button>
                                                                                @endif
                                                                            @endif
                                                                            {{-- show share button --}}
                                                                            @if($dep->dep_first_confirm_status != 'pending')
                                                                            ({{ @$dep->depFirstConfirmBy->name }} {{ @$dep->depFirstConfirmBy->last_name }} {{ @$dep->depFirstConfirmBy->designation->name }})
                                                                                <hr class="my-2" style="border-top: 3px double #CCC">
                                                                                @foreach($dep->sharedExpert as $exp)
                                                                                <div class="col-md-12 px-4">
                                                                                    @php
                                                                                        $actionUser = \App\Models\User::find($exp->expert_id);
                                                                                    @endphp
                                                                                    <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                                    alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                                    {{ $exp->expert->name." ".$exp->expert->last_name." (".$exp->expert->designation->name.")" ?? 'نامشخص' }} 
                                                                                    @if($dir->expertise_by == '')
                                                                                        @if(checkExpertPermissions($exp->expert_id))
                                                                                            <button type="button" class="btn btn-info btn-sm text-dark fw-bold float-start" onclick="setExpertOpinionModal('{{ encryption($letterInfo->id) }}', {{$dep->directorate_id}}, {{$exp->expert->id}})" style="margin-top: -2px">
                                                                                                <i class="fas fa-plus"></i> {{ __('letters.expert_opinion') }}
                                                                                            </button>
                                                                                        @endif
                                                                                    @endif
                                                                                </div>
                                                                                    @if (!$loop->last) 
                                                                                        <hr class="my-2 mx-4">
                                                                                    @endif
                                                                                @endforeach
                                                                            @endif
                                                                        </div>
                                                                    @endforeach
                                                                @endif
                                                                @if($dir->expertise_by != '')
                                                                    <div class="row mx-0 mb-2" style="border: 1px solid #6da1fb">
                                                                        <div class="col-md-12">
                                                                            <label class="form-label pt-2" style="color: #2828ff;">
                                                                                {{ __('letters.expert_opinion') }} 
                                                                                ({{ $dir->expertiseBy->name." ".$dir->expertiseBy->last_name }})
                                                                            </label>
                                                                            @if($dir->expert_opinion_confirm_status == 'pending')
                                                                                @if(confirmEspertOpinionPermissions($dir->directorate_id, $dep->department_id) && $letterInfo->letter_status != 'saved')
                                                                                    <button class="btn btn-outline-primary btn-sm float-start" onclick="confirmExpertOpinionModal({{ $dir->directorate_id }})" style="margin-top: 6px" title="{{ __('letters.confirm_expert_by_department') }}">
                                                                                        <i class="fa fa-check-circle"></i> {{ __('letters.confirm') }}
                                                                                    </button>
                                                                                @endif
                                                                                @php
                                                                                    $expert_date = \Carbon\Carbon::parse($dir->expertise_at != null ? $dir->expertise_at : '');
                                                                                @endphp
                                                                                @if($letterInfo->letter_status == 'saved')
                                                                                    <label class="float-start mt-2">{{ __('letters.lattter_saved') }} | {{ formatVertaDate($expert_date->timestamp) }}</label>
                                                                                @endif
                                                                            @else
                                                                                @php
                                                                                    $date = \Carbon\Carbon::parse($dir->expert_opinion_confirm_at != null ? $dir->expert_opinion_confirm_at : '');
                                                                                @endphp
                                                                                <button key="t-min-ago" class="btn btn-default btn-sm float-start mt-1">
                                                                                    <i class="fa fa-check"></i> {{ formatVertaDate($date->timestamp) }}
                                                                                </button>
                                                                            @endif
                                                                            <hr class="m-0 mb-2" style="border-top: 1px solid #7b7bff;">
                                                                            {{-- <p style="column-count: 2; column-gap: 50px; text-align: justify;"> --}}
                                                                            <p>
                                                                                {{ $dir->expert_opinion }}
                                                                                <hr class="m-1">
                                                                                <label>{{ __('letters.letter_text') }}</label><br>
                                                                                {{ $dir->letter_text }}
                                                                            </p>
                                                                        </div>
                                                                    </div>
                                                                @endif
                                                            </div>
                                                        </div>
                                                    @endforeach
                                                </div>
                                                @if($officeSecondFlag && $letterInfo->letter_status != 'technical_shared' && $letterInfo->letter_status != 'tarh_shared')
                                                <div class="row pb-0 px-2">
                                                    <div class="panel panel-default px-0">
                                                        <div class="panel-heading" onclick="collapsePanel(this)" style="cursor: pointer; background-color: #bac9ff">
                                                            @if($letterInfo->office_dir_second_confirm_at)
                                                                @php
                                                                    $actionUser = \App\Models\User::find($letterInfo->office_dir_second_confirm_by);
                                                                    $date = \Carbon\Carbon::parse($letterInfo->office_dir_second_confirm_at != null ? $letterInfo->office_dir_second_confirm_at : '');
                                                                @endphp
                                                                <img src="{{ $actionUser && $actionUser->photo && file_exists(storage_path('app/public/attachment/employee/photo/' . $actionUser->photo)) ? asset('storage/attachment/employee/photo/'. $actionUser->photo) : asset('assets/img/default-img.png') }}"
                                                                alt="{{ $actionUser->name }}" style="width:40px; height:40px; display: inline;" class="avatar-title bg-primary rounded-circle">&nbsp; &nbsp;
                                                                {{ $actionUser->employee->name." ".$actionUser->employee->last_name." (".$actionUser->employee->designation->name.")" ?? 'نامشخص' }}
                                                                <button key="t-min-ago" class="btn btn-default btn-sm float-start">
                                                                    <i class="fa fa-check"></i> {{ formatVertaDate($date->timestamp) }}
                                                                </button>
                                                            @else
                                                                <i class="fa fa-pen"></i> {{ __('letters.second_confirmation_offince') }}
                                                            @endif
                                                        </div>
                                                        <div class="panel-body">
                                                            @if($letterInfo->office_dir_second_confirm_status == 'pending')
                                                                @if(checkOfficeDirectoratePermissions())
                                                                    <button type="button" class="btn btn-success text-dark fw-bold btn-sm" onclick="secondConfirmOfficeDirModal()">
                                                                        <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                                    </button>
                                                                @endif
                                                            @else
                                                                <p>{{ $letterInfo->office_dir_second_remarks }}</p>
                                                            @endif
                                                        </div>
                                                    </div>
                                                </div>
                                                @endif
                                            </div>
                                        @else
                                            <div class="col">
                                                <label class="form-label">{{ __('letters.main_directore') }}</label>
                                                <i class="fas fa-angle-double-left" style="color: #2828ff"></i>
                                                <label class="form-label mb-0">{{ __('letters.share_to_dir') }}</label><br>
                                                @if(checkOfficeDirectoratePermissions())
                                                    <button type="button" class="btn btn-success text-dark" onclick="officeDirectorateActionStatusModal('{{ encryption($letterInfo->id) }}')" style="font-weight: bold">
                                                        <i class="fas fa-reply-all"></i> {{ __('items.request_form.do_confirm') }}
                                                    </button>
                                                @endif
                                            </div>
                                        @endif
                                    @endif
                                </div>
                                {{-- office directorate actions end --}}
                            </div>
                            
                            <div id="edit-section" style="display: none">
                                <form method="POST" action="{{ route('letter.incoming.update', ['id' => encryption($letterInfo->id)]) }}" id="incoming-letter-update" enctype="multipart/form-data">                                    
                                    @csrf
                                    @method('PUT')
                                    <div class="row mt-1">
                                        <div class="col-md-6">
                                            <div class="row">
                                                {{-- entry number --}}
                                                <div class="col-md-6">
                                                    <label class="form-label">@lang('letters.entry_number') <span class="required">*</span></label>
                                                    <input type="number" class="form-control" name="r_entry_number" value="{{ $letterInfo->number }}" placeholder="@lang('letters.entry_number')"/>
                                                    <span class="text-danger hiddens">@lang('global.required')</span>
                                                </div>
                                                {{-- entry date --}}
                                                <div class="col-md-6">
                                                    <label class="form-label">@lang('letters.entry_date') <span class="required">*</span></label>
                                                    <input type="text" class="form-control datepickers" value="{{ getHijriDate($letterInfo->date) }}" name="r_entry_date" placeholder="@lang('letters.entry_date')" autocomplete="off" />
                                                    <span class="text-danger hiddens">@lang('global.required')</span>
                                                </div>
                                            </div>
                                            <div class="row mt-2">
                                                {{-- letter number --}}
                                                <div class="col-md-6">
                                                    <label class="form-label">@lang('letters.letter_number') <span class="required">*</span></label>
                                                    <input type="number" class="form-control" name="r_letter_number" value="{{ $letterInfo->maktub_number }}" placeholder="@lang('letters.letter_number')"/>
                                                    <span class="text-danger hiddens">@lang('global.required')</span>
                                                </div>
                                                {{-- letter date --}}
                                                <div class="col-md-6">
                                                    <label class="form-label">@lang('letters.letter_date') <span class="required">*</span></label>
                                                    <input type="text" class="form-control datepickers" name="r_letter_date" value="{{ getHijriDate($letterInfo->maktub_date) }}" placeholder="@lang('letters.letter_date')" autocomplete="off" />
                                                    <span class="text-danger hiddens">@lang('global.required')</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            {{-- letter description --}}
                                            <label for="description" class="form-label">@lang('letters.description') <span class="required">*</span></label>
                                            <textarea name="r_description" class="form-control" rows="5" placeholder="@lang('letters.description')">{{ $letterInfo->description }}</textarea>
                                            <span class="text-danger hiddens">@lang('global.required')</span>
                                        </div>
                                    </div>
                                    <div class="row mt-3">
                                        <!-- Sender -->
                                        <div class="col-md-3">
                                            <label class="form-label">@lang('letters.sender') <span class="required">*</span></label>
                                            <select name="r_sender" class="select2">
                                                <option value="">@lang('global.select')</option>
                                                @foreach ($organization as $item)
                                                    <option value="{{ $item->id }}" @if($letterInfo->from == $item->id) selected @endif>{{ $item->name }}</option>
                                                @endforeach
                                            </select>
                                            <span class="text-danger hiddens">@lang('global.required')</span>
                                        </div>
                                        <!-- Sender Department -->
                                        <div class="col-md-3">
                                            <label class="form-label">@lang('letters.sender_department')</label>
                                            <input type="text" class="form-control" value="{{ $letterInfo->to }}" disabled />
                                            <span class="text-danger hiddens">@lang('global.required')</span>
                                        </div>
                                        <!-- Letter Type -->
                                        <div class="col">
                                            <label class="form-label">@lang('letters.letter_type')</label>
                                            <select name="letter_type" id="letter-type" class="form-select p-2" onchange="showDecreesNumber(this.value)">
                                                <option value="">@lang('global.select')</option>
                                                <option value="عادی" {{ $letterInfo->letter_type == 'عادی' ? 'selected' : '' }}>@lang('letters.normal')</option>
                                                <option value="احکام" {{ $letterInfo->letter_type == 'احکام' ? 'selected' : '' }}>@lang('letters.decrees')</option>
                                                <option value="فرمان" {{ $letterInfo->letter_type == 'فرمان' ? 'selected' : '' }}>@lang('letters.order')</option>
                                                <option value="مصوبه" {{ $letterInfo->letter_type == 'مصوبه' ? 'selected' : '' }}>@lang('letters.resolution')</option>
                                                <option value="پیشنهاد" {{ $letterInfo->letter_type == 'پیشنهاد' ? 'selected' : '' }}>@lang('letters.proposal')</option>
                                                <option value="استعلام" {{ $letterInfo->letter_type == 'استعلام' ? 'selected' : '' }}>@lang('letters.inquiry')</option>
                                            </select>
                                            <span class="text-danger hiddens">@lang('global.required')</span>
                                        </div>
                                        <div class="col @if($letterInfo->letter_type != 'احکام') d-none @endif decrees-div">
                                            <label class="form-label">@lang('letters.save_number') <span class="required">*</span></label>
                                            <input type="number" name="save_number" id="save-number" class="form-control" value="{{ $letterInfo->save_number }}" placeholder="@lang('letters.save_number')" />
                                        </div>
                                    </div>
                                    <div class="row mt-3">
                                        <div class="col-md-6">
                                            <div class="row">
                                                <div class="col-md-6">
                                                    <label class="form-label">@lang('letters.reffered')</label>
                                                    <input type="text" class="form-control" name="reffered" value="{{ $letterInfo->reffered }}" placeholder="@lang('letters.reffered')" />
                                                    <span class="text-danger hiddens">@lang('global.required')</span>
                                                </div>
                                                <div class="col-md-6">
                                                    <label class="form-label">@lang('letters.related_book')</label>
                                                    <input type="text" class="form-control" name="archive" value="{{ $letterInfo->archive }}" placeholder="@lang('letters.related_book')" />
                                                    <span class="text-danger hiddens">@lang('global.required')</span>
                                                </div>
                                            </div>
                                            <div class="row mt-2">
                                                <div class="col">
                                                    <label class="form-label">@lang('letters.answer_to')</label>
                                                    <div class="d-flex align-items-center answer-to">
                                                        <select name="answer_to" id="answer-to" class="form-select select2" data-placeholder="{{ __('global.select') }}">
                                                            <option value=""></option>
                                                            @if($letterInfo->answerTo)
                                                                <option value="{{ $letterInfo->answerTo->id }}" selected>
                                                                    ({{ $letterInfo->answerTo->number }}) - {{ getYear($letterInfo->answerTo->date) }}
                                                                    - ({{ $letterInfo->answerTo->recipients->pluck('name')->implode(' - ') }})
                                                                </option>
                                                            @endif
                                                        </select>
                                                        <span class="text-danger hiddens">@lang('global.required')</span>
                                                        <button type="button" class="btn btn-outline-secondary me-1" title="@lang('letters.letter_details')" style="padding:10px" onclick="showLetterDetails()">
                                                            <i class="fa fa-eye"></i>
                                                        </button>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row mt-2">
                                                <div class="col">
                                                    <label class="form-label">@lang('letters.attachment')</label>
                                                    <input type="file" name="attachment" class="form-control" accept=".jpg, .jpeg, .png, .pdf" />
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6">
                                            {{-- letter description --}}
                                            <label class="form-label">@lang('letters.activity_description')</label>
                                            <textarea name="execution_details" class="form-control" rows="10" placeholder="@lang('letters.activity_description')">{{ $letterInfo->execution_details }}</textarea>
                                            <span class="text-danger hiddens">@lang('global.required')</span>
                                        </div>
                                    </div>
                                    <div class="row mt-3" id="footer-button">
                                        <div class="col">
                                            <button type="button" onclick="showHideSection('view-section', 'edit-section')" class="btn btn-outline-secondary">
                                                <i class="fa fa-times-circle"></i> @lang('global.cancel')
                                            </button>
                                            <button type="button" class="btn btn-primary me-1" onclick="updatetLetter('incoming-letter-update');">
                                                <i class="fa fa-check-circle"></i> @lang('global.save')
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- confirm main directorate modal srate -->
    <div class="modal fade" id="confirm-main-directorate-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">{{ __('letters.confirm_lettter') }}</h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="confirm-section">
                        <div class="col-md-12">
                            <label class="form-label mb-0 py-2">{{ __('letters.confirm_reject') }}</label><br>
                            <button type="button" class="btn btn-primary p-1" onclick="confirmMainDirectorateStatus(1)">
                                <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                            </button>
                            <button type="button" class="btn btn-danger p-1" onclick="confirmMainDirectorateStatus(0)">
                                <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.reject') }}
                            </button>
                            <button type="button" class="btn btn-outline-secondary p-1" data-bs-dismiss="modal" aria-label="Close">
                                <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                            </button>
                            <input type="hidden" id="letter-id">
                            <input type="hidden" id="letter-process">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- confirm main directorate modal end -->

    <!-- confirm office directorate modal start -->
    <div class="modal fade" id="confirm-office-directorate-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">
                        <i class="fas fa-reply-all"></i> {{ __('letters.share_letter_to_dir') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <label class="form-label">{{ __('letters.directorate') }}</label><br>
                    <select id="directorate-id" class="form-control select2" multiple>
                        @foreach ($allDirectorates as $allDirectorate)
                            <option value="{{ $allDirectorate->id }}">{{ $allDirectorate->name }}</option>
                        @endforeach
                    </select>
                    <label class="form-label mb-0 py-2">{{ __('letters.remarks') }}</label><br>
                    <textarea id="office-first-remarks" rows="2" class="form-control mb-2"></textarea>
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary" onclick="officeDirectorateActionStatus()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                        <input type="hidden" id="letter-id">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- confirm office directorate modal end -->

    {{-- confirm directorate modal start --}}
    <div class="modal fade" id="confirm-directorate-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">
                        <i class="fas fa-reply-all"></i>  {{ __('letters.share_letter_to_dep') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <select id="department-id" class="form-control select2" multiple></select>
                    <input type="hidden" id="letter-id">
                    <input type="hidden" id="directorate-id">
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary" onclick="directorateActionStatus()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- confirm directorate modal end --}}

    {{-- confirm expert modal start --}}
    <div class="modal fade" id="confirm-expert-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">
                        <i class="fas fa-reply-all"></i>  {{ __('letters.share_letter_to_expert') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <select id="expert-id" class="form-control select2" multiple></select>
                    <input type="hidden" id="letter-id">
                    <input type="hidden" id="directorate-id">
                    <input type="hidden" id="department-id">
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary" onclick="expertActionStatus()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    {{-- confirm expert modal end --}}

    <!-- insert expert opinion modal srate -->
    <div class="modal fade" id="add-expert-opinion-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">
                        <i class="fa fa-pen"></i> {{ __('letters.expert_opinion_form') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="confirm-section">
                        <div class="col-md-12">
                            <label class="form-label mb-0 py-2">{{ __('letters.expert_opinion') }}</label><br>
                            <textarea id="opinion-text" rows="6" class="form-control mb-2"></textarea>
                            <label class="form-label mb-0 py-2">{{ __('letters.letter_text') }}</label><br>
                            <textarea id="letter-text" rows="4" class="form-control mb-2"></textarea>
                            <div class="form-check form-check-primary" @if(app()->getLocale() != 'en') style="text-align: right;" @endif>
                                <input type="checkbox" class="form-check-input" id="hafz-letter" onchange="toggleCheckbox(this)" @if(app()->getLocale() != 'en')style="float: right" @endif>
                                <label class="form-check-label" for="hafz-letter" @if(app()->getLocale() != 'en') style="margin-right: 23px;" @endif>{{ __('letters.hafz') }}</label>
                            </div>
                            <div class="form-check form-check-primary" @if(app()->getLocale() != 'en') style="text-align: right;" @endif>
                                <input type="checkbox" class="form-check-input" id="share-to-technical-section" onchange="toggleCheckbox(this)" @if(app()->getLocale() != 'en')style="float: right" @endif>
                                <label class="form-check-label" for="share-to-technical-section" @if(app()->getLocale() != 'en') style="margin-right: 23px;" @endif>{{ __('letters.share_to_technical_section') }}</label>
                            </div>
                            <div class="form-check form-check-primary" @if(app()->getLocale() != 'en') style="text-align: right;" @endif>
                                <input type="checkbox" class="form-check-input" id="share-to-tarh-section" onchange="toggleCheckbox(this)" @if(app()->getLocale() != 'en')style="float: right" @endif>
                                <label class="form-check-label" for="share-to-tarh-section" @if(app()->getLocale() != 'en') style="margin-right: 23px;" @endif>{{ __('letters.share_to_tarh_section') }}</label>
                            </div>
                            <div class="d-none shared-subject">
                                <label class="form-label mb-0 py-2">{{ __('letters.shared_subject') }}</label><br>
                                <input type="text" id="shared-subject" class="form-control">
                            </div>
                            <hr>
                            <button type="button" class="btn btn-primary p-1" onclick="setExpertOpinion()" style="border-radius: 2px; font-size: 14px !important">
                                <i class="fa fa-check-circle"></i> &nbsp;{{ __('global.save') }}
                            </button>
                            <button type="button" class="btn btn-outline-secondary p-1" data-bs-dismiss="modal" aria-label="Close" style="border-radius: 2px; font-size: 14px !important">
                                <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                            </button>
                            <input type="hidden" id="letter-id">
                            <input type="hidden" id="dir-id">
                            <input type="hidden" id="expert-id">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- insert expert opinion modal end -->

    <!-- confirn expert opinion modal srate -->
    <div class="modal fade" id="confirn-expert-opinion-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">
                        <i class="fa fa-check"></i> {{ __('letters.confirm_expert_opinion') }}
                    </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="confirm-section">
                        <div class="col-md-12">
                            <label class="form-label mb-0 py-2">{{ __('letters.confirm') }}</label><br>
                            <button type="button" class="btn btn-success p-1" onclick="confirmExpertOpinion()">
                                <i class="fa fa-check-circle"></i> &nbsp;{{ __('global.confirm') }}
                            </button>
                            <button type="button" class="btn btn-outline-secondary p-1" data-bs-dismiss="modal" aria-label="Close">
                                <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                            </button>
                            <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                            <input type="hidden" id="directorate-id">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- confirn expert opinion modal end -->

    <!-- confirn second driectorate form department and expert actions modal srate -->
    <div class="modal fade" id="confirn-second-directorate-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">
                    <h5 class="modal-title">
                        <i class="fa fa-check"></i> {{ __('letters.confirm_from_dep_and_expert_actions_form') }}
                    </h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="confirm-section">
                        <div class="col-md-12">
                            <label class="form-label mb-0 py-2">{{ __('letters.confirm') }}</label><br>
                            <button type="button" class="btn btn-success p-1" onclick="confirmDirectorateFromDepActions()">
                                <i class="fa fa-check-circle"></i> &nbsp;{{ __('global.confirm') }}
                            </button>
                            <button type="button" class="btn btn-outline-secondary p-1" data-bs-dismiss="modal" aria-label="Close">
                                <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                            </button>
                            <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                            <input type="hidden" id="directorate-id">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- confirn second driectorate form department and expert actions modal srate -->

    <!-- insert expert opinion modal srate -->
    <div class="modal fade" id="second-confirm-office-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">
                    <i class="fa fa-pen"></i>&nbsp;&nbsp;
                    <h4 class="modal-title">
                        {{ __('letters.second_confirmation_offince') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="confirm-section">
                        <div class="col-md-12">
                            <label class="form-label mb-0 py-2">{{ __('letters.office_opinion') }}</label><br>
                            <textarea id="office-text" rows="10" class="form-control mb-2"></textarea>
                            <button type="button" class="btn btn-primary p-1" onclick="secondConfirmOfficeDir()">
                                <i class="fa fa-check-circle"></i> &nbsp;{{ __('global.save') }}
                            </button>
                            <button type="button" class="btn btn-outline-secondary p-1" data-bs-dismiss="modal" aria-label="Close">
                                <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                            </button>
                            <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- insert expert opinion modal end -->

    <!-- main directorate second confirm modal start -->
    <div class="modal fade" id="main-directorate-second-confirm-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">
                        <i class="fas fa-reply-all"></i> {{ __('letters.main_directorate_second_confrim') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <label class="form-label">{{ __('letters.directorate') }}</label><br>
                    <select id="manager-id" class="form-control select2">
                        <option value="">{{ __('global.select') }}</option>
                        @foreach ($administrativeManager as $managerInfo)
                            <option value="{{ $managerInfo->id }}">{{ $managerInfo->name }} {{ $managerInfo->last_name }} - {{ $managerInfo->designation->name }}</option>
                        @endforeach
                    </select>
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary" onclick="secondConfirmMainDir()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                        <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- main directorate second confirm modal start -->

    <!-- administrative manager confirm modal start -->
    <div class="modal fade" id="administrative-manager-confirm-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">
                        <i class="fas fa-reply-all"></i> {{ __('letters.share_latter_to_editorial_manager') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <label class="form-label">{{ __('global.select') }}</label><br>
                    <select id="editorial-id" class="form-select">
                        <option value="">{{ __('global.select') }}</option>
                        @foreach ($editorialManager as $managerInfo)
                            <option value="{{ $managerInfo->id }}">{{ $managerInfo->name }} {{ $managerInfo->last_name }} - {{ $managerInfo->designation->name }}</option>
                        @endforeach
                    </select>
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary" onclick="administrativeManager()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                        <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- administrative manager confirm modal start -->

    <!-- editorial employee modal modal start -->
    <div class="modal fade" id="editorial-employee-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">
                        <i class="fas fa-reply-all"></i> {{ __('letters.share_latter_to_editorial_employee') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <label class="form-label">{{ __('letters.directorate') }}</label><br>
                    <select id="editorial-employee-id" class="form-select">
                        <option value="">{{ __('global.select') }}</option>
                        @foreach ($editorialEmployee as $editorial)
                            <option value="{{ $editorial->id }}">{{ $editorial->name }} {{ $editorial->last_name }} - {{ $editorial->designation->name }}</option>
                        @endforeach
                    </select>
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary" onclick="shareLatterToEditorialEmployee()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" style="padding: 6px 10px !important" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                        <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- editorial employee modal modal end -->

    <!-- create letter editorial employee modal modal start -->
    <div class="modal fade" id="create-letter-editorial-employee-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
        <div class="modal-dialog" style="min-width: 50%">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">
                        <i class="fas fa-pen"></i> {{ __('letters.create_letter_form') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="row">
                        <div class="col">
                            <label class="form-label">{{ __('letters.shared_subject') }} <span class="required">*</span></label><br>
                            <input type="text" class="form-control" id="letter-title">
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col editorial-letter-text-section">
                            <label class="form-label">{{ __('letters.letter_text') }} <span class="required">*</span></label><br>
                            <div id="editorial-letter-text"></div>
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col">
                            <label class="form-label">{{ __('letters.moqam') }} <span class="required">*</span></label><br>
                            <select id="moqam-id" class="form-select">
                                <option value="">{{ __('global.select') }}</option>
                                @foreach ($officeDirInfo as $info)
                                    <option value="{{ $info->id }}">{{ $info->name }} {{ $info->last_name }} - {{ $info->designation->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <label class="form-label">@lang('letters.copy_to')</label>
                            <select id="copy-to" class="select2" multiple>
                                <option value="">@lang('global.select')</option>
                                @foreach ($organization as $item)
                                    <option value="{{ $item->name }}">{{ $item->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="row mt-3 letter-recipient-section">
                        <div class="col">
                            <label class="form-label">{{ __('letters.department') }} <span class="required">*</span></label><br>
                            <div id="letter-recipient"></div>
                        </div>
                    </div>
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary p-2" onclick="createLetter()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                        <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- create letter editorial employee modal modal end -->

    <!-- edit letter editorial employee modal modal start -->
    <div class="modal fade" id="edit-letter-editorial-employee-modal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
        <div class="modal-dialog" style="min-width: 50%">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">
                        <i class="fas fa-pen"></i> {{ __('letters.edit_letter_form') }}
                    </h4>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body pt-0">
                    <div class="row">
                        <div class="col">
                            <label class="form-label">{{ __('letters.shared_subject') }} <span class="required">*</span></label><br>
                            <input type="text" class="form-control" id="edit-letter-title" value="{{ $letterInfo->editorial_subject }}">
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col edit-editorial-letter-text-section">
                            <label class="form-label">{{ __('letters.letter_text') }} <span class="required">*</span></label><br>
                            <div id="edit-editorial-letter-text">{!! $letterInfo->editorial_text !!}</div>
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col">
                            <label class="form-label">{{ __('letters.moqam') }} <span class="required">*</span></label><br>
                            <select id="edit-moqam-id" class="form-select">
                                <option value="">{{ __('global.select') }}</option>
                                @foreach ($officeDirInfo as $info)
                                    <option value="{{ $info->id }}" @if($letterInfo->moqam_id == $info->id) selected @endif>{{ $info->name }} {{ $info->last_name }} - {{ $info->designation->name }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <label class="form-label">@lang('letters.copy_to')</label>
                            @php
                                $copyToArray = explode('^', $letterInfo->copy_to);
                            @endphp
                            <select name="edit_copy_to[]" id="edit-copy-to" class="select2" multiple>
                                <option value="">@lang('global.select')</option>
                                @foreach ($organization as $item)
                                    <option value="{{ $item->name }}" 
                                        @if(in_array($item->name, $copyToArray)) selected @endif>
                                        {{ $item->name }}
                                    </option>
                                @endforeach
                                @foreach ($directorate as $dir)
                                    <option value="{{ $dir->name }}" 
                                        @if(in_array($dir->name, $copyToArray)) selected @endif>
                                        {{ $dir->name }}
                                    </option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="row mt-3 edit-letter-recipient-section">
                        <div class="col">
                            <label class="form-label">{{ __('letters.department') }} <span class="required">*</span></label><br>
                            <div id="edit-letter-recipient">{!! $letterInfo->letter_recipient !!}</div>
                        </div>
                    </div>
                    <div class="col-md-12 mt-2">
                        <button type="button" class="btn btn-primary p-2" onclick="updateLetter()">
                            <i class="fa fa-check-circle"></i> &nbsp;{{ __('letters.confirm') }}
                        </button>
                        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> &nbsp;{{ __('global.close') }}
                        </button>
                        <input type="hidden" id="letter-id" value="{{ encryption($letterInfo->id) }}">
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- create letter editorial employee modal modal end -->
    
    {{-- letter details model --}}
    <div class="modal fade" id="letter-details-model" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" data-bs-backdrop="static" data-bs-keyboard="false" aria-hidden="true">
        <div class="modal-dialog" style="max-width: 70%; width: 70%">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">
                        <i class="fa fa-info-circle"></i> {{ __('letters.letter_details') }}
                    </h5>
                    <button type="button" data-bs-dismiss="modal" aria-label="Close">x</button>
                </div>
                <div class="modal-body px-4">
                    <i class="fa fa-spiner" style="font-size: 50px"></i>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('js')
    <script>
        // ------------------------------for update letter start-----------------------------------
        function updatetLetter(formID)
        {
            if(!validateForm(formID)){
                return false;
            }
            let letterType = $("#letter-type").val();
            let saveNumber = $("#save-number").val();
            if(letterType === 'احکام'){
                if(saveNumber == ''){
                    $("#save-number").css("border", "1px solid #F00");
                    $("#save-number").focus();
                    return false;
                }
            }
            $("#"+formID).submit();
        }
        function showDecreesNumber(val)
        {
            if(val === 'احکام'){
                $(".decrees-div").removeClass("d-none");
            }else{
                $(".decrees-div").addClass("d-none");
            }
        }
        function showHideSection(showID, hideID)
        {
            if(hideID == 'view-section'){
                $(".edit-btn").hide();
            }
            if(hideID == 'edit-section'){
                $(".edit-btn").show();
            }
            $("#"+hideID).slideUp();
            $("#"+showID).slideDown();
        }
        // ------------------------------for update letter end-------------------------------------

        // ------------------------------for main directorate start--------------------------------
        function confirmMainDirectorateModal(process, lid)
        {
            $("#confirm-main-directorate-modal #letter-id").val(lid);
            $("#confirm-main-directorate-modal #letter-process").val(process);
            $("#confirm-main-directorate-modal").modal('show');
        }
        function confirmMainDirectorateStatus(action)
        {
            var letterID = $("#confirm-main-directorate-modal #letter-id").val();
            var process = $("#confirm-main-directorate-modal #letter-process").val(); // first confirmation or second confirmation
            var action = action; // 1 = confirm and 2 reject
            $.ajax({
                url: "{{ route('confirm.main.directorate.status') }}",
                method: "POST",
                data: {
                    lid: letterID,
                    process: process,
                    action: action,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // ------------------------------for main directorate end----------------------------------

        // ------------------------------for office directorate start------------------------------
        function officeDirectorateActionStatusModal(lid)
        {
            $("#confirm-office-directorate-modal #letter-id").val(lid);
            $("#confirm-office-directorate-modal").modal('show');
            $("#confirm-office-directorate-modal select").select2();
        }
        function officeDirectorateActionStatus()
        {
            var letterID = $("#confirm-office-directorate-modal #letter-id").val();
            var directorateID = $("#confirm-office-directorate-modal #directorate-id").val();
            var directorateRemark = $("#confirm-office-directorate-modal #office-first-remarks").val();
            $.ajax({
                url: "{{ route('office.directorate.action.status') }}",
                method: "POST",
                data: {
                    lid: letterID,
                    dirID: directorateID,
                    directorateRemark: directorateRemark,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // ------------------------------for office directorate end--------------------------------

        // ------------------------------for other directorate start-------------------------------
        function directorateActionStatusModal(lid, did)
        {
            $("#confirm-directorate-modal #letter-id").val(lid);
            $("#confirm-directorate-modal #directorate-id").val(did);
            $.ajax({
                type: "GET",
                url: "{{ route('letter-directorate-department')}}",
                data: { 
                    "_token": "{{ csrf_token() }}",
                    directorate: did
                },
                headers: {
                    "X-CSRF-TOKEN": "{{ csrf_token() }}"
                },
                success:function(result){
                    $('#confirm-directorate-modal #department-id').html(result.content);
                    $('#confirm-directorate-modal #department-id').trigger('change');
                    $("#confirm-directorate-modal").modal('show');
                    $("#confirm-directorate-modal select").select2();
                },
                error:function(result){
                    var errors = result.responseJSON;
                    toastr.error(errors);
                }
            });
        }
        function directorateActionStatus()
        {
            var letterID = $("#confirm-directorate-modal #letter-id").val();
            var directorateID = $("#confirm-directorate-modal #directorate-id").val();
            var departmentID = $("#confirm-directorate-modal #department-id").val();
            $.ajax({
                url: "{{ route('directorate.action.status') }}",
                method: "POST",
                data: {
                    lid: letterID,
                    dirID: directorateID,
                    depID: departmentID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // ------------------------------for other directorate end---------------------------------

        // ----------------------------------for expert start--------------------------------------
        function expertActionStatusModal(lID, dirID, depID)
        {
            $("#confirm-expert-modal #letter-id").val(lID);
            $("#confirm-expert-modal #directorate-id").val(dirID);
            $("#confirm-expert-modal #department-id").val(depID);
            $.ajax({
                type: "POST",
                url: "{{ route('get.expert')}}",
                data: { 
                    "_token": "{{ csrf_token() }}",
                    dirID: dirID,
                    depID: depID,
                },
                headers: {
                    "X-CSRF-TOKEN": "{{ csrf_token() }}"
                },
                success:function(result){
                    $('#confirm-expert-modal #expert-id').html(result.content);
                    $('#confirm-expert-modal #expert-id').trigger('change');
                    $("#confirm-expert-modal").modal('show');
                    $("#confirm-expert-modal select").select2();
                },
                error:function(result){
                    var errors = result.responseJSON;
                    toastr.error(errors);
                }
            });
        }
        function expertActionStatus()
        {
            var letterID = $("#confirm-expert-modal #letter-id").val();
            var directorateID = $("#confirm-expert-modal #directorate-id").val();
            var departmentID = $("#confirm-expert-modal #department-id").val();
            var expertID = $("#confirm-expert-modal #expert-id").val();
            $.ajax({
                url: "{{ route('department.action.status') }}",
                method: "POST",
                data: {
                    lid: letterID,
                    dirID: directorateID,
                    depID: departmentID,
                    expertID: expertID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // -----------------------------------for expert end--------------------------------------

        // --------------------------insert and confirm expert opinion start----------------------
        function setExpertOpinionModal(lID, dirID, expertID)
        {
            $("#add-expert-opinion-modal #letter-id").val(lID);
            $("#add-expert-opinion-modal #dir-id").val(dirID);
            $("#add-expert-opinion-modal #expert-id").val(expertID);
            $("#add-expert-opinion-modal").modal('show');
        }

        function setExpertOpinion()
        {
            var expertText = $("#add-expert-opinion-modal #opinion-text").val();
            var letterText = $("#add-expert-opinion-modal #letter-text").val();
            if (expertText == '') {
                $("#add-expert-opinion-modal #opinion-text").css("border", "1px solid #F00");
                return;
            }
            $("#add-expert-opinion-modal #opinion-text").css("border", "");

            var lID = $("#add-expert-opinion-modal #letter-id").val();
            var dirID = $("#add-expert-opinion-modal #dir-id").val();
            var expertID = $("#add-expert-opinion-modal #expert-id").val();

            // Check which checkbox is selected
            var hafzChecked = $("#add-expert-opinion-modal #hafz-letter").is(":checked");
            var technicalChecked = $("#add-expert-opinion-modal #share-to-technical-section").is(":checked");
            var tarhChecked = $("#add-expert-opinion-modal #share-to-tarh-section").is(":checked");

            // Determine selected option
            var selectedOption = '';
            if (hafzChecked) {
                selectedOption = 'hafz';
            } else if (technicalChecked) {
                selectedOption = 'technical';
            } else if (tarhChecked) {
                selectedOption = 'tarh';
            }

            let subject = $("#shared-subject").val();
            if((selectedOption == 'technical' || selectedOption == 'tarh') && subject == ''){
                $("#shared-subject").css("border", "1px solid #F00");
                return;
            }
            $("#shared-subject").css("border", "");

            $.ajax({
                url: "{{ route('add-expert-opinion') }}",
                method: "POST",
                data: {
                    expertText: expertText,
                    letterText: letterText,
                    lID: lID,
                    dirID: dirID,
                    expertID: expertID,
                    selectedOption: selectedOption,
                    subject: subject,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    toastr.error('Error');
                }
            });
        }

        // manage expert opinion checkbox
        function toggleCheckbox(current)
        {
            const checkboxes = document.querySelectorAll('#add-expert-opinion-modal input[type=checkbox]');
            let boxID = current.id;
            checkboxes.forEach((box) => {
                if (box !== current) {
                    box.checked = false;
                }
            });
            // Only show subject input if current is checked AND not hafz-letter
            if (current.checked && boxID !== 'hafz-letter') {
                $(".shared-subject").removeClass("d-none");
            } else {
                $(".shared-subject").addClass("d-none");
            }
        }

        function confirmExpertOpinionModal(dirID)
        {
            $("#confirn-expert-opinion-modal #directorate-id").val(dirID);
            $("#confirn-expert-opinion-modal").modal('show');
        }
        function confirmExpertOpinion()
        {
            var lID = $("#confirn-expert-opinion-modal #letter-id").val();
            var dirID = $("#confirn-expert-opinion-modal #directorate-id").val();
            $.ajax({
                url: "{{ route('confirm-expert-opinion') }}",
                method: "POST",
                data: {
                    lID: lID,
                    dirID: dirID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // -----------------------insert and confirm expert opinion end--------------------------

        // ---------second confirm directprate from department and expert actions start----------
        function confirmDirectorateFromDepActionsModal(dirID)
        {
            $("#confirn-second-directorate-modal #directorate-id").val(dirID);
            $("#confirn-second-directorate-modal").modal('show');
        }

        function confirmDirectorateFromDepActions()
        {
            var lID = $("#confirn-second-directorate-modal #letter-id").val();
            var dirID = $("#confirn-second-directorate-modal #directorate-id").val();
            $.ajax({
                url: "{{ route('confirm-second-directorate-actions') }}",
                method: "POST",
                data: {
                    lID: lID,
                    dirID: dirID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // ---------second confirm directprate from department and expert actions end----------

        // --------------second confirm office directprate from all actions start--------------
        function secondConfirmOfficeDirModal()
        {
            $("#second-confirm-office-modal").modal('show');
        }
        function secondConfirmOfficeDir()
        {
            var lID = $("#second-confirm-office-modal #letter-id").val();
            var officeText = $("#second-confirm-office-modal #office-text").val();
            if(officeText == ''){
                $("#second-confirm-office-modal #office-text").css("border", "1px solid #F00");
                return;
            }
            $("#second-confirm-office-modal #office-text").css("border", "");
            $.ajax({
                url: "{{ route('confirm-second-office-directorate') }}",
                method: "POST",
                data: {
                    lID: lID,
                    officeText: officeText,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // ----------------second confirm office directprate from all actions end--------------

        // ------------------------second confirm main directprate start-----------------------
        function secondConfirmMainDirModal()
        {
            $("#main-directorate-second-confirm-modal").modal('show');
        }
        function secondConfirmMainDir()
        {
            var lID = $("#main-directorate-second-confirm-modal #letter-id").val();
            var managerID = $("#main-directorate-second-confirm-modal #manager-id").val();
            if(managerID == ''){
                $("#main-directorate-second-confirm-modal #manager-id").css("border", "1px solid #F00");
                return;
            }
            $("#main-directorate-second-confirm-modal #manager-id").css("border", "");
            $.ajax({
                url: "{{ route('confirm-second-main-directorate') }}",
                method: "POST",
                data: {
                    lID: lID,
                    managerID: managerID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // -----------------------second confirm office directprate end-----------------------

        // ------------------------administrative manager confirm start-----------------------
        function administrativeManagerModal()
        {
            $("#administrative-manager-confirm-modal").modal('show');
        }
        function administrativeManager()
        {
            var lID = $("#administrative-manager-confirm-modal #letter-id").val();
            var editorialID = $("#administrative-manager-confirm-modal #editorial-id").val();

            if(editorialID == ''){
                $("#administrative-manager-confirm-modal #editorial-id").css("border", "1px solid #F00");
                return;
            }
            $("#administrative-manager-confirm-modal #editorial-id").css("border", "");
            $.ajax({
                url: "{{ route('administrative-manager-confirm') }}",
                method: "POST",
                data: {
                    lID: lID,
                    editorialID: editorialID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // -------------------------administrative manager confirm end------------------------

        // -----------------------------editorial employee start------------------------------
        function shareLatterToEditorialEmployeeModal()
        {
            $("#editorial-employee-modal").modal('show');
        }
        function shareLatterToEditorialEmployee()
        {
            var lID = $("#editorial-employee-modal #letter-id").val();
            var editorialEmployeeID = $("#editorial-employee-modal #editorial-employee-id").val();

            if(editorialEmployeeID == ''){
                $("#editorial-employee-modal #editorial-employee-id").css("border", "1px solid #F00");
                return;
            }
            $("#editorial-employee-modal #editorial-employee-id").css("border", "");
            $.ajax({
                url: "{{ route('editorial-manager-confirm') }}",
                method: "POST",
                data: {
                    lID: lID,
                    editorialEmployeeID: editorialEmployeeID,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // -----------------------------editorial employee end------------------------------

        // -----------------------------editorial employee start------------------------------
        function createLetterModal()
        {
            $(document).ready(function() {
                $('#editorial-letter-text').summernote({
                    placeholder: 'متن مکتوب',
                    tabsize: 1,
                    height: 250,
                    toolbar: [
                        ['style', ['style']],
                        ['font', ['bold', 'underline', 'clear']],
                        ['color', ['color']],
                        ['para', ['ul', 'ol', 'paragraph']],
                    ]
                });
            });
            $(document).ready(function() {
                $('#letter-recipient').summernote({
                    placeholder: 'اداره',
                    tabsize: 1,
                    height: 40,
                    toolbar: [
                        ['style', ['style']],
                        ['font', ['bold', 'underline', 'clear']],
                        ['color', ['color']],
                        ['para', ['ul', 'ol', 'paragraph']],
                    ]
                });
            });
            $("#create-letter-editorial-employee-modal").modal('show');
        }
        function createLetter()
        {
            $("#create-letter-editorial-employee-modal #letter-title").css("border", "");
            $(".editorial-letter-text-section .note-editable").css("border", "");
            $("#create-letter-editorial-employee-modal #moqam-id").next('.select2-container').find('.select2-selection').css('border', '');
            $(".letter-recipient-section .note-editable").css("border", "");

            var lID = $("#create-letter-editorial-employee-modal #letter-id").val();
            var letterTitle = $("#create-letter-editorial-employee-modal #letter-title").val();
            var letterHtml = $("#create-letter-editorial-employee-modal #editorial-letter-text").summernote('code');
            let letterText = $("<div>").html(letterHtml).text().trim();
            var moqamID = $("#create-letter-editorial-employee-modal #moqam-id").val();
            var copyTo = $("#create-letter-editorial-employee-modal #copy-to").val();
            var letterRecipientHtml = $("#create-letter-editorial-employee-modal #letter-recipient").summernote('code');
            let letterRecipientText = $("<div>").html(letterRecipientHtml).text().trim();

            if(letterTitle == ''){
                $("#create-letter-editorial-employee-modal #letter-title").css("border", "1px solid #F00");
                return;
            }
            
            if(letterText == ''){
                $(".editorial-letter-text-section .note-editable").css("border", "1px solid #F00");
                return;
            }

            if(moqamID == ''){
                $("#create-letter-editorial-employee-modal #moqam-id").next('.select2-container').find('.select2-selection').css('border', '1px solid red');
                return;
            }

            if(letterRecipientText == ''){
                $(".letter-recipient-section .note-editable").css("border", "1px solid #F00");
                return;
            }
            $.ajax({
                url: "{{ route('editorial-employee-confirm') }}",
                method: "POST",
                data: {
                    lID: lID,
                    letterTitle: letterTitle,
                    letterText: letterHtml,
                    copyTo: copyTo,
                    moqamID: moqamID,
                    letterRecipient: letterRecipientHtml,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        function editLetterModal()
        {
            $('#edit-editorial-letter-text').summernote({
                placeholder: 'متن مکتوب',
                tabsize: 1,
                height: 250,
                toolbar: [
                    ['style', ['style']],
                    ['font', ['bold', 'underline', 'clear']],
                    ['color', ['color']],
                    ['para', ['ul', 'ol', 'paragraph']],
                ]
            });
            $('#edit-letter-recipient').summernote({
                placeholder: 'اداره',
                tabsize: 1,
                height: 40,
                toolbar: [
                    ['style', ['style']],
                    ['font', ['bold', 'underline', 'clear']],
                    ['color', ['color']],
                    ['para', ['ul', 'ol', 'paragraph']],
                ]
            });
            $("#edit-letter-editorial-employee-modal").modal('show');
        }
        function updateLetter()
        {
            var lID = $("#edit-letter-editorial-employee-modal #letter-id").val();
            var letterTitle = $("#edit-letter-editorial-employee-modal #edit-letter-title").val();
            var letterHtml = $("#edit-letter-editorial-employee-modal #edit-editorial-letter-text").summernote('code');
            let letterText = $("<div>").html(letterHtml).text().trim();
            var moqamID = $("#edit-letter-editorial-employee-modal #edit-moqam-id").val();
            var copyTo = $("#edit-letter-editorial-employee-modal #edit-copy-to").val();
            var letterRecipientHtml = $("#edit-letter-editorial-employee-modal #edit-letter-recipient").summernote('code');
            let letterRecipientText = $("<div>").html(letterRecipientHtml).text().trim();

            if(letterTitle == ''){
                $("#edit-letter-editorial-employee-modal #edit-letter-title").css("border", "1px solid #F00");
                return;
            }
            
            if(letterText == ''){
                $(".edit-editorial-letter-text-section .note-editable").css("border", "1px solid #F00");
                return;
            }

            if(moqamID == ''){
                $("#edit-letter-editorial-employee-modal #edit-moqam-id").next('.select2-container').find('.select2-selection').css('border', '1px solid red');
                return;
            }

            if(letterRecipientText == ''){
                $(".edit-letter-recipient-section .note-editable").css("border", "1px solid #F00");
                return;
            }

            $.ajax({
                url: "{{ route('letter-edit') }}",
                method: "POST",
                data: {
                    lID: lID,
                    letterTitle: letterTitle,
                    letterText: letterHtml,
                    moqamID: moqamID,
                    copyTo: copyTo,
                    letterRecipient: letterRecipientHtml,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    location.reload();
                },
                error: function(xhr) {
                    // Handle errors
                    toastr.error('Error');
                }
            });
        }
        // -----------------------------editorial employee end------------------------------

        function collapsePanel(element)
        {
            $(element).parent().children().not(element).slideToggle();
        }

        function printPDFLetter(id)
        {
            $.ajax({
                url: "{{ route('letter.print.pdf') }}",
                type: "POST",
                cache: false,
                data: { record_id: id },
                headers: {
                    "X-CSRF-TOKEN": "{{ csrf_token() }}"
                },
                dataType: "json"
            }).done(function(response) {
                if (response.success) {
                    var downloadUrl = response.url;
                    // Create a temporary <a> element
                    var a = document.createElement('a');
                    a.href = downloadUrl;
                    a.download = response.fileName; // Set the desired file name
                    document.body.appendChild(a);
                    // Simulate a click on the <a> element
                    a.click();
                    // Remove the <a> element
                    document.body.removeChild(a);
                } else {
                    toastr.options = {
                        "closeButton": true,
                        "progressBar": true
                    }
                    toastr.error(response.message);
                }
            });
        }

        // show answer to letter details
        function showLetterDetails()
        {
            var letterID = $("#answer-to").val();
            if (letterID == '') {
                $(".answer-to .select2-selection").css("border", "1px solid #F00");
                return;
            }
            $(".answer-to .select2-selection").css("border", "");
            $.ajax({
                url: "{{ route('letter-details') }}",
                method: "GET",
                data: {
                    id: letterID,
                    model: "OutgoingLetter",
                    folder: "letter.outgoing_letter"
                },
                success: function(response) {
                    $("#letter-details-model .modal-body").html(response);
                    $("#letter-details-model").modal('show');
                },
                error: function(xhr) {
                    let errorMessage = "An error occurred";
                    if (xhr.responseJSON && xhr.responseJSON.message) {
                        errorMessage = xhr.responseJSON.message;
                    }
                    toastr.error(errorMessage);
                }
            });
        }

        $('#answer-to').select2({
            placeholder: "{{ __('global.select') }}",
            allowClear: true,
            ajax: {
                url: "{{ route('letter.search') }}",
                dataType: 'json',
                delay: 250,
                headers: {
                    'Accept': 'application/json',
                },
                data: function(params) {
                    return {
                        q: params.term // متن جستجو شده
                    };
                },
                processResults: function(data) {
                    return {
                        results: data.map(function(item) {
                            return {
                                id: item.id,
                                text: item.text // متن آماده از سرور می‌آید
                            };
                        })
                    };
                },
                cache: true
            },
            minimumInputLength: 1
        });
    </script>
@endsection
<table class="print-section" id="print-section" style="display: none;">
    <tbody>
        <tr>
            <td id="logo" colspan="2">
                <img src="{{ asset('assets/logo/logo.png') }}">
            </td>
        </tr>
        <tr>
            <td id="title-info" colspan="2">
                <h3>د ریاست الوزراء اقتصادي معاونیت</h3>
                <h4>د دفتر عمومي ریاست</h4>
            </td>
        </tr>
        <tr>
            <td class="text-end mx-2">ګڼه:</td>
            <td class="text-start mx-2">نېټه:&nbsp; &nbsp; &nbsp; &nbsp; / &nbsp; &nbsp; &nbsp; &nbsp; /{{ getJalaliYear(now()) }}</td>
        </tr>
        <tr>
            <td colspan="2">
                <hr style="border-bottom: 2px ridge #4b4a4a; width: 98%; margin: 10px auto;">
            </td>
        </tr>
        <tr>
            <td class="mx-2" colspan="2">
                <p>بِسْمِ ٱللَّهِ ٱلرَّحْمَٰنِ ٱلرَّحِيمِ</p>
            </td>
        </tr>
        <tr>
            <td class="mx-2" colspan="2">
                <h3 class="fw-bold text-end">{!! $letterInfo->letter_recipient !!}</h3>
            </td>
            <strong></strong>
        </tr>
        <tr>
            <td class="mx-2" colspan="2">
                <p class="text-end">السلام علیکم و رحمة الله و برکاته</p>
            </td>
        </tr>
        <tr>
            <td class="mx-2 text-end" colspan="2">
                <label class="form-label">موضوع: &nbsp; {!! $letterInfo->editorial_subject !!}</label>
                <p id="letter-text" style="font-size: 16px;">{!! $letterInfo->editorial_text !!}</p>
            </td>
        </tr>
        <tr>
            <td class="mx-2" colspan="2">
                <p>دیره مننه</p>
            </td>
        </tr>
        <tr>
            <td class="mx-2" colspan="2">
                {{-- <p class="mb-0">{{ @$letterInfo->moqamInfo->name." ".@$letterInfo->moqamInfo->last_name }}</p>
                <p class="mb-0">د ریاست الوزراء اقتصادي معاونیت</p>
                <p>{{ @$letterInfo->moqamInfo->designation->name }}</p> --}}
                @if($letterInfo->moqam_id == 2)
                    <span>مولوی عبدالله عزام</span><br>
                    <span>د ریاست الوزراء اقتصادي معاونیت</span><br>
                    <span>د مقام د دفتر عمومی ریس</span>
                @elseif($letterInfo->moqam_id == 3)
                    <span>مولوی ذبیح الله ناصر</span><br>
                    <span>د ریاست الوزراء اقتصادي معاونیت</span><br>
                    <span>معاون رییس دفتر</span>
                @endif
            </td>
        </tr>
    </tbody>
</table>
<table class="table print-section" style="position: absolute; bottom: 0; left: 0; right: 0; width: 100%;">
    @php
        $copyToArray = explode('^', $letterInfo->copy_to);
        $chunks = array_chunk($copyToArray, 3);
    @endphp

    <tr>
        <td class="text-end" colspan="2">
            <label>کاپي</label><br>
            <div class="row">
                @for($col = 0; $col < 3; $col++)
                    <div class="col-md-4 col-sm-4 col-4" style="vertical-align: top;">
                        @if(isset($chunks[$col]))
                            @foreach($chunks[$col] as $index => $copyTo)
                                <div>{{ ($col * 3) + $index + 1 }}. {{ $copyTo }}</div>
                            @endforeach
                        @endif
                    </div>
                @endfor
            </div>
        </td>
    </tr>
    <tr class="letter-footer px-5">
        <td style="width: 50%;">
            <h4 style="text-align: {{ app()->getLocale() != 'en' ? 'right' : 'left' }}">
                <span class="d-block">پته: صدارت – مرمرینه ماڼۍ - د ملک اصغر څلور لاری – کابل – افغانستان</span>
                <span class="d-block">د اریکی شمیره: 0202105504</span>
            </h4>
        </td>
        <td style="width: 50%">
            <h4 style="text-align: {{ app()->getLocale() != 'en' ? 'left' : 'right' }}">
                <span class="d-block">Address: Sedarat Marmarin Palace - Malik Asghar Square - Kabul – Afghanistan</span>
                <span class="d-block">Contact number: 0202105504 </span>
            </h4>
        </td>
    </tr>
</table>