New changes.
parent
cd3efc29b7
commit
37e3d8af4a
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -0,0 +1,41 @@
|
||||
{% load static %}
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Osina</title>
|
||||
|
||||
<link rel="stylesheet" type="text/css" href='{% static "dist/output.css" %}'>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
|
||||
</head>
|
||||
|
||||
<body class="font-poppinsLight">
|
||||
<form id="hiddenContent" method="POST" action="">
|
||||
{% csrf_token %}
|
||||
<h1 class="text-secondosiblue text-2xl font-semibold text-center">Update Ticket Status</h1>
|
||||
|
||||
<select name="status" id="" class="w-full h-[50px] py-1 px-3 border border-gray-300 outline-none rounded-md mt-4">
|
||||
<option value="Open">Open</option>
|
||||
<option value="Working On">Working On</option>
|
||||
<option value="Closed">Closed</option>
|
||||
</select>
|
||||
|
||||
|
||||
<div class="w-full">
|
||||
<input required name="date" type="date" id="date" name="date"
|
||||
class="w-full p-3 border border-gray-300 rounded-md bg-transparent outline-none mt-4">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="w-full flex justify-center items-center mt-4">
|
||||
<button type="submit"
|
||||
class="w-fit bg-osiblue border border-osiblue rounded-md text-white text-xl px-5 py-1 hover:bg-white hover:text-osiblue">Save</button>
|
||||
</div>
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
Binary file not shown.
Binary file not shown.
After Width: | Height: | Size: 366 KiB |
@ -0,0 +1,44 @@
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
|
||||
// Function to calculate progress and update progress bar
|
||||
function calculateProgress(startDate, endDate, progressBar) {
|
||||
const currentDate = new Date();
|
||||
if (endDate <= currentDate) {
|
||||
progressBar.style.width = "100%";
|
||||
progressBar.classList.add('bg-red-500');
|
||||
} else if (startDate > currentDate) {
|
||||
progressBar.style.width = "0%";
|
||||
} else {
|
||||
const passedTime = currentDate - startDate;
|
||||
const totalDuration = endDate - startDate;
|
||||
const percentage = (passedTime / totalDuration) * 100;
|
||||
progressBar.style.width = percentage + "%";
|
||||
|
||||
if (percentage <= 50) {
|
||||
progressBar.classList.add('bg-green-700');
|
||||
} else if (percentage <= 80) {
|
||||
progressBar.classList.add('bg-yellow-400');
|
||||
} else if (percentage <= 100) {
|
||||
progressBar.classList.add('bg-red-500');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function updateAllProjectProgress() {
|
||||
const projectContainers = document.querySelectorAll(".projectContainer");
|
||||
|
||||
projectContainers.forEach(projectContainer => {
|
||||
const startDateElement = projectContainer.querySelector(".startDate");
|
||||
const endDateElement = projectContainer.querySelector(".endDate");
|
||||
|
||||
const progressBar = projectContainer.querySelector(".progressBar");
|
||||
|
||||
const startDate = new Date(startDateElement.textContent);
|
||||
const endDate = new Date(endDateElement.textContent);
|
||||
|
||||
calculateProgress(startDate, endDate, progressBar);
|
||||
});
|
||||
}
|
||||
|
||||
updateAllProjectProgress();
|
||||
});
|
Loading…
Reference in New Issue