@extends('frontend.layouts.app')
<style>
    .form-check {
        margin: 0 auto 20px 0!important;
    }
    .swal-text, .swal-footer  {
        text-align: center;
        line-height: 2;
    }
</style>
@section('frontend-content')

    <div class="content-wrapper">
        <div class="page-header">
            <h3 class="page-title"> {{ trans('main-sidebar.profile') }} </h3>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
{{--                    <li class="breadcrumb-item"><a href="#">Sample Pages</a></li>--}}
{{--                    <li class="breadcrumb-item active" aria-current="page">Profile</li>--}}
                </ol>
            </nav>
            
        </div>
        @if(\App\Models\Banner::count() != 0)
        <div class="row">
         <div class="col-12">
         <div class="owl-carousel">
            @foreach(\App\Models\Banner::all() as $banner)
                <div><img src="@if(App::getLocale() == 'ar')
                                        {{ $banner->banner_ar }}
                                         @else
                                        {{ $banner->banner_en }}
                                    @endif" style="width: 100%; border-radius:5px!important" ></div>
            @endforeach
            </div>
        </div>
        </div>
        @endif
        
        <br>
        <div class="row">
            <div class="col-12">
                <div class="row">
                    <div class="col-md-4 stretch-card grid-margin">
                        <div class="card bg-gradient-danger card-img-holder text-white">
                            <div class="card-body">
                                <img src="{{asset('assets/images/dashboard/circle.svg')}}" class="card-img-absolute" alt="circle-image" />
                                <h4 class="font-weight-normal mb-3">{{ trans('main-sidebar.my_codes') }} <i class="mdi mdi-chart-line mdi-24px float-right"></i>
                                </h4>
                                <h2 class="mb-5">{{ \App\Models\Code::where('customer_id', \Illuminate\Support\Facades\Auth::id())->count() }}</h2>
                                <div class="d-flex justify-content-between">
                                    <p>{{ trans('main-sidebar.available') }} : {{ \App\Models\Code::where([['customer_id', \Illuminate\Support\Facades\Auth::id()], ['status', 'available']])->count() }}</p>
                                    <p>{{ trans('main-sidebar.expired') }} : {{ \App\Models\Code::where([['customer_id', \Illuminate\Support\Facades\Auth::id()], ['status', 'expired']])->count() }}</p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 stretch-card grid-margin">
                        <div class="card bg-gradient-info card-img-holder text-white">
                            <div class="card-body">
                                <img src="{{ asset('assets/images/dashboard/circle.svg') }}" class="card-img-absolute" alt="circle-image" />
                                <h4 class="font-weight-normal mb-3">{{ trans('main-sidebar.my_testings') }} <i class="mdi mdi-bookmark-outline mdi-24px float-right"></i>
                                </h4>
                                <h2 class="mb-5">{{ \App\Models\Exam::where('user_id', \Illuminate\Support\Facades\Auth::id())->count() }}</h2>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 stretch-card grid-margin">
                        <div class="card bg-gradient-success card-img-holder text-white">
                            <div class="card-body">
                                <img src="{{ asset('assets/images/dashboard/circle.svg') }}" class="card-img-absolute" alt="circle-image" />
                                <h4 class="font-weight-normal mb-3">{{ trans('main-sidebar.my_teams') }} <i class="mdi mdi-diamond mdi-24px float-right"></i>
                                </h4>
                                <h2 class="mb-5">{{ \App\Models\TeamWork::where('user_id', \Illuminate\Support\Facades\Auth::id())->count() }}</h2>
                            </div>
                        </div>
                    </div>
                </div>

                        <div class="row">

                            <div class="col-lg-4">
                                <div class="card">
                                    <div class="card-body">
                                        <div class="border-bottom text-center pb-4">
                                            <img src="@if($user->avatar == null){{ asset('assets/images/default-avatar.png') }} @else {{ $user->avatar }} @endif" alt="profile" class="img-lg rounded-circle mb-3" />
                                            <h3>{{ $user->name }}</h3>
                                            <p><i class="mdi mdi-phone"></i> {{ $user->phone_number }}</p>
                                            <p><i class="mdi mdi-email"></i> {{ $user->email }}</p>
{{--                                            <div class="d-flex justify-content-between">--}}
{{--                                                <button class="btn btn-gradient-success">Hire Me</button>--}}
{{--                                                <button class="btn btn-gradient-success">Follow</button>--}}
{{--                                            </div>--}}
                                        </div>
                                    </div>
                                </div>
                            </div>


                            <div class="col-lg-8">
                                <div class="card">
                                    <div class="card-body">
                                        <div class="d-flex justify-content-between">
                                            <div>
                                                @php
                                                    $existExam = \App\Models\Exam::where("user_id", \Illuminate\Support\Facades\Auth::id())->first();
                                                @endphp
                                                
                                                @php
                                                    $tutorial = \App\Models\Tutorial::find(1);
                                                @endphp


                                                <a onclick="@if($existExam == null) showSwal('basic') @endif @if(\Illuminate\Support\Facades\Auth::user()->profile->birth_date == null || \Illuminate\Support\Facades\Auth::user()->profile->time_of_birth == null || \Illuminate\Support\Facades\Auth::user()->profile->city == null || \Illuminate\Support\Facades\Auth::user()->profile->country == null || \Illuminate\Support\Facades\Auth::user()->phone_number == null ) showSwal('warning-message-and-cancel') @endif"  href="@if($existExam != null) {{ route('design_exam.payment') }} @else # @endif"  class="btn btn-gradient-dark">
{{--                                                    <i class="mdi mdi-plus"></i>--}}
                                                    {{ trans('main-sidebar.careful_testing') }}
                                                </a>



                                                <a href="{{ route('exam.start') }}" class="btn btn-dark" style="background-color: #111111">{{ trans('main-sidebar.herman_testing') }}</a>
                                                
                                                
                                                @if($tutorial->status == "active")
                                                <a  href="{{ $tutorial->url }}" target="_blank" class="btn btn-gradient-danger">
                                                    <i class="mdi mdi-youtube"></i>
                                                    {{ trans('main-sidebar.tutorial') }}
                                                </a>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="mt-4 py-2 border-top border-bottom">
                                            <ul class="nav profile-navbar p-0">
                                                <li class="nav-item">
                                                    <a class="nav-link active" href="#">
                                                        <i class="mdi mdi-account-outline"></i> {{ trans('main-sidebar.profile_info') }} </a>
                                                </li>
                                            </ul>
                                        </div>

                                        <form class="forms-sample my-3" action="{{ route("profile.update", ['id'=> $user->id]) }}" method="POST"  enctype="multipart/form-data">
                                            @csrf
                                            <div class="form-group">
                                                <label for="exampleInputName1">{{ trans('main-sidebar.full_name') }}</label>
                                                <input type="text" name="name" class="form-control" id="exampleInputName1" placeholder="{{ trans('main-sidebar.full_name') }}" value="{{ $user->name }}">
                                            </div>
                                            <div class="form-group">
                                                <label for="Phone">{{ trans('main-sidebar.phone_number') }}</label>
                                                <input type="text" name="phone_number" class="form-control" id="Phone" placeholder="{{ trans('main-sidebar.phone_number') }}" value="{{ $user->phone_number }}">
                                            </div>
                                            <div class="form-group">
                                                <label for="Email">{{ trans('main-sidebar.email') }}</label>
                                                <input type="email" name="email" class="form-control" id="Email" placeholder="{{ trans('main-sidebar.email') }}" value="{{ $user->email }}">
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleInputPassword4">{{ trans('main-sidebar.password') }}</label>
                                                <input type="password" name="password" class="form-control" id="exampleInputPassword4" placeholder="{{ trans('main-sidebar.password') }}">
                                            </div>
                                            <div class="form-group">
                                                <label for="BirthDate">{{ trans('main-sidebar.birth_date') }}</label>
                                                <input type="date" name="birth_date" value="{{ $user->profile->birth_date }}" class="form-control" id="BirthDate">
                                            </div>
                                            <div class="form-group">
                                                <label for="BirthTime">{{ trans('main-sidebar.time_birth') }}</label>
                                                <input type="time" name="time_of_birth" value="{{ $user->profile->time_of_birth }}" class="form-control" id="BirthTime">
                                            </div>
                                            <div class="form-group">
                                                <label for="exampleSelectGender">{{ trans('main-sidebar.gender') }}</label>
                                                <select class="form-control" name="gender" id="exampleSelectGender">
                                                    <option @if($user->profile->gender == 'ذكر') selected @endif value="ذكر">{{ trans('main-sidebar.male') }}</option>
                                                    <option @if($user->profile->gender == 'أنثى') selected @endif value="أنثى">{{ trans('main-sidebar.female') }}</option>
                                                </select>
                                            </div>
                                            <div class="form-group">
                                                <label>{{ trans('main-sidebar.profile_pic') }}</label>
                                                <input type="file" name="avatar" class="file-upload-default">
                                                <div class="input-group col-xs-12">
                                                    <input type="text" class="form-control file-upload-info" disabled placeholder="Upload Image">
                                                    <span class="input-group-append">
                                                    <button class="file-upload-browse btn btn-gradient-primary" type="button">Upload</button>
                                                  </span>
                                                </div>
                                            </div>
                                            <div class="form-group">
                                                <label for="City">{{ trans('main-sidebar.city') }}</label>
                                                <input type="text" value="{{ $user->profile->city }}" name="city" class="form-control" id="City" placeholder="City of Birth">
                                            </div>
                                            <div class="form-group">
                                                <label for="Country">{{ trans('main-sidebar.country') }}</label>
                                                <input type="text" value="{{ $user->profile->country }}" name="country" class="form-control" id="Country" placeholder="Country Of Birth">
                                            </div>

                                            <button type="submit" class="btn btn-gradient-primary me-2">{{ trans('main-sidebar.save') }}</button>

                                        </form>
                                    </div>
                                </div>
                            </div>

                        </div>

            </div>
        </div>
        
    </div>
    <!-- content-wrapper ends -->
    <!-- partial:partials/_footer.html -->

    <!-- partial -->
