{{-- <iframe src="https://datatrained.org/app/connect-with-career-coach" frameborder="0" style="width:100%;height:100vh;"></iframe> --}}


<section class="Connect-with-Career">
    <div class="container-fluid">
       <div class="row">
          <div class="offset-lg-1 col-lg-5 col-md-6 col-flex order-2">
             <div class="Connect-heading">
                <h1>Connect with Career Coach</h1>
             </div>
             <div class="contact-form">
                <div class="query-form">
                    <div id="grp1" class="">
                        <form>
                            <i><h5>Please provide your Batch Number.</h5></i>
                            <label id="error-msg1" style="color: red;"></label>
                            <div class="form-group col-md-12">
                               <label for="batch">Your Batch Number</label>
                               <input type="text" class="form-control" id="batch" name="batch" placeholder="Your Batch Number" required>
                            </div>
                           
                            <button type="button" id="next1">Next</button>
                         </form>
                    </div>
                    <div id="grp2" class="d-none">
                        <form> 
                            <i><h5>Please provide your <span style="color: red; font-size: 1.25rem;">Access Code</span>.</h5></i>
                            <label id="error-msg2" style="color: red;"></label>
                            <div class="form-group col-md-12">
                               <label for="code">Your Access Code</label>
                               <input type="text" class="form-control" placeholder="Your Access Code" name="code" id="code" required>
                            </div>
                            
                            <button type="button" id="next2">Next</button>
                         </form>
                    </div>
                  
                </div>
             </div>
          </div>
          <div class=" col-lg-6 col-md-6 order-1">
             <div class="coach-img">
                <img data-lazysrc="{{asset('images/connect-with-mentor.png')}}" alt="coach-img">
             </div>
          </div>
       </div>
    </div>
 </section>


 @section('scripts')


 <script>
    $("#next1").click(function() {

        $.post("{{ url('api/check-mentor-session-batch-validity') }}",
        {
            batch: $("#batch").val(),
            type: 2
        },
        function(data, status){
            // console.log(data);
            if(data.status == 200) {
                $("#grp1").removeClass("d-none");
                $("#grp2").removeClass("d-none");
                $("#grp1").addClass("d-none");
            } else {
                
                $("#error-msg1").html(data.data)
            }
        });
    });

    $("#next2").click(function() {
        $.post("{{ url('api/check-mentor-session-code-validity') }}",
        {
            batch: $("#batch").val(),
            code: $("#code").val(),
            type: 2
        },
        function(data, status){
            
            if(data.status == 200) {
                window.location.href = data.url;
            } else {
                $("#error-msg2").html(data.data)
            }
        });
    });
</script>

     
 @endsection