166 lines
		
	
	
		
			4.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
		
		
			
		
	
	
			166 lines
		
	
	
		
			4.9 KiB
		
	
	
	
		
			HTML
		
	
	
	
|  | <!DOCTYPE html> | ||
|  | <html lang="en"> | ||
|  | 
 | ||
|  | <head> | ||
|  |     <meta charset="UTF-8"> | ||
|  |     <meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
|  |     <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
|  |     <title>Payment Details</title> | ||
|  | </head> | ||
|  | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"> | ||
|  | 
 | ||
|  | <!-- jQuery library --> | ||
|  | <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> | ||
|  | 
 | ||
|  | <!-- Latest compiled JavaScript --> | ||
|  | <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script> | ||
|  | 
 | ||
|  | <link rel="stylesheet" href="https://cdn.datatables.net/1.10.25/css/jquery.dataTables.min.css"> | ||
|  | <style> | ||
|  |     table { | ||
|  |         font-family: arial, sans-serif; | ||
|  |         border-collapse: collapse; | ||
|  |         width: 80%; | ||
|  |     } | ||
|  | 
 | ||
|  |     td, | ||
|  |     th { | ||
|  |         border: 1px solid #dddddd; | ||
|  |         text-align: left; | ||
|  |         padding: 8px; | ||
|  |     } | ||
|  | 
 | ||
|  |     tr:nth-child(even) { | ||
|  |         background-color: #dddddd; | ||
|  |     } | ||
|  | 
 | ||
|  |     .Attendance { | ||
|  |         margin-top: 30px; | ||
|  |         margin-left: 13px; | ||
|  |     } | ||
|  | </style> | ||
|  | 
 | ||
|  | <body> | ||
|  |     <div class="container"> | ||
|  |         <h2 style="text-align: center;">Payment Details</h2> | ||
|  |     </div> | ||
|  | 
 | ||
|  |     <div id="example_wrapper" class="dataTables_wrapper" style="padding: 5%;"> | ||
|  |         <!-- <h3 style="text-align: center;">All Entry</h3> --> | ||
|  | 
 | ||
|  |         <table id="example" class="display" style="width:100%;"> | ||
|  |             <thead> | ||
|  |                 <tr> | ||
|  |                     <th>Sl</th> | ||
|  |                     <th>Date</th> | ||
|  |                     <th>User Email</th> | ||
|  |                     <th>Stage</th> | ||
|  |                     <th>Services</th> | ||
|  |                     <th>Total Amount</th> | ||
|  |                     <th>Discount</th> | ||
|  |                     <th>Amount charged</th> | ||
|  |                     <th>payment_id</th> | ||
|  |                     <th>isRefund</th> | ||
|  |                     <th>Currency</th> | ||
|  |                     <th>Pay method</th> | ||
|  |                     <th>Payment status</th> | ||
|  |                     <th>Payment gateway</th> | ||
|  |                 </tr> | ||
|  |             </thead> | ||
|  |             <tbody> | ||
|  |                 {% if list %} | ||
|  |                 {% for i in list reversed %} | ||
|  |                 <tr> | ||
|  |                     <td>{{forloop.counter}}</td> | ||
|  |                     <td>{{i.date}}</td> | ||
|  |                     <td>{{i.user_id__email}}</td> | ||
|  |                     <td>{{i.stage}}</td> | ||
|  |                     <td>{{i.services_used}}</td> | ||
|  |                     <td>{{i.total_amount}}</td> | ||
|  |                     <td>{{i.discount}}</td> | ||
|  |                     <td>{{i.amount_charged}}</td> | ||
|  |                     <td>{{i.payment_id}}</td> | ||
|  |                     <td>{{i.isRefund}}</td> | ||
|  |                      | ||
|  |                     <td>{{i.currency}}</td> | ||
|  |                     <td>{{i.pay_method}}</td> | ||
|  |                     <td>{{i.payment_status}}</td> | ||
|  |                     <td>{{i.payment_gateway}}</td> | ||
|  |                 </tr> | ||
|  |                 {% endfor %} | ||
|  |                 {% endif %} | ||
|  |                 </tfoot> | ||
|  | 
 | ||
|  |         </table> | ||
|  | 
 | ||
|  |     </div> | ||
|  |     </div> | ||
|  | 
 | ||
|  |     <script src="https://code.jquery.com/jquery-3.5.1.js"></script> | ||
|  |     <script src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js"></script> | ||
|  |     <script> | ||
|  |         $(document).ready(function () { | ||
|  |             $('#example').DataTable({ | ||
|  |                 "pagingType": "full_numbers" | ||
|  |             }); | ||
|  |         }); | ||
|  | 
 | ||
|  |         function deleteRow(btn) { | ||
|  |             var row = btn.parentNode.parentNode; | ||
|  |             row.parentNode.removeChild(row); | ||
|  |         } | ||
|  | 
 | ||
|  |         // /////////////// | ||
|  |         $(".button").on("click", function () { | ||
|  |             $('input:checked').not('.all').parents("tr").remove(); | ||
|  |         }); | ||
|  |         $('.all').on('click', function () { | ||
|  |             var $inputs = $('table').find('input'); | ||
|  |             $inputs.prop('checked', 'checked'); | ||
|  |         }); | ||
|  |     </script> | ||
|  |     <script> | ||
|  |         $(document).ready(function () { | ||
|  |             $('#example1').DataTable({ | ||
|  |                 "pagingType": "full_numbers" | ||
|  |             }); | ||
|  |         }); | ||
|  | 
 | ||
|  |         function deleteRow(btn) { | ||
|  |             var row = btn.parentNode.parentNode; | ||
|  |             row.parentNode.removeChild(row); | ||
|  |         } | ||
|  | 
 | ||
|  |         // /////////////// | ||
|  |         $(".button").on("click", function () { | ||
|  |             $('input:checked').not('.all').parents("tr").remove(); | ||
|  |         }); | ||
|  |         $('.all').on('click', function () { | ||
|  |             var $inputs = $('table').find('input'); | ||
|  |             $inputs.prop('checked', 'checked'); | ||
|  |         }); | ||
|  |     </script> | ||
|  |     <script> | ||
|  |         $(document).ready(function () { | ||
|  |             $('#example2').DataTable({ | ||
|  |                 "pagingType": "full_numbers" | ||
|  |             }); | ||
|  |         }); | ||
|  | 
 | ||
|  |         function deleteRow(btn) { | ||
|  |             var row = btn.parentNode.parentNode; | ||
|  |             row.parentNode.removeChild(row); | ||
|  |         } | ||
|  | 
 | ||
|  |         // /////////////// | ||
|  |         $(".button").on("click", function () { | ||
|  |             $('input:checked').not('.all').parents("tr").remove(); | ||
|  |         }); | ||
|  |         $('.all').on('click', function () { | ||
|  |             var $inputs = $('table').find('input'); | ||
|  |             $inputs.prop('checked', 'checked'); | ||
|  |         }); | ||
|  |     </script> | ||
|  | </body> | ||
|  | 
 | ||
|  | </html> |