@@ -346,17 +346,25 @@
|
||||
<div class="tab-pane fade" id="pills-tab3" role="tabpanel" aria-labelledby="pills-tab3-tab" tabindex="2">
|
||||
<div class="d-flex justify-content-sm-end justify-content-center mb-3">
|
||||
<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">
|
||||
<button class="rfq-filter btn _effect--ripple waves-effect waves-light dropdown-toggle d-flex justify-content-between align-items-center" type="button" id="drop-one" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="#505050" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-filter">
|
||||
<polygon points="22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3"></polygon>
|
||||
</svg>
|
||||
Filter
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuLink" style="">
|
||||
<a class="dropdown-item" href="javascript:void(0)" onclick="getReportData('7')">Last 7 days</a>
|
||||
<a class="dropdown-item" href="javascript:void(0)" onclick="getReportData(20)">Last 20 days</a>
|
||||
<a class="dropdown-item" href="javascript:void(0)" onclick="getReportData(30)">Last 30 days</a>
|
||||
{% comment %} <a class="dropdown-item" href="javascript:void(0)" onclick="getReportData(40)">Last 40 days</a> {% endcomment %}
|
||||
<a class="dropdown-item" href="javascript:void(0)" onclick="getReportData(60)">Last 60 days</a>
|
||||
<a class="dropdown-item" href="javascript:void(0)" onclick="getReportData(90)">Last 90 days</a>
|
||||
</div>
|
||||
</button>
|
||||
<ul class="dropdown-menu" aria-labelledby="drop-one" style="">
|
||||
<li class=""><a class="dropdown-item" href="#"><input type="radio" id="radio7" value="7" name="dateFilter" checked> <label class="ms-2" for="radio7">Last 7 days</label></a></li>
|
||||
<li class=""><a class="dropdown-item" href="#"><input type="radio" id="radio20" value="20" name="dateFilter"> <label class="ms-2" for="radio20">Last 20 days</label></a></li>
|
||||
<li class=""><a class="dropdown-item" href="#"><input type="radio" id="radio30" value="30" name="dateFilter"> <label class="ms-2" for="radio30">Last 30 days</label></a></li>
|
||||
<li class=""><a class="dropdown-item" href="#"><input type="radio" id="radio60" value="60" name="dateFilter"> <label class="ms-2" for="radio60">Last 60 days</label></a></li>
|
||||
<li class=""><a class="dropdown-item" href="#"><input type="radio" id="radio90" value="90" name="dateFilter"> <label class="ms-2" for="radio90">Last 90 days</label></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="loaderContainer" class="text-center" style="display: none;">
|
||||
<div class="spinner-border text-primary" role="status">
|
||||
<span class="visually-hidden">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tab-content" id="pills-tab3Content">
|
||||
@@ -393,13 +401,22 @@ 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 %}"
|
||||
var symptomUrl = "{% url 'module_activity:meal_symptom_detail' pk=0 %}"
|
||||
var reportUrl = "{% url 'module_activity:report_data' principal_id=obj.id %}?date_range=20"
|
||||
|
||||
var reportUrl = "{% url 'module_activity:report_data' principal_id=obj.id %}?date_range=date_range_data"
|
||||
|
||||
// Entry point
|
||||
$(document).ready(function() {
|
||||
tableName = $('#table');
|
||||
//dataTableInstance = initializeDataTable(tableName, activityMainUrl);
|
||||
//getReportData();
|
||||
|
||||
var selectedDays = $('input[name="dateFilter"]:checked').val();
|
||||
getReportData(selectedDays);
|
||||
|
||||
$('input[name="dateFilter"]').change(function() {
|
||||
selectedDays = $(this).val();
|
||||
console.log(selectedDays)
|
||||
getReportData(selectedDays);
|
||||
});
|
||||
});
|
||||
|
||||
// Function to initialize DataTable
|
||||
@@ -522,18 +539,20 @@ function filterActivityData(dateRange){
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
function getReportData(timeRange){
|
||||
console.log("data range is ", timeRange)
|
||||
var url = timeRange ? reportUrl.replace("7", timeRange) : reportUrl
|
||||
function getReportData(days){
|
||||
console.log("data range is ", days)
|
||||
var url = days ? reportUrl.replace("date_range_data", days) : reportUrl
|
||||
$('#pills-tab3Content').empty()
|
||||
// Show loader
|
||||
$('#loaderContainer').show();
|
||||
$.ajax({
|
||||
url: url,
|
||||
type: 'GET',
|
||||
success: function(response) {
|
||||
console.log("reposne is ", response);
|
||||
// Hide loader
|
||||
$('#loaderContainer').hide();
|
||||
if (response.status == 200){
|
||||
setReportContent(response.data)
|
||||
setReportContent(response.data, days)
|
||||
}
|
||||
if (response.status == 202){
|
||||
const errorCard = $('<div class="card card-danger text-center mt-3 p-4 tab-pane-content"></div>');
|
||||
@@ -548,12 +567,13 @@ function getReportData(timeRange){
|
||||
}
|
||||
},
|
||||
error: function(response) {
|
||||
|
||||
// Hide loader
|
||||
$('#loaderContainer').hide();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function setReportContent(data) {
|
||||
function setReportContent(data, days) {
|
||||
// Clear previous content
|
||||
$('#pills-tab3Content').empty();
|
||||
|
||||
@@ -562,7 +582,7 @@ function setReportContent(data) {
|
||||
const section = $('<div class="row tab-pane-content d-flex justify-content-center gap-5 mb-5"></div>');
|
||||
|
||||
if (data.food_avoid) {
|
||||
createFoodToAvoid(section, data.food_avoid);
|
||||
createFoodToAvoid(section, data.food_avoid, days);
|
||||
}
|
||||
|
||||
if (data.highest_stool) {
|
||||
@@ -590,13 +610,13 @@ function setReportContent(data) {
|
||||
$('#pills-tab3Content').append(tableSection);
|
||||
}
|
||||
|
||||
function createFoodToAvoid(parent, content) {
|
||||
function createFoodToAvoid(parent, content, days) {
|
||||
const col = $('<div class="col-md-3 tab-pane-content food-column text-center card d-flex flex-column justify-content-center align-items-center gap-4 py-4"><div class="h-100"></div></div>');
|
||||
const title = $('<h5></h5>').text('Foods to Avoid');
|
||||
const img = $('<img height="100" width="100">').attr('src', "{% static 'img/foods.png' %}");
|
||||
const h4 = $('<h3></h4>').text(content);
|
||||
const h6 = $('<h6></h6>').html(
|
||||
'Based on the Symptoms added within the last 7 days, <b>' + content + '</b> should be avoided.'
|
||||
'Based on the Symptoms added within the last '+ days +' days, <b>' + content + '</b> should be avoided.'
|
||||
);
|
||||
|
||||
col.append(title);
|
||||
|
||||
@@ -73,7 +73,7 @@
|
||||
|
||||
<!-- modal for View FAQ Question Answer -->
|
||||
<div class="modal fade" id="faqmodal" tabindex="-1" role="dialog" aria-labelledby="faqModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-dialog modal-dialog-scrollable" role="document">
|
||||
<div class="modal-content" >
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="faqModalLabel">Faq</h5>
|
||||
@@ -336,7 +336,8 @@ function viewClickEvent(dataTableInstance) {
|
||||
$('body').on('click', '.view', function(){
|
||||
var id =$(this).data('id');
|
||||
var rowData = dataTableInstance.row($(this).closest('tr')).data();
|
||||
|
||||
var question = rowData.question;
|
||||
var answer = rowData.answer;
|
||||
// Set the data in the modal content
|
||||
$('#questionData').text(question);
|
||||
$('#answerData').text(answer);
|
||||
|
||||
@@ -128,6 +128,7 @@
|
||||
submitHandler: function(form) {
|
||||
// Disable the submit button to prevent multiple submissions
|
||||
$('button[type="submit"]').prop('disabled', true);
|
||||
form.submit()
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -68,8 +68,9 @@
|
||||
</div>
|
||||
|
||||
<!-- modal for View Feedback Question Answer -->
|
||||
<div class="modal fade" id="feedbackmodal" tabindex="-1" role="dialog" aria-labelledby="feedbackmodalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog" role="document">
|
||||
|
||||
<div class="modal fade" id="feedbackmodal" tabindex="-1" role="dialog" aria-labelledby="feedbackmodalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-scrollable" role="document">
|
||||
<div class="modal-content" >
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="feedbackmodalLabel">Feedback</h5>
|
||||
@@ -77,12 +78,8 @@
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="card mb-2">
|
||||
<div class="card-body">
|
||||
<p class="mb-0" id="messageText"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="mb-0" id="messageText"></p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-dark" data-bs-dismiss="modal">Discard</button>
|
||||
</div>
|
||||
@@ -130,9 +127,8 @@ function initializeDataTable(tableName, mainUrl) {
|
||||
{
|
||||
data: "comment",
|
||||
render: function (data, type, row) {
|
||||
console.log(data)
|
||||
return `<button class="btn btn-primary view-comment" onclick="showDataModal('${data}')">View</button>`;
|
||||
}
|
||||
return `<button class="btn btn-primary view-comment" data-comment="${data}">View</button>`;
|
||||
|
||||
}
|
||||
],
|
||||
debug: true,
|
||||
@@ -178,11 +174,11 @@ function reloadDataTable() {
|
||||
dataTableInstance.ajax.reload();
|
||||
}
|
||||
|
||||
function showDataModal(data) {
|
||||
console.log(data)
|
||||
$('#messageText').text(data);
|
||||
$('#feedbackmodal').modal('show');
|
||||
}
|
||||
$(document).on("click", ".view-comment", function() {
|
||||
var comment = $(this).data("comment");
|
||||
$('#messageText').text(comment);
|
||||
$('#feedbackmodal').modal('show');
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user