New changes.

main
nataly 12 months ago
parent ec38487e65
commit 4fbbc4aec0

@ -53,7 +53,7 @@
</form>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-input-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-input-tag.js" %}'></script>
</body>

@ -68,6 +68,6 @@
<script type="text/javascript" src='{% static "js/pop-modals.js" %}'></script>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-input-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-input-tag.js" %}'></script>
{% endblock content %}

@ -93,10 +93,10 @@
<!-------------- JS SCRIPTS --------------->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src='{% static "js/file-uploader.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/file-uploader.js" %}'></script>
<!-- TO DISPLAY THE CHOSEN REGARDING OPTION SELECT TAG -->
<script type="text/javascript" src='{% static "js/customer_dashboard/regarding-ticket.js" %}'></script>
<script type="text/javascript" src='{% static "js/tickets/regarding-ticket.js" %}'></script>
{% endblock %}

@ -274,5 +274,5 @@
</div>
</div>
</div>
<script type="text/javascript" src='{% static "js/calculate-project-time.js" %}'></script>
<script type="text/javascript" src='{% static "js/projects/calculate-project-time.js" %}'></script>
{% endblock content %}

@ -335,10 +335,10 @@
<!---------------------- JS SCRIPTS -------------------->
<script type="text/javascript" src="{% static 'js/customer_dashboard/ticket-details.js' %}"></script>
<script type="text/javascript" src="{% static 'js/tickets/ticket-details.js' %}"></script>
<script type="text/javascript" src="{% static 'js/text-editor.js' %}"></script>
<script type="text/javascript" src="{% static 'js/inputs/text-editor.js' %}"></script>
<script type="text/javascript" src='{% static "js/file-uploader.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/file-uploader.js" %}'></script>
{% endblock %}

@ -53,6 +53,6 @@
</div>
</div>
</div>
<script type="text/javascript" src='{% static "js/calculate-all-projects-time.js" %}'></script>
<script type="text/javascript" src='{% static "js/projects/calculate-all-projects-time.js" %}'></script>
{% endblock content %}

@ -183,6 +183,6 @@
<!---------------------- JS SCRIPTS -------------------->
<script type="text/javascript" src='{% static "js/customer_dashboard/tickets-filtering.js" %}'></script>
<script type="text/javascript" src='{% static "js/tickets/tickets-filtering.js" %}'></script>
{% endblock %}

Binary file not shown.

@ -804,10 +804,10 @@
<script type="text/javascript" src='{% static "js/side-bar.js" %}'></script>
<!-- TO SWITCH BETWEEN STATUSES FROM ONLINE TO OFFLINE -->
<script type="text/javascript" src='{% static "js/switch-status.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/switch-status.js" %}'></script>
<!-- TO RELOAD THE STATUS CONTAINER -->
<script type="text/javascript" src='{% static "js/get-updated-last-status.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/get-updated-last-status.js" %}'></script>
</body>
</html>

@ -104,7 +104,7 @@
</div>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-input-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-input-tag.js" %}'></script>
{% endblock content %}

@ -79,7 +79,7 @@
</div>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-input-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-input-tag.js" %}'></script>

@ -119,6 +119,6 @@
</div>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/add-project.js" %}'></script>
<script type="text/javascript" src='{% static "js/projects/add-project.js" %}'></script>
{% endblock content %}

@ -104,7 +104,7 @@
</div>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-image-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-image-tag.js" %}'></script>
{% endblock content %}

@ -138,7 +138,7 @@
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-input-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-input-tag.js" %}'></script>
{% endblock content %}

@ -105,10 +105,10 @@
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/add-ticket.js" %}'></script>
<script type="text/javascript" src='{% static "js/tickets/add-ticket.js" %}'></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src='{% static "js/file-uploader.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/file-uploader.js" %}'></script>
{% endblock %}

