337 lines
21 KiB
HTML
337 lines
21 KiB
HTML
{% extends 'base_structure/layout/base_template.html' %}
|
|
{% load static %}
|
|
{% block stylesheet %}
|
|
<!-- include required css cdn link through html here -->
|
|
|
|
{% include "cdn_through_html/datatable_cdn_css.html" %}
|
|
{% include "cdn_through_html/animate_cdn_css.html" %}
|
|
{% include "cdn_through_html/modal_cdn_css.html" %}
|
|
{% include "cdn_through_html/tabs_cdn_css.html" %}
|
|
{% include "cdn_through_html/switches_cdn_css.html" %}
|
|
{% include "cdn_through_html/sweetalert2_cdn_css.html" %}
|
|
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
|
|
<div class="row layout-top-spacing">
|
|
<div class="col-lg-12">
|
|
<div class="row mb-2">
|
|
<div class="col">
|
|
<h3>User Details</h3>
|
|
</div>
|
|
<div class="col text-end">
|
|
{% comment %} <button class="btn btn-dark mb-2 me-4" onclick="history.back()">
|
|
<i class="fa fa-arrow-left"></i>
|
|
Back
|
|
</button> {% endcomment %}
|
|
{% comment %} <a class="btn btn-success mb-2 me-4" href="{% url 'manage_cms:faq_category_add' %}">Add Category</a> {% endcomment %}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div id="tabsSimple" class="col-xl-12 col-12 layout-spacing">
|
|
<div class="statbox widget box box-shadow">
|
|
<div class="widget-content widget-content-area p-3">
|
|
<div class="simple-pill">
|
|
<ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link active" id="pills-tab1-tab" data-bs-toggle="pill" data-bs-target="#pills-tab1" type="button" role="tab" aria-controls="pills-tab1" aria-selected="false">User</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" id="pills-tab2-tab" data-bs-toggle="pill" data-bs-target="#pills-tab2" type="button" role="tab" aria-controls="pills-tab2" aria-selected="true">Activity</button>
|
|
</li>
|
|
<li class="nav-item" role="presentation">
|
|
<button class="nav-link" id="pills-tab3-tab" data-bs-toggle="pill" data-bs-target="#pills-tab3" type="button" role="tab" aria-controls="pills-tab3" aria-selected="true">Report</button>
|
|
</li>
|
|
</ul>
|
|
<div class="tab-content" id="pills-tabContent">
|
|
<div class="tab-pane fade active show" id="pills-tab1" role="tabpanel" aria-labelledby="pills-tab1-tab" tabindex="0">
|
|
<div class="row mt-5">
|
|
<div class="col-md-6">
|
|
<table class="w-100">
|
|
<tbody class="d-flex">
|
|
<tr class="w-25 d-flex flex-column">
|
|
<td><p>Name :</p></td>
|
|
<td><p>Email ID :</p></td>
|
|
<td><p>Gender :</p></td>
|
|
<td><p>DOB :</p></td>
|
|
|
|
</tr>
|
|
<tr class=" d-flex flex-column">
|
|
<td><p>{{obj.first_name}}</p></td>
|
|
<td><p>{{obj.email}}</p></td>
|
|
<td><p>{{obj.gender}}</p></td>
|
|
<td><p>{{obj.date_of_birth}}</p></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="col-md-6 mb-10">
|
|
<table class="w-100">
|
|
<tbody class="d-flex">
|
|
<tr class="w-25 d-flex flex-column">
|
|
|
|
<td><p>Weigth:</p></td>
|
|
<td><p>Ethnicity:</p></td>
|
|
<td><p>Height:</p></td>
|
|
</tr>
|
|
<tr class=" d-flex flex-column">
|
|
<td><p>{{obj.health_data_principal.weight}} kg</p></td>
|
|
<td><p>{{obj.health_data_principal.ethenicity}}</p></td>
|
|
<td><p>{{obj.health_data_principal.height}} cm</p></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<hr class="bdr-line">
|
|
<div class="row">
|
|
<div class="col-md-6 mb-3">
|
|
<p>How frequently do you eat in a day? </p>
|
|
<span>{{obj.health_data_principal.eat_frequency}}</span>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<p>How do you rate your overall gastrointestinal functions?</p>
|
|
<span>{{obj.health_data_principal.gastrointestinal_health}}</span>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<p>How much sleep do you take daily?</p>
|
|
<span>{{obj.health_data_principal.sleep_duration}}</span>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<p>How frequently do you engage in physical activities?</p>
|
|
<span>{{obj.health_data_principal.exercise_frequency}}</span>
|
|
</div>
|
|
</div>
|
|
<hr class="bdr-line">
|
|
<div class="row d-flex justify-content-between">
|
|
<div class="card col-md-5 m-3 p-3 position-relative">
|
|
<div class="col-md-12 mb-3">
|
|
<p>User Intolerances?</p>
|
|
<span>{{ obj.intolerance_data.0.name }}</span>
|
|
</div>
|
|
<div class="col-md-12 mb-3">
|
|
<p>For how long have you been experiencing this intolerance?</p>
|
|
<span>{{ obj.intolerance_data.0.duration }}</span>
|
|
</div>
|
|
<a class="view-more-link position-absolute top-0 end-0 m-2" href="{% url 'module_activity:intolerance' principal_id=obj.id %}">View more</a>
|
|
</div>
|
|
<div class="card col-md-5 m-3 p-3 position-relative">
|
|
<div class="col-md-12 mb-3">
|
|
<p>User Symptoms?</p>
|
|
<span>{{ obj.symptoms_data.0.name }}</span>
|
|
</div>
|
|
<div class="col-md-12 mb-3">
|
|
<p>For how long have you been experiencing these symptoms?</p>
|
|
<span>{{ obj.symptoms_data.0.duration }}</span>
|
|
</div>
|
|
<a class="view-more-link position-absolute top-0 end-0 m-2" href="{% url 'module_activity:symptoms' principal_id=obj.id %}">View more</a>
|
|
</div>
|
|
</div>
|
|
<hr class="bdr-line">
|
|
<div class="row d-flex justify-content-between">
|
|
<div class="card col-md-5 m-3 p-3 position-relative">
|
|
<div class="col-md-12 mb-3">
|
|
<p>User Past Treatment Name?</p>
|
|
<span>{{ obj.pasttreatment_data.0.name }}</span>
|
|
</div>
|
|
<div class="col-md-12 mb-3">
|
|
<p>When did you undergo this treatment?</p>
|
|
<span>{{ obj.pasttreatment_data.0.duration }}</span>
|
|
</div>
|
|
<a class="view-more-link position-absolute top-0 end-0 m-2" href="{% url 'module_activity:past_treatment' principal_id=obj.id %}">View more</a>
|
|
</div>
|
|
<div class="card col-md-5 m-3 p-3 position-relative">
|
|
<div class="col-md-12 mb-3">
|
|
<p>User Chronic conditions/diseases Name?</p>
|
|
<span>{{ obj.chronic_data.0 }}</span>
|
|
</div>
|
|
<div class="col-md-12 mb-3">
|
|
<p>For how long have you been experiencing this diseases?</p>
|
|
<span>{{ obj.chronic_data.0 }}</span>
|
|
</div>
|
|
<a class="view-more-link position-absolute top-0 end-0 m-2" href="{% url 'module_activity:chronic_condition' principal_id=obj.id %}">View more</a>
|
|
</div>
|
|
</div>
|
|
<div class="d-flex mb-5">
|
|
<a class="download-btn-custom mt-3" href="manage-users.php">
|
|
<span>Download user profile</span>
|
|
<img src="../src/assets/img/download.svg" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade" id="pills-tab2" role="tabpanel" aria-labelledby="pills-tab2-tab" tabindex="1">
|
|
<div class="row layout-spacing">
|
|
<div class="col-lg-12">
|
|
<div class="statbox widget box box-shadow">
|
|
<div class="widget-content widget-content-area">
|
|
<div id="table_wrapper" class="dataTables_wrapper container-fluid dt-bootstrap4 no-footer">
|
|
|
|
<div class="table-responsive">
|
|
<table id="table" class="table style-3 dt-table-hover dataTable" role="grid"
|
|
aria-describedby="style-3_info">
|
|
|
|
<thead>
|
|
<tr role="row">
|
|
<th class="sorting_asc text-center" tabindex="0"
|
|
aria-controls="style-3" aria-sort="ascending"
|
|
style="width: 50.2656px;">#</th>
|
|
<th class="sorting text-center" tabindex="1" aria-controls="style-3"
|
|
colspan="1"
|
|
style="width: 44.2344px;">Time</th>
|
|
<th class="sorting text-center" tabindex="2" aria-controls="style-3"
|
|
colspan="1"
|
|
style="width: 44.2344px;">Meal</th>
|
|
<th class="sorting text-center" tabindex="3" aria-controls="style-3"
|
|
style="width: 79.7969px;">Medication</th>
|
|
<th class="sorting text-center" tabindex="4" aria-controls="style-3"
|
|
style="width: 79.7969px;">Bowel Movement</th>
|
|
<th class="sorting text-center" tabindex="5" aria-controls="style-3"
|
|
style="width: 79.7969px;">Symptoms</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-pane fade" id="pills-tab3" role="tabpanel" aria-labelledby="pills-tab3-tab" tabindex="2">
|
|
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
{% endblock content %}
|
|
|
|
{% block javascript %}
|
|
|
|
<!-- include required css cdn link through html here -->
|
|
|
|
{% include "cdn_through_html/datatable_cdn_js.html" %}
|
|
{% include "cdn_through_html/datatable_button_cdn_js.html" %}
|
|
{% include "cdn_through_html/sweetalert2_cdn_js.html" %}
|
|
|
|
<script>
|
|
|
|
// Define DataTable instance
|
|
var dataTableInstance
|
|
var mainUrl = "{% url 'module_activity:activity_list' principal_id=obj.id %}?date=2024-02-14";
|
|
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 %}"
|
|
// Entry point
|
|
$(document).ready(function() {
|
|
|
|
dataTableInstance = initializeDataTable(dataTableInstance, mainUrl);
|
|
});
|
|
|
|
// Function to initialize DataTable
|
|
function initializeDataTable(dataTableInstance, mainUrl) {
|
|
return $('#table').DataTable({
|
|
processing: true,
|
|
serverSide: true,
|
|
ajax: {
|
|
url: mainUrl,
|
|
type: "GET",
|
|
},
|
|
columns: [
|
|
{
|
|
data: null,
|
|
className: "text-center",
|
|
render: function(data, type, row, meta) {
|
|
// Calculate sequence number based on page, page length, and index
|
|
var sequenceNumber = meta.row + meta.settings._iDisplayStart + 1;
|
|
return sequenceNumber;
|
|
}
|
|
},
|
|
{ data: "time", className: "text-center" },
|
|
{
|
|
data: "type",
|
|
className: "text-center",
|
|
render: function(data, type, row){
|
|
if (data ==="Meal"){
|
|
return '<a href="' + mealUrl.replace('0', row.id) +'" class="view-more">View More</a>';
|
|
}else{
|
|
return "--"
|
|
}
|
|
}
|
|
},
|
|
{
|
|
data: "type",
|
|
className: "text-center",
|
|
render: function(data, type, row){
|
|
if (data ==="Medication"){
|
|
return '<a href="' + medicationUrl.replace('0', row.id) +'" class="view-more">View More</a>';
|
|
}else{
|
|
return "--"
|
|
}
|
|
}
|
|
},
|
|
{
|
|
data: "type",
|
|
className: "text-center",
|
|
render: function(data, type, row){
|
|
if (data ==="Bowel"){
|
|
return '<a href="' + bowelUrl.replace('0', row.id) + '" class="view-more">View More</a>';
|
|
}else{
|
|
return "--"
|
|
}
|
|
}
|
|
},
|
|
{
|
|
data: "type",
|
|
className: "text-center",
|
|
render: function(data, type, row){
|
|
if (data ==="Symptom"){
|
|
return '<a href="' + symptomUrl.replace('0', row.id) + '" class="view-more">View More</a>';
|
|
}else{
|
|
return "--"
|
|
}
|
|
}
|
|
},
|
|
],
|
|
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'B>>>" +
|
|
"<'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>' },
|
|
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: " _MENU_",
|
|
},
|
|
stripeClasses: [],
|
|
lengthMenu: [5, 10, 20, 50],
|
|
pageLength: 10,
|
|
});
|
|
}
|
|
|
|
// Function to reload the DataTable
|
|
function reloadDataTable() {
|
|
dataTableInstance.Datatable().ajax.reload();
|
|
}
|
|
|
|
|
|
</script>
|
|
{% endblock %} |