Merge pull request #270 from WDI-Ideas/sayli

Sayli
This commit is contained in:
Sayli Raut
2024-07-08 14:51:54 +05:30
committed by GitHub

View File

@@ -100,7 +100,7 @@
</div> --}}
</div>
{{-- <div class="col-12 d-flex align-items-center p-0 mb-4">
<div class="col-12 d-flex align-items-center p-0 mb-4">
<div class="col-md-12">
<div class="card">
<div class="card-body">
@@ -151,14 +151,14 @@
<a class="view-btn m-0 pointer sub_admin_permission"
data-toggle="modal" data-target="#payment-details-modal"
data-id="{{ $recent_transactions['id'] }}"
data-name="{{ $recent_transactions['subscription']['first_name'] }}"
data-price="{{ $recent_transactions['amount'] }}"
data-first_name="{{ $recent_transactions['subscription']['first_name'] }}"
data-stripeCustId="{{ $recent_transactions['stripe_customer_id'] }}"
data-subId="{{ $recent_transactions['subscription_id'] }}"
data-subStatus="{{ $recent_transactions['subscription_status'] }}"
data-subStartPeriod="{{ $recent_transactions['current_period_start'] }}"
data-subCurrentPeriod="{{ $recent_transactions['current_period_end'] }}"
data-subNextPeriod="{{ $recent_transactions['next_payment_date'] }}">View</a>
data-subscription-id="{{ $recent_transactions['subscription_id'] }}"
data-customer-id="{{ $recent_transactions['stripe_customer_id'] }}"
data-subscription-status="{{ $recent_transactions['subscription_status'] }}"
data-start-date="{{ $recent_transactions['current_period_start'] }}"
data-end-date="{{ $recent_transactions['current_period_end'] }}"
data-next-date="{{ $recent_transactions['next_payment_date'] }}">View</a>
</td>
</tr>
@endforeach
@@ -170,204 +170,277 @@
</div>
</div>
</div> --}}
<!-- Modal -->
<div class="modal fade" id="payment-details-modal" tabindex="-1" role="dialog"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document" style="max-width: 550px;">
<div class="modal-content">
<div class="modal-body">
<div class="modal-header d-flex justify-content-between modal-title">
<h5>View Details</h5>
<button type="button pointer" class="btn-close" data-dismiss="modal"
aria-label="Close">
x
</button>
</div>
<div class="row" style="padding: 0px 10px;">
<div class="form-group subadmin-option col-md-12">
<div class="payment-main-div">
<div class="payment-inn-div">
<p><strong>Name:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Price:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Subscription ID:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Stripe Customer Id:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Subscription Status:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Current Start Period:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Current End Period:</strong></p><span></span>
</div>
<div class="payment-inn-div">
<p><strong>Next Period Date:</strong></p><span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
@endsection
@section('section_script')
<script>
$('#zero-config').DataTable({
"dom": "<'dt--top-section'<'row'<'col-12 col-sm-6 d-flex justify-content-sm-start justify-content-center'l><'col-12 col-sm-6 d-flex justify-content-sm-end justify-content-center mt-sm-0 mt-3'f>>>" +
"<'table-responsive'tr>" +
"<'dt--bottom-section d-sm-flex justify-content-sm-between text-center'<'dt--pages-count mb-sm-0 mb-3'i><'dt--pagination'p>>",
"oLanguage": {
"oPaginate": {
"sPrevious": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>',
"sNext": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>'
},
"sInfo": "Showing page PAGE of _PAGES_",
"sSearch": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>',
"sSearchPlaceholder": "Search...",
"sLengthMenu": "Results : _MENU_",
},
"stripeClasses": [],
"lengthMenu": [7, 10, 20, 50],
"pageLength": 10
});
$('#zero-config2').DataTable({
"dom": "<'dt--top-section'<'row'<'col-12 col-sm-6 d-flex justify-content-sm-start justify-content-center'l><'col-12 col-sm-6 d-flex justify-content-sm-end justify-content-center mt-sm-0 mt-3'f>>>" +
"<'table-responsive'tr>" +
"<'dt--bottom-section d-sm-flex justify-content-sm-between text-center'<'dt--pages-count mb-sm-0 mb-3'i><'dt--pagination'p>>",
"oLanguage": {
"oPaginate": {
"sPrevious": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>',
"sNext": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>'
},
"sInfo": "Showing page PAGE of _PAGES_",
"sSearch": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>',
"sSearchPlaceholder": "Search...",
"sLengthMenu": "Results : _MENU_",
},
"stripeClasses": [],
"lengthMenu": [7, 10, 20, 50],
"pageLength": 10
});
$(function(e) {
$("#select-all-ids").click(function() {
$(".form-check-input").prop('checked', $(this).prop('checked'));
});
$(".form-check-input").click(function() {
if (!$(this).prop('checked')) {
$("#select-all-ids").prop('checked', false);
} else {
if ($(".form-check-input:checked").length === $(".form-check-input").length) {
$("#select-all-ids").prop('checked', true);
}
}
});
$(document).on("click", "#download-selected", function(e) {
e.preventDefault();
var allIds = [];
// Iterate over each page of the DataTable
var table = $('#zero-config').DataTable();
for (var i = 0; i < table.page.info().pages; i++) {
table.page(i).draw(false); // Switch to page i
$('#zero-config tbody input:checked').each(function() {
allIds.push($(this).val());
});
}
if (allIds.length > 0) {
// If there are selected customers
$('#ids').prop('disabled', false);
$('#all_id').prop('disabled', true);
$('#ids').val(allIds);
// Now submit the form or perform download action
$('#customer-form').submit(); // Or perform your download action here
} else {
// No customers selected
toastr.error("Please select at least one customer to download.");
}
});
$(document).on("click", "#download_all", function(e) {
$('#all_id').prop('disabled', false);
$('#ids').prop('disabled', true);
})
});
$(document).on("click", ".more", function(e) {
e.preventDefault();
e.stopPropagation();
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Initial data and categories
var userChartData = getUserChartData('monthly');
var userCategories = getUserChartCategories('monthly');
// Chart options
var userOptions = {
chart: {
type: 'line',
zoom: {
enabled: false
@section('section_script')
<script>
$('#zero-config').DataTable({
"dom": "<'dt--top-section'<'row'<'col-12 col-sm-6 d-flex justify-content-sm-start justify-content-center'l><'col-12 col-sm-6 d-flex justify-content-sm-end justify-content-center mt-sm-0 mt-3'f>>>" +
"<'table-responsive'tr>" +
"<'dt--bottom-section d-sm-flex justify-content-sm-between text-center'<'dt--pages-count mb-sm-0 mb-3'i><'dt--pagination'p>>",
"oLanguage": {
"oPaginate": {
"sPrevious": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>',
"sNext": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>'
},
toolbar: {
show: false
}
"sInfo": "Showing page PAGE of _PAGES_",
"sSearch": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>',
"sSearchPlaceholder": "Search...",
"sLengthMenu": "Results : _MENU_",
},
series: userChartData,
xaxis: {
categories: userCategories
"stripeClasses": [],
"lengthMenu": [7, 10, 20, 50],
"pageLength": 10
});
$('#zero-config2').DataTable({
"dom": "<'dt--top-section'<'row'<'col-12 col-sm-6 d-flex justify-content-sm-start justify-content-center'l><'col-12 col-sm-6 d-flex justify-content-sm-end justify-content-center mt-sm-0 mt-3'f>>>" +
"<'table-responsive'tr>" +
"<'dt--bottom-section d-sm-flex justify-content-sm-between text-center'<'dt--pages-count mb-sm-0 mb-3'i><'dt--pagination'p>>",
"oLanguage": {
"oPaginate": {
"sPrevious": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>',
"sNext": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>'
},
"sInfo": "Showing page PAGE of _PAGES_",
"sSearch": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>',
"sSearchPlaceholder": "Search...",
"sLengthMenu": "Results : _MENU_",
},
stroke: {
curve: 'smooth',
width: [4, 4]
}
};
"stripeClasses": [],
"lengthMenu": [7, 10, 20, 50],
"pageLength": 10
});
// Create the chart
var userChart = new ApexCharts(document.querySelector("#user-chart"), userOptions);
userChart.render();
// Event listener for filter select element
document.getElementById('graph-filter').addEventListener('change', function(event) {
var selectedFilter = event.target.value;
userChartData = getUserChartData(selectedFilter);
userCategories = getUserChartCategories(selectedFilter);
$(function(e) {
$("#select-all-ids").click(function() {
$(".form-check-input").prop('checked', $(this).prop('checked'));
});
userChart.updateSeries(userChartData);
userChart.updateOptions({
xaxis: {
categories: userCategories
$(".form-check-input").click(function() {
if (!$(this).prop('checked')) {
$("#select-all-ids").prop('checked', false);
} else {
if ($(".form-check-input:checked").length === $(".form-check-input").length) {
$("#select-all-ids").prop('checked', true);
}
}
});
$(document).on("click", "#download-selected", function(e) {
e.preventDefault();
var allIds = [];
// Iterate over each page of the DataTable
var table = $('#zero-config').DataTable();
for (var i = 0; i < table.page.info().pages; i++) {
table.page(i).draw(false); // Switch to page i
$('#zero-config tbody input:checked').each(function() {
allIds.push($(this).val());
});
}
if (allIds.length > 0) {
// If there are selected customers
$('#ids').prop('disabled', false);
$('#all_id').prop('disabled', true);
$('#ids').val(allIds);
// Now submit the form or perform download action
$('#customer-form').submit(); // Or perform your download action here
} else {
// No customers selected
toastr.error("Please select at least one customer to download.");
}
});
$(document).on("click", "#download_all", function(e) {
$('#all_id').prop('disabled', false);
$('#ids').prop('disabled', true);
})
});
});
function getUserChartData(filter) {
switch (filter) {
case 'monthly':
return [{
name: 'Total Accounts',
data: <?php echo json_encode(array_values($dataMonthlyWithType3)); ?>
$(document).on("click", ".more", function(e) {
e.preventDefault();
e.stopPropagation();
});
</script>
<script>
$(document).ready(function() {
$('<button><ul class="navbar-item flex-row ms-lg-auto ms-0"><li class="nav-item dropdown action-dropdown order-lg-0 order-1"><a href="javascript:void(0);"class="nav-link dropdown-toggle user extra-btn" id="actionDropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><div class="avatar-container"><div class="avatar avatar-sm avatar-mid avatar-indicators avatar-online"><h3>Export</h3></div></div></a><div class="dropdown-menu position-absolute" aria-labelledby="actionDropdown"><div class="dropdown-item"><a href="javascript:void(0)" id="download_all"><span>Download Overview</span></a></div><div class="dropdown-item"><a href="javascript:void(0)" id="download-selected"><span id="export">Download Selected</span></a></div></div></li></ul></button>')
.insertBefore("#zero-config_filter label");
$("#zero-config").on("click", ".sub_admin_permission", function() {
var Name = $(this).data('name');
var Price = $(this).data('price');
var SubID = $(this).data('subscription-id');
var CustID = $(this).data('customer-id');
var SubStatus = $(this).data('subscription-status');
var startDate = $(this).data('start-date');
var endDate = $(this).data('end-date');
var nextDate = $(this).data('next-date');
var formattedPrice = '$' + Price;
$('.subadmin-option span').eq(0).text(Name);
$('.subadmin-option span').eq(1).text(formattedPrice);
$('.subadmin-option span').eq(2).text(SubID);
$('.subadmin-option span').eq(3).text(CustID);
$('.subadmin-option span').eq(4).text(SubStatus);
$('.subadmin-option span').eq(5).text(startDate);
$('.subadmin-option span').eq(6).text(endDate);
$('.subadmin-option span').eq(7).text(nextDate); // Corrected index for next-date
});
});
</script>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Initial data and categories
var userChartData = getUserChartData('monthly');
var userCategories = getUserChartCategories('monthly');
// Chart options
var userOptions = {
chart: {
type: 'line',
zoom: {
enabled: false
},
{
name: 'Total Subscribed',
data: <?php echo json_encode(array_values($dataMonthlyWithType4)); ?>
toolbar: {
show: false
}
];
case 'quarterly':
return [{
name: 'Total Accounts',
data: <?php echo json_encode(array_values($dataQuarterlyWithType3)); ?>
},
{
name: 'Total Subscribed',
data: <?php echo json_encode(array_values($dataQuarterlyWithType4)); ?>
},
series: userChartData,
xaxis: {
categories: userCategories
},
stroke: {
curve: 'smooth',
width: [4, 4]
}
};
// Create the chart
var userChart = new ApexCharts(document.querySelector("#user-chart"), userOptions);
userChart.render();
// Event listener for filter select element
document.getElementById('graph-filter').addEventListener('change', function(event) {
var selectedFilter = event.target.value;
userChartData = getUserChartData(selectedFilter);
userCategories = getUserChartCategories(selectedFilter);
userChart.updateSeries(userChartData);
userChart.updateOptions({
xaxis: {
categories: userCategories
}
];
case 'yearly':
return [{
name: 'Total Accounts',
data: <?php echo json_encode(array_values($dataYearlyWithType3)); ?>
},
{
name: 'Total Subscribed',
data: <?php echo json_encode(array_values($dataYearlyWithType4)); ?>
}
];
default:
return [];
});
});
});
function getUserChartData(filter) {
switch (filter) {
case 'monthly':
return [{
name: 'Total Accounts',
data: <?php echo json_encode(array_values($dataMonthlyWithType3)); ?>
},
{
name: 'Total Subscribed',
data: <?php echo json_encode(array_values($dataMonthlyWithType4)); ?>
}
];
case 'quarterly':
return [{
name: 'Total Accounts',
data: <?php echo json_encode(array_values($dataQuarterlyWithType3)); ?>
},
{
name: 'Total Subscribed',
data: <?php echo json_encode(array_values($dataQuarterlyWithType4)); ?>
}
];
case 'yearly':
return [{
name: 'Total Accounts',
data: <?php echo json_encode(array_values($dataYearlyWithType3)); ?>
},
{
name: 'Total Subscribed',
data: <?php echo json_encode(array_values($dataYearlyWithType4)); ?>
}
];
default:
return [];
}
}
}
function getUserChartCategories(filter) {
switch (filter) {
case 'monthly':
return ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
case 'quarterly':
return ['Q1', 'Q2', 'Q3', 'Q4'];
case 'yearly':
return <?php echo json_encode(array_keys($dataYearlyWithType3)); ?>;
default:
return [];
function getUserChartCategories(filter) {
switch (filter) {
case 'monthly':
return ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
case 'quarterly':
return ['Q1', 'Q2', 'Q3', 'Q4'];
case 'yearly':
return <?php echo json_encode(array_keys($dataYearlyWithType3)); ?>;
default:
return [];
}
}
}
</script>
@endsection
</script>
@endsection