@extends('views.layouts.master')

@section('content')

<form class="sub inquiry form-prevent-multiple-submits" id="contact-us-form" method="POST" action="{{ route('contact-us-custom.store') }}">
    @csrf
	<div class="container">
		<div class="navi">
			<a href="/"><i class="fa-solid fa-house"></i> 홈</a> > 매매상담 > 상담문의
		</div>
		<div class="title">
			<h2>상담문의</h2>
		</div>
	</div>

	<div class="personal">
		<div class="container">
			<div class="stit">
				<h3>개인정보 입력</h3>
			</div>

			<div class="input_form">
                <div>
					<input type="hidden" name="Pc7" value="상담접수">
				</div>
				<div>
					<label class="need">신청자 이름</label>
					<input type="text" name="Pc1" value="{{ old('Pc1') }}" placeholder="이름을 입력해주세요." required>
				</div>
				<div>
					<label class="need">연락처</label>
					<input type="tel" name="Pc2" value="{{ old('Pc2') }}" placeholder="연락처를 입력해주세요." required>
				</div>
				<div>
					<label class="need">거래 구분</label>
					<label for="sell" class="radio_box">
						<input id="sell" type="radio" name="Pc3" value="매도" {{ old('Pc3') == null || old('Pc3') === '매도' ? 'checked' : '' }}>
						<span></span> 매도
					</label>
					<label for="buy" class="radio_box">
						<input id="buy" type="radio" name="Pc3" value="매수" {{ old('Pc3') === '매수' ? 'checked' : '' }}>
						<span></span> 매수
					</label>

				</div>
				<div>
					<label class="need">회원권 구분</label>
					<select name="Pc4" required>
                        <option value="골프회원권" {{ $siseType === 'golf' || is_null($siseType) ? 'selected' : '' }}>골프회원권</option>
                        <option value="콘도회원권" {{ $siseType === 'condo' ? 'selected' : '' }}>콘도회원권</option>
                        <option value="휘트니스회원권" {{ $siseType === 'fitness' ? 'selected' : '' }}>휘트니스회원권</option>
					</select>
				</div>
				<div>
					<label class="need">회원권명</label>
					<input type="text" name="Pc5" value="{{ old('Pc5', $postTitle ?? '') }}" placeholder="회원권명을 입력해주세요." required>
				</div>
				<div class="price">
					<label class="need">희망 가격</label>
					<input type="tel" name="Pc6" value="{{ old('Pc6') }}" placeholder="희망 가격을 입력해주세요." required> 만원
				</div>
				<div class="request">
					<label>요청 사항</label>
					<textarea name="Pt1" placeholder="요청사항을 입력해주세요.">{{ old('Pt1') }}</textarea>
				</div>
			</div>
		</div>
	</div>

	<div class="agree">
		<div class="container">
			<div class="stit">
				<h3>개인정보 취급방침</h3>
			</div>
			<div class="term_wrap">
				<pre>
                {!! $policy['PostContents'] ?? '' !!}
				</pre>
			</div>
			<div class="agree_check">

				<label for="agree" class="check_box">
				<input id="agree" type="checkbox" required>

					<span></span>
					[필수] 상기 약관을 확인했으며, 개인정보 취급방침에 동의합니다.
				</label>
			</div>
		</div>
	</div>

	<div class="container">
		<div class="guide">※ 모든 항목을 올바르게 입력하셔야 문의하기 버튼이 활성화 됩니다.</div>
	    <div class="captcha_wrap d-flex flex-column">
{{--                    <div id="captcha" class="g-recaptcha mb-3 mb-md-0" data-sitekey="6LdEDgcqAAAAAFB0ti6Jwq1jH8nltyjBIcnqHJ5M"></div>--}}
			<div class="captch_box">
			    <div class="d-flex modal-body px-0 m-auto py-5">
			        <div class="form-group mb-1">
			            <div class="captcha text-center">
			                <span>{!! captcha_img() !!}</span>
			            </div>
			        </div>
			        <div class="form-group d-flex mb-0">
			            <input id="captcha" type="text"
			                class="form-control" required placeholder="문자열 입력" name="captcha">
				        <button type="button" class="btn reload" id="reload">
				            새로고침
				        </button>
				    </div>
				</div>
			</div>
			<div class="btn_wrap">
				<button type="submit" disabled
					class="contact-us-btn btn btn_primary submitForm button-prevent-multiple-submits">
					<i class="spinner fa fa-spinner fa-spin"></i>
					문의하기
				</button>
			</div>
		</div>
	</div>
</form>


@endsection

@push('js')
    {{--    <script src="https://www.google.com/recaptcha/api.js?hl={{ getLocale() }}" async defer></script>--}}
    <script src="https://www.google.com/recaptcha/api.js?hl={{ app()->getLocale() }}" async defer></script>
<script>
        // $('#contact-us-form').on('submit', function(event) {
        //     event.preventDefault()
        //     event.stopPropagation()
        //
        //     var v = grecaptcha.getResponse()
        //     if (v.length == 0) {
        //         return iziToast.error({ title: 'Error', message: "자동입력방지 기능 - '로봇이 아닙니다.'를 체크해주세요" })
        //     }
        //
        //     click_submit_btn(this)
        //     this.submit()
        // });

        $('#contact-us-form input').on('input', function() {
            input_check()

        });

        function input_check() {
            let check = true
            $('#contact-us-form input').each(function () {
                if ($(this).val() == '') {
                    check = false
                    return false
                }
            })
            $('.contact-us-btn').prop('disabled', ! check)

            return check
        }

        $('input[name=Pc2]').on('input', function() {
            let phoneNumber = $(this).val();
            // Remove any non-numeric characters
            phoneNumber = phoneNumber.replace(/\D/g, '');
            // Limit input to 11 digits
            phoneNumber = phoneNumber.substring(0, 11);
            // Update the input value
            $(this).val(phoneNumber);
        });

        $('#reload').click(function () {
            $.ajax({
                type: 'GET',
                url: '{{ url('reload-captcha') }}',
                success: function (data) {
                    $('#captcha').val('')
                    $(".captcha span").html(data.captcha);
                }
            });
        });

    </script>
@endpush