@extends('layout-common')

@section('content')
    <div id="membership">
        <div class="findPwd step2">
            <div class="max-width">
                <h1 class="pageTitle">아이디 찾기</h1>

                <form method="post" id="findId">
                    @csrf
                    <input type="hidden" name="id" value="{{Crypt::encrypt($user->id)}}">
                    <div class="input-wrap formWrap">
                        <div class="messageBox">
                            <figure></figure><em>회원가입시 등록한 아이디(계정) 정보입니다.</em>
                        </div>
                        <div class="user-id">
                        <p>{{ BaseHelper::maskEmailShort($user->email) }}</p>
                        </div>
                        <div class="input certificationWrap">
                            <p class="tit">인증방법</p>
                            <div class="inputBox">
                                <label><input type="radio" name="sendType" value="email"><span>이메일로 받기</span></label>
                                <label><input type="radio" name="sendType" value="phone"><span>휴대폰번호로 받기</span></label>
                            </div>
                        </div>
                        <div class="button-wrap">
                            <input type="button" class="submitBtn" onclick="sendFindId()" id="btnSubmit" value="아이디 확인하기" disabled>
                        </div>
                    </div>
                </form>

                <div class="shortcut">
                    <a href="/login">로그인</a>
                    <a href="/signup">회원가입</a>
                </div>
            </div>

{{--            <!-- 아이디 전송 후 팝업 -->--}}
{{--            <div class="popupArea">--}}
{{--                <div class="popupWrap">--}}
{{--                        <div class="popup textPopup">--}}
{{--                            <div class="closeIcon closeBtn"></div>--}}
{{--                            <div class="textWrap">--}}
{{--                                <p>아이디가 전송되었어요. <br>아이디를 확인 한 후 로그인하세요.</p>--}}
{{--                            </div>--}}
{{--                            <button type="button" class="closeBtn popupClose">확인</button>--}}
{{--                        </div>--}}
{{--                    <div class="dim"></div>--}}
{{--                </div>--}}
{{--            </div>--}}
        </div>
    </div>
@endsection

@section('script')
<script>
    var isCertify = true;
    $(document).ready(function(){
        $("input[name='sendType']").on('click', function () {
            if ($(this).val()) {
                $('#btnSubmit').attr('disabled', false);
            } else {
                $('#btnSubmit').attr('disabled', true);
            }
        });
    });

    function sendFindId() {
        if (isCertify) {
            isCertify = false;
            $.ajax({
                url: "/api/send/find-id",
                data: $('#findId').serialize(),
                method: "POST",
                dataType: "JSON",
                success: function(result) {
                    if(result.status == true){
                        alertPopup("아이디가 전송되었어요. <br>아이디를 확인 한 후 로그인하세요.", {
                            confirmText: '확인',
                            onConfirm: function() {
                                location.href = "/login"
                            },
                            onClose : function() {
                                location.href = "/login"
                            }
                        });
                    }
                }
            });
        }
    }
</script>
@endsection