@extends('views.layouts.master')
<link rel="stylesheet" href="{{ csset('/themes/kbgolf/pro/resources/css/user-auth.css') }}">
@section('content')

    <!--=====================================
	USER FORM PART START
=======================================-->
    <section class="user-form-part">
        <div class="container">
            <form class="row justify-content-center form-prevent-multiple-submits" action="{{ route('member-unlock.store') }}" method="POST">
                @csrf
                <input type="hidden" id="email-txt" name="email" value="{{ $email }}">
                <div class="col-12 col-sm-10 col-md-12 col-lg-12 col-xl-6">

                    <!--
                    <div class="user-form-logo">
                        <a href="index.html"><img src="images/logo.png" alt="logo"></a>
                    </div>
                    -->
                    <div class="user-form-card agree_form">
                        <div class="user-form-title">
                            <h2>계정잠금 해제</h2>
                        </div>
                        <div class="form-check all_agree mb-4">
                            <input class="form-check-input" type="checkbox" id="phone-identity-verifiy-ck">
                            <label class="form-check-label" for="phone-identity-verifiy-ck">휴대폰 본인 확인</label>
                        </div>

                        <div class="form-group mb-2 d-flex">
                            <button type="button" class="btn btn-danger border-danger text-white w-100" onclick="send_verify_code(this)">
                                등록된 번호로 인증번호 발송
                            </button>

                        </div>
                        <div class="form-group mb-0 d-flex">
                            <input type="text" class="form-control certi-txt rounded-right-0" name="cert_number" placeholder="인증번호" required>
                            <span class="btn_wrap js_btn_wrapper mt-0">
                                <button type="submit" class="btn bg-black border-black btn-block text-white certi-btn button-prevent-multiple-submits">
                                    <i class="spinner fa fa-spinner fa-spin"></i>
                                    확인
                                </button>
                            </span>
                        </div>

                        <div class="form-group mt-2">
                            <input type="checkbox" name="single_use" value="1" id="single-use-ck">
                            <label class="form-check-label text-danger" for="single-use-ck">
                                1회 사용(사용후 반드시 로그아웃 필요)
                            </label>
                        </div>
                    </div>

                </div>
            </form>
        </div>
    </section>
    <!--=====================================
        USER FORM PART END
    =======================================-->

@endsection

@push('js')
    <script>
        async function send_verify_code($this) {
            let all_check = true

            $('#required-div input').each(function () {
                if (! $(this).is(':checked')) {
                    all_check = false
                }
            })

            if (all_check && $('#phone-identity-verifiy-ck').is(':checked')) {
                const response = await call_local_api('{{ route("member-unlock.send") }}', {email: $('#email-txt').val()})
                const data = response.data

                if (data['Success']) {
                    $($this).prop('disabled', true)
                    // iziToast.success({ title: 'Success', message: $('#action-completed').text() })
                } else {
                    iziToast.error({ title: 'Error', message: data['Message'] })
                }
                return
            }

            iziToast.info({ title: 'Info', message: '이용약관에 동의하셔야 합니다' });
        }

        $('#all-ck').click(function(){
            const checked = $(this).is(':checked');

            if (checked) {
                $('#required-div input:checkbox').prop('checked', true);
            }
        });
    </script>
@endpush