@extends('layouts.app')

@section('content')
    <div class="row justify-content-center" style="margin-top:1em">
        <div class="col-10">

            <div class="card shadow p-3 mb-5 bg-body rounded">
                <div class="row justify-content-center" style="margin-top:0em;margin-bottom:0em;padding:0em">
                    <div class="col-12" align="center" style="color:#222222;font-family:Soho Std;font-size:2.2em">
                        Registro de Detenidos (Falta Administrativa)
                    </div>
                </div>
                <hr />
                <div class="card-body" style="padding:0em 2em 2em 2em">
                    <form id="currentForm" method="POST" action="{{ route('storeArrestedFault') }}">
                        @csrf

                        <input type="hidden" id="id" value="{{ $id }}" name="id">
                        

                        @include('arrested_fault.nav-tab')

                        <div class="tab-content" id="myTabContent">
                            <div id="general_section_1" class="tab-pane fade show active" role="tabpanel"
                                aria-labelledby="tab_general_1">
                                <div class="row justify-content-center" style="margin-top:1em">
                                    <div class="col-11">
                                        <div class="row justify-content-start" style="margin-top:0em;font-size:1.2em">
                                            <div class="col-12" align="right">
                                                <label class="form-label"><strong>CÓDIGO</strong>:
                                                    {{ $data->code }}</label>
                                            </div>
                                            <div class="col-12" align="right">
                                                <label class="form-label"><strong>FOLIO</strong>:
                                                    {{ $data->log_sheet_id }}</label>
                                            </div>

                                        </div>
                                        <div class="row justify-content-center" style="margin-top:0em">
                                            <div class="col-12">
                                                <label for="element" class="form-label">Primer respondiente</label>
                                                <input id="element" name="element" type="text" class="form-control"
                                                    value="{{ $data->police_number . ': ' . $data->police_name . ' ' . $data->police_first_lastname . ' ' . $data->police_second_lastname }}"
                                                    readonly>
                                            </div>
                                        </div>

                                        @include('arrested_fault.form1ArrestedFault')

                                    </div>
                                </div>
                            </div>

                            <div id="general_section_2" class="tab-pane fade" role="tabpanel"
                                aria-labelledby="tab_general_2">
                                <div class="row justify-content-center" style="margin-top:1em">
                                    <div class="col-11">

                                        @include('arrested_fault.form2ArrestedFault')

                                    </div>
                                </div>
                            </div>
                        </div>

						<div class="row justify-content-center" style="margin-top:1.5em">
							<div class="col-6" align="left" style="padding-left:6%">
								<button id="buttonPrev" type="button" class="btn btn-primary btn-block" onclick="prevSection()" style="display:none">Anterior</button>
							</div>
							<div class="col-6" align="right" style="padding-right:6%">
								<button id="buttonNext" type="button" class="btn btn-primary btn-block" onclick="nextSection()">Siguiente</button>
								<button id="buttonSubmit" type="button" class="btn btn-primary btn-block" style="display:none" onclick="sendForm()">Registrar</button>
							</div>
						</div>
                    </form>
                </div>
            </div>

        </div>
    </div>
@endsection

@section('js-files')
    <script src="{{ asset('assets/js/minimap.js') }}"></script>
    <script src="{{ asset('assets/js/info-elements.js') }}"></script>
    <script src="{{ asset('assets/js/navigation-tab.js') }}"></script>
    <script src="{{ asset('assets/js/views/arrested_fault/form.js') }}"></script>
    <script type="text/javascript">
        document.addEventListener('DOMContentLoaded', () => {
            let oldExist = "{{ old() ? true : false }}";
            if (oldExist == '') {
                fillDefaultData();
            }
            else {
                fillDinamicDataOld();
            }
        });
    </script>
@endsection