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>
							 |