implemented filter counts #4
While this contributes to #4, it doesn't complete it as the filters are still mostly eye candy.
This commit is contained in:
parent
7ccdbc326a
commit
cae5ac024e
@ -16,6 +16,7 @@ urlpatterns = [
|
||||
path('get/', include([
|
||||
path('one/', views.get_ticket, name="ticket-getone"),
|
||||
path('many/', views.get_tickets, name="ticket-getmany"),
|
||||
path("filtercounts/", views.get_filter_counts, name="ticket-getfiltercounts"),
|
||||
])),
|
||||
])),
|
||||
|
||||
|
||||
@ -57,6 +57,33 @@ def get_tickets(request):
|
||||
|
||||
return JsonResponse(data)
|
||||
|
||||
@login_required
|
||||
@require_POST
|
||||
def get_filter_counts(request):
|
||||
|
||||
priorities = TicketPriority.objects.all()
|
||||
tags = TicketTag.objects.all()
|
||||
departments = Department.objects.all()
|
||||
|
||||
tickets = Ticket.objects.all()
|
||||
|
||||
data = {
|
||||
"priority_counts": {},
|
||||
"tag_counts": {},
|
||||
"department_counts": {},
|
||||
"ticket_count": tickets.count()
|
||||
}
|
||||
|
||||
for priority in priorities:
|
||||
data["priority_counts"][str(priority.id)] = tickets.filter(priority=priority).count()
|
||||
|
||||
for tag in tags:
|
||||
data["tag_counts"][str(tag.id)] = tickets.filter(tags__in=[tag]).count()
|
||||
|
||||
for department in departments:
|
||||
data["department_counts"][str(department.id)] = tickets.filter(author__department=department).count()
|
||||
|
||||
return JsonResponse(data)
|
||||
|
||||
@login_required()
|
||||
@require_POST
|
||||
|
||||
@ -21,138 +21,86 @@
|
||||
<button type="button" class="btn btn-danger c-white w-100" data-bs-toggle="modal" data-bs-target="#ticketModal">New Ticket</button>
|
||||
</div>
|
||||
<div class="scrollable pos-r bdT layer w-100 fxg-1">
|
||||
<ul class="p-20 nav flex-column">
|
||||
<li class="nav-item">
|
||||
<h6>Filters</h6>
|
||||
<ul id="filterSidebar" class="p-20 nav flex-column">
|
||||
|
||||
{% if priorities %}
|
||||
|
||||
<li class="nav-item mT-15">
|
||||
<h6>Priorities</h6>
|
||||
</li>
|
||||
|
||||
{% if priorities %}
|
||||
<li class="nav-item px-3 mt-3">
|
||||
<h6 class="small">Priority</h6>
|
||||
{% for priority in priorities %}
|
||||
<div class="form-check mb-2">
|
||||
<input type="checkbox" id="priority-{{ priority.id }}" class="form-check-input me-3">
|
||||
<label for="priority-{{ priority.id }}" class="form-check-label">
|
||||
<span class="badge rounded-pill" style="color: {{ priority.colour }}; background-color: {{ priority.backgroundcolour }};">
|
||||
{{ priority.title }}
|
||||
<i class="ti-control-record ms-auto"></i>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</li>
|
||||
{% endif %}
|
||||
{% for priority in priorities %}
|
||||
|
||||
{% if departments %}
|
||||
<li class="nav-item px-3 mt-3">
|
||||
<h6 class="small">Department</h6>
|
||||
{% for department in departments %}
|
||||
<div class="form-check mb-2">
|
||||
<input type="checkbox" id="department-{{ department.id }}" class="form-check-input me-2">
|
||||
<label for="department-{{ department.id }}" class="form-check-label d-flex jc-sb">
|
||||
{{ department.title }}
|
||||
<i class="{{ department.icon }} ms-auto"></i>
|
||||
</label>
|
||||
<li class="nav-item filter-priority" data-uuid="{{ priority.id }}">
|
||||
<label for="filterPriority-{{ priority.id }}" class="nav-link c-grey-800 cH-blue-500 actived">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<input type="checkbox" id="filterPriority-{{ priority.id }}" class="form-check-input me-2">
|
||||
<span>{{ priority.title }}</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill" style="color: {{ priority.colour }}; background-color: {{ priority.backgroundcolour }};">0</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</label>
|
||||
</li>
|
||||
{% endif %}
|
||||
|
||||
{% if tags %}
|
||||
<li class="nav-item px-3 mt-3">
|
||||
<h6 class="small">Tags</h6>
|
||||
{% for tag in tags %}
|
||||
<div class="form-check mb-2">
|
||||
<input type="checkbox" id="tag-{{ tag.id }}" class="form-check-input me-3">
|
||||
<label for="tag-{{ tag.id }}" class="form-check-label">
|
||||
<span class="badge rounded-pill" style="color: {{ tag.colour }}; background-color: {{ tag.backgroundcolour }};">
|
||||
{{ tag.title }}
|
||||
<i class="ti-tag ms-auto"></i>
|
||||
</span>
|
||||
</label>
|
||||
{% endfor %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% if tags %}
|
||||
|
||||
<li class="nav-item mT-15">
|
||||
<h6>Tags</h6>
|
||||
</li>
|
||||
|
||||
{% for tag in tags %}
|
||||
|
||||
<li class="nav-item filter-tag" data-uuid="{{ tag.id }}">
|
||||
<label for="filterTag-{{ tag.id }}" class="nav-link c-grey-800 cH-blue-500 actived">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<input type="checkbox" id="filterTag-{{ tag.id }}" class="form-check-input me-2">
|
||||
<span>{{ tag.title }}</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill" style="color: {{ tag.colour }}; background-color: {{ tag.backgroundcolour }};">0</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</label>
|
||||
</li>
|
||||
{% endif %}
|
||||
<!--
|
||||
<li class="nav-item mt-5">
|
||||
<a href="javascript:void(0)" class="nav-link c-grey-800 cH-blue-500 actived">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<i class="mR-10 ti-email"></i>
|
||||
<span>Inbox</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-deep-purple-50 c-deep-purple-700">+99</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li> -->
|
||||
<!--<li class="nav-item">
|
||||
<a href="" class="nav-link c-grey-800 cH-blue-500">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<i class="mR-10 ti-share"></i>
|
||||
<span>Sent</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-green-50 c-green-700">12</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="" class="nav-link c-grey-800 cH-blue-500">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<i class="mR-10 ti-star"></i>
|
||||
<span>Important</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-blue-50 c-blue-700">3</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="" class="nav-link c-grey-800 cH-blue-500">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<i class="mR-10 ti-file"></i>
|
||||
<span>Drafts</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-amber-50 c-amber-700">5</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="" class="nav-link c-grey-800 cH-blue-500">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<i class="mR-10 ti-alert"></i>
|
||||
<span>Spam</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-red-50 c-red-700">1</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a href="" class="nav-link c-grey-800 cH-blue-500">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<i class="mR-10 ti-trash"></i>
|
||||
<span>Trash</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-red-50 c-red-700">+99</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li> -->
|
||||
|
||||
{% endfor %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% if departments %}
|
||||
|
||||
<li class="nav-item mT-15">
|
||||
<h6>Departments</h6>
|
||||
</li>
|
||||
|
||||
{% for department in departments %}
|
||||
|
||||
<li class="nav-item filter-department" data-uuid="{{ department.id }}">
|
||||
<label for="filterDepartment-{{ department.id }}" class="nav-link c-grey-800 cH-blue-500 actived">
|
||||
<div class="peers ai-c jc-sb">
|
||||
<div class="peer peer-greed">
|
||||
<input type="checkbox" id="filterDepartment-{{ department.id }}" class="form-check-input me-2">
|
||||
<span>{{ department.title }}</span>
|
||||
</div>
|
||||
<div class="peer">
|
||||
<span class="badge rounded-pill bgc-green-50 c-green-700">0</span>
|
||||
</div>
|
||||
</div>
|
||||
</label>
|
||||
</li>
|
||||
|
||||
{% endfor %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@ -399,6 +347,7 @@
|
||||
console.error(error)
|
||||
});
|
||||
|
||||
loadFilterCounts();
|
||||
loadAllTickets();
|
||||
});
|
||||
|
||||
@ -429,6 +378,47 @@
|
||||
}
|
||||
}
|
||||
|
||||
function loadFilterCounts() {
|
||||
// $("#filterSidebar")
|
||||
|
||||
$.ajax({
|
||||
url: "{% url 'ticket-getfiltercounts' %}",
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
data: {
|
||||
csrfmiddlewaretoken: "{{ csrf_token }}",
|
||||
},
|
||||
success: function(data) {
|
||||
alert(JSON.stringify(data, null, 4));
|
||||
|
||||
var priorities = data.priority_counts;
|
||||
var tags = data.tag_counts;
|
||||
var departments = data.department_counts;
|
||||
|
||||
$("#filterSidebar .filter-priority").each(function() {
|
||||
var uuid = $(this).data("uuid");
|
||||
var count = priorities[uuid];
|
||||
$(this).find(".badge").text(count);
|
||||
});
|
||||
|
||||
$("#filterSidebar .filter-tag").each(function() {
|
||||
var uuid = $(this).data("uuid");
|
||||
var count = tags[uuid];
|
||||
$(this).find(".badge").text(count);
|
||||
});
|
||||
|
||||
$("#filterSidebar .filter-department").each(function() {
|
||||
var uuid = $(this).data("uuid");
|
||||
var count = departments[uuid];
|
||||
$(this).find(".badge").text(count);
|
||||
});
|
||||
},
|
||||
error: function(data) {
|
||||
alert(JSON.stringify(data, null, 4))
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function loadAllTickets() {
|
||||
$("#ticketsContainer").empty();
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user