@if(request()->get('intials'))
<input type="hidden" name="intials" value="{{ request()->get('intials') }}">
@endif

<div class="row">
    <div class="col-md-3">
        <div class="form-group">
            <label for="group_name_value">@lang('global.Settings Type')</label>
            <div class="input-group">
                <div class="input-group-prepend">
                    <button type="button" class="btn btn-primary btn-xs toggle-settings">
                        <i class="fa fa-cogs"></i>
                    </button>
                </div>
                <input type="hidden" id="settings_group_name" name="group_name" value="docs-types">
                <select name="group_name_value" id="group_name_value" class="form-control init-select2">
                    <option selected disabled value="">@lang('global.Choose')</option>
                    @foreach (get_intitules_by_group([['slug', '=', 'docs-types']]) as $intitule)
                        <option {{ request()->get('group_name_value') == $intitule->id ? 'selected' : '' }} value="{{ $intitule->id }}">{{ $intitule->libelle }}</option>
                    @endforeach
                </select>
            </div>
        </div>
    </div>
</div>



<div id="setting-inputs" class="w-100 d-none">
    @if(request()->has('group_name') and request()->get('group_name') === 'docs-types')
        @include('partials.ajax._setting_inputs')
    @endif
</div>


<div class="row">
    <div class="col-md-9">
        <div class="form-group">
            <label for="qrcode_position_preview_pdf">@lang('global.Qrcode Position Preview PDF')</label>
            <input type="file" name="qrcode_position_preview_pdf" id="qrcode_position_preview_pdf" class="form-control update-settings">
            <small class="text-muted">@lang('global.You must have to submit the form in order to preview with the new PDF')</small>
        </div>
    </div>
</div>

@push('js')
    <script>
        $(function () {

            $('body').on('click', '.toggle-settings', function () {

                $('body #setting-inputs').toggleClass('d-none');
            });

            $('body').on('change', '#group_name_value', function () {

                $('#setting-inputs').prepend('<div class="w-100 h-100 d-flex justify-content-center align-items-center position-absolute bg-secondary" style="z-index: 3;opacity: 0.65;"><div class="spinner-border" role="status"> <span class="sr-only">Loading...</span> </div>')
                $('#setting-inputs').addClass('position-relative');//.css({height: '150px'});
                //window.location.href = '{{ url('/settings') }}?group_name='+$('body #settings_group_name').val()+'&group_name_value='+$(this).val();
                $.get('/settings?group_name='+$('body #settings_group_name').val()+'&group_name_value='+$(this).val(), response => {

                    $('body #setting-inputs').html(response.html);
                    $('#qrcode-position-frame')
                    .parent()
                    .html(`<iframe id="qrcode-position-frame" src="${response.preview_link}" style="width: 100%; height: 500px;border: none;"></iframe>`);
                    init_3rd_party_plugins( $('body #setting-inputs') );
                });
            })
        })
    </script>
@endpush