@php
    $nowDate = date("Y:m:d");
    //echo $nowDate."</br>";
    $nowHour = date("H");
@endphp

@extends('layouts.default', [
    'activatedNavItem' => 'INQUIRY',
])

@push('head')
    <link rel="stylesheet" type="text/css" href="/css/inquiry.css?ver=22.07.04"/>
    <link rel="stylesheet" type="text/css" href="/css/presentation-pages.css?ver=23.02.17"/>
    <script type="text/javascript" src="/js/form.js?ver=20200716"></script>
{{--    <script type="text/javascript" src="/js/jquery.min.js"></script>--}}
    <script type="text/javascript" src="/js/jquery-ui.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/css/jquery-ui.min.css"/>
    {{--    --}}
    {{--    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>--}}
    {{--    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js" integrity="sha512-uto9mlQzrs59VwILcLiRYeLKPPbS/bT71da/OEBYEwcdNUk8jYIy+D176RYoop1Da+f9mvkYrmj5MCLZWEtQuA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>--}}
    {{--    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" integrity="sha512-aOG0c6nPNzGk+5zjwyJaoRUgCdOrfSDhmMID2u4+OIslr0GjpLKo7Xm0Ao3xmpM4T8AmIouRkqwj1nrdVsLKEQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />--}}
@endpush

@if (Carbon\Carbon::now()->format('Y-m-d') >= $presentation_data['등록일'] && Carbon\Carbon::now()->format('Y-m-d') <= $presentation_data['종료일'])
@else
    <script>
        alert('현재 접수 기간이 아닙니다.');
        window.location.href = "{{ route('main.index') }}";
    </script>
@endif