@ -7,13 +7,44 @@
<div class="w-full xxlg1:w-[74.5%] bg-white h-fit rounded-md shadow-md p-5">
<div class="w-full rounded-md flex flex-col justify-center items-center py-2 bg-gray-400
<div class="w-full rounded-md flex flex-col justify-center items-center py-2 bg-gray-400 relative
{% if project.projectstatus_set.all.last.status == 'Completed' %}bg-green-700{% endif %}
{% if project.projectstatus_set.all.last.status == 'Cancelled' %}bg-red-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'In Progress' %}bg-orange-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'Pending' %}bg-yellow-500{% endif %}">
{% if project.projectstatus_set.all.last.status == 'Pending' %}bg-yellow-500{% endif %} bg-opacity-70">
<h1 class="text-xl md:text-3xl text-white font-semibold text-center">{{project.name}}</h1>
<p class="text-white text-center text-base">{{project.project_id}}</p>
{% for type in project.project_type.all %}
<p class="text-white text-sm">
{{type.name}} {% if not forloop.last %} | {% endif %}
</p>
{% endfor %}
<div class="absolute top-3 right-3 cursor-pointer" id="pinProject">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-6 s:w-7 h-6 s:h-7 text-white" color="#000000"
fill="none">
<path d="M3 21L8 16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path
d="M13.2585 18.8714C9.51516 18.0215 5.97844 14.4848 5.12853 10.7415C4.99399 10.1489 4.92672 9.85266 5.12161 9.37197C5.3165 8.89129 5.55457 8.74255 6.03071 8.44509C7.10705 7.77265 8.27254 7.55888 9.48209 7.66586C11.1793 7.81598 12.0279 7.89104 12.4512 7.67048C12.8746 7.44991 13.1622 6.93417 13.7376 5.90269L14.4664 4.59604C14.9465 3.73528 15.1866 3.3049 15.7513 3.10202C16.316 2.89913 16.6558 3.02199 17.3355 3.26771C18.9249 3.84236 20.1576 5.07505 20.7323 6.66449C20.978 7.34417 21.1009 7.68401 20.898 8.2487C20.6951 8.8134 20.2647 9.05346 19.4039 9.53358L18.0672 10.2792C17.0376 10.8534 16.5229 11.1406 16.3024 11.568C16.0819 11.9955 16.162 12.8256 16.3221 14.4859C16.4399 15.7068 16.2369 16.88 15.5555 17.9697C15.2577 18.4458 15.1088 18.6839 14.6283 18.8786C14.1477 19.0733 13.8513 19.006 13.2585 18.8714Z"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</div>
<div class="absolute top-3 right-3 cursor-pointer hidden" id="unpinProject">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="w-6 s:w-7 h-6 s:h-7 text-white" color="#000000"
fill="none">
<path
d="M7.5 8C6.95863 8.1281 6.49932 8.14239 5.99268 8.45891C5.07234 9.03388 4.85108 9.71674 5.08821 10.7612C5.94028 14.5139 9.48599 18.0596 13.2388 18.9117C14.2834 19.1489 14.9661 18.928 15.5416 18.0077C15.8411 17.5288 15.8716 17.0081 16 16.5"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M12 7.79915C12.1776 7.77794 12.3182 7.74034 12.4295 7.68235C13.3997 7.17686 13.9291 5.53361 14.4498 4.60009C14.9311 3.73715 15.1718 3.30567 15.7379 3.10227C16.3041 2.89888 16.6448 3.02205 17.3262 3.26839C18.9197 3.8445 20.1555 5.08032 20.7316 6.6738C20.9779 7.35521 21.1011 7.69591 20.8977 8.26204C20.6943 8.82817 20.2628 9.06884 19.3999 9.55018C18.4608 10.074 16.7954 10.6108 16.2905 11.5898C16.2345 11.6983 16.1978 11.8327 16.1769 12"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
<path d="M3 21L8 16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
<path d="M3 3L21 21" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
</div>
@ -52,11 +83,11 @@
class="w-full md:w-fit text-base px-3 py-2 bg-transparent text-osiblue outline-none border border-osiblue duration-300 rounded-md cursor-pointer hover:bg-osiblue hover:text-white">Create
Story</button>
<a href="" class="w-full md:w-fit">
<button
class="w-full md:w-fit text-base px-3 py-2 bg-transparent text-osiblue outline-none border border-osiblue duration-300 rounded-md cursor-pointer hover:bg-osiblue hover:text-white">Add
Ticket</button>
</a>
<a href="" class="w-full md:w-fit">
<button
class="w-full md:w-fit text-base px-3 py-2 bg-transparent text-osiblue outline-none border border-osiblue duration-300 rounded-md cursor-pointer hover:bg-osiblue hover:text-white">Add
Ticket</button>
</a>
<a href="{% url 'editproject' project.project_id %}" class="w-full md:w-fit">
<button
@ -67,94 +98,81 @@
</div>
<div class="w-full flex flex-col gap-5 mt-5">
<!-- CLIENT -->
<div>
<p class="text-gray-500 text-xl">Client: <span
class="text-secondosiblue text-xl font-semibold">{{project.customer.user.first_name}}
{{project.customer.user.last_name}}</span></p>
</div>
<!-- PROJECT MANAGER -->
<div>
<p class="text-gray-500 text-xl">Project Manager:</p>
<div class="w-fit flex justify-start items-center gap-1 px-5 py-3 bg-gray-100 rounded-md shadow-md mt-2">
<div class="w-[40px] h-[40px] rounded-full bg-white">
{% if project.manager.image %}
<img src="{{project.manager.image.url}}" class="w-full h-full rounded-full object-cover">
{% else %}
<img src="{% static 'images/default-user.png' %}" class="w-full h-full rounded-full object-cover">
{% endif %}
<div class="w-full grid grid-cols-1 xl:grid-cols-2 gap-3">
<div class="w-full p-5 bg-white border border-gray-100 shadow-md flex flex-col rounded-md">
<div class="w-full border-b border-gray-200 pb-3 flex justify-between items-center gap-2">
<p class="text-secondosiblue font-poppinsBold uppercase">Project Details</p>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"
class="w-7 h-7 text-secondosiblue cursor-pointer hover:scale-105 duration-500" color="#000000"
fill="none">
<circle cx="12" cy="12" r="10" stroke="currentColor" stroke-width="1.5" />
<path
d="M10 9C10 7.89543 10.8954 7 12 7C13.1046 7 14 7.89543 14 9C14 9.39815 13.8837 9.76913 13.6831 10.0808C13.0854 11.0097 12 11.8954 12 13V13.5"
stroke="currentColor" stroke-width="1.5" stroke-linecap="round" />
<path d="M11.992 17H12.001" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
</div>
<p class="text-secondosiblue font-light">{{project.manager.user.first_name}}
{{project.manager.user.last_name}}</p>
</div>
</div>
<!-- TYPE -->
<div class="w-full">
<p class="text-gray-500 text-xl">Type:
{% for type in project.project_type.all %}
<span class="text-secondosiblue text-xl font-semibold">
{{type.name}} {% if not forloop.last %}, {% endif %}
{% endfor %}</span>
</p>
</div>
<!-- STATUS -->
<p class="text-gray-500 text-xl">Status:
{% if project.projectstatus_set.exists %}
{% with latest_status=project.projectstatus_set.last.status %}
{% if latest_status == 'Cancelled' %}
<span class="text-red-500 text-xl font-semibold">{{ latest_status }}</span>
{% elif latest_status == 'Completed' %}
<span class="text-green-700 text-xl font-semibold">{{ latest_status }}</span>
{% elif latest_status == 'In Progress' %}
<span class="text-orange-500 text-xl font-semibold">{{ latest_status }}</span>
{% elif latest_status == 'Pending' %}
<span class="text-yellow-400 text-xl font-semibold">{{ latest_status }}</span>
{% else %}
<span class="text-gray-700 text-xl font-semibold">Unknown</span>
{% endif %}
{% endwith %}
{% else %}
<span class="text-gray-700 text-xl font-semibold">No status available</span>
{% endif %}
</p>
<!-- PROJECT DETAILS -->
<div class="w-full flex flex-col gap-3 mt-3">
<p class="text-gray-500">Project ID: <span class="text-secondosiblue">{{project.project_id}}</span>
</p>
<div>
<p class="text-gray-500">Project Description:</p>
<p class="text-secondosiblue">
{{project.details}}
</p>
</div>
<!-- PROJECT DETAILS -->
<div>
<div>
<p class="text-gray-500 text-xl">Project Details:</p>
<div class="w-full pr-8">
<p class="text-secondosiblue font-semibold">
{{project.details}}
</p>
<!-- CLIENT -->
<div>
<p class="text-gray-500">Client:</p>
<a class="">
<div
class="w-full flex justify-between items-center gap-1 px-3 py-3 bg-gray-100 rounded-md shadow-md cursor-pointer hover:scale-105 duration-500">
<p class="text-secondosiblue">
{{project.customer.user.first_name}} {{project.customer.user.last_name}}
</p>
<div
class="w-[30px] h-[30px] rounded-md shadow-md text-white bg-secondosiblue border border-osiblue flex justify-center items-center cursor-pointer hover:bg-transparent hover:text-secondosiblue duration-300">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
<path stroke-linecap="round" stroke-linejoin="round"
d="m8.25 4.5 7.5 7.5-7.5 7.5" />
</svg>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
<!-- TAGS -->
<div>
<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">
<button
class="text-sm text-gray-400 border border-gray-400 rounded-md w-fit py-2 px-3 outline-none">Media
Streaming</button>
<!-- STATUSES -->
<div class="w-full p-5 bg-white border border-gray-100 shadow-md flex flex-col rounded-md">
<div class="w-full border-b border-gray-200 pb-3">
<p class="text-secondosiblue font-poppinsBold uppercase">Statuses</p>
</div>
<button
class="text-sm text-gray-400 border border-gray-400 rounded-md w-fit py-2 px-3 outline-none">Live
Streaming</button>
<button
class="text-sm text-gray-400 border border-gray-400 rounded-md w-fit py-2 px-3 outline-none">Audio
On Demand</button>
<div class="w-full flex flex-col">
{% for status in statuses %}
<div
class="border-b border-gray-100 py-4 flex justify-between items-center px-3 {% if forloop.first %} bg-gray-100 {% endif %}">
<p class="text-secondosiblue text-sm s:text-base">{{status.status}}</p>
<p class="text-gray-500 text-sm">{{status.date}}</p>
</div>
{% endfor %}
</div>
</div>
</div>
<!-- MEMBERS -->
<div class="w-full mt-5">
<div
@ -164,39 +182,101 @@
</div>
<button
class="h-full rounded-tr-md px-4 bg-secondosiblue text-gray-200 text-[18px] outline-none border-none cursor-pointer flex justify-center items-center addProjectMemberModal" data-modal-url="{% url 'addprojectmembermodal' %}">
class="h-full rounded-tr-md px-4 bg-secondosiblue text-gray-200 text-[18px] outline-none border-none cursor-pointer flex justify-center items-center addProjectMemberModal"
data-modal-url="{% url 'addprojectmembermodal' %}">
<i class="fa fa-plus"></i>
</button>
</div>
<div class="w-full flex justify-start items-center gap-3 flex-wrap mt-3">
{% for member in members %}
<div
class="w-fit flex flex-col gap-2 px-5 py-3 bg-gray-100 rounded-md shadow-md">
<div class="flex justify-start items-center gap-1">
<div class="w-[40px] h-[40px] rounded-full bg-white">
{% if member.image %}
<img src="{{member.image.url}}" class="w-full h-full rounded-full object-cover">
{% else %}
<img src="{% static 'images/default-user.png' %}"
class="w-full h-full rounded-full object-cover">
{% endif %}
<div class="w-full grid grid-cols-1 l:grid-cols-2 xl:grid-cols-3 gap-3 mt-3">
<!-- PROJECT MANAGER -->
<a class="h-full">
<div
class="w-full h-full flex flex-col gap-1 px-3 py-3 bg-gray-100 rounded-md shadow-md cursor-pointer hover:scale-105 duration-500">
<div class="w-full flex justify-between items-center gap-1">
<div class="flex justify-start items-center gap-2">
<div class="w-[45px] h-[45px] rounded-full bg-white">
{% if project.manager.image %}
<img src="{{project.manager.image.url}}"
class="w-full h-full rounded-full object-cover">
{% else %}
<img src="{% static 'images/default-user.png' %}"
class="w-full h-full rounded-full object-cover">
{% endif %}
</div>
<div>
<p class="text-secondosiblue font-light">{{project.manager.user.first_name}}
{{project.manager.user.last_name}}</p>
<div class="text-xs bg-secondosiblue text-white shadow-md py-1 px-2 rounded-md">
<p>Project Manager</p>
</div>
</div>
</div>
<div
class="w-[30px] h-[30px] rounded-md shadow-md text-white bg-secondosiblue border border-osiblue flex justify-center items-center cursor-pointer hover:bg-transparent hover:text-secondosiblue duration-300">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
<path stroke-linecap="round" stroke-linejoin="round"
d="m8.25 4.5 7.5 7.5-7.5 7.5" />
</svg>
</div>
</div>
<p class="text-secondosiblue font-light">{{member.user.first_name}} {{member.user.last_name}}
</p>
{% if request.user.is_superuser %}
<p class="text-secondosiblue text-sm">Working Hours:
{{member.total_time_worked_hours}}hr {{member.total_time_worked_minutes}}min
{{member.total_time_worked_seconds}}sec</p>
{% endif %}
</div>
</a>
{% if request.user.is_superuser %}
<p class="text-secondosiblue text-sm">Working Hours:
{{member.total_time_worked_hours}}hr {{member.total_time_worked_minutes}}min
{{member.total_time_worked_seconds}}sec</p>
{% endif %}
</div>
{% for member in members %}
<a>
<div
class="w-full flex flex-col gap-2 px-3 py-3 bg-gray-100 rounded-md shadow-md cursor-pointer hover:scale-105 duration-500">
<div class="w-full flex justify-between items-center gap-1">
<div class="flex justify-start items-center gap-1">
<div class="w-[45px] h-[45px] rounded-full bg-white">
{% if member.image %}
<img src="{{member.image.url}}" class="w-full h-full rounded-full object-cover">
{% else %}
<img src="{% static 'images/default-user.png' %}"
class="w-full h-full rounded-full object-cover">
{% endif %}
</div>
<p class="text-secondosiblue font-light">{{member.user.first_name}}
{{member.user.last_name}}</p>
</div>
<div
class="w-[30px] h-[30px] rounded-md shadow-md text-white bg-secondosiblue border border-osiblue flex justify-center items-center cursor-pointer hover:bg-transparent hover:text-secondosiblue duration-300">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor" class="w-4 h-4">
<path stroke-linecap="round" stroke-linejoin="round"
d="m8.25 4.5 7.5 7.5-7.5 7.5" />
</svg>
</div>
</div>
{% if request.user.is_superuser %}
<p class="text-secondosiblue text-sm">Working Hours:
{{member.total_time_worked_hours}}hr {{member.total_time_worked_minutes}}min
{{member.total_time_worked_seconds}}sec</p>
{% endif %}
</div>
</a>
{% endfor %}
</div>
</div>
<!-- TICKETS -->
<div class="w-full mt-5">
<div class="overflow-x-auto border border-gray-300 rounded-md">
@ -260,33 +340,45 @@
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<p class="text-secondosiblue">hhh</p>
</td>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<p class="text-secondosiblue">hhh</p>
</td>
<td class="px-6 py-4 text-center text-sm">
<div class="w-full flex justify-center items-center gap-3">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[16px] cursor-pointer text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[16px] cursor-pointer text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
</svg>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
</a>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
</svg>
</a>
<div class="cursor-pointer deleteTicketButton"
data-modal-url="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
<div class="cursor-pointer deleteTicketButton" data-modal-url="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
</div>
</div>
</td>
@ -368,15 +460,20 @@
Task</button>
</a>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
</svg>
</a>
<div class="cursor-pointer deleteTicketButton"
data-modal-url="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
<div class="cursor-pointer deleteTicketButton" data-modal-url="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
</div>
</div>
</td>
@ -544,6 +641,7 @@
</button>
</div>
{% if project_notes %}
<div class="w-full h-fit mt-3 grid grid-cols-3 gap-5">
{% for note in project_notes %}
<div>
@ -565,9 +663,53 @@
</p>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="w-full flex justify-center items-center px-3 py-3 text-secondosiblue text-center">
<p>No Available Notes</p>
</div>
{% endif %}
</div>
<!-- TAGS -->
<div class="w-full mt-5">
<div
class=" bg-gray-200 rounded-t-md flex justify-between items-center text-white text-xl font-bold h-[50px]">
<div class="px-3">
<p class="text-secondosiblue uppercase font-bold">Tags</p>
</div>
<button
class="h-full rounded-tr-md px-4 bg-secondosiblue text-gray-200 text-[18px] outline-none border-none cursor-pointer flex justify-center items-center addTagButton"
data-modal-url="{% url 'addtagmodal' %}">
<i class="fa fa-plus"></i>
</button>
</div>
<div class="w-full h-fit mt-3 grid grid-cols-1 s:grid-cols-2 md:grid-cols-3 xlg1:grid-cols-5 gap-3">
<a>
<div
class="bg-gray-50 border border-gray-100 text-sm text-secondosiblue px-3 py-3 rounded-md cursor-pointer hover:scale-105 duration-500">
<p>Media </p>
</div>
</a>
<a>
<div
class="bg-gray-50 border border-gray-100 text-sm text-secondosiblue px-3 py-3 rounded-md cursor-pointer hover:scale-105 duration-500">
<p>Media </p>
</div>
</a>
<a>
<div
class="bg-gray-50 border border-gray-100 text-sm text-secondosiblue px-3 py-3 rounded-md cursor-pointer hover:scale-105 duration-500">
<p>Media </p>
</div>
</a>
</div>
</div>
@ -592,6 +734,7 @@
</div>
</div>
<!-- LOADER -->
<div class="w-full flex justify-center items-center p-5 hidden" id="epicLoader">
<div role="status">
@ -606,8 +749,8 @@
</svg>
</div>
</div>
<!-- TO DISPLAY THE FETCHED TASKS -->
<div class="w-full flex flex-col gap-3" id="epicRelatedTasksContainer">
@ -625,10 +768,10 @@
<!---------------------- JS SCRIPTS -------------------->
<!-- TO FETCH THE RELATED TASKS -->
<script type="text/javascript" src='{% static "js/fetch-epic-tasks.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/fetch-epic-tasks.js" %}'></script>
<!-- TO DISPLAY THE PROJECT PROGRESS BAR BASED ON ITS REMAINING TIME -->
<script type="text/javascript" src='{% static "js/calculate-project-time.js" %}'></script>
<script type="text/javascript" src='{% static "js/projects/calculate-project-time.js" %}'></script>
{% endblock content %}

