@include('crud::fields.inc.wrapper_start')
<label>{!! $field['label'] !!}</label>
<select name="{{ $field['name'] }}" style="width: 100%" data-init-function="bpFieldInitMailSelectorElement"
    bp-field-main-input @include('crud::fields.inc.attributes', [
        'default_class' => 'form-control form-control-solid select2_from_array',
    ])>
    @if (count($field['options']))
        @foreach ($field['options'] as $key => $value)
            @if ($key == $field['value'] || (is_array($field['value']) && in_array($key, $field['value'])))
                <option value="{{ $key }}" selected>{{ $value }}</option>
            @else
                <option value="{{ $key }}">{{ $value }}</option>
            @endif
        @endforeach
    @endif
</select>
@include('crud::fields.inc.wrapper_end')

{{-- Select an Application Follow Up Mail  --}}
{{-- Display subject, mailcontent & respond to  of the selected mail --}}
@push('crud_fields_scripts')
    @loadOnce('bpFieldInitMailSelectorElement')
        <script>
            function bpFieldInitMailSelectorElement(element) {
                if (!element.hasClass("select2-hidden-accessible")) {
                    let select2 = element.select2({
                        allowClear: false,
                        multiple: false,
                        minimumResultsForSearch: -1,
                        placeholder: ' ',
                        dropdownParent: $(document.body)
                    });
                    $('.form-group[bp-field-name=mail_subject]').hide();
                    $('.form-group[bp-field-name=mail_body]').hide();
                    $('.form-group[bp-field-name=mail_reply_to]').hide();

                    select2.on('select2:select', function(e) {
                        var data = e.params.data;
                        let searchMailContentUrl =
                            "{{ route('api.application-follow-up-mail-content', ['mailContent' => '#id']) }}";
                        searchMailContentUrl = searchMailContentUrl.replace('#id', data.id);

                        if (data.id == "-1") {
                            $('[name=mail_subject]').val("");
                            $('[name=mail_body]').val("");
                            $('[name=mail_reply_to]').val("");
                            $('.form-group[bp-field-name=mail_subject]').hide();
                            $('.form-group[bp-field-name=mail_body]').hide();
                            $('.form-group[bp-field-name=mail_reply_to]').hide();
                            return;
                        }

                        if (data.id == "0") {
                            $('[name=mail_subject]').val("");
                            $('[name=mail_body]').val("");
                            $('[name=mail_reply_to]').val("");
                            $('.form-group[bp-field-name=mail_subject]').show();
                            $('.form-group[bp-field-name=mail_body]').show();
                            $('.form-group[bp-field-name=mail_reply_to]').show();
                            return;
                        }

                        return $.ajax({
                            url: searchMailContentUrl,
                            processData: false,
                            contentType: "application/json",
                            method: "GET",
                            success: function(responseJSON) {
                                $('[name=mail_subject]').val(responseJSON.subject);
                                $('[name=mail_body]').val(responseJSON.body);
                                $('[name=mail_reply_to]').val(responseJSON.reply_to);
                                $('.form-group[bp-field-name=mail_subject]').show();
                                $('.form-group[bp-field-name=mail_body]').show();
                                $('.form-group[bp-field-name=mail_reply_to]').show();
                            }
                        });
                    });
                }
            }
        </script>
    @endLoadOnce
@endpush