<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="author" content="colorlib.com">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>ICAN</title>

    <!-- Font Icon -->
    <link rel="stylesheet" href="{{url('fonts/themify-icons/themify-icons.css')}}">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
    
    <!-- Main css -->
    <link rel="stylesheet" href="{{url('css/style-form.css')}}">
</head>
<body>

    <div class="main">

        <div class="container">
           <br/>
            <img  src="{{url('img/banner_logo.jpg')}}" style=" display: block;margin-left: auto;margin-right: auto;" class="img-responsive " alt="ican"> <br/>
          
             <h2>Courses Registration</h2>
            <input type="text" hidden  value="{{$payment}}" name="payonly" id="payonly" />
             <input type="text" hidden  value="{{$message}}" name="msg" id="msg" />
            <form method="POST" id="signup-form" class="signup-form">
                    <h3 style="display: none;">
                        <span class="icon"><i class="ti-user"></i></span>
                        <span class="title_text">Basic</span>
                    </h3>
                    <fieldset>
                        <legend>
                            <span class="step-heading"></span>
                            <span class="step-number">Step 1 / 4</span>
                        </legend>
                        <label for="name" class="form-label required">Name</label>
                            <input type="text"  value="{{$std_data->name}}" name="name" id="name" />

                        <div id="divreg" name="divreg" class="form-group">
                            <label for="regNo" class="form-label required">Regd. No</label>
                            <input type="text"  value="{{$std_data->reg_no}}" name="regNo" id="regNo" />
                        </div>
                        <div class="form-group">
                            <label for="address" class="form-label required">Address </label>
                            <input type="text" required value="{{$std_data->address}}" name="address" id="address" />
                        </div>

                        <div class="form-group">
                            <label for="email" class="form-label required">Email</label>
                            <input type="email" value="{{$std_data->email}}" name="email" id="email" />
                            <span id="ifempty" name="ifempty" style="font-size:12px;font-style: italic;color:red">(if different, type your email id)</span>
                        </div>

                        <div class="form-group">
                            <label for="phone" class="form-label required">Phone</label>
                            <input type="number"  value="{{$std_data->phone}}" name="phone" id="phone" />
                            <span id="ifempty1" name="ifempty1" style="font-size:12px;font-style: italic;color:red">(if different, type your mobile number)</span>
                        </div>
                       <span id="ifempty1" name="ifempty1" style="font-size:12px;font-style: italic;color:red">* fields are mandatory.</span>
                    </fieldset>

                    <h3>
                        <span class="icon"><i class="ti-email"></i></span>
                        <span class="title_text">Class</span>
                    </h3>
                    <fieldset>
                        <legend>
                            <span class="step-heading">Choose your subject</span>
                            <span class="step-number">Step 2 / 4</span>
                        </legend>
                    <div class="class-info-details">
                    <input type="hidden" name="courseid" id="courseid" />
                    
                        <div class="table-responsive" style="font-size:11px;" >

                            <table id="dtBasicExample" name="dtBasicExample"    class="table table-striped  table-bordered table-sm" cellspacing="0">
                                    <thead>
                                        <tr >
                                        <th  >#</th>
                                        <th>Session</th>
                                         <th >Class Type </th>
                                        <th >Subject</th>
                                        
                                        <th >Resources Person</th>
                                        <th >Date</th>
                                        <th >Time</th>
                                        <th >Fee</th>
                                       
                                         <th >Status</th>
                                        <th>Schedule</th>
                                        <th >Remarks</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if(!empty($allunpaid))
                                         @foreach($allunpaid as $ct )
                                         <tr>
                                             @if(!empty($ct->enrollId))
                                             @if($ct->completed_process == 1 ||  $readOnly == 2)
                                       <td > <input type="checkbox" style=" width: 15px; height: 15px;" disabled checked class="approve_class" name="sel_app[]" onchange="getValue(this.value)" value="{{$ct->id}}" ></td>
                                       @else
                                        <td  > <input type="checkbox" style=" width: 15px; height: 15px;" checked class="approve_class" name="sel_app[]" onchange="getValue(this.value)" value="{{$ct->id}}" ></td>
                                            @endif
                                            @else
                                        <td > <input type="checkbox" style=" width: 15px; height: 15px;" class="approve_class" name="sel_app[]" onchange="getValue(this.value)" value="{{$ct->id}}" ></td>
                                                @endif  
                                                <td>{{$ct->session_name}}</td>
                                              <td >{{$ct->name}}</td>
                                               <td>{{$ct->subject_name}}</td>
                                              
                                                 <td >{{$ct->resources_person}}</td>
                                                 <td  class="text-nowrap">{{$ct->start_dt}} <br/>to <br/> {{$ct->end_dt}} </td>
                                                 <td  class="text-nowrap">{{strtoupper($ct->start_time)}} <br/> TO <br/> {{strtoupper($ct->end_time)}}</td>
                                                 <td style="text-align:right">Rs.{{$ct->cost_per_sub}}</td>
                                                
                                                   <td>@if ($ct->paid_status ==1) Paid @elseif (strlen($ct->paid_status) == 1) Unpaid @else Not Registered @endif </td>
                                                 <td>
                            @if($ct->schedule)
                            
                                <a href="{{env('APP_URL')}}.{{ $ct->schedule->getFullUrl() }}"  download="schedule.pdf" target="_blank">
                                   download
                                </a>
                            @endif
                        </td>
                        <td>{{$ct->remarks}}</td>
                                                 </tr>
                                                @endforeach
                                                @endif
                                                 
                                    </tbody>
