@extends('layouts.app')

@section('content')

    <form action="{{ route('dependents.storeOut') }}" class="col col-lg-9 pd-30" id="form_request_ajax" method="POST">
        @csrf

        <!-- Page Title -->
        <div class="page-title divider-b pdb-10 flexbox align-between align-center-y mb-20">
            <h1 class="reset-block primary-color lineheight-130 fs-20">تسجيل خروج تابع</h1>

            <button class="btn small primary">حفظ </button>

        </div>

        <!-- بيانات التابع -->
        <div class="row">
            <!-- Avatar Uploader -->
            <div class="col-lg-1">
                <div
                    data-src="{{ asset($dependent->dependent_image) ?? asset('assets/img/avatar.jpg') }}"
                    class="px-media radius-g ratio-1x1 mb-15 ratio-none"
                    style="background-image: url({{ asset($dependent->dependent_image) ?? asset('assets/img/avatar.jpg') }});"
                >
                </div>

            </div>

            <div class="col-lg-11">
                <!-- Table -->
                <div class="responsive-table mb-30">
                    <table class="table striped bordered" data-page-length="12">

                        <thead>
                            <tr class="primary-bg fs-13">
                                <th class="tx-align-start">اسم التابع</th>
                                <th class="tx-align-center">رقم الهوية</th>
                                <th class="tx-align-center">الجنسية</th>
                                <th class="tx-align-center">الجنس</th>
                                <th class="tx-align-center">تاريخ الميلاد</th>
                            </tr>
                        </thead>

                        <tbody class="fs-13">
                            <tr>
                                <td>{{ $dependent->full_name }}</td>
                                <td class="tx-align-center form-ui gray-form">{{ $dependent->identity_number }}</td>
                                <td class="tx-align-center">{{ optional($dependent->nationality)->name }}</td>
                                <td class="tx-align-center">{{ config("static.gender.$dependent->gender") }}</td>
                                <td class="tx-align-center">{{ $dependent->birth_date_hijri }}</td>
                                <input type="hidden" name="dependent_id" value="{{ $dependent->id }}">
                            </tr>
                        </tbody>

                    </table>
                </div>
                <!-- // Table -->
            </div>

        </div>

        <!-- بيانات النزيلة -->
        <div class="row">
            <!-- Avatar Uploader -->
            <div class="col-lg-1">
                <div
                    data-src="{{ ($prisoner->images()->imageType('image')) ? asset(optional($prisoner->images()->imageType('image')->first())->path) : asset('assets/img/avatar.jpg') }}"
                    class="px-media radius-g ratio-1x1 mb-15 ratio-none"
                    style="background-image: url({{ ($prisoner->images()->imageType('image')) ? asset(optional($prisoner->images()->imageType('image')->first())->path) : asset('assets/img/avatar.jpg') }});"
                >
                </div>
            </div>
            <div class="col-lg-11">
                <!-- Table -->
                <div class="responsive-table mb-30">
                    <table class="table striped bordered" data-page-length="12">

                        <thead>
                            <tr class="primary-bg fs-13">
                                <th class="tx-align-start">اسم النزيلة</th>
                                <th class="tx-align-center">رقم الهوية</th>
                                <th class="tx-align-center">الجنسية</th>
                                <th class="tx-align-center">رقم النزيلة</th>
                                <th class="tx-align-center">رقم الملف</th>
                            </tr>
                        </thead>

                        <tbody class="fs-13">

                            <tr>
                                <td>{{ $prisoner->full_name }}</td>
                                <td class="tx-align-center form-ui gray-form">{{ $prisoner->identity_number }}</td>
                                <td class="tx-align-center">{{ optional($prisoner->nationality)->name }}</td>
                                <td class="tx-align-center">{{ optional($prisoner->prisoner_detail)->prisoner_number }}</td>
                                <td class="tx-align-center">{{ $prisoner->file_number }}</td>
                                <input type="hidden" name="prisoner_id" value="{{ $prisoner->id }}">
                            </tr>

                        </tbody>

                    </table>
                </div>
                <!-- // Table -->
            </div>

        </div>

        <!-- بيانات المستلم -->
        <div class="widget-block mb-30 white-bg radius-g pdb-5 form-ui gray-form primary">
            <!-- Page Title -->
            <h3 class="far fa-angle-up widget-title fs-15 pdx-20 pdy-10 medium-weight mb-20 primary">بيانات مستلم التابع</h3>

            <!-- // Page Title -->
            <div class="widget-content pdx-20">

                <div class="widget-block pd-30 mb-15 white-bg radius-g form-ui gray-form">
                    <!-- Layouts -->
                    <div class="row">

                        <div class="col form-group justify-content-around mb-5">
                            <div class="col-3">
                                <input  type="text" class="input_validation" name="first_name" id="first_name" placeholder="الاسم الأول" value="">
                            </div>
                            <div class="col-3">
                                <input  type="text" class="input_validation" name="second_name" id="second_name" placeholder="الاسم الثاني" value="">
                            </div>
                            <div class="col-3">
                                <input  type="text" class="input_validation" name="third_name" id="third_name" placeholder="الاسم الثالث" value="">
                            </div>
                            <div class="col-3">
                                <input  type="text" class="input_validation" name="fourth_name" id="fourth_name" placeholder="الاسم الرابع" value="">
                            </div>
                        </div>

                        <div class="col col-12 col-md-6 col-lg-6">
                            <label class="mb-5">رقم الهوية</label>
                            <div class="row" dir="ltr">
                                @for ($i = 0; $i < 10; $i++)
                                    <input type="text" data-name_inp="id_number"
                                        style=" display: inline-block;margin-left: 5px; " value=""
                                        maxlength="1" min="0" max="9"
                                        class="inp_repate  inp_arr_id_number_{{ $i + 1 }}   inp_repate_id_number_num_{{ $i + 1 }} col-1"
                                        data-inp_repate_num="{{ $i + 1 }}" name="identity_number[{{ $i }}]">
                                @endfor
                            </div>
                        </div>

                        <div class="col col-lg-6">

                            <label for="">عنوان السكن</label>

                            <div class="col form-group justify-content-nowrap">
                                @foreach (config('static.address') as $key => $val)
                                    <div class="col-2">
                                        <input type="text" name="{{ $key }}"
                                            class="col-12  inp_arr_address_{{ $key }}"
                                            placeholder="{{ $val }}" value="">
                                    </div>
                                @endforeach
                            </div>

                        </div>

                        <div class="col col-12 col-md-4 col-lg-3">
                            <label class="mb-5">الجنسية</label>
                            <select name="nationality_id" class="req advanced-select">
                                <option value="">-- اختيار --</option>
                                @foreach($nationalites as $nationality)
                                    <option value="{{ $nationality->id }}">{{ $nationality->name }}</option>
                                @endforeach
                            </select>
                        </div>

                        <div class="col col-12 col-md-4 col-lg-3">
                            <label class="mb-5">صلة القرابة</label>
                            <input type="text" placeholder="- - -" name="relationship" class="req">
                        </div>

                        <div class="col col-12 col-md-4 col-lg-3">
                            <label class="mb-5">تاريخ الخروج</label>
                            <div class="pos-rel">
                                <input type="text" class="date-hijri req" placeholder="- - -" name="exit_date_hijri"  >
                            </div>
                        </div>

                        <div class="col col-12 col-md-4 col-lg-3">
                            <label class="mb-5">وقت الخروج</label>
                            <div class="pos-rel">
                                <input type="time" class="req" placeholder="- - -" name="exit_time"  >
                            </div>
                        </div>



                        <div class="col col-12 col-md-6 col-lg-6">
                            <label class="mb-5">رقم الجوال</label>
                            <div class="row" dir="ltr">
                                @for ($i = 0; $i < 10; $i++)
                                    <input type="text" data-name_inp="mobile"
                                        style=" display: inline-block;margin-left: 5px;" value=""
                                        maxlength="1" min="0" max="9"
                                        class="inp_repate  inp_arr_mobile_{{ $i + 1 }}   inp_repate_mobile_num_{{ $i + 1 }} col-1"
                                        data-inp_repate_num="{{ $i + 1 }}" name="mobile_number[]">
                                @endfor
                            </div>
                        </div>

                        <div class="col col-12 col-md-6 col-lg-6">
                            <label class="mb-5">هاتف ثابت</label>
                            <div class="row" dir="ltr">
                                @for($i = 0; $i < 10; $i++)
                                    <input type="text" data-name_inp="mobile2"
                                        style=" display: inline-block;margin-left: 5px;" value=""
                                        maxlength="1" min="0" max="9"
                                        class="inp_repate  inp_arr_mobile2_{{ $i + 1 }}   inp_repate_mobile2_num_{{ $i + 1 }} col-1"
                                        data-inp_repate_num="{{ $i + 1 }}" name="mobile_number2[]">
                                @endfor
                            </div>
                        </div>

                        <div class="col col-12 col-md-4 col-lg-3">
                            <label class="mb-5">الغرض من الخروج</label>
                            <textarea name="exit_purpose"  placeholder="- - -"></textarea>
                        </div>

                        <div class="col col-12">
                            <label class="mb-5">ملاحظات</label>
                            <textarea name="exit_notes"  placeholder="- - -"></textarea>
                        </div>

                    </div>

                </div>

            </div>
        </div>

        <div class="col-lg-6">
            <button class="btn primary fluid">حفظ </button>
        </div>

    </form>

@endsection


@section('script')
    <script src="{{ asset('assets/js/repate-inputs_old.js') }}"></script>
@endsection