@ -6,7 +6,7 @@
<div class="w-full xxlg1:w-[75%] bg-white h-fit rounded-md shadow-md p-5">
<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 %}">
class="w-full rounded-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 %} bg-opacity-70">
<h1 class="text-xl md:text-3xl text-white font-semibold text-center">{{task.name}}</h1>
</div>

@ -422,9 +422,9 @@
<!---------------------- JS SCRIPTS -------------------->
<script type="text/javascript" src="{% static 'js/customer_dashboard/ticket-details.js' %}"></script>
<script type="text/javascript" src="{% static 'js/text-editor.js' %}"></script>
<script type="text/javascript" src="{% static 'js/tickets/ticket-details.js' %}"></script>
<script type="text/javascript" src="{% static 'js/inputs/text-editor.js' %}"></script>
<script type="text/javascript" src='{% static "js/file-uploader.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/file-uploader.js" %}'></script>
{% endblock %}

@ -133,6 +133,6 @@
</div>
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-image-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-image-tag.js" %}'></script>
{% endblock content %}

@ -103,7 +103,7 @@
<!-------------- JS SCRIPTS --------------->
<script type="text/javascript" src='{% static "js/upload-image-tag.js" %}'></script>
<script type="text/javascript" src='{% static "js/inputs/upload-image-tag.js" %}'></script>
{% endblock content %}