</table>
</div>
                        
                    </div>
                    

                    </fieldset>


                    
                   
                   
                    <h3>
                        <span class="icon"><i class="ti-credit-card"></i></span>
                        <span class="title_text">Payment</span>
                    </h3>
                    <fieldset>
                        <legend>
                            <span class="step-heading">Make your payment </span>
                            <span class="step-number">Step 3 / 4</span>
                        </legend>
                       
                        <div class="payment_div">
      
                          <div class="products">
                            <h3 class="title">Transactions</h3>
                            <div id="trxn" name="trxn" class="item">
                              <span class="price"></span>
                              <p class="item-name"></p>
                            </div>
                             
                           
                
     

                          <div class="payment-option">
                            <div class="p-row">
                              <div class=" payment-online p-col">
                                <h4>Pay Online</h4>
                                <div>
                                    
                                        <button  id="subesewa" name="subesewa" style="cursor: pointer; margin-bottom: 10px;">
                                          <img src="{{url('/img/esewa_logo.png')}}" alt="esewa" class="img-fluid">
                                        </button>
                                   
                                   
                                        <button id="btnconnect" name="btnconnect" style="cursor: pointer">
                                         <img src="{{url('/img/ConnectIPS.png')}}" alt="connectIPS" class="img-fluid" >
                                        </button> 
                                   
                                </div>
                              </div>
                              @if($level =="Memberships") // s added to remove for all
                              <div class="p-col">
                                <h4>Don't want to pay now</h4>
                                <label class="radio-button">
  <input type="radio" id="scholarship" name="scholarship" value="0">
  <span class="label-visible">
    <span class="fake-radiobutton"></span>
    Applying to pay later
  </span>
  <p style="margin-left:30px;font-style: italic">You must pay the class fee before the final exam.</p>
</label>
 <strong><p >OR</p></strong>
<label class="radio-button">
  <input type="radio" id="scholarship" name="scholarship" value="1">
  <span class="label-visible">
    <span class="fake-radiobutton"></span>
    Applying for scholarship
  </span>
    <p style="margin-left:30px;font-style: italic">Decision regarding scholarship will be done once the office resume.</p>