@section('content')

    <div class="container inquiry consultation presentation-pages">
        <div class="flex-wrap">
            <!-- 제목 및 현재위치 표시 -->
            <div class="area-pages-top bg">
                <h1 class="page-title">{{$presentation_data['제목']}}</h1>
                <div class="presentation-pages-text">
                    <p>{!! nl2br($presentation_data['설명']) !!}</p>
                </div>
            </div>
        </div>
        <div class="area-pages-content">
            <div class="flex-wrap">
                <form method="POST" action="{{ route('inquiry.presentation.store') }}" onsubmit="return false">
                    @csrf
                    <input type="hidden" name="gc_token" id="gc_token" value="">
                    <input type="hidden" name="register_root[category]" value="설명회">
                    <input type="hidden" name="presentation_id" value="{{$id}}">
                    <input type="hidden" name="uhaktype" value="{{$presentation_data['유학종류']}}">
{{--                    <input type="hidden" name="register_root[id]" value="{{ $register_root['id'] }}">--}}
{{--                    <input type="hidden" name="register_root[name]" value="{{ $register_root['name'] }}">--}}
{{--                    <input type="hidden" name="register_root[url]" value="{{ $register_root['url'] }}">--}}
                    <input type="hidden" name="presentation_title" value="{{$presentation_data['제목']}}">
                    <div class="area-inquiry-form">
                        <div class="input-wrap">
                            <div class="input">
                                <p class="tit"><label for="aif-name"><i class="req"><b>* 필수항목</b></i></label></p>
                                @foreach ($standard_names as $standard_name)
                                    <input type="hidden" name="standard_names[]" value="{{$standard_name}}">
                                @endforeach
                            </div>
                            <div class="input-wrap standard hope">
                                @foreach ($presentation_data_standard as $standard)
                                    <div class="input type">
                                    @if($standard['답변필수'] == "yes")
                                        <p class="tit">
                                            <label for="aif-type">
                                                <i class="req">*</i>{{$standard['항목명']}}
                                            </label>
                                        </p>
                                        @if($standard['타입'] == "text")
                                            <input type="text"{!!($standard['항목명']=='연락처' ? ' maxlength=11 placeholder="\'-\'없이 숫자만 입력하세요" onKeyup="this.value=this.value.replace(/[^0-9]/g,\'\');"' : '')!!} requiredinput="{{ $standard['답변필수'] }}" data-itnm="{{ $standard['항목명'] }}" id="aif-{{$standard['항목명']}}" name="standard{{$standard['항목명']}}[]" value="" class="line-style">
                                        @elseif($standard['타입'] == "textarea")
                                            <textarea requiredinput="{{ $standard['답변필수'] }}" data-itnm="{{ $standard['항목명'] }}" id="aif-{{$standard['항목명']}}" name="standard{{$standard['항목명']}}[]"></textarea>
                                        @elseif($standard['타입'] == "select")
                                            <p class="line-style">
                                                <select requiredinput="{{ $standard['답변필수'] }}" data-itnm="{{ $standard['항목명'] }}" id="aif-{{$standard['항목명']}}" name="standard{{$standard['항목명']}}[]">
                                                    <option value="">{{$standard['항목명']}}를 선택하세요.</option>
                                                    @foreach ($standard['옵션'] as $check)
                                                        <option value="{{ $check }}" @selected(old('check'), $check)>{{ $check }}</option>
                                                    @endforeach
                                                </select>
                                            </p>
                                        @elseif($standard['타입'] == "checkbox")
                                            <div class="input country {{ $standard['항목명'] }}" style="margin: 0;">
                                                <div class="line-style presentation-check">
                                                    <input type="text" name="country_names" value="{{ old('country_names') }}" class="select-style" placeholder="{{$standard['항목명']}}를 선택해주세요" autocomplete="off" readonly>
                                                </div>
                                                <div class="input-multi-select">
                                                    <div class="chk-custom-wrap">
                                                        @foreach ($standard['옵션'] as $check)
                                                            <span><input requiredinput="{{ $standard['답변필수'] }}" data-itnm="{{ $standard['항목명'] }}" type="checkbox" id="aif-{{$standard['항목명']}}{{ $check }}" name="standard{{$standard['항목명']}}[]" value="{{ $check }}" @checked(old('check'), $check)><label for="aif-{{$standard['항목명']}}{{ $check }}">{{ $check }}</label></span>
                                                        @endforeach
                                                    </div>
                                                    <div class="button-wrap">
                                                        <input type="button" class="reset button half" value="선택해지">
                                                        <input type="button" class="save button color half" value="선택완료" data-class="{{ $standard['항목명'] }}">
                                                    </div>
                                                </div>
                                            </div>
                                        @endif
                                    @else
                                    @endif
                                    </div>
                                @endforeach
                            </div>

                            <div class="input">
                                @if (!empty($extra_names) && is_array($extra_names))
                                    @foreach ($extra_names as $extra_name)
                                        <input type="hidden" name="extra_names[]" value="{{ $extra_name }}">
                                    @endforeach
                                @endif
                            </div>

                            <div class="input-wrap extra">
                                @if (!empty($presentation_data_extra) && is_array($presentation_data_extra))
                                    @foreach ($presentation_data_extra as $extra)
                                    <div class="input type">
                                        <p class="tit">
                                            <label for="aif-type">
                                                {!! $extra['답변필수']=='yes' ? '<i class="req">*</i>' : '' !!}{{ $extra['항목명'] }}
                                            </label>
                                        </p>
                                        @if($extra['타입'] == "text")
                                        <input type="text" requiredinput="{{ $extra['답변필수'] }}" data-itnm="{{ preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명']) }}" id="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}" name="extra{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}[]" value="" class="line-style">
                                        @elseif($extra['타입'] == "textarea")
                                        <textarea requiredinput="{{ $extra['답변필수'] }}" data-itnm="{{ preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명']) }}" id="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}" name="extra{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}[]"></textarea>
                                        @elseif($extra['타입'] == "select")
                                        <p class="line-style">
                                            <select requiredinput="{{ $extra['답변필수'] }}" data-itnm="{{ preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명']) }}" id="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}" name="extra{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}[]">
                                                <option value="">{{$extra['항목명']}}를 선택하세요.</option>
                                                @foreach ($extra['옵션'] as $check)
                                                    <option value="{{ $check }}" @selected(old('check'), $check)>{{ $check }}</option>
                                                @endforeach
                                            </select>
                                        </p>
                                        @elseif($extra['타입'] == "checkbox")
                                        <ul class="presentation-checkbox-list">
                                            @foreach ($extra['옵션'] as $check)
                                                <li><span class="chk"><input requiredinput="{{ $extra['답변필수'] }}" data-itnm="{{ preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명']) }}" type="checkbox" id="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}{{ $check }}" name="extra{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}[]" value="{{ $check }}" @checked(old('check'), $check)><label for="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}{{ $check }}">{{ $check }}</label></span></li>
                                            @endforeach
                                        </ul>
                                        @elseif($extra['타입'] == "radio")
                                        <ul class="presentation-radio-list">
                                            @foreach ($extra['옵션'] as $radio)
                                                <li><span class="rdo"><input requiredinput="{{ $extra['답변필수'] }}" data-itnm="{{ preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명']) }}" type="radio" id="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}{{ $radio }}" name="extra{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}[]" value="{{ $radio }}" @checked(old('radio'), $radio)><label for="aif-{{preg_replace("/[ #\&\+\-%@=\/\\\:;,\.'\"\^`~\_|\!\?\*$#<>()\[\]\{\}]/i", "", $extra['항목명'])}}{{ $radio }}">{{ $radio }}</label></span></li>
                                            @endforeach
                                        </ul>
                                        @endif
                                    </div>
                                    @endforeach
                                @endif
                            </div>

                            <div class="input terms-wrap">
                                <span class="chk"><input type="checkbox" id="agree-info" name="agreement"><label for="agree-info">[필수] 개인정보수집 및 이용안내 동의</label></span>
                                <span class="toggle-btn">자세히보기</span>
                                <div class="terms-detail">
                                    {{ S3Policy::find('data-collection')->render() }}
                                </div>
                            </div>

                            <div class="button-wrap">
                                <button type="submit" id="aif-counsel" class="button color wide">신청하기</button>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script src="https://www.google.com/recaptcha/api.js?render={{ config('var.RECAPTCHA_V3_SITEKEY') }}"></script>
    <script>
        $('.line-style.presentation-check').click(function(){
            if ($(this).parent().parent().siblings().find('.input.country').hasClass('ims-active')) {
                $(this).parent().parent().siblings().find('.input.country').toggleClass('ims-active');
            }
            $(this).parent().toggleClass('ims-active');
        });
        $('.hope .save').click(function(){
            const data = $(this).data('class');
            var value = [];
            $('.hope .'+data+' input[type=checkbox]:checked').each(function() {
                var checkedId = $(this).attr('id');
                value.push($('label[for='+checkedId+']').text());
            });
            $('.hope .'+data+' input[type=text]').val(value.join(','));
            $('.hope .'+data).removeClass('ims-active');
        });
        $('.hope .reset').click(function(){
            $(this).parent().parent().find('input[type=checkbox]').prop('checked', false);
        });
        $(function(){
            new Swiper('.area-promotion-inquiry .aip-slide', {
                loop: true,
                autoplay: true,
                slideClass: 'swiper-slide',
                slidesPerView: 1,
                navigation: {
                    prevEl: '.area-promotion-inquiry .swiper-button-prev',
                    nextEl: '.area-promotion-inquiry .swiper-button-next',
                },
            });

            $('.layout-container form').submit(function() {

                let dosubmit = true;

                $('[requiredinput="yes"]').each(function(){
                    let tn = $(this).prop('tagName');
                    let ty = $(this).attr('type');
                    let label = $(this).attr('data-itnm');
                    if(tn == 'INPUT' && (ty == 'checkbox' || ty == 'radio')){
                        let en = $(this).attr('name')
                        if($("[name='"+en+"']:checked").length == 0){
                            dosubmit = false;
                            alert(label+'는(은) 필수 체크 사항입니다.');
                            $(this).focus();
                            return false;
                        }
                    }else{
                        let iv = $.trim($(this).val());
                        if($(this).attr('name') == 'standard연락처[]'){
                            phoneRule = /^(01[016789]{1})[0-9]{3,4}[0-9]{4}$/;
	                        if(!phoneRule.test(iv)){
                                dosubmit = false;
                                alert(label+'는 휴대폰번호만 가능합니다.');
                                $(this).focus();
                                return false;
                            }
                        }else{
                            if(iv == ''){
                                dosubmit = false;
                                alert(label+'는(은) 필수 입력/선택 사항입니다.');
                                $(this).focus();
                                return false;
                            }
                        }
                    }
                });

                if( dosubmit && $( "input:checkbox[name='agreement']" ).is(":checked") == false ) {
                    dosubmit = false;
                    alert('개인정보수집 및 이용안내 동의는 필수 선택 항목입니다.');
                    return false;
                }

                if(dosubmit){

                    let $form = $(this);

                    grecaptcha.ready(function() {
                        grecaptcha.execute("{{ config('var.RECAPTCHA_V3_SITEKEY') }}", {action: 'submit'}).then(function(token) {
                            $('#gc_token').val(token);

                            //캡챠코드 받으면 submit
                            dosubmit($form);
                        });
                    });

                    function dosubmit($form){
                        let $error = null;

                        $.ui_ajax({
                            ajax: {
                                method: $form.attr('method'),
                                url: $form.attr('action'),
                                data: $form.serialize(),
                                done: function() {
                                    Analytics.call('presentation.created');
                                }
                            },
                            dialog: {
                                text_process: '신청중입니다.<br/>잠시만 기다려 주세요.',
                                text_done: '신청이 완료되었습니다.<br/>감사합니다.',
                                text_fail: '신청에 실패했습니다.',
                                done: function(data) {
                                    console.log(data);
                                    $error = null;
                                    {{--window.location.href = '{!! route('main.index') !!}';--}}
                                    // history.back();
                                    document.referrer && -1 != document.referrer.indexOf("edmuhak.com") ? history.back() : location.href = "{!! route('main.index') !!}";
                                },
                                fail: function(jqXHR, textStatus, errorThrown) {
                                    var response = jqXHR.responseJSON;
                                    if (response && response.cousel_uid === 'reject') {
                                        // 강제로 에러 메시지를 설정
                                        $('.ui-dialog .ui-dialog-content').html('최근 신청하신 내역이 존재합니다.<br/>잠시 뒤에 시도 하여 주십시요.');
                                    } else if (response) {
                                        $error = response.errors;
                                        console.log($error);
                                    }
                                },
                                close: function() {
                                    if ($error) {
                                        for (var key in $error) {
                                            $form.find('[name="' + key + '"]').focus();
                                            break;
                                        }
                                    }
                                }
                            }
                        });
                    }
                }

            });
        });
    </script>
@endsection