@extends('front.layout.master')

@section('content')
    <!-- -------------------------------------------- -->
    <!-- Start Login -->
    <div class="login">
        <div class="container">
            <div class="row">
                <div class="box m-auto col-md-8">
                    <a class="link" href="{{route('get-login')}}">تسجيل الدخول</a>
                    <a class="link active" href="{{route('register')}}">انشاء حساب</a>
                    <form action="{{route('register-post')}}" method="post" id="submit_login"  data-parsley-validate="">
                        @csrf
                        @method('post')

                        <label data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in" class="mt-4" for="name">الاسم</label>
                        <div class="input-group" data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in">
                            <img src="{{asset('front/images/Icon awesome-user-alt.png')}}" alt="">
                            <input id="name" type="text" class="form-control" name="name">
                        </div>

                        <label data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in" class="mt-4" for="mail">البريد الاكتروني</label>
                        <div class="input-group" data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in">
                            <img src="{{asset('front/images/Icon material-email.png')}}" alt="">
                            <input id="mail" type="email" class="form-control" name="email">
                        </div>

                        <label data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in" class="mt-4" for="tel">رقم الهاتف</label>
                        <div class="input-group tel" data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in">
                            <img src="{{asset('front/images/Icon feather-phone-call.png')}}" alt="">
                            <input id="tel" type="tel" class="form-control" name="phone">
                        </div>

                        <label data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in"  class="mt-4" for="pass">كلمة المرور</label>
                        <div class="input-group" data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in">
                            <img src="{{asset('front/images/Group 3089.png')}}" alt="">
                            <input id="pass" type="password" class="form-control" name="password">
                            <a  id="eye">
                                <i class="fas fa-eye eye"></i>
                            </a>
                            <a id="eye1">
                                <i  class="fas fa-eye-slash eye1"></i>
                            </a>
                        </div>

                        <a href="forgetPassword.html" class="forget" data-aos-delay="100" data-aos-duration="800" data-aos="fade-up" >نسيت كلمة المرور</a>

                        <button class="submit mt-5" type="submit" data-aos-delay="100" data-aos-duration="800" data-aos="zoom-in" >دخول</button>

                    </form>
                </div>
            </div>
        </div>
    </div>
    <!-- End Login -->
    <!-- -------------------------------------------- -->
@endsection
@push('js')
    <script>
        $(function (){

            $('.iti__selected-dial-code').html('+965')
            $('body').on('submit','#submit_login',function (e){
                e.preventDefault();

                var url = $(this).attr('action');
                $.ajax({
                    url: url,
                    method: "post",
                    data: new FormData(this),
                    dataType: 'json',

                    cache       : false,
                    contentType : false,
                    processData : false,

                    success: function (response) {
                        if(response.status == true){
                            toastr.success("تم تسجيل الدخول بنجاح");
                            window.location.href = "{{ route('otp-code')}}";

                        }else{
                            toastr.warning(response.message);

                        }
                        // window.location.reload();
                    },

                });

            })
        });
    </script>
@endpush