</label>
                                
                                <div style="text-align:right">
          
                                  <p><span  id="ican-pay" style="color: #03254c;"><b>Click here to proceed</b></span>.</p>
                                 
                                </div>
                              </div>
                            </div>
                          </div>
                          @endif
         
         
                        </div>
     
  </div>
  
 
                    </fieldset>
                    
                    <h3>
                        <span class="icon"><i class="ti-credit-card"></i></span>
                        <span class="title_text">Complete</span>
                    </h3>
                    <fieldset>
                        <legend>
                            <span class="step-heading"></span>
                            <span class="step-number">Step 4 / 4</span>
                        </legend>
                            <h5 style="color: #e5272a; font-size: 16px; margin-bottom: 15px;"><i>Thank you for your registration!</i></h5>
                            <h5 style="color: #e5272a; font-size: 15px;"><i>Please check your email for more details.</i></h5>
                            <div class="media" style="margin-top: 25px;">
                              <div class="media-left">
                                  <!--<img class="media-object" src="{{url('/img/ican-logo.png')}}" alt="ican-logo" width="90" height="90">-->
                              </div>
                              <!--<div class="media-body media-middle">-->
                              <!--  <h4 class="media-heading" style="font-size: 20px; font-weight: 600;">The Institute of Chartered Accountants of Nepal</h4>-->
                              <!--</div>-->
                            </div>
                        <div>
                            
                        </div>
                    </fieldset>

            </form>
   
            <form  id ="frmesewa" name="frmesewa" action = "https://esewa.com.np/epay/main" method="POST">
                                        @csrf
                                        <input id="tAmt"  name="tAmt" type="hidden" >
                                        <input id="amt" name="amt" type="hidden" > 
                                        <input value="ICANPAY-1" name="pid" id="pid" type="hidden" >
                                        <input value="0" name="txAmt" type="hidden">
                                        <input value="0" name="psc" type="hidden">
                                        <input value="0" name="pdc" type="hidden">
                                        <input value="NP-ES-ICANONLINE" name="scd" type="hidden">
                                        <input  type="hidden"  id="su" name="su">
                                        <input  type="hidden"  id="fu" name="fu">
                                        
                                    </form> 
                                    <form id="frmConnect" name="frmConnect" action = "https://login.connectips.com:7443/connectipswebgw/loginpage" method="POST">
                                        <input  type="hidden" name="MERCHANTID" id="MERCHANTID" value="360"/>
                                        <input type="hidden"  name="APPID" id="APPID" value="MER-360-APP-1"/> 
                                        <input type="hidden" name="APPNAME" id="APPNAME" value="ICAN"/> 
                                        <input type="hidden" name="TXNID" id="TXNID" value="111"/> 
                                        <input type="hidden"  name="TXNDATE" id="TXNDATE" value="2020-12-12"/> 
                                        <input type="hidden" name="TXNCRNCY" id="TXNCRNCY" value="NPR"/> 
                                        <input type="hidden" name="TXNAMT" id="TXNAMT" value=""/> 
                                        <input type="hidden" name="REFERENCEID" id="REFERENCEID" value="ICAN 1"/>
                                        <input type="hidden" name="REMARKS" id="REMARKS" value="ican"/>  
                                        <input type="hidden" name="PARTICULARS" id="PARTICULARS" value="Exam Registration for "/>
                                        <input type="hidden" name="TOKEN" id="TOKEN" value="token"/> 
                                        <!-- <button type="submit" class="btn btn-primary btn-block">Connect IPS</button> -->
                                    </form>

    <div class="modal" tabindex="-1" role="dialog" id="modal-box2">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        To Continue, Please enter the sum of numbers sent to your mobile number and email.
        <input type="number" id="otp" name="otp_code" class="form-control">
       
      </div>
      <div class="modal-footer">
          <button type="button" id="validate" name="validate" class="btn btn-primary" >Verify</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Back</button>
      </div>
    </div>
  </div>
