bobby.vishwakarma/digest_app
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor datatables

Browse Source
This commit is contained in:
bobbyvish
2024-03-26 13:22:29 +05:30
parent 64c172ab59
commit 2a4f507a6f
22 changed files with 1191 additions and 391 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
templates/module_auth/user_view.html
View File

@@ -257,8 +257,7 @@
<script>
// Define DataTable instance
var dataTableInstance
var mainUrl = "{% url 'module_activity:activity_list' principal_id=obj.id %}?date=2024-02-14";
var activityMainUrl = "{% url 'module_activity:activity_list' principal_id=obj.id %}?date_range=40";
var mealUrl = "{% url 'module_activity:meal_detail' pk=0 %}"
var medicationUrl = "{% url 'module_activity:medication_detail' pk=0 %}"
var bowelUrl = "{% url 'module_activity:bowel_detail' pk=0 %}"
@@ -267,18 +266,18 @@ var reportUrl = "{% url 'module_activity:report_data' principal_id=obj.id %}?dat
// Entry point
$(document).ready(function() {
dataTableInstance = initializeDataTable(dataTableInstance, mainUrl);
tableName = $('#table');
dataTableInstance = initializeDataTable(tableName, activityMainUrl);
getReportData();
});
// Function to initialize DataTable
function initializeDataTable(dataTableInstance, mainUrl) {
return $('#table').DataTable({
function initializeDataTable(tableName, activityMainUrl) {
return tableName.DataTable({
processing: true,
serverSide: true,
ajax: {
url: mainUrl,
url: activityMainUrl,
type: "GET",
},
columns: [
@@ -341,7 +340,6 @@ function initializeDataTable(dataTableInstance, mainUrl) {
"<'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>>",
buttons: [
{ text: 'View Archive List', className: "btn btn-dark " }
],
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>' },
@@ -353,14 +351,46 @@ function initializeDataTable(dataTableInstance, mainUrl) {
stripeClasses: [],
lengthMenu: [5, 10, 20, 50],
pageLength: 10,
initComplete: function() {
$(`<div class="dropdown">
<a class="dropdown-toggle btn btn-primary" href="#" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">\
Filter
</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink" style="">
<a class="dropdown-item" href="javascript:void(0)" onclick="filterActivityData(7)">Last 7 days</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="filterActivityData(20)">Last 20 days</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="filterActivityData(40)">Last 40 days</a>
<a class="dropdown-item" href="javascript:void(0)" onclick="filterActivityData(60)">Last 60 days</a>
</div>
</div>`).appendTo('.dt--top-section .col-12:last');
}
});
}
// Function to reload the DataTable
function reloadDataTable() {
dataTableInstance.Datatable().ajax.reload();
dataTableInstance.ajax.reload();
}
function filterActivityData(dateRange){
var url = dateRange ? activityMainUrl.replace("1", dateRange) : activityMainUrl;
$.ajax({
url: url,
type: 'GET',
success: function(response) {
// Assuming response.data contains the filtered records
var filteredData = response.data;
tableName.clear().rows.add(filteredData).draw();
console.log("Filtered data loaded successfully:", filteredData);
},
error: function(response) {
console.error("Error occurred while fetching filtered data:", response);
}
});
}
function getReportData(timeRange){
var url = timeRange ? reportUrl.replace("7", timeRange) : reportUrl