@endsection

@push('frontend-script')



    <script src="{{ asset("assets/js/file-upload.js") }}"></script>
    <script src="{{ asset("assets/vendors/sweetalert/sweetalert.min.js") }}"></script>

    <script>
        (function($) {
            showSwal = function(type) {
                'use strict';
                if (type === 'basic') {
                    swal({
                        text: '{{ trans("main-sidebar.exam_message") }}',
                        button: {
                            text: "OK",
                            value: true,
                            visible: true,
                            className: "btn btn-primary"
                        }
                    })

                } else if (type === 'title-and-text') {
                    swal({
                        title: 'Read the alert!',
                        text: 'Click OK to close this alert',
                        button: {
                            text: "OK",
                            value: true,
                            visible: true,
                            className: "btn btn-primary"
                        }
                    })

                } else if (type === 'success-message') {
                    swal({
                        title: 'لقد تم إجراء الفحص الدقيق بنجاح!',
                        text: 'سيصلك الرد على الواتساب والأيميل خلال ٤٨ ساعة عمل.',
                        icon: 'success',
                        button: {
                            text: "Ok",
                            value: true,
                            visible: true,
                            className: "btn btn-primary"
                        }
                    })

                } else if (type === 'auto-close') {
                    swal({
                        title: 'Auto close alert!',
                        text: 'I will close in 2 seconds.',
                        timer: 2000,
                        button: false
                    }).then(
                        function() {},
                        // handling the promise rejection
                        function(dismiss) {
                            if (dismiss === 'timer') {
                                console.log('I was closed by the timer')
                            }
                        }
                    )
                } else if (type === 'warning-message-and-cancel') {
                    swal({
                        title: 'لا يمكنك أجراء الفحص الدقيق!',
                        text: "لكي تتمكن من إجراء الفحص الدقيق تأكد من تحديد تاريخ ميلادك ووقت الميلاد و المدينة والدولة ورقم الهاتف أولاً.",
                        icon: 'warning',
                        showCancelButton: true,
                        confirmButtonColor: '#3f51b5',
                        confirmButtonText: 'Great ',
                        buttons: {
                            confirm: {
                                text: "OK",
                                value: true,
                                visible: true,
                                className: "btn btn-primary",
                                closeModal: true
                            }
                        }
                    })

                } else if (type === 'custom-html') {
                    swal({
                        content: {
                            element: "input",
                            attributes: {
                                placeholder: "Type your password",
                                type: "text",
                                class: 'form-control',
                            },
                        },
                        button: {
                            text: "OK",
                            value: true,
                            visible: true,
                            className: "btn btn-primary",
                        }
                    })
                }
            }

        })(jQuery);
    </script>

    @if(session()->has('message'))
        <script>
            Toastify({
                text: '{{  session()->get('message') }}',
                duration: 3000,
                newWindow: true,
                close: true,
                gravity: "top", // `top` or `bottom`
                position: "left", // `left`, `center` or `right`
                stopOnFocus: true, // Prevents dismissing of toast on hover
                style: {
                    background: "linear-gradient(to right, #00b09b, #96c93d)",
                },
                onClick: function(){} // Callback after click
            }).showToast();
        </script>
    @endif
    
    <script src="{{ asset('assets/owlcarousel/owl.carousel.min.js') }}"></script>
    <script>
    $(document).ready(function(){
          $(".owl-carousel").owlCarousel(
              {
                  items:1,
            margin:10,
            autoHeight:true,
            autoplay:true,
            autoplayTimeout:4000,
            autoplayHoverPause:true,
            loop:true,
            margin:10,
            nav:false,
            @if(App::getLocale() == 'ar')
            rtl: true,
            @endif
            responsive:{
                0:{
                    items:1
                },
                600:{
                    items:1
                },
                1000:{
                    items:1
                }
            }
        });
        });
        </script>


@endpush