</div>
</div>
    <div class="footer">
        
    </div>

    <!-- JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/jquery.validate.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-steps/1.1.0/jquery.steps.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script type="text/javascript">
      var add_event_url = "{{ url('store-form-data') }}";
      var load_payment = "{{ url('load-payment') }}";
      var generateOTP = "{{ url('generate_otp') }}";
      var checkOTP = "{{ url('check_otp') }}";
      var csrftoken = "{{ csrf_token() }}";
      var initinex = $('#payonly').val(); 
      var msg = $('#msg').val(); 
      if(msg!=''){
      alert(msg);
      }
      var selectedCourses=[];
      
      var all=<?php echo $allunpaid->toJson(); ?>;
     
       var selectedCourses=<?php echo $courses->toJson(); ?>;
        console.log(selectedCourses);
     var coursess="";
      for(var i = 0; i < selectedCourses.length; i++) {
        if (coursess)
             coursess +=",";
             coursess += selectedCourses[i].id;
      }
      document.getElementById('courseid').value = coursess;
    //alert(coursess);
    
    function getValue(value){

        for(var i = 0; i < all.length; i++) {
            var delStatus = false;
            if(all[i].id == value){
                for(var j = 0; j < selectedCourses.length; j++)
                {
                    
                    if(selectedCourses[j].id == value)
                    {
                          selectedCourses.splice(j,1);
                        delStatus = true;
                        break;
                    }
                }
                if(!delStatus)
                {
                     
                      selectedCourses.push(all[i]);
                      break;
                  
                }
                 
            }
            
        }
      var coursess="";
      for(var i = 0; i < selectedCourses.length; i++) {
        if (coursess)
             coursess +=",";
             coursess += selectedCourses[i].id;
      }
      document.getElementById('courseid').value = coursess;
      //alert(coursess);
      
}
      
     $(document).ready(function(){
         
    
         for( i =0; i<initinex; i++)
         {
            $("#signup-form").steps("next");
         }
      
        $('#ican-pay').click(function(){
            var phone = $('#phone').val();
            var scholarship = $('input[name="scholarship"]:checked').val();
            
    
      $.ajax({
          url: "{!! route('save-pay-later') !!}",
          type: 'POST',
          data: {phone:phone,_token: csrftoken,scholarship:scholarship},
          success: function(result){
              if(result.status==1)
              {
                $("#signup-form").steps("next");
              }
          }
      
    });
  });
  
  
   $('input:radio[name=scholarship]').click(function() {
        var checkval = $('input:radio[name=scholarship]:checked').val();
        if(checkval == '0'|| checkval == '1')
        {
              $('#ican-pay').css('cursor', 'pointer' );
              $('#ican-pay').css('color', '#3b99e0' );
              
        }
       

    });
 

        $('#subesewa').click(function(e){
            e.preventDefault();
            var phone = $('#phone').val();
            document.getElementById("su").value = "{{route('save-payment')}}?phone="+phone+"&q=su";
            document.getElementById("fu").value = "{{route('save-payment')}}?phone="+phone+"&q=fu";
          
            $('#frmesewa').submit();
        });
        $('#btnconnect').click(function(e){
           
           e.preventDefault();
            $('#frmConnect').submit();
        });
      
        if({{$readOnly}}==1)
        {

        document.getElementById("name").disabled = true;
        document.getElementById("regNo").disabled = true;
      //  document.getElementById("address").disabled = true;
            $("#divreg").show();
             $("#ifempty").show();
              $("#ifempty1").show();
            
        }else
        {
            document.getElementById("name").disabled = false;
        document.getElementById("regNo").disabled = false;
   //     document.getElementById("address").disabled = false;
            $("#divreg").hide();
            $("#ifempty").hide();
             $("#ifempty1").hide();
        }
        
        
        $('#btnAdd').on("click",function(e){
    e.preventDefault();
    var courseid = document.getElementById("courseid").value;
    var result = $('#course').val();
    var course = JSON.parse(result);
    //alert(result);
    var alreadyadd = false;
    for(var i = 0; i < selectedCourses.length; i++) {
       
        if(selectedCourses[i].id == course["id"] )
        {
            alreadyadd = true;
            break;
        }
    }
    if(alreadyadd)
    {
        alert("Already Added ");
    }else{
    selectedCourses.push(course);
    if (courseid)
    courseid += ",";
    courseid += course["id"];
        document.getElementById('courseid').value = courseid;
        document.getElementById('resourcepersonname').innerHTML = "";
        document.getElementById('subject').innerHTML ="";
        document.getElementById('fee').innerHTML = "";
        document.getElementById('date').innerHTML =  "" ;
        document.getElementById('time').innerHTML = "" ;
        document.getElementById('remarks').innerHTML ="";
        document.getElementById('classtype').innerHTML = "";
       // alert("Course Added to your list");

        $('#table1').find('tbody').empty();
               for(var i = 0; i < selectedCourses.length; i++) {
                $("#table1").append("<tr><td>"+(i+1)+"</td><td>"+selectedCourses[i].session_name+
                "</td><td>"+selectedCourses[i].name+"</td><td>"+selectedCourses[i].subject_name+
                "</td><td>"+selectedCourses[i].cost_per_sub+"</td><td>"+selectedCourses[i].start_dt+
                "</td><td><a onclick='deleteSelected("+selectedCourses[i].id+")'><i class='ti-trash'></input></td></tr>");
                // <a  onclick='deleteSelected("+selectedCourses[i]+")'>Delete</a>
              }
        
    }

});

    $('#course').change(function(){
        var result = $(this).val();
        var course = JSON.parse(result);
        document.getElementById('resourcepersonname').innerHTML = course['resources_person'];
        document.getElementById('subject').innerHTML = course['subject_name'];
        document.getElementById('fee').innerHTML = "Rs."+course['cost_per_sub'];
        document.getElementById('date').innerHTML =  course['start_dt']+" -"+course['end_dt'] ;
        document.getElementById('time').innerHTML = course['start_time']+" -"+course['end_time'] ;
        document.getElementById('remarks').innerHTML = course['remarks'];
        document.getElementById('classtype').innerHTML = course['name'];
       // document.getElementById('courseid').value = course['id'];

   
});
     });

     function deleteSelected (selected)
    {

        
            $.each(selectedCourses, function(i){
                if(selectedCourses[i].id === selected) {
                    selectedCourses.splice(i,1);
                    return false;
                }
            });
            $('#table1').find('tbody').empty();
               for(var i = 0; i < selectedCourses.length; i++) {
                $("#table1").append("<tr><td>"+(i+1)+"</td><td>"+selectedCourses[i].session_name+
                "</td><td>"+selectedCourses[i].name+"</td><td>"+selectedCourses[i].subject_name+
                "</td><td>"+selectedCourses[i].cost_per_sub+"</td><td>"+selectedCourses[i].start_dt+
                "</td><td><a onclick='deleteSelected("+selectedCourses[i].id+")'><i class='ti-trash'></input></td></tr>");
                // <a  onclick='deleteSelected("+selectedCourses[i]+")'>Delete</a>
              }
        
    }
     </script>
       <script src="{{url('js/main-form.js')}}"></script>
       
</body>
</html>