166 lines
4.9 KiB
HTML
Executable File
166 lines
4.9 KiB
HTML
Executable File
<!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> |