@ -122,6 +122,6 @@
<!---------------------- JS SCRIPTS -------------------->
<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script type="text/javascript" src='{% static "js/fetch-epics-in-edit-task.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/fetch-epics-in-edit-task.js" %}'></script>
{% endblock content %}

@ -54,114 +54,6 @@
</div>
</div>
<!-- ALL PROJECTS -->
<div class="w-full flex flex-col gap-5 mt-3 hidden" id="allProjectsContainer">
{% for project in projects %}
<div class="w-full h-fit bg-white rounded-md shadow-md p-3 projectContainer">
<p id="projectId" class="hidden">{{project.id}}</p>
<p class="hidden startDate">{{project.start_date}}</p>
<p class="hidden endDate">{{project.end_date}}</p>
<div class="w-full bg-white h-fit rounded-md border border-gray-200">
<div class="w-full px-5 py-5 bg-gray-400 {% if project.projectstatus_set.all.last.status == 'Completed' %}bg-green-700{% endif %}
{% if project.projectstatus_set.all.last.status == 'Cancelled' %}bg-red-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'In Progress' %}bg-orange-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'Pending' %}bg-yellow-500{% endif %}
flex justify-center items-center text-center text-white rounded-t-md text-[17px] s:text-[20px]">
<p>{{project.name}}</p>
</div>
<!-- Progress Bar -->
<div class="w-full h-[8px] bg-gray-100 mainBar">
<div class="h-full progressBar">
</div>
</div>
<div class="w-full grid grid-cols-1 l:grid-cols-2">
<!-- Left Section -->
<div class="flex flex-col justify-between">
<!-- Details -->
<div class="w-full flex flex-col gap-3 p-5">
<div class="w-full flex justify-start items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-secondosiblue">
<path stroke-linecap="round" stroke-linejoin="round"
d="M6 6.878V6a2.25 2.25 0 0 1 2.25-2.25h7.5A2.25 2.25 0 0 1 18 6v.878m-12 0c.235-.083.487-.128.75-.128h10.5c.263 0 .515.045.75.128m-12 0A2.25 2.25 0 0 0 4.5 9v.878m13.5-3A2.25 2.25 0 0 1 19.5 9v.878m0 0a2.246 2.246 0 0 0-.75-.128H5.25c-.263 0-.515.045-.75.128m15 0A2.25 2.25 0 0 1 21 12v6a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18v-6c0-.98.626-1.813 1.5-2.122" />
</svg>
<p class="text-secondosiblue"><span
class="font-poppinsBold">{{project.open_user_tasks_count}}</span> Open {% if project.open_user_tasks_count == 1 %} Task {% else %} Tasks {% endif %}</p>
</div>
<div class="w-full flex justify-start items-center gap-2">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor" class="w-6 h-6 text-secondosiblue">
<path stroke-linecap="round" stroke-linejoin="round"
d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
</svg>
<p class="text-secondosiblue">Total Time: <span
class="font-poppinsBold">{{project.total_time_worked_hours}}hr
{{project.total_time_worked_minutes}}min
{{project.total_time_worked_seconds}}sec</span>
</p>
</div>
</div>
<!-- Action Buttons -->
<div
class="w-full border-t border-b l:border-b-0 border-gray-200 grid grid-cols-1 s:grid-cols-3">
<a href="{% url 'detailed-project' project.project_id %}"
class="p-3 border-b s:border-b-0 border-r-0 s:border-r border-gray-200 text-base bg-gray-50 text-secondosiblue flex justify-center items-center">View</a>
<a href="{% url 'editproject' project.project_id %}"
class="p-3 text-base bg-gray-50 border-b s:border-b-0 border-r-0 s:border-r border-gray-200 text-secondosiblue flex justify-center items-center">Edit</a>
<button class="p-3 text-base bg-gray-50 text-secondosiblue editProjectStatusButton"
data-modal-url="{% url 'editprojectstatusmodal' project.id %}">Update Status</button>
</div>
</div>
<!-- Right Section - Recent Notes -->
<div class="w-full border-l-none l:border-l border-gray-200">
{% if project.note_set.exists %}
{% with last_note=project.note_set.last %}
<div class="w-full h-full flex flex-col gap-3 justify-center items-center p-3">
<p class="text-secondosiblue break-all whitespace-pre-wrap">{{ last_note.text }}</p>
<div class="w-[30px] h-[30px] rounded-full shadow-md p-1 flex justify-center items-center bg-gray-100 cursor-pointer hover:scale-105 duration-300 addProjectNoteButton"
data-modal-url="{% url 'addprojectnotemodal' project.project_id %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="3"
stroke="currentColor" class="w-6 h-6 text-secondosiblue">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
</svg>
</div>
</div>
{% endwith %}
{% else %}
<div class="w-full h-full flex flex-col justify-center items-center gap-3 p-3">
<p class="text-secondosiblue">No Recent Note</p>
<div class="w-[30px] h-[30px] rounded-full shadow-md p-1 flex justify-center items-center bg-gray-100 cursor-pointer hover:scale-105 duration-300 addProjectNoteButton"
data-modal-url="{% url 'addprojectnotemodal' project.project_id %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="3"
stroke="currentColor" class="w-6 h-6 text-secondosiblue">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
</svg>
</div>
</div>
{% endif %}
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<!-- IN PROGRESS PROJECTS -->
<div class="w-full flex flex-col gap-5 mt-3" id="inProgressProjectsContainer">
@ -175,9 +67,12 @@
<div class="w-full bg-white h-fit rounded-md border border-gray-200">
<div class="w-full px-5 py-5 bg-orange-500 flex justify-center items-center text-center text-white rounded-t-md text-[17px] s:text-[20px]">
<p>{{project.name}}</p>
</div>
<a href="{% url 'detailed-project' project.project_id %}">
<div class="w-full px-5 py-5 bg-orange-500 flex justify-center items-center text-center text-white rounded-t-md text-[17px] s:text-[20px] bg-opacity-70 hover:bg-opacity-100 duration-300">
<p>{{project.name}}</p>
</div>
</a>
<!-- Progress Bar -->
<div class="w-full h-[8px] bg-gray-100 mainBar">
@ -260,7 +155,6 @@
</svg>
</div>
</div>
{% endif %}
</div>
</div>
@ -282,9 +176,9 @@
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<!-- TO DISPLAY THE PROJECT PROGRESS BAR BASED ON ITS REMAINING TIME -->
<script type="module" src='{% static "js/calculate-all-projects-time.js" %}'></script>
<script type="module" src='{% static "js/projects/calculate-all-projects-time.js" %}'></script>
<script type="module" src='{% static "js/projects-filtering.js" %}'></script>
<script type="module" src='{% static "js/projects/projects-filtering.js" %}'></script>
{% endblock content %}

