corbz/ticket-website
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects 1 Releases 1 Wiki Activity

tags and priorities now shown in ticket items

Browse Source
This commit is contained in:
Corban-Lee Jones 2024-01-19 17:56:10 +00:00
parent 4e70005cac
commit c9e59c5c66
1 changed files with 50 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
apps/static/js/tickets.js
View File

@ -37,7 +37,7 @@ function updateItemsState(state) {
}
function updateContentState(state) {
console.debug(`updating items state to '${state}'`);
console.debug(`updating content state to '${state}'`);
switch (state) {
case "content":
$("#ticketContent .loading").hide();
@ -47,7 +47,7 @@ function updateContentState(state) {
$("#ticketContent .loading").show();
break;
default:
throw new Error(`Invalid Items State '${state}'`);
throw new Error(`Invalid Content State '${state}'`);
}
}
@ -156,6 +156,10 @@ function loadFilterCounts() {
function applyTicketClickFunction() {
$(".ticket-item").on("click", function(e) {
e.preventDefault();
if ($(this).hasClass("active")) {
return;
}
loadTicketContent($(this).data("uuid"));
$(".ticket-item").removeClass("active");
$(this).addClass("active");
@ -164,6 +168,11 @@ function applyTicketClickFunction() {
});
}
$(".back-to-mailbox").on("click", function(e) {
e.preventDefault();
$(".ticket-item.active").removeClass("active");
});
function reloadCurrentTicket() {
loadTicketContent($(".ticket-item.active").data("uuid"));
}
@ -203,7 +212,10 @@ function loadTicketItems(page=1) {
updateItemsState("loading");
filters["page"] = page;
fetchTicketsPromise(filters).then((response) => {
var fetchFilters = { ...filters };
fetchFilters["only_fields"] = "uuid,title,short_description,author,priority,tags,timestamp,was_yesterday,is_edited,author__forename,author__surname,author__department,author__icon";
fetchTicketsPromise(fetchFilters).then((response) => {
// Update the counts to show how many tickets were found
$("#ticketCounts .current").text(response.results.length);
$("#ticketCounts .total").text(response.count);
@ -225,6 +237,15 @@ function loadTicketItems(page=1) {
"prev": ticketHasPrevPage
}
// Update the pagination count with the current page
$("#paginationCounts .current").text(pageNumber);
// If we are on page one (which has been normalised to be the case in many intances)
// We can use the amount of results to calculate the total amount of pages.
if (pageNumber === 1) {
$("#paginationCounts .total").text(Math.ceil(response.count / response.results.length));
}
// Iterate over and handle each ticket
response.results.forEach(function(ticket) {
@ -240,9 +261,24 @@ function loadTicketItems(page=1) {
template.find(".ticket-item-author").text(`${ticket.author.forename} ${ticket.author.surname}`);
template.find(".ticket-item-datetime").text(formattedTime);
template.find(".ticket-item-title").text(ticket.title);
template.find(".ticket-item-desc").text(ticket.description);
template.find(".ticket-item-desc").html(ticket.short_description);
template.find(".ticket-item-icon").attr("src", ticket.author.icon);
template.attr("data-uuid", ticket.uuid);
// Add tickets using the badge template
ticket.tags.forEach(function(tag) {
var tagTemplate = $($("#ticketContentBadgeTemplate").html());
tagTemplate.find(".ticket-content-badge-text").text(tag.title);
tagTemplate.css({ "color": tag.colour, "background-color": tag.backgroundcolour });
template.find(".ticket-item-tags").append(tagTemplate);
});
// Add the priority using the badge template
var priorityTemplate = $($("#ticketContentBadgeTemplate").html());
priorityTemplate.find(".ticket-content-badge-text").text(ticket.priority.title + " Priority");
priorityTemplate.css({ "color": ticket.priority.colour, "background-color": ticket.priority.backgroundcolour });
priorityTemplate.removeClass("rounded-pill").addClass("rounded-1");
template.find(".ticket-item-priority").append(priorityTemplate);
// Add the content to the interface
$("#ticketsContainer .content").append(template);
@ -276,12 +312,20 @@ function loadTicketContent(uuid) {
if (ticket.is_edited) formattedTime += " • edited";
// Create a copy of the template using the ticket data
var template = $($("#ticketContentTemplate").html())
var template = $($("#ticketContentTemplate").html());
template.find(".ticket-content-author").text(`${ticket.author.forename} ${ticket.author.surname}`);
template.find(".ticket-content-datetime").text(formattedTime);
template.find(".ticket-content-title").text(ticket.title);
template.find(".ticket-content-desc").text(ticket.description);
template.find(".ticket-content-desc").html(ticket.description);
template.find(".ticket-content-icon").attr("src", ticket.author.icon);
console.debug(ticket.description);
ticket.tags.forEach(function(tag) {
var tagTemplate = $($("#ticketContentBadgeTemplate").html());
tagTemplate.find(".ticket-content-badge-text").text(tag.title);
tagTemplate.css({ "color": tag.colour, "background-color": tag.backgroundcolour });
template.find(".ticket-content-badges").append(tagTemplate);
});
$("#ticketContent .content").append(template);