@extends('layouts.app')

@section('content')
    <form action="{{route('archive.store')}}" class="col col-lg-9 pd-30 mb-30" id="form_request_ajax" method="POST"
          enctype="multipart/form-data">
        @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>
        <!-- // Page Title -->
        <!-- Grid -->
        <div class="row">


            <!-- Column -->
            <!-- Column Prisoner Information -->
            <x-prisoner-info/>
            <!-- Widget Group -->

            <!-- Widget Group -->
            <x-issue-info/>
        </div>
        <!-- // Widget Group -->
        <div class="row align-center-x">
            <label class="col-1">اسم النافذه</label>
            <select class="col-7 req" name="name" id="name">
                <option value="">-- اختيار --</option>
                @foreach(config('static_archive') as $key=>$value)
                    <option value="{{$key}}">{{$value['name']}}</option>
                @endforeach
            </select>
            <div class="col-2">
                <input type="submit" value="حفظ" class="btn col-6 primary">
            </div>
        </div>

        <div>
            @foreach(config('static_archive') as $key=>$value)
                <div class="widget-block mb-30 white-bg radius-g pdb-20 form-ui gray-form electronic_form"
                     style="display: none;" id="{{$key}}">
                    <h3 class="far fa-angle-up widget-title fs-15 pdx-20 pdy-10 medium-weight mb-20 primary"><span
                                class="header_name">  {{$value['name']}} </span></h3>
                    @foreach($value['values'] as $k=>$v)
                        <div class="widget-content pdx-20">
                            <div class="flexbox align-center-y m-4" style="margin: 10px 0;">
                                <label class="col-3 mb-15">{{$v}}</label>
                                <div data-placeholder="تحميل الملف " data-btn="اختيار ملف" class="px-uploader col-9"
                                     data-uploader="standard">
                                    <input type="file" name="{{$key}}_{{$k}}">
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            @endforeach

        </div>
        <!-- Widget Block -->

        <!-- column -->

        <!-- // column -->

    </form>
@endsection

@section('script')
    <script src="{{ asset('assets/js/ajax_judgement.js') }}"></script>

    <script>
        $(document).ready(function(){
            // Hide all widget-block divs except the first one initially
            $(".electronic_form").hide()
            $("#name").on('change',function (){
                var name = $(this).val()
                var textname = $(this).find(":selected").text();
                $(".electronic_form").each(function (el){
                    let id = $( this ).attr('id')
                    if (id === name){
                        $(this).show()
                        $(this).find('span.header_name').text(textname)
                        $(this).find('input').prop('disabled', false)
                    }else {
                        $(this).hide()
                        $(this).find('input').prop('disabled', true)
                    }
                })
            })
        });
    </script>

@endsection