@ -2,11 +2,10 @@
{%load static%}
{% block content %}
<div class="w-full xxlg1:w-[75%] relative">
<div class="w-full xxlg1:w-[75%]">
<div class="w-full h-fit bg-white rounded-md shadow-md p-5">
<h1 class="text-secondosiblue text-[25px]">Tickets</h1>
<!-- FILTERING -->
<div
class="w-full py-4 px-3 bg-gray-200 rounded-md shadow-md mt-4 flex flex-col s:flex-row gap-3 justify-between items-center">
@ -23,7 +22,7 @@
</div>
<div class="w-full flex flex-col gap-3 mt-5">
<div class="w-full flex flex-col justify-center items-center gap-3 mt-5">
<div class="w-full bg-gray-200 rounded-md shadow-md h-fit p-3 flex items-center justify-between gap-5">
<div class="flex items-center gap-5 text-[17px]">
<p class="text-secondosiblue font-semibold cursor-pointer" id="openTicketsLink">Open Tickets</p>
@ -31,11 +30,14 @@
</div>
</div>
<!-- RESPONSE MESSGAE FOR SHARING A TICKET -->
<div id="successMessage"
class="fixed mx-auto top-10 opacity-0 w-[85%] s:w-fit px-9 s:px-14 py-3 rounded-md bg-osiblue bg-opacity-80 text-white text-center rounded-t-md shadow-md z-10 pointer-events-none">
</div>
<!-- OPEN TICKETS -->
<div class="overflow-x-auto border border-gray-300 rounded-md" id="openTickets">
<div class="w-full overflow-x-auto border border-gray-300 rounded-md" id="openTickets">
<table class="min-w-full divide-y">
<!-- TABLE HEADER -->
<thead class="bg-gray-50">
@ -90,52 +92,51 @@
</td>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<p class="text-secondosiblue">{{ticket.ticketupdate_set.all.last.added_by.first_name}}</p>
<p class="text-secondosiblue">{{ticket.ticketupdate_set.all.last.added_by.first_name}}
</p>
</td>
<td class="px-6 py-4 text-center text-sm">
<div class="flex justify-center items-center gap-3">
<button onclick="myFunction()">
<input type="text" class="hidden" value="https://osina.ositcom.com/my-tickets/{{ticket.ticket_number}}/" id="myInput">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[16px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
<button class="copyButton">
<input type="text" class="hidden copyInput"
value="https://osina.ositcom.com/my-tickets/{{ticket.ticket_number}}/">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[16px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
</svg>
</button>
<script>
function myFunction() {
// Get the text field
var copyText = document.getElementById("myInput");
// Select the text field
copyText.select();
copyText.setSelectionRange(0, 99999); // For mobile devices
// Copy the text inside the text field
navigator.clipboard.writeText(copyText.value);
// Alert the copied text
alert("Copied Link: " + copyText.value);
}
</script>
<a href="{% url 'ticketdetails' ticket.ticket_number %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
</a>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
</svg>
</a>
<div class="cursor-pointer deleteTicketButton"
data-modal-url="{% url 'deleteticketmodal' ticket.id %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
data-modal-url="{% url 'deleteticketmodal' ticket.id %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
</div>
</div>
</td>
@ -145,10 +146,10 @@
</table>
</div>
<!-- CLOSED TICKETS -->
<div class="overflow-x-auto border border-gray-300 rounded-md hidden" id="closedTickets">
<div class="w-full overflow-x-auto border border-gray-300 rounded-md hidden" id="closedTickets">
<table class="min-w-full divide-y">
<!-- TABLE HEADER -->
<thead class="bg-gray-50">
@ -202,27 +203,49 @@
</td>
<td class="px-6 py-4 text-center text-sm border-r border-gray-300">
<p class="text-secondosiblue">{{ticket.ticketupdate_set.all.last.added_by.first_name}}</p>
<p class="text-secondosiblue">{{ticket.ticketupdate_set.all.last.added_by.first_name}}
</p>
</td>
<td class="px-6 py-4 text-center text-sm">
<div class="flex justify-center items-center gap-3">
<button class="copyButton">
<input type="text" class="hidden copyInput"
value="https://osina.ositcom.com/my-tickets/{{ticket.ticket_number}}/">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[16px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
</svg>
</button>
<a href="{% url 'ticketdetails' ticket.ticket_number %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="M2.036 12.322a1.012 1.012 0 0 1 0-.639C3.423 7.51 7.36 4.5 12 4.5c4.638 0 8.573 3.007 9.963 7.178.07.207.07.431 0 .639C20.577 16.49 16.64 19.5 12 19.5c-4.638 0-8.573-3.007-9.963-7.178Z" />
<path stroke-linecap="round" stroke-linejoin="round"
d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z" />
</svg>
</a>
<a href="">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-fifthosiblue hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10" />
</svg>
</a>
<div class="cursor-pointer deleteTicketButton"
data-modal-url="{% url 'deleteticketmodal' ticket.id %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round" d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
data-modal-url="{% url 'deleteticketmodal' ticket.id %}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
stroke-width="1.5" stroke="currentColor"
class="w-[18px] text-red-500 hover:scale-110 duration-500 transition-transform">
<path stroke-linecap="round" stroke-linejoin="round"
d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
</svg>
</div>
</div>
</td>
@ -239,8 +262,8 @@
</div>
</div>
<script type="text/javascript" src='{% static "js/tickets-filtering.js" %}'></script>
<script type="text/javascript" src='{% static "js/tickets/tickets-filtering.js" %}'></script>
<script type="text/javascript" src='{% static "js/tickets/share-ticket.js" %}'></script>
{% endblock %}

@ -250,11 +250,11 @@
<!-- Include the intl-tel-input JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.13/js/intlTelInput.min.js"></script>
<script src='{% static "js/international-mobile-input-tag.js" %}'></script>
<script src='{% static "js/login_register/international-mobile-input-tag.js" %}'></script>
<script src='{% static "js/login-register.js" %}'></script>
<script src='{% static "js/login_register/login-register.js" %}'></script>
<script src='{% static "js/registration.js" %}'></script>
<script src='{% static "js/login_register/registration.js" %}'></script>
</body>
</html>

@ -1116,25 +1116,25 @@
<script type="text/javascript" src='{% static "js/draggable-slider.js" %}'></script>
<!-- TO SHOW ALL THE ADDED NOTES BY THE USER WHEN CLICKING ON THE SHOW NOTES BUTTON -->
<script type="text/javascript" src='{% static "js/show-notes.js" %}'></script>
<script type="text/javascript" src='{% static "js/notes/show-notes.js" %}'></script>
<!-- IT OPENS A POPUP FOR THE WHOLE NOTE CONTENT -->
<script type="text/javascript" src='{% static "js/notes-pop-modal.js" %}'></script>
<script type="text/javascript" src='{% static "js/notes/notes-pop-modal.js" %}'></script>
<!-- TO OPEN TASKS ACTIONS BUTTONS CONTAINER ON MOBILE -->
<script type="text/javascript" src='{% static "js/tasks.js" %}'></script>
<!-- TO SWITCH BETWEEN STATUSES FROM ONLINE TO OFFLINE -->
<script type="text/javascript" src='{% static "js/switch-status.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/switch-status.js" %}'></script>
<!-- TO OPEN EMOJI PICKER TO ADD REACTIONS -->
<script type="text/javascript" src='{% static "js/emoji-picker.js" %}'></script>
<!-- TO RELOAD THE STATUS CONTAINER -->
<script type="text/javascript" src='{% static "js/get-updated-last-status.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/get-updated-last-status.js" %}'></script>
<!-- TO RELOAD THE USERS ACTIVITY CONTAINER -->
<script type="text/javascript" src='{% static "js/get-updated-user-activity.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/get-updated-user-activity.js" %}'></script>
<!-- NOTIFICATIONS SIDE BAR -->
<script type="text/javascript" src='{% static "js/notifications-side-bar.js" %}'></script>

@ -8,13 +8,16 @@
<p class="hidden endDate">{{project.end_date}}</p>
<div class="w-full bg-white h-fit rounded-md border border-gray-200">
<div class="w-full px-5 py-5 {% if project.projectstatus_set.all.last.status == 'Completed' %}bg-green-700{% endif %}
{% if project.projectstatus_set.all.last.status == 'Cancelled' %}bg-red-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'In Progress' %}bg-orange-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'Pending' %}bg-yellow-500{% endif %}
flex justify-center items-center text-center text-white rounded-t-md text-[17px] s:text-[20px]">
<p>{{project.name}}</p>
</div>
<a href="{% url 'detailed-project' project.project_id %}">
<div class="w-full px-5 py-5 {% if project.projectstatus_set.all.last.status == 'Completed' %}bg-green-700{% endif %}
{% if project.projectstatus_set.all.last.status == 'Cancelled' %}bg-red-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'In Progress' %}bg-orange-500{% endif %}
{% if project.projectstatus_set.all.last.status == 'Pending' %}bg-yellow-500{% endif %}
flex justify-center items-center text-center text-white rounded-t-md text-[17px] s:text-[20px] bg-opacity-70 hover:bg-opacity-100 duration-300">
<p>{{project.name}}</p>
</div>
</a>
<!-- Progress Bar -->
<div class="w-full h-[8px] bg-gray-100 mainBar">

