Reload containers - Failed.

osinaweb/static/js/reload-script.js

@@ -0,0 +1,17 @@
+function autoRefreshDiv() {
+    var statusContainer = document.getElementById('statusContainer');
+    var divs = document.querySelectorAll('.userActivityContainer');
+
+    divs.forEach(function (div) {
+        setInterval(function () {
+            div.innerHTML = div.innerHTML;
+        }, 15000);
+    });
+
+    // setInterval(function () {
+
+    //     statusContainer.innerHTML = statusContainer.innerHTML;
+    // }, 60000);
+}
+
+window.onload = autoRefreshDiv;

osinaweb/templates/index.html

@@ -185,7 +185,7 @@
     <!-- RIGHT SIDE / USERS ACTIVITY -->
     <div class="w-[23%] bg-white h-fit rounded-md shadow-md p-5">
         <h1 class="text-2xl text-slate-700 text-center font-semibold">USERS ACTIVITY</h1>
-        <div class="w-full h-fit mt-2">
+        <div class="w-full h-fit mt-2 userActivityContainer">
 
 
             {% for latest in latest_statuses_time_ago %}
@@ -201,7 +201,7 @@
                             <div class="flex flex-col">
                                 <h1 class="text-sm text-slate-700 font-semibold">{{latest.status.staff.first_name}}
                                     {{latest.status.staff.last_name}}</h1>
-                                {% if latest.time_ago == '0min ago' %} 
+                                {% if latest.time_ago == '0min ago' %}
                                 <p class="text-sm text-gray-500">Just Now</p>
                                 {%else %}
                                 <p class="text-sm text-gray-500">{{ latest.time_ago}}</p>
@@ -235,6 +235,7 @@
     </div>
 </div>
 
+
 <!-- TICKETS SECTION -->
 <div class="w-full h-fit px-10 py-5">
     <!-- TICKETS FILTERING BAR -->

osinaweb/templates/main.html

@@ -102,7 +102,8 @@
                         </a>
 
                         <a>
-                            <div class="w-full flex justify-start items-center gap-3 text-white border-b border-slate-600 py-2 text-[18px]">
+                            <div
+                                class="w-full flex justify-start items-center gap-3 text-white border-b border-slate-600 py-2 text-[18px]">
                                 <p class="text-white">My Tickets</p>
                             </div>
                         </a>
@@ -124,7 +125,7 @@
                         <i class="fa fa-angle-down" style="font-size: 25px; color: white;"></i>
                     </div>
                 </div>
- 
+
                 {% if user.is_superuser %}
                 <div class="w-full flex justify-between items-center border-b border-slate-600 py-3">
                     <div class="w-full flex justify-start items-center gap-3">
@@ -222,20 +223,20 @@
                     </div>
 
                     <div class="flex justify-start items-center gap-5">
-                        <div>
+                        <div id="statusContainer">
                             <p class="text-sm text-gray-500">Recent Status: <span
                                     class="text-slate-700 font-semibold">{{last_status.text}}</span></p>
-                                    <p class="text-sm text-gray-500">Last update: 
+                            <p class="text-sm text-gray-500">Last update:
-                                    {% if last_status.date == current_date %}
+                                {% if last_status.date == current_date %}
-                                      Today | {{last_status.time}}, 
+                                Today | {{last_status.time}},
-                                      {% if minutes_ago == 0 %} 
+                                {% if minutes_ago == 0 %}
-                                        Just Now 
+                                Just Now
-                                      {%else%}  
+                                {%else%}
-                                        {{hours_minutes_ago}} 
+                                {{hours_minutes_ago}}
-                                      {%endif%} 
+                                {%endif%}
-                                    {% else %}
+                                {% else %}
-                                     {{last_status.date}} | {{last_status.time}}
+                                {{last_status.date}} | {{last_status.time}}
-                                    {%endif %}</p>
+                                {%endif %}</p>
                         </div>
                         <button
                             class="w-[30px] h-[30px] rounded-full p-2 bg-gray-300 text-white text-[18px] outline-none border-none cursor-pointer flex justify-center items-center shadow-md addStatusButton"
@@ -338,6 +339,9 @@
             <!-- SIDE BAR SCRIPT -->
             <script type="text/javascript" src='{% static "js/side-bar.js" %}'></script>
 
+            <!-- TO RELOAD THE USERS ACTIVITY CONTAINER -->
+            <script type="text/javascript" src='{% static "js/reload-script.js" %}'></script>
+
 </body>
 
 </html>