New changes in task details

main
emile 1 year ago
parent 44df4a2897
commit 453f3b9ea2

Binary file not shown.

@ -24,5 +24,5 @@ urlpatterns = [
path('mark_point_completed/<int:point_id>/<str:task_id>/', views.mark_point_completed, name='mark_point_completed'),
path('mark_point_completed_task_page/<int:point_id>/<str:task_id>/', views.mark_point_completed_task_page, name='mark_point_completed_task_page'),
path('mark_point_paused/<int:point_id>/<str:task_id>/', views.mark_point_paused, name='mark_point_paused'),
path('mark_point_paused_task_page/<int:point_id>/<str:task_id>/', views.mark_point_paused, name='mark_point_paused_task_page'),
]

@ -457,6 +457,32 @@ def mark_point_paused(request, point_id, task_id):
@login_required
def mark_point_paused_task_page(request, point_id, task_id):
task = get_object_or_404(Task, id=task_id)
point = get_object_or_404(Point, id=point_id)
point.status = 'Paused'
current_datetime = datetime.now()
point.save()
last_activity = PointActivity.objects.filter(point=point).last()
if last_activity:
last_activity.end_time = timezone.make_aware(current_datetime, timezone.get_current_timezone())
last_activity.save()
status_text = f'{point.text} - Paused'
status = Status(text=status_text, date=current_datetime.date(), time=current_datetime.strftime("%I:%M %p"), staff=request.user.staffprofile)
status.save()
task_id_str = task.task_id
showpoints_url = reverse('showpoints', args=[task_id_str])
return HttpResponseRedirect(showpoints_url)
@login_required
def mark_point_completed(request, point_id, task_id):
task = get_object_or_404(Task, id=task_id)
@ -491,9 +517,7 @@ def mark_point_completed(request, point_id, task_id):
status = Status(text=status_text, date=current_datetime.date(), time=current_datetime.strftime("%I:%M %p"), staff=request.user.staffprofile)
status.save()
task_id_str = task.task_id
showpoints_url = reverse('showpoints', args=[task_id_str])
return HttpResponseRedirect(showpoints_url)
return redirect('detailed-task', task_id=task.task_id)
@ -502,18 +526,32 @@ def mark_point_completed_task_page(request, point_id, task_id):
task = get_object_or_404(Task, id=task_id)
point = get_object_or_404(Point, id=point_id)
point.status = 'Completed'
current_datetime = datetime.now()
current_datetime = datetime.now()
point.save()
# Update the end time of the last activity to the current time
last_activity = PointActivity.objects.filter(point=point).last()
last_activity.end_time = datetime.now()
if last_activity:
last_activity.end_time = timezone.make_aware(current_datetime, timezone.get_current_timezone())
last_activity.save()
total_time_hours, total_time_minutes, total_time_seconds = point.total_activity_time()
formatted_time = ""
if total_time_hours > 0:
formatted_time += f"{total_time_hours}{'hr' if total_time_hours == 1 else 'hrs'}"
if total_time_minutes > 0:
formatted_time += f" {total_time_minutes}{'min' if total_time_minutes == 1 else 'mins'}"
if total_time_seconds > 0:
formatted_time += f" {total_time_seconds}{'sec' if total_time_seconds == 1 else 'secs'}"
status_text = f'{point.text} - Completed'
if formatted_time:
status_text += f' in {formatted_time}'
status = Status(text=status_text, date=current_datetime.date(), time=current_datetime.strftime("%I:%M %p"), staff=request.user.staffprofile)
status.save()

@ -585,7 +585,7 @@
<div class="bg-white shadow-md rounded-md p-5">
<div class="w-full h-full flex flex-col justify-between items-center">
<div class="w-full flex justify-between items-center">
<p class="text-[22px] text-secondosiblue font-bold uppercase">Tasks</p>
<p class="text-[22px] text-secondosiblue font-poppinsBold uppercase">Tasks</p>
<img src="{% static 'images/icons/tasks.png' %}" class="w-[50px]">
</div>
<div
@ -598,7 +598,7 @@
<div class="bg-white shadow-md rounded-md p-5">
<div class="w-full h-full flex flex-col justify-between items-center">
<div class="w-full flex justify-between items-center">
<p class="text-[22px] text-secondosiblue font-bold uppercase">Projects</p>
<p class="text-[22px] text-secondosiblue font-poppinsBold uppercase">Projects</p>
<img src="{% static 'images/icons/projects.png' %}" class="w-[50px]">
</div>
<div
@ -611,7 +611,7 @@
<div class="bg-white shadow-md rounded-md p-5">
<div class="w-full h-full flex flex-col justify-between items-center">
<div class="w-full flex justify-between items-center">
<p class="text-[22px] text-secondosiblue font-bold uppercase">Tickets</p>
<p class="text-[22px] text-secondosiblue font-poppinsBold uppercase">Tickets</p>
<img src="{% static 'images/icons/tickets.png' %}" class="w-[50px]">
</div>
<div

@ -4,22 +4,18 @@
<div class="w-full xxlg1:w-[75%] bg-white h-fit rounded-md shadow-md p-5">
{% if task.status == 'Open' %}
<div class="w-full bg-blue-500 rounded-t-md flex flex-col justify-center items-center py-3">
<h1 class="text-xl md:text-3xl text-white font-semibold text-center">{{task.name}}</h1>
</div>
{% endif %}
{% if task.status == 'Working On' %}
<div class="w-full bg-yellow-500 rounded-t-md flex flex-col justify-center items-center py-3">
<div class="w-full rounded-t-md flex flex-col justify-center items-center py-3 {% if task.status == 'Open' %} bg-osiblue {% endif %} {% if task.status == 'Working On' %} bg-yellow-500 {% endif %} {% if task.status == 'Closed' %} bg-green-700 {% endif %}">
<h1 class="text-xl md:text-3xl text-white font-semibold text-center">{{task.name}}</h1>
</div>
{% endif %}
{% if task.status == 'Closed' %}
<div class="w-full bg-green-700 rounded-t-md flex flex-col justify-center items-center py-3">
<h1 class="text-xl md:text-3xl text-white font-semibold text-center">{{task.name}}</h1>
<div class="w-full h-fit flex justify-between items-center bg-gray-100 shadow-md rounded-md px-3 py-3 mt-4">
<div class="flex justify-start items-center gap-2">
<img src="{% static 'images/back-in-time.png' %}" class="w-[35px]">
<p class="text-secondosiblue">Total Time: <span class="font-poppinsBold">{{ task.total_task_time.0 }}{% if task.total_task_time.0 == 1 %}hr{% else %}hrs{% endif %} {{ task.total_task_time.1 }}{% if task.total_task_time.1 == 1 %}min{% else %}mins{% endif %} {{ task.total_task_time.2 }}{% if task.total_task_time.2 == 1 %}sec{% else %}secs{% endif %}</span></p>
</div>
{% endif %}
<div class="w-full h-fit flex justify-end items-center bg-gray-100 shadow-md rounded-md px-3 py-3 mt-4">
<div class="w-full s:w-fit flex flex-col s:flex-row justify-end items-center gap-3">
<button
class="w-full s:w-fit text-base px-3 py-2 bg-red-500 text-white outline-none border border-red-500 rounded-md cursor-pointer hover:bg-white hover:text-red-500 duration-300 deleteTaskButton"
@ -35,11 +31,23 @@
<div class="w-full flex flex-col gap-4 mt-5">
<div>
<p class="text-gray-500 text-xl">Description: <span
class="text-slate-800 text-xl font-semibold">{{task.description}}</span></p>
</div>
<div>
<p class="text-gray-500 text-xl">Project: <span
class="text-slate-800 text-xl font-semibold">{{task.project.name}}</span></p>
</div>
<div>
<p class="text-gray-500 text-xl">Epic: <span
class="text-slate-800 text-xl font-semibold">{{task.epic.title}}</span></p>
</div>
<div>
<p class="text-gray-500 text-xl">Start Date: <span
class="text-slate-800 text-xl font-semibold">{{task.start_date}}</span></p>
@ -50,10 +58,6 @@
class="text-slate-800 text-xl font-semibold">{{task.end_date}}</span></p>
</div>
<div>
<p class="text-gray-500 text-xl">Epic: <span
class="text-slate-800 text-xl font-semibold">{{task.epic.title}}</span></p>
</div>
<div>
<p class="text-gray-500 text-xl">Assigned To: <span
@ -69,13 +73,13 @@
<div>
<p class="text-gray-500 text-xl">Status:
{% if task.status == 'Closed' %}
<span class="text-red-500 text-xl font-semibold">{{task.status}}</span>
<span class="text-green-700 text-xl font-semibold">{{task.status}}</span>
{% endif %}
{% if task.status == 'Open' %}
<span class="text-green-700 text-xl font-semibold">{{task.status}}</span>
<span class="text-osiblue text-xl font-semibold">{{task.status}}</span>
{% endif %}
{% if project.status == 'Working on' %}
<span class="text-yellow-400 text-xl font-semibold">{{task.status}}</span>
{% if task.status == 'Working On' %}
<span class="text-yellow-500 text-xl font-semibold">{{task.status}}</span>
{% endif %}
</p>
</div>
@ -102,194 +106,121 @@
</button>
</div>
<div class="overflow-x-auto border border-gray-300 rounded-b-md">
<table class="min-w-full divide-y">
<!-- TABLE HEADER -->
<thead class="bg-gray-50">
<tr>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
Point
</th>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
Status
</th>
</tr>
</thead>
<!-- TABLE BODY -->
<tbody class="bg-white divide-y divide-gray-200">
<!-- 1st row -->
<div class="overflow-x-auto">
{% if points %}
{% for point in points %}
<tr>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<p class="text-slate-800">{{point.text}}</p>
</td>
<p class="pointId" data-point-id="{{ point.id }}" style="display: none;">{{ point.id }}</p>
<div class="w-full flex flex-col gap-1
{% if point.status == 'Completed' %}
bg-green-700
{% elif point.status == 'Working On' %}
bg-orange-500
{% elif point.status == 'Paused' %}
bg-red-500
{% else %}
bg-slate-700
{% endif %}
bg-opacity-50 rounded-md shadow-md p-3 mt-4">
<div class="w-full flex justify-between items-end pb-2 border-b border-gray-200">
<div class="w-[380px]">
{% if point.status == 'Completed' %}
<p class="text-white line-through">{{point.text}}</p>
{% else %}
<p class="text-white">{{point.text}}</p>
{% endif %}
</div>
<div class="flex justify-end items-center gap-2">
{% if point.status == 'Not Completed' or point.status == 'Paused' and not point.status == 'Completed' %}
<a href="{% url 'mark_point_working_on_task_page' point.id task.id %}">
<button
class="w-[40px] h-[40px] rounded-full bg-transparent shadow-md text-white border border-white flex justify-center items-center hover:scale-105 transition-transform duration-300"
id="startPointButton">
<i class="fa fa-play"></i>
</button>
</a>
{% endif %}
{% if point.status == 'Not Completed' %}
<td class="px-6 py-4 text-center text-sm">
<div class="w-full flex justify-center items-center gap-2">
<form method="post"
action="{% url 'mark_point_working_on_task_page' point.id task.id %}">
{% csrf_token %}
<button type="submit"
class="w-[120px] px-2 py-2 bg-transparent border border-yellow-500 rounded-md text-yellow-500 hover:bg-yellow-500 hover:text-white">Working
On</button>
</form>
<form method="post"
action="{% url 'mark_point_completed_task_page' point.id task.id %}">
{% csrf_token %}
<button type="submit"
class="w-[120px] px-2 py-2 bg-transparent border border-blue-500 rounded-md text-blue-500 hover:bg-blue-500 hover:text-white">Complete</button>
</form>
<form method="post" action="{% url 'deletetaskpointmodal' point.id task.id %}">
{% csrf_token %}
<button type="submit"
class="w-fit px-3 py-2 bg-white border border-red-500 rounded-md text-red-500 hover:bg-red-500 hover:text-white cursor-pointer">
<i class="fa fa-trash"></i>
{% if point.status == 'Working On' and not point.status == 'Completed' %}
<a href="{% url 'mark_point_paused_task_page' point.id task.id %}">
<button
class="w-[40px] h-[40px] rounded-full bg-transparent shadow-md text-white border border-white justify-center items-center hover:scale-105 transition-transform duration-300"
id="pausePointButton">
<i class="fa fa-pause"></i>
</button>
</form>
</div>
</td>
</a>
{% endif %}
{% if point.status == 'Completed' %}
<td class="px-6 py-4 text-center text-sm">
{% if not point.status == 'Completed' and not point.status == 'Paused' %}
<a href="{% url 'mark_point_completed_task_page' point.id task.id %}">
<button
class="w-fit px-3 py-2 bg-blue-500 border border-blue-500 rounded-md text-white opacity-40"
value="Completed" disabled>Completed</button>
</td>
class="w-[40px] h-[40px] rounded-full bg-transparent shadow-md text-white border border-white flex justify-center items-center hover:scale-105 transition-transform duration-300">
<i class="fa fa-check"></i>
</button>
</a>
{% endif %}
{% if point.status == 'Working On' %}
<td class="px-6 py-4 text-center text-sm">
<div class="w-full flex justify-center items-center gap-2">
{% if point.status == 'Completed' %}
<button
class="w-[120px] px-2 py-2 border border-yellow-500 rounded-md bg-yellow-500 text-white opacity-40"
disabled>Working On</button>
<form method="post"
action="{% url 'mark_point_completed_task_page' point.id task.id %}">
{% csrf_token %}
<button type="submit"
class="w-[120px] px-2 py-2 bg-transparent border border-blue-500 rounded-md text-blue-500 hover:bg-blue-500 hover:text-white">Complete</button>
</form>
<form method="post" action="{% url 'deletetaskpointmodal' point.id task.id %}">
class="w-[40px] h-[40px] rounded-full bg-transparent shadow-md text-white border border-white flex justify-center items-center opacity-30 cursor-default">
<i class="fa fa-check"></i>
</button>
{% endif %}
{% if not point.status == 'Completed' %}
<form method="post" action="{% url 'deletepointmodal' point.id task.id %}">
{% csrf_token %}
<button type="submit"
class="w-fit px-3 py-2 bg-white border border-red-500 rounded-md text-red-500 hover:bg-red-500 hover:text-white cursor-pointer">
class="w-[40px] h-[40px] bg-transparent border border-white rounded-full text-white flex justify-center items-center shadow-md hover:scale-105 transition-transform duration-300">
<i class="fa fa-trash"></i>
</button>
</form>
</div>
</td>
{% endif %}
</tr>
{% endfor %}
{% else %}
<tr>
<td colspan="3" class="px-6 py-4 text-center text-sm text-slate-800">
No Available Points
</td>
</tr>
{% endif %}
</tbody>
</table>
</div>
</div>
<!-- TIMLINE -->
<div>
<div class="mt-5 relative">
<div
class=" bg-osiblue rounded-t-md flex justify-between items-center text-white text-xl font-bold h-[50px]">
<div class="px-3">
<p class="text-white uppercase font-bold">Timline</p>
<div class="flex justify-between items-center gap-3 pt-2">
<div class="text-white text-sm">
<p>Total Time:
<span class="font-semibold pointTotalTime">
<span class="hours">{{ point.total_activity_time.0 }}</span> hours,
<span class="minutes">{{ point.total_activity_time.1 }}</span> minutes,
<span class="seconds">{{ point.total_activity_time.2 }}</span> seconds
</span>
</p>
</div>
<button
class="h-full rounded-tr-md px-4 bg-gray-300 text-osiblue text-[18px] outline-none border-none cursor-pointer flex justify-center items-center">
<i class="fa fa-plus"></i>
</button>
<div class="w-fit py-1 px-2 bg-white text-slate-700 text-xs rounded-md shadow-md">
{% if point.status == 'Completed' %}
<p class="text-green-700 opacity-50">Completed</p>
{% elif point.status == 'Working On' %}
<p class="text-orange-500 opacity-50">Working On</p>
{% elif point.status == 'Paused' %}
<p class="text-red-500 opacity-50">Paused</p>
{% else %}
<p class="text-slate-700 opacity-50">Created</p>
{% endif %}
</div>
<div class="overflow-x-auto border border-gray-300 rounded-b-md">
<table class="min-w-full divide-y">
<!-- TABLE HEADER -->
<thead class="bg-gray-50">
<tr>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
Task Time: 300 min
</th>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase border-r border-gray-300 whitespace-nowrap">
User
</th>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
Date
</th>
<th scope="col"
class="px-6 py-3 text-sm font-medium text-gray-500 uppercase whitespace-nowrap">
Total Time
</th>
</tr>
</thead>
<!-- TABLE BODY -->
<tbody class="bg-white divide-y divide-gray-200">
<!-- 1st row -->
</div>
</div>
{% endfor %}
{% else %}
<tr>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<button
class="w-fit py-1 px-3 bg-red-500 border border-red-500 text-white text-base rounded-md">Delete</button>
</td>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<a class="text-slate-800">Nataly</a>
</td>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<a class="text-slate-800">6-9-2023</a>
</td>
<td class="px-6 py-4 text-center text-sm">
<a class="text-slate-800">50min</a>
</td>
</tr>
<!-- <tr>
<td colspan="3" class="px-6 py-4 text-center text-sm text-slate-800">
No Available Credentials
No Available Points
</td>
</tr> -->
</tr>
{% endif %}
</tbody>
</table>
</div>
</div>
</div>
<!-- DESCRIPTION -->
<div class="mt-5">
<p class="text-gray-500 text-xl">Description:</p>
<div class="w-full h-fit px-4 mt-1">
<p class="text-slate-700">
{{task.description}}
</p>
</div>
</div>
<!-- TAGS -->
<div>
<div class="mt-5">
<p class="text-gray-500 text-xl">Tags:</p>
<div class="w-full h-fit px-4 mt-3 flex flex-wrap justify-start items-center gap-3">
<div class="w-full h-fit mt-3 flex flex-wrap justify-start items-center gap-3">
<button
class="text-sm text-gray-400 border border-gray-400 rounded-md w-fit py-2 px-3 outline-none cursor-pointer">Media
Streaming</button>
@ -308,7 +239,7 @@
<!-- POPUP MODAL -->
<div class="w-full h-full bg-black bg-opacity-40 z-20 fixed justify-center items-center hidden" id="popUpModal">
<div class="w-full h-full bg-black bg-opacity-40 z-20 fixed justify-center items-center hidden inset-0" id="popUpModal">
<div class="w-[95%] md:w-fit h-fit bg-white rounded-md p-9 relative">
<button class="absolute top-3 right-5 text-slate-800 text-xl cursor-pointer outline-none border-none"
id="closeModalButton">

@ -614,7 +614,7 @@
<div class="bg-white shadow-md rounded-md p-5">
<div class="w-full h-full flex flex-col justify-between items-center">
<div class="w-full flex justify-between items-center">
<p class="text-[22px] text-secondosiblue font-bold uppercase">Tasks</p>
<p class="text-[22px] text-secondosiblue font-poppinsBold uppercase">Tasks</p>
<img src="{% static 'images/icons/tasks.png' %}" class="w-[50px]">
</div>
<div
@ -627,7 +627,7 @@
<div class="bg-white shadow-md rounded-md p-5">
<div class="w-full h-full flex flex-col justify-between items-center">
<div class="w-full flex justify-between items-center">
<p class="text-[22px] text-secondosiblue font-bold uppercase">Projects</p>
<p class="text-[22px] text-secondosiblue font-poppinsBold uppercase">Projects</p>
<img src="{% static 'images/icons/projects.png' %}" class="w-[50px]">
</div>
<div
@ -640,7 +640,7 @@
<div class="bg-white shadow-md rounded-md p-5">
<div class="w-full h-full flex flex-col justify-between items-center">
<div class="w-full flex justify-between items-center">
<p class="text-[22px] text-secondosiblue font-bold uppercase">Tickets</p>
<p class="text-[22px] text-secondosiblue font-poppinsBold uppercase">Tickets</p>
<img src="{% static 'images/icons/tickets.png' %}" class="w-[50px]">
</div>
<div

@ -2840,11 +2840,6 @@ video {
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.hover\:bg-blue-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(59 130 246 / var(--tw-bg-opacity));
}
.hover\:bg-gray-50:hover {
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
@ -2855,11 +2850,6 @@ video {
background-color: rgb(32 51 107 / var(--tw-bg-opacity));
}
.hover\:bg-red-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(239 68 68 / var(--tw-bg-opacity));
}
.hover\:bg-secondosiblue:hover {
--tw-bg-opacity: 1;
background-color: rgb(55 74 122 / var(--tw-bg-opacity));
@ -2874,11 +2864,6 @@ video {
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.hover\:bg-yellow-500:hover {
--tw-bg-opacity: 1;
background-color: rgb(234 179 8 / var(--tw-bg-opacity));
}
.hover\:bg-opacity-60:hover {
--tw-bg-opacity: 0.6;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

Loading…
Cancel
Save