@ -747,16 +747,16 @@
<script type="text/javascript" src='{% static "js/side-bar.js" %}'></script>
<!-- TO SWITCH BETWEEN STATUSES FROM ONLINE TO OFFLINE -->
<script type="text/javascript" src='{% static "js/switch-status.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/switch-status.js" %}'></script>
<!-- TO OPEN EMOJI PICKER TO ADD REACTIONS -->
<script type="text/javascript" src='{% static "js/emoji-picker.js" %}'></script>
<!-- TO RELOAD THE USERS ACTIVITY CONTAINER -->
<script type="text/javascript" src='{% static "js/get-updated-user-activity.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/get-updated-user-activity.js" %}'></script>
<!-- TO RELOAD THE STATUS CONTAINER -->
<script type="text/javascript" src='{% static "js/get-updated-last-status.js" %}'></script>
<script type="text/javascript" src='{% static "js/api_calls/get-updated-last-status.js" %}'></script>
</body>

@ -628,6 +628,7 @@ def projectdetails(request, project_id):
epics = Epic.objects.filter(project=project).order_by('-id')
project_notes = Note.objects.filter(project=project).order_by('-id')
statuses = ProjectStatus.objects.filter(project=project).order_by('-id')
@ -653,6 +654,7 @@ def projectdetails(request, project_id):
'epics': epics,
'project_notes' : project_notes,
'members': members,
'statuses' : statuses,
}
return render(request, 'details_templates/project-details.html', context)

