<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).on('click','.submit',function(){
    var formId = $(this).closest('form').attr('id');
      var formData = $('#' + formId).serialize(); // Serialize form data
 alert(formData);
    $.ajax({ 
      type: "get",
      url: "<?php echo base_url(); ?>payment",
      data: formData,
      json: true,
      success: function(response) {
        if (response == true) {
           $("#mytable").load(window.location + " #mytable");
        } 
        else {
           
        }
      },
      error: function(jqXHR, textStatus, err) { alert('text status '+textStatus+', err '+err) }
    });
});


$(document).on('click','.use_points',function(){
    
    var formData = $('#myform').serialize(); // Serialize form data
 
    $.ajax({ 
      type: "post",
      url: "<?php echo base_url(); ?>use_points",
      data: formData,
      json: true,
      success: function(response) {
        if (response == true) {
           $("#mytable").load(window.location + " #mytable");
        } 
        else {
           alert(response);
        }
      },
      error: function(jqXHR, textStatus, err) { alert('text status '+textStatus+', err '+err) }
    });
});


$(document).on('click','.Addtocart',function(){
    var formId = $(this).closest('form').attr('id');
      var formData = $('#' + formId).serialize(); // Serialize form data
 
    $.ajax({ 
      type: "post",
      url: "<?php echo base_url(); ?>add_to_cart",
      data: formData,
      json: true,
      success: function(response) {
        if (response == true) {
           $("#mycarttable").load(window.location + " #mycarttable");
        } 
        else {
           
        }
      },
      error: function(jqXHR, textStatus, err) { alert('text status '+textStatus+', err '+err) }
    });
});


$(document).on('click','.checkout',function(){
   
    $.ajax({ 
      type: "post",
      url: "<?php echo base_url(); ?>cart_checkout",
      //data: formData,
      json: true,
      success: function(response) {
       
        if (response == true) {
           $("#mytable").load(window.location + " #mytable");
           $("#mycarttable").load(window.location + " #mycarttable");
        } 
        else {
           
        }
      },
      error: function(jqXHR, textStatus, err) { alert('text status '+textStatus+', err '+err) }
    });
});
</script>
<!-- jquery -->
<style>
    table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}
    </style>

<div class="container">
	<div class="row">

		<div class="col-md-3 ">
		     <div class="list-group ">
              <a href="<?=base_url()."member_home"; ?>" class="list-group-item list-group-item-action active">Dashboard</a>
            </div> 
		</div>
        <div class="col-md-3 ">
		     <div class="list-group ">
              <a href="#" class="list-group-item list-group-item-action">My Credits</a>
            </div> 
		</div>
        <div class="col-md-3 ">
		     <div class="list-group ">
              <a href="#" class="list-group-item list-group-item-action">Credit Packages</a>
            </div> 
		</div>
        <div class="col-md-3 ">
		     <div class="list-group ">
              <a href="<?=base_url()."member_logout"; ?>" class="list-group-item list-group-item-action">Logout</a>
            </div> 
		</div>
        </br>


		<div class="col-md-12">
		    <div class="card">
		        <div class="card-body">
		            <div class="row">
		                <div class="col-md-12">
		                    <h4>My Profile</h4>
		                    <hr>
		                </div>
		            </div>
		            <div class="row">
		                <div class="col-md-12">
		                    
                              <div class="form-group row">
                                <label for="username" class="col-4 col-form-label">Welcome , </label> 
                                <div class="col-8">
                                <h1>  <?=    $userdata->name; ?> </h1>
                                </div>
                              </div>
                              
                            
		                </div>
		            </div>
		            
</br><h1>Credit Packs</h1></br>
        <div class="row ">


        <?php foreach ($packageData as $index => $row) { ?>
            <div class="col-xs-12 col-sm-2 col-md-2 col-lg-2">
                <div class="db-wrapper">
                    <div class="db-pricing-seven">
                        <ul>
                            <li class="price">
                                <?= $row['package_type']; ?>
                            </li>
                            <li class="price">
                               <?= $row['package_name']; ?>
                            </li>
                            <li class="price">
                                <?= $row['credit']; ?> - <?= $row['cost']; ?> $
                            </li> 
                        </ul>
                        <div class="pricing-footer">
                        <form   id="form_<?php echo $index; ?>">
                        <input type="hidden" value="<?=    $userdata->id; ?>" name="member_id_<?php echo $index; ?>" id="<?php echo $index; ?>">
                        <input type="hidden" value=" <?= $row['id']; ?>" name="pack_id_<?php echo $index; ?>" id="<?php echo $index; ?>">
                        <input type="hidden" value="1" name="pack_count_<?php echo $index; ?>" id="<?php echo $index; ?>">
                        <button type="button"   class="btn btn-default btn-sm submit"> BUY</button>
                        <button type="button"   class="btn btn-default btn-sm Addtocart"> Add to cart</button>
                        </form>
                        <a href="<?= base_url() ?>payment?pack_id=<?= $row['id']; ?>" > buy pack </a>
                        </div>
                    </div>
                </div>
            </div>
        <?php } ?>
           
        </div>
<div>
<form   method="post" action="<?= base_url('/payment'); ?>">
<input type ="text" name="pack_id[]" >
<input type ="text" name="count[]" >
<input type ="text" name="pack_id[]" >
<input type ="text" name="count[]" >
<button type="submit" >submit</button>
</form>
</div>
</br><h1>My credits table</h1></br>
  <table id="mytable">
    <thead>
      <tr>
        <th>Pack type</th>
        <th>Pack name</th>
        <th>Credits</th>
        <th>Used credits</th>
        <th>Available credits</th>
        <th>Expired credits</th>
        <th>Cost</th>
        <th>Expiring date </th>

      </tr>
    </thead>
    <tbody>
    <?php foreach ($creditsData as $index => $row) { ?>
      <tr>
        <td><?= $row['package_type']; ?></td>
        <td><?= $row['package_name']; ?></td>
        <td><?= $row['credit_points']; ?></td>
        <td><?= $row['used_points'] ?></td>
        <td><?= $row['running_balance'] ?></td>
        <td><?= $row['expired_points']; ?></td>
        <td><?= $row['cost']; ?></td>
        <td><?= $row['expiring_date']; ?></td>
      </tr>
      <?php } ?>
    </tbody>
  </table>

    </br>

</br><h1>Book slot</h1></br>

    <form   id="myform">
    <input type="hidden" value="<?=    $userdata->id; ?>" name="member_id" >
    <lable>Book slot With  <lable>  <input type="text " value="" name="points"> <lable>Credit points  <lable>
    <button type="button"   class="btn btn-default btn-lg use_points"> Use points</button>
    </form>

</br><h1>My cart</h1></br>
<table id="mycarttable">
    <thead>
      <tr>
        <th>Pack type</th>
        <th>Pack name</th>
        <th>Credits</th>
        <th>Cost</th>

      </tr>
    </thead>
    <tbody>
    <?php foreach ($cartData as $index => $row) { ?>
      <tr>
        <td><?= $row['package_type']; ?></td>
        <td><?= $row['package_name']; ?></td>
        <td><?= $row['credit']; ?></td>
        <td><?= $row['cost']; ?></td>
     
      <?php } ?>
    </tbody>
  </table>
  
  <button type="button"   class="btn btn-default btn-lg checkout">Check out</button>
  
		        </div>
		    </div>
		</div>
	</div>
</div>