@ -866,6 +866,10 @@ video {
top: 14px;
}
.right-1\/2 {
right: 50%;
}
.z-0 {
z-index: 0;
}
@ -1052,6 +1056,18 @@ video {
margin-bottom: 0.75rem;
}
.mr-0 {
margin-right: 0px;
}
.-mr-3 {
margin-right: -0.75rem;
}
.mr-3 {
margin-right: 0.75rem;
}
.block {
display: block;
}
@ -1667,6 +1683,10 @@ video {
grid-template-columns: repeat(8, minmax(0, 1fr));
}
.grid-cols-5 {
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.flex-row {
flex-direction: row;
}
@ -2747,6 +2767,10 @@ video {
padding-top: 2.25rem;
}
.pb-3 {
padding-bottom: 0.75rem;
}
.text-left {
text-align: left;
}
@ -3627,6 +3651,10 @@ video {
height: 90px;
}
.s\:h-7 {
height: 1.75rem;
}
.s\:w-\[100px\] {
width: 100px;
}
@ -3680,6 +3708,10 @@ video {
width: fit-content;
}
.s\:w-7 {
width: 1.75rem;
}
.s\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@ -3780,6 +3812,10 @@ video {
display: flex;
}
.md\:grid {
display: grid;
}
.md\:hidden {
display: none;
}
@ -3837,6 +3873,10 @@ video {
width: fit-content;
}
.l\:w-\[400px\] {
width: 400px;
}
.l\:max-w-xl {
max-width: 36rem;
}
@ -3892,6 +3932,10 @@ video {
width: 480px;
}
.lg\:grid-cols-5 {
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.lg\:text-\[48px\] {
font-size: 48px;
}
@ -3930,6 +3974,10 @@ video {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.xlg1\:grid-cols-5 {
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.xlg1\:overflow-visible {
overflow: visible;
}
@ -4030,6 +4078,14 @@ video {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.xl\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.xl\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.xl\:text-xl {
font-size: 1.25rem;
line-height: 1.75rem;

@ -1,10 +1,9 @@
import { initializeModalButtons } from '../js/pop-modals.js';
import { updateAllProjectProgress } from '../js/calculate-all-projects-time.js';
import { initializeModalButtons } from '../pop-modals.js';
import { updateAllProjectProgress } from '../../js/projects/calculate-all-projects-time.js';
document.addEventListener('DOMContentLoaded', function () {
const inProgressProjectsContainer = document.getElementById('inProgressProjectsContainer');
const projectsByStatusContainer = document.getElementById('projectsByStatusContainer');
const allProjectsContainer = document.getElementById('allProjectsContainer');
const projectLoader = document.getElementById('projectLoader');
const statusesSelectTag = document.getElementById('statusesSelectTag');
@ -14,7 +13,6 @@ document.addEventListener('DOMContentLoaded', function () {
projectLoader.classList.remove('hidden');
inProgressProjectsContainer.classList.add('hidden');
projectsByStatusContainer.classList.add('hidden');
allProjectsContainer.classList.add('hidden');
if (selectedStatus === 'All') {
fetch('/all-projects/')

@ -1,28 +0,0 @@
function showOpenTickets() {
openTicketsContainer.classList.remove('hidden');
closedTicketsContainer.classList.add('hidden');
openTicketsLink.classList.add('text-secondosiblue', 'font-semibold');
closedTicketsLink.classList.remove('text-secondosiblue', 'font-semibold');
closedTicketsLink.classList.add('text-gray-500');
}
function showClosedTickets() {
openTicketsContainer.classList.add('hidden');
closedTicketsContainer.classList.remove('hidden');
closedTicketsLink.classList.add('text-secondosiblue', 'font-semibold');
openTicketsLink.classList.remove('text-secondosiblue', 'font-semibold');
openTicketsLink.classList.add('text-gray-500');
}
const openTicketsLink = document.getElementById('openTicketsLink');
const closedTicketsLink = document.getElementById('closedTicketsLink');
const openTicketsContainer = document.getElementById('openTickets');
const closedTicketsContainer = document.getElementById('closedTickets');
openTicketsLink.addEventListener('click', showOpenTickets);
closedTicketsLink.addEventListener('click', showClosedTickets);
showOpenTickets();

@ -0,0 +1,26 @@
document.addEventListener('DOMContentLoaded', function () {
const copyButtons = document.querySelectorAll('.copyButton');
const successMessage = document.getElementById('successMessage');
copyButtons.forEach(button => {
button.addEventListener('click', function () {
const copyInput = button.querySelector('.copyInput');
copyInput.select();
copyInput.setSelectionRange(0, 99999); // For mobile devices
navigator.clipboard.writeText(copyInput.value).then(function () {
successMessage.textContent = "Copied Link: " + copyInput.value;
successMessage.classList.add('show-message');
successMessage.classList.remove('hide-message');
setTimeout(function () {
successMessage.classList.remove('show-message');
successMessage.classList.add('hide-message');
}, 10000);
}, function (err) {
console.error('Async: Could not copy text: ', err);
});
});
});
});
Loading…
Cancel
Save