Modified: template structure add includes tmp

logs_collector/collector/models.py

@@ -83,7 +83,7 @@ class Ticket(models.Model):
     user = models.ForeignKey(User, on_delete=models.CASCADE)
 
     class Meta:
-        ordering = ['-time_update']
+        ordering = ['-time_create']
 
     def get_absolute_url(self):
         return reverse(

logs_collector/collector/static/collector/js/jq.ticket.detail.js

@@ -1,18 +1,19 @@
 $(function () {
     console.log("JQ is ready to work");
+
     // CSRF token:
     const CSRF = $("input[name=csrfmiddlewaretoken]").val()
-    // -- -- -- --
+    // -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
-    function deleteArchiveListElement(id) {
+
-        const archiveList = `#li-archive-${id}`
+    // delete one attachment
-        $(archiveList).hide(1500);
+    // -- -- -- -- -- -- --
-    };
     $(".btn-archive-eraser").click(function (e) { 
         e.preventDefault();
         const archiveListElement = $(this).attr("data-jq-archive-target");
+        const delUrl = $(this).attr("href");
         $.ajax({
             type: "delete",
-            url: $(this).attr("href"),
+            url: delUrl,
             headers: {
                 "X-CSRFToken":CSRF,
                 "Content-Type":"application/json"
@@ -22,30 +23,31 @@ $(function () {
             // },
             success: function (response) {
                 console.log(response.status);
-                deleteArchiveListElement(archiveListElement);
+                $(archiveListElement).hide(1500);
             },
             error: function (response) {
                 console.log(response.status);
             }
         });
     });
-    $("#ticket-state").click(function () { 
+    // change ticket state
+    // -- -- -- -- -- -- --
+    $("input[name=ticket-state]").click(function () { 
         console.log('Press');
         let resolved = false;
-        let ticket_state_url = $(this).attr("ticket-state-url")
+        let ticketStateUrl = $(this).attr("ticket-state-url")
         if ($(this).attr("ticket-state-switch") === "1") {
             console.log('Find it!!!')
             resolved = true;
             $(this).attr("ticket-state-switch", "0");  // disable
-
         } else {
             resolved = false;
             $(this).attr("ticket-state-switch", "1");  // enable
         }
         console.log(resolved)
         $.ajax({
-            type: "post",
+            type: "POST",
-            url: ticket_state_url,
+            url: ticketStateUrl,
             headers: {
                 "X-CSRFToken":CSRF,
                 "Content-Type":"application/json"
@@ -63,23 +65,27 @@ $(function () {
             }
         });
     });
+    // delete ticket with attachments:
+    // -- -- -- -- -- -- -- -- -- -- --
     $(".btn-ticket-del").click(function (e) {
         e.preventDefault(); 
-        const del_url = $(this).attr("href")
+        const delUrl = $(this).attr("href")
-        const redirect_url = $(this).attr("data-jq-ticket-del-redirect")
+        const redirectUrl = $(this).attr("data-jq-ticket-del-redirect")
+        const elementTarget = $(this).attr("data-jq-ticket-del-target")
+        const delDiv = $(elementTarget)
         $.ajax({
             type: "DELETE",
-            url: del_url,
+            url: delUrl,
             headers: {
                 'X-CSRFToken':CSRF,
                 'Content-Type':'application/json'
             },
             success: function (response) {
                 console.log(response.status);
-                if (redirect_url) {
+                if (delDiv.length) {
-                    window.location.href = redirect_url;
+                    delDiv.hide(1500);
-                }else {
+                } else {
-                    console.log("Need delete ticket card");
+                    window.location.href = redirectUrl;
                 }
             },
             error: function (response) {

logs_collector/collector/templates/collector/base.html

@@ -34,14 +34,24 @@
       rel="stylesheet"
       href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css"
     >
-    <title>Document</title>
+    {% block title %}{% endblock title %}
   </head>
   <body>
+    <header>
+      <section>
+        {% include 'collector/includes/navigation.html' %}
+      </section>
+    </header>
     <main>
       <section>
-        {% block content %}{% endblock content %}
+        {% block main %}{% endblock main %}
       </section>
     </main>
+    <footer>
+      <section>
+        {% block footer %}{% endblock footer %}
+      </section>
+    </footer>
     <script src="{% static 'collector/js/bootstrap.bundle.min.js' %}"></script>
     <script src="{% static 'collector/js/bs.theme.mode.js' %}"></script>
     <script src="{% static 'collector/js/jquery-3.7.0.min.js' %}"></script>

logs_collector/collector/templates/collector/delete_ticket.html

@@ -1,7 +1,7 @@
 {% extends 'collector/base.html' %} 
 {% load static %} 
 {% block content %}
-{% include 'collector/navigation.html' %}
+{% include 'collector/includes/navbar.html' %}
 <div class="container mt-5">
   <div class="row">
     <form method="post" action="{% url 'delete' ticket.number %}">

logs_collector/collector/templates/collector/includes/modal_archive.html

@@ -0,0 +1,43 @@
+<div 
+  class="modal fade"
+  id="modal-archive-del-{{ archive.id }}"
+  tabindex="-1"
+  aria-labelledby="LabelArchive-{{ archive.id }}"
+  aria-hidden="true"
+>
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5
+          class="modal-title"
+          id="LabelArchive-{{ archive.id }}">Delete this file?
+        </h5>
+        <button
+          type="button"
+          class="btn-close"
+          data-bs-dismiss="modal"
+          aria-label="Close">
+        </button>
+      </div>
+      <div class="modal-body">
+        <p style="word-wrap: break-word">{{ archive.file }}</p>
+      </div>
+      <div class="modal-footer">
+        <button 
+          type="button"
+          class="btn btn-secondary"
+          data-bs-dismiss="modal"
+        >Cancel
+        </button>
+        <a
+          href="{% url 'collector:download' archive.file %}"
+          type="button"
+          class="btn btn-danger btn-archive-eraser"
+          data-bs-dismiss="modal"
+          data-jq-archive-target="#li-archive-{{ archive.id }}"
+        >Delete 
+        </a>
+      </div>
+    </div>
+  </div>
+</div>

logs_collector/collector/templates/collector/includes/modal_ticket.html

@@ -0,0 +1,40 @@
+<div
+  class="modal fade"
+  id="modal-ticket-del-{{ ticket.number }}"
+  tabindex="-1"
+  aria-labelledby="LabelTicket"
+  aria-hidden="true"
+>
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="LabelTicket">
+          Delete ticket #{{ ticket.number }} ?
+        </h5>
+        <button
+          type="button"
+          class="btn-close"
+          data-bs-dismiss="modal"
+          aria-label="Close"
+        ></button>
+      </div>
+      <div class="modal-body">
+        <p>Deleting a ticket will also permanently delete all files associated with it.</p>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
+          Cancel
+        </button>
+        <a
+          type="button"
+          href="{% url 'collector:ajax_delete_ticket' ticket.number %}"
+          class="btn btn-danger btn-ticket-del"
+          data-bs-dismiss="modal"
+          data-jq-ticket-del-target="#div-ticket-{{ ticket.number }}"
+          data-jq-ticket-del-redirect="{% url 'collector:tickets' %}"
+          >Delete</a
+        >
+      </div>
+    </div>
+  </div>
+</div>

logs_collector/collector/templates/collector/includes/navigation.html

@@ -0,0 +1,165 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="d-none">
+  <symbol id="check2" viewBox="0 0 16 16">
+    <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
+  </symbol>
+  <symbol id="circle-half" fill="currentColor" viewBox="0 0 16 16">
+    <path d="M8 15A7 7 0 1 0 8 1v14zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"/>
+  </symbol>
+  <symbol id="moon-stars-fill" fill="currentColor" viewBox="0 0 16 16">
+    <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z"/>
+    <path d="M10.794 3.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387a1.734 1.734 0 0 0-1.097 1.097l-.387 1.162a.217.217 0 0 1-.412 0l-.387-1.162A1.734 1.734 0 0 0 9.31 6.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387a1.734 1.734 0 0 0 1.097-1.097l.387-1.162zM13.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.617.732.732l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.156 1.156 0 0 0-.732.732l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.156 1.156 0 0 0-.732-.732l-.774-.258a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.386.732-.732L13.863.1z"/>
+  </symbol>
+  <symbol id="sun-fill" fill="currentColor" viewBox="0 0 16 16">
+    <path d="M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"/>
+  </symbol>
+</svg>
+<nav class="navbar navbar-expand-lg bg-body-tertiary">
+  <div class="container">
+    <a 
+      class="navbar-brand" 
+      href="{% url 'collector:index' %}">Logs Collector <i class="bi bi-file-earmark-zip-fill"></i>
+    </a>
+    <button
+      class="navbar-toggler"
+      type="button"
+      data-bs-toggle="collapse"
+      data-bs-target="#navbarSupportedContent"
+      aria-controls="navbarSupportedContent"
+      aria-expanded="false"
+      aria-label="Переключатель навигации"
+    >
+      <span class="navbar-toggler-icon"></span>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">   
+      <ul class="navbar-nav ml-auto mb-2 mb-lg-0 me-md-auto">
+        <li class="nav-item dropdown">
+          <button
+            class="nav-link dropdown-toggle"
+            role="button"
+            data-bs-toggle="dropdown"
+            aria-expanded="false"
+            >Tickets</button>
+          <ul class="dropdown-menu">
+            {% for platform in platforms %}
+            <li>
+              <a
+                class="dropdown-item"
+                href="{{ platform.get_absolute_url }}"
+                >{{ platform.pretty_name}}
+              </a
+              >
+            </li>
+            {% endfor %}
+            <li><hr class="dropdown-divider" /></li>
+            <li><a class="dropdown-item" href="{% url 'collector:tickets' %}"><i class="bi bi-funnel"></i> Reset filter</a></li>
+          </ul>
+        </li>
+        <li class="nav-item"><a class="nav-link" aria-current="page" href="#"><i class="bi bi-pencil-square"></i> New</a></li>
+      </ul>
+      <!-- Search -->
+      <ul class="navbar-nav flex-row flex-wrap me-md-auto">
+        <li class="nav-item py-2 col-12 col-lg-auto">
+        <form class="d-flex" role="search">
+          <input
+            class="form-control me-2"
+            type="search"
+            placeholder="Search"
+            aria-label="Search"
+          />
+          <button class="btn btn-outline-success" type="submit"><i class="bi bi-search"></i></button>
+        </form>
+        </li>
+      </ul>
+      <!-- Right fields -->
+      <ul class="navbar-nav flex-row flex-wrap ms-md-auto">
+        <!-- User settings -->
+        {% if request.user.is_authenticated %}
+        <li class="nav-item py-2 py-lg-1 col-12 col-lg-auto">
+          <div class="btn-group">
+            <button type="button" class="btn btn-outline-secondary">
+              <i class="bi bi-person-square"></i> {{ request.user }}
+            </button>
+            <button 
+              type="button"
+              class="btn btn-outline-secondary dropdown-toggle dropdown-toggle-split"
+              data-bs-toggle="dropdown"
+              aria-expanded="false"
+            >
+              <span class="visually-hidden">Toggle Dropdown</span>
+            </button>
+            <ul class="dropdown-menu dropdown-menu-end">
+              {% if request.user.is_staff %}
+              <li>
+                <a class="dropdown-item" type="button" href="{% url 'admin:index' %}"
+                ><i class="bi bi-shield-shaded"></i></i> Admin</a>
+              </li>
+              {% endif %}
+              <li><button class="dropdown-item" type="button"><i class="bi bi-gear"></i> Settings</button></li>
+              <li><hr class="dropdown-divider" /></li>
+              <li><button class="dropdown-item" type="button"><i class="bi bi-door-closed"></i> Logout</button></li>           
+            </ul>
+          </div>              
+        </li>
+        {% else %}
+        <li class="nav-item py-2 py-lg-1 col-12 col-lg-auto">
+          <div class="btn-group">
+            <a
+              type="button"
+              href="{% url 'admin:index' %}"
+              class="btn btn-outline-secondary"
+            >
+              <i class="bi bi-box-arrow-in-right"></i></i> Login
+            </a>
+          </div>              
+        </li>    
+        {% endif %}
+        <!-- Separator -->
+        <li class="nav-item py-2 py-lg-1 col-12 col-lg-auto">
+          <div class="vr d-none d-lg-flex h-100 mx-lg-2 text-white"></div>
+          <hr class="d-lg-none my-2 text-white-50">
+        </li>
+        <!-- Theme switcher-->
+        <li class="nav-item dropdown">
+          <div class="dropdown bd-mode-toggle">
+            <button class="btn btn-bd-primary py-2 dropdown-toggle d-flex align-items-center"
+                    id="bd-theme"
+                    type="button"
+                    aria-expanded="false"
+                    data-bs-toggle="dropdown"
+                    aria-label="Toggle theme (auto)">
+              <svg class="bi my-1 theme-icon-active" width="1em" height="1em"><use href="#circle-half"></use></svg>
+              <span class="visually-hidden" id="bd-theme-text">Toggle theme</span>
+            </button>
+            <ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="bd-theme-text">
+              <li>
+                <button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="light" aria-pressed="false">
+                  <svg class="bi me-2 opacity-50 theme-icon" width="1em" height="1em"><use href="#sun-fill"></use></svg>
+                  Light
+                  <svg class="bi ms-auto d-none" width="1em" height="1em"><use href="#check2"></use></svg>
+                </button>
+              </li>
+              <li>
+                <button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="dark" aria-pressed="false">
+                  <svg class="bi me-2 opacity-50 theme-icon" width="1em" height="1em"><use href="#moon-stars-fill"></use></svg>
+                  Dark
+                  <svg class="bi ms-auto d-none" width="1em" height="1em"><use href="#check2"></use></svg>
+                </button>
+              </li>
+              <li>
+                <button
+                  type="button"
+                  class="dropdown-item d-flex align-items-center active"
+                  data-bs-theme-value="auto" aria-pressed="true"
+                >
+                  <svg class="bi me-2 opacity-50 theme-icon" width="1em" height="1em"><use href="#circle-half"></use></svg>
+                  Auto
+                  <svg class="bi ms-auto d-none" width="1em" height="1em"><use href="#check2"></use></svg>
+                </button>
+              </li>
+            </ul>
+          </div>
+        </li>
+      </ul>
+    </div>
+  </div>
+</nav>

logs_collector/collector/templates/collector/includes/pagination.html

@@ -0,0 +1,41 @@
+{% if page_obj.has_other_pages %}
+  <div class="row">
+    <nav class="d-flex justify-content-center mt-3" aria-label="...">
+      <ul class="pagination">
+        {% if page_obj.has_previous %}
+          <li class="page-item">
+            <a 
+              class="page-link"
+              href="?page={{ page_obj.previous_page_number }}"
+            >Back
+          </a>
+          </li>
+        {% else %}
+          <li class="page-item disabled"><a class="page-link">Back</a></li>
+        {% endif %}
+        {% for page in paginator.page_range %}
+          {% if page_obj.number == page %}
+            <li class="page-item active" aria-current="page">
+              <button class="page-link">{{ page }}</button>
+            </li>
+          {% elif page >= page_obj.number|add:-2 and page <= page_obj.number|add:2%}
+          <li class="page-item">
+            <a class="page-link" href="?page={{ page }}">{{ page }}</a>
+          </li>
+          {% endif %}
+        {% endfor %}
+        {% if page_obj.has_next %}
+          <li class="page-item">
+            <a 
+              class="page-link"
+              href="?page={{ page_obj.next_page_number }}"
+            >Next
+            </a>
+          </li>
+        {% else %}
+          <li class="page-item disabled"><a class="page-link">Next</a></li>
+        {% endif %}
+      </ul>
+    </nav>
+  </div>
+{% endif %}

logs_collector/collector/templates/collector/includes/ticket_archives.html

@@ -0,0 +1,37 @@
+<li 
+  id="li-archive-{{ archive.id }}"
+  class="list-group-item list-group-item-action">
+  <smal>
+    <b>File:</b>
+    <span style="word-wrap: break-word">{{ archive.file }}</span>
+  </small>
+  <small>
+    <br>
+    <b>SHA1:</b>
+    <span style="word-wrap: break-word">{{ archive.sha1 }}</span>
+  </small>
+  <small>
+    <br>
+    <b>Uploaded:</b>
+    <span style="word-wrap: break-word">{{ archive.time_update }}</span>
+  </small>
+    <br>
+  <small>
+    <b>Size:</b>
+    <span style="word-wrap: break-word">{{ archive.size }}</span>
+  </small>
+  <div class="row">
+    <div class="d-flex justify-content-sm-start justify-content-between" >
+      <a
+        class="btn btn-outline-success btn-sm mt-2"
+        href="{{ archive.get_absolute_url }}"
+      ><i class="bi bi-download"></i> GET</a>
+      <button
+        button type="button"
+        class="btn btn-outline-danger btn-sm ms-2 mt-2"
+        data-bs-toggle="modal"
+        data-bs-target="#modal-archive-del-{{ archive.id }}"
+      ><i class="bi bi-trash"></i> DEL</button>
+    </div>
+  </div>
+</li>

logs_collector/collector/templates/collector/includes/ticket_info.html

@@ -0,0 +1,19 @@
+<div class="d-sm-flex w-100 justify-content-between mb-2">
+  <h4 class="card-title mb-1">Ticket: {{ ticket.number }}</h4>
+  <small><i class="bi bi-clock-history"></i> {{ ticket.time_create }}</small>
+</div>
+<div class="form-check form-switch form-check-reverse d-flex w-100 justify-content-left">
+  <label class="form-check-label" for="ticket-state">Resolved:</label>
+  <input 
+    class="form-check-input ms-2 mb-2"
+    type="checkbox"
+    role="switch"
+    name="ticket-state"
+    ticket-state-url="{% url 'collector:ajax_update_state_ticket' ticket.platform ticket.number %}"
+    {% if ticket.resolved %} ticket-state-switch="1" {% endif %}
+    {% if ticket.resolved %} checked {% endif %}>
+</div>
+<div class="col-xl-6 mb-2">
+  <h6 class="card-title mb-1">Platform: {{ ticket.platform.pretty_name }}</h6>
+  <h6 class="card-title mb-3">Owner: {{ ticket.user.username }}</h6>
+</div>

logs_collector/collector/templates/collector/navigation.html

@@ -1,163 +0,0 @@
-<header>
-  <section>
-    <svg xmlns="http://www.w3.org/2000/svg" class="d-none">
-      <symbol id="check2" viewBox="0 0 16 16">
-        <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
-      </symbol>
-      <symbol id="circle-half" fill="currentColor" viewBox="0 0 16 16">
-        <path d="M8 15A7 7 0 1 0 8 1v14zm0 1A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"/>
-      </symbol>
-      <symbol id="moon-stars-fill" fill="currentColor" viewBox="0 0 16 16">
-        <path d="M6 .278a.768.768 0 0 1 .08.858 7.208 7.208 0 0 0-.878 3.46c0 4.021 3.278 7.277 7.318 7.277.527 0 1.04-.055 1.533-.16a.787.787 0 0 1 .81.316.733.733 0 0 1-.031.893A8.349 8.349 0 0 1 8.344 16C3.734 16 0 12.286 0 7.71 0 4.266 2.114 1.312 5.124.06A.752.752 0 0 1 6 .278z"/>
-        <path d="M10.794 3.148a.217.217 0 0 1 .412 0l.387 1.162c.173.518.579.924 1.097 1.097l1.162.387a.217.217 0 0 1 0 .412l-1.162.387a1.734 1.734 0 0 0-1.097 1.097l-.387 1.162a.217.217 0 0 1-.412 0l-.387-1.162A1.734 1.734 0 0 0 9.31 6.593l-1.162-.387a.217.217 0 0 1 0-.412l1.162-.387a1.734 1.734 0 0 0 1.097-1.097l.387-1.162zM13.863.099a.145.145 0 0 1 .274 0l.258.774c.115.346.386.617.732.732l.774.258a.145.145 0 0 1 0 .274l-.774.258a1.156 1.156 0 0 0-.732.732l-.258.774a.145.145 0 0 1-.274 0l-.258-.774a1.156 1.156 0 0 0-.732-.732l-.774-.258a.145.145 0 0 1 0-.274l.774-.258c.346-.115.617-.386.732-.732L13.863.1z"/>
-      </symbol>
-      <symbol id="sun-fill" fill="currentColor" viewBox="0 0 16 16">
-        <path d="M8 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zM8 0a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 0zm0 13a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-1 0v-2A.5.5 0 0 1 8 13zm8-5a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2a.5.5 0 0 1 .5.5zM3 8a.5.5 0 0 1-.5.5h-2a.5.5 0 0 1 0-1h2A.5.5 0 0 1 3 8zm10.657-5.657a.5.5 0 0 1 0 .707l-1.414 1.415a.5.5 0 1 1-.707-.708l1.414-1.414a.5.5 0 0 1 .707 0zm-9.193 9.193a.5.5 0 0 1 0 .707L3.05 13.657a.5.5 0 0 1-.707-.707l1.414-1.414a.5.5 0 0 1 .707 0zm9.193 2.121a.5.5 0 0 1-.707 0l-1.414-1.414a.5.5 0 0 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .707zM4.464 4.465a.5.5 0 0 1-.707 0L2.343 3.05a.5.5 0 1 1 .707-.707l1.414 1.414a.5.5 0 0 1 0 .708z"/>
-      </symbol>
-    </svg>
-    <nav class="navbar navbar-expand-lg bg-body-tertiary">
-      <div class="container">
-        <a class="navbar-brand" href="{% url 'collector:index' %}">Logs Collector <i class="bi bi-file-earmark-zip-fill"></i></a>
-        <button
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbarSupportedContent"
-          aria-controls="navbarSupportedContent"
-          aria-expanded="false"
-          aria-label="Переключатель навигации"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbarSupportedContent">   
-          <ul class="navbar-nav ml-auto mb-2 mb-lg-0">
-            <li class="nav-item dropdown">
-              <button
-                class="nav-link dropdown-toggle"
-                role="button"
-                data-bs-toggle="dropdown"
-                aria-expanded="false"
-                >Tickets</button>
-              <ul class="dropdown-menu">
-                <li>
-                  <a class="dropdown-item" href="{% url 'collector:index' %}">All</a>
-                </li>
-                {% for platform in platforms %}
-                <li>
-                  <a
-                    class="dropdown-item"
-                    href="{{ platform.get_absolute_url }}"
-                    >{{ platform.pretty_name}}</a
-                  >
-                </li>
-                {% endfor %}
-                <li><hr class="dropdown-divider" /></li>
-                <li><a class="dropdown-item" href="#"><i class="bi bi-pencil-square"></i> Create ticket</a></li>
-              </ul>
-            </li>
-          </ul>
-          <!-- Search -->
-          <ul class="navbar-nav flex-row flex-wrap ms-md-auto">
-            <li class="nav-item py-2 col-12 col-lg-auto">
-            <form class="d-flex" role="search">
-              <input
-                class="form-control me-2"
-                type="search"
-                placeholder="Search"
-                aria-label="Search"
-              />
-              <button class="btn btn-outline-success" type="submit"><i class="bi bi-search"></i></button>
-            </form>
-            </li>
-          </ul>
-          <!-- Right fields -->
-          <ul class="navbar-nav flex-row flex-wrap ms-md-auto">
-            <!-- User settings -->
-            {% if request.user.is_authenticated %}
-            <li class="nav-item py-2 py-lg-1 col-12 col-lg-auto">
-              <div class="btn-group">
-                <button type="button" class="btn btn-outline-secondary">
-                  <i class="bi bi-person-square"></i> {{ request.user }}
-                </button>
-                <button 
-                  type="button"
-                  class="btn btn-outline-secondary dropdown-toggle dropdown-toggle-split"
-                  data-bs-toggle="dropdown"
-                  aria-expanded="false"
-                >
-                  <span class="visually-hidden">Toggle Dropdown</span>
-                </button>
-                <ul class="dropdown-menu dropdown-menu-end">
-                  {% if request.user.is_staff %}
-                  <li>
-                    <a class="dropdown-item" type="button" href="{% url 'admin:index' %}"
-                    ><i class="bi bi-shield-shaded"></i></i> Admin</a>
-                  </li>
-                  {% endif %}
-                  <li><button class="dropdown-item" type="button"><i class="bi bi-gear"></i> Settings</button></li>
-                  <li><hr class="dropdown-divider" /></li>
-                  <li><button class="dropdown-item" type="button"><i class="bi bi-door-closed"></i> Logout</button></li>           
-                </ul>
-              </div>              
-            </li>
-            {% else %}
-            <li class="nav-item py-2 py-lg-1 col-12 col-lg-auto">
-              <div class="btn-group">
-                <a
-                  type="button"
-                  href="{% url 'admin:index' %}"
-                  class="btn btn-outline-secondary"
-                >
-                  <i class="bi bi-box-arrow-in-right"></i></i> Login
-                </a>
-              </div>              
-            </li>    
-            {% endif %}
-            <!-- Separator -->
-            <li class="nav-item py-2 py-lg-1 col-12 col-lg-auto">
-              <div class="vr d-none d-lg-flex h-100 mx-lg-2 text-white"></div>
-              <hr class="d-lg-none my-2 text-white-50">
-            </li>
-            <!-- Theme switcher-->
-            <li class="nav-item dropdown">
-              <div class="dropdown bd-mode-toggle">
-                <button class="btn btn-bd-primary py-2 dropdown-toggle d-flex align-items-center"
-                        id="bd-theme"
-                        type="button"
-                        aria-expanded="false"
-                        data-bs-toggle="dropdown"
-                        aria-label="Toggle theme (auto)">
-                  <svg class="bi my-1 theme-icon-active" width="1em" height="1em"><use href="#circle-half"></use></svg>
-                  <span class="visually-hidden" id="bd-theme-text">Toggle theme</span>
-                </button>
-                <ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="bd-theme-text">
-                  <li>
-                    <button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="light" aria-pressed="false">
-                      <svg class="bi me-2 opacity-50 theme-icon" width="1em" height="1em"><use href="#sun-fill"></use></svg>
-                      Light
-                      <svg class="bi ms-auto d-none" width="1em" height="1em"><use href="#check2"></use></svg>
-                    </button>
-                  </li>
-                  <li>
-                    <button type="button" class="dropdown-item d-flex align-items-center" data-bs-theme-value="dark" aria-pressed="false">
-                      <svg class="bi me-2 opacity-50 theme-icon" width="1em" height="1em"><use href="#moon-stars-fill"></use></svg>
-                      Dark
-                      <svg class="bi ms-auto d-none" width="1em" height="1em"><use href="#check2"></use></svg>
-                    </button>
-                  </li>
-                  <li>
-                    <button type="button" class="dropdown-item d-flex align-items-center active" data-bs-theme-value="auto" aria-pressed="true">
-                      <svg class="bi me-2 opacity-50 theme-icon" width="1em" height="1em"><use href="#circle-half"></use></svg>
-                      Auto
-                      <svg class="bi ms-auto d-none" width="1em" height="1em"><use href="#check2"></use></svg>
-                    </button>
-                  </li>
-                </ul>
-              </div>
-            </li>
-          </ul>
-        </div>
-      </div>
-    </nav>
-  </section>
-</header>

logs_collector/collector/templates/collector/pagination.html

@@ -1,37 +0,0 @@
-{% if page_obj.has_other_pages %}
-  <nav class="d-flex justify-content-center mt-3" aria-label="...">
-    <ul class="pagination">
-      {% if page_obj.has_previous %}
-        <li class="page-item">
-          <a 
-            class="page-link"
-            href="?page={{ page_obj.previous_page_number }}"
-          >Back</a>
-        </li>
-      {% else %}
-        <li class="page-item disabled"><a class="page-link">Back</a></li>
-      {% endif %}
-      {% for page in paginator.page_range %}
-        {% if page_obj.number == page %}
-          <li class="page-item active" aria-current="page">
-            <button class="page-link">{{ page }}</button>
-          </li>
-        {% elif page >= page_obj.number|add:-2 and page <= page_obj.number|add:2%}
-        <li class="page-item">
-          <a class="page-link" href="?page={{ page }}">{{ page }}</a>
-        </li>
-        {% endif %}
-      {% endfor %}
-      {% if page_obj.has_next %}
-        <li class="page-item">
-          <a 
-            class="page-link"
-            href="?page={{ page_obj.next_page_number }}"
-          >Next</a>
-        </li>
-      {% else %}
-        <li class="page-item disabled"><a class="page-link">Next</a></li>
-      {% endif %}
-    </ul>
-  </nav>
-{% endif %}

logs_collector/collector/templates/collector/ticket.html

@@ -1,175 +1,57 @@
 {% extends 'collector/base.html' %}
 {% load static %}
-{% block content %} 
+{% block title %}<title>Collector - {{ ticket.number }}</title>{% endblock title %}
-{% include 'collector/navigation.html' %}
+{% block main %} 
-<main>
+<div class="container mt-3">
-  <section>
+  <div class="row">
-    <div class="container mt-3">
+    {% csrf_token %}
-      <div class="row">
+    <div class="card">
-        {% csrf_token %}
+      <div class="card-body" aria-current="true">
-        <div class="card">
+          {% include 'collector/includes/ticket_info.html' %}
-          <div class="card-body" aria-current="true">
+        <div class="col-xl-6 mt-1 mb-2">
-            <div class="d-flex w-100 justify-content-between mb-2">
+          {% if ticket.note %}
-              <h4 class="card-title mb-1">Ticket: {{ ticket.number }}</h4>
+            <div class="card">
-              <small><i class="bi bi-clock-history"></i> {{ ticket.time_create }}</small>
+                <div class="card-header">
-            </div>
+                  Note:
-            <div class="form-check form-switch form-check-reverse d-flex w-100 justify-content-left">
+                </div>
-              <label class="form-check-label" for="ticket-state">Resolved:</label>
+                <div class="card-body">
-              <input 
+                  <p class="card-text">{{ ticket.note }}</p>
-                class="form-check-input ms-2 mb-2"
-                type="checkbox"
-                role="switch"
-                id="ticket-state"
-                ticket-state-url="{% url 'collector:ajax_update_state_ticket' ticket.platform ticket.number %}"
-                {% if ticket.resolved %} ticket-state-switch="1" {% endif %}
-                {% if ticket.resolved %} checked {% endif %}>
-            </div>
-            <div class="col-xl-6 mb-2">
-              <h6 class="card-title mb-1">Platform: {{ ticket.platform.pretty_name }}</h6>
-              <h6 class="card-title mb-3">Owner: {{ ticket.user.username }}</h6>
-            </div>          
-            <div class="col-xl-6 mt-1 mb-2">
-              {% if ticket.note %}
-                <div class="card">
-                    <div class="card-header">
-                      Note:
-                    </div>
-                    <div class="card-body">
-                      <p class="card-text">{{ ticket.note }}</p>
-                    </div>
                 </div>
-              {% endif %}
             </div>
-            <!-- Logs -->
+          {% endif %}
-            {% if ticket.archive_set.all %}
-                <ul class="list-group col-xl-6 mb-2 mt-2">
-                  {% for archive in ticket.archive_set.all %}
-                    <li 
-                      id="li-archive-{{ archive.id }}"
-                      class="list-group-item list-group-item-action">
-                      <smal>
-                        <b>File:</b>
-                        <span style="word-wrap: break-word">{{ archive.file }}</span>
-                      </small>
-                      <small>
-                        <br>
-                        <b>SHA1:</b>
-                        <span style="word-wrap: break-word">{{ archive.sha1 }}</span>
-                      </small>
-                      <small>
-                        <br>
-                        <b>Uploaded:</b>
-                        <span style="word-wrap: break-word">{{ archive.time_update }}</span>
-                      </small>
-                        <br>
-                      <small>
-                        <b>Size:</b>
-                        <span style="word-wrap: break-word">{{ archive.size }}</span>
-                      </small>
-                      <div class="row">
-                        <div class="col-xl-8" >
-                          <a
-                            class="btn btn-outline-success btn-sm mt-2"
-                            href="{{ archive.get_absolute_url }}"
-                          ><i class="bi bi-download"></i> GET</a>
-                          <button
-                            button type="button"
-                            class="btn btn-outline-danger btn-sm ms-2 mt-2"
-                            data-bs-toggle="modal"
-                            data-bs-target="#modal-archive-del-{{ archive.id }}"
-                          ><i class="bi bi-trash"></i> DEL</button>
-                        </div>
-                      </div>
-                    </li>
-                  {% endfor %}
-                  </ul>
-            {% endif %}
-            <!-- Card buttons -->
-            <div class="d-flex w-100 justify-content-between">
-              <a
-                href="/"
-                class="btn btn-outline-warning mb-1 mt-1"
-              ><i class="bi bi-pencil-square"></i> Edit</a>
-              <button
-                class="btn btn-outline-danger mb-1 mt-1"
-                data-bs-toggle="modal"
-                data-bs-target="#modal-ticket-del"
-              ><i class="bi bi-trash"></i> Delete
-            </button>
-            </div>
-          </div>
         </div>
-      </div>
+        <!-- Logs -->
-      <!-- Modal Archive -->
+        {% if ticket.archive_set.all %}
-      {% for archive in ticket.archive_set.all %}
+            <ul class="list-group col-xl-6 mb-2 mt-2">
-      <div 
+              {% for archive in ticket.archive_set.all %}
-        class="modal fade"
+                {% include 'collector/includes/ticket_archives.html' %}
-        id="modal-archive-del-{{ archive.id }}"
+              {% endfor %}
-        tabindex="-1"
+            </ul>
-        aria-labelledby="LabelArchive-{{ archive.id }}"
+        {% endif %}
-        aria-hidden="true"
+        <!-- Card buttons -->
-      >
+        <div class="d-flex w-100 justify-content-between">
-        <div class="modal-dialog">
+          <a
-          <div class="modal-content">
+            href="/"
-            <div class="modal-header">
+            class="btn btn-outline-warning mb-1 mt-1"
-              <h5 class="modal-title" id="LabelArchive-{{ archive.id }}">Delete this file?</h5>
+          ><i class="bi bi-pencil-square"></i> Edit</a>
-              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+          <button
-            </div>
+            class="btn btn-outline-danger mb-1 mt-1"
-            <div class="modal-body">
+            data-bs-toggle="modal"
-              <p style="word-wrap: break-word">{{ archive.file }}</p>
+            data-bs-target="#modal-ticket-del-{{ ticket.number }}"
-            </div>
+          ><i class="bi bi-trash"></i> Delete
-            <div class="modal-footer">
+        </button>
-              <button 
-                type="button"
-                class="btn btn-secondary"
-                data-bs-dismiss="modal"
-              >Cancel
-              </button>
-              <a
-                href="{% url 'collector:download' archive.file %}"
-                type="button"
-                class="btn btn-danger btn-archive-eraser"
-                data-bs-dismiss="modal"
-                data-jq-archive-target="{{ archive.id }}"
-              >Delete 
-              </a>
-            </div>
-          </div>
-        </div>
-      </div>
-      {% endfor %}
-      <!-- Modal Ticket -->
-      <div class="modal fade" id="modal-ticket-del" tabindex="-1" aria-labelledby="LabelTicket" aria-hidden="true">
-        <div class="modal-dialog">
-          <div class="modal-content">
-            <div class="modal-header">
-              <h5 class="modal-title" id="LabelTicket">Delete ticket #{{ ticket.number }} ?</h5>
-              <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
-            </div>
-            <div class="modal-body">
-              <p>Deleting a ticket will also permanently delete all files associated with it.</p>
-            </div>
-            <div class="modal-footer">
-                <button 
-                type="button"
-                class="btn btn-secondary"
-                data-bs-dismiss="modal"
-                >Cancel</button>
-                <a
-                  type="button"
-                  href="{% url 'collector:ajax_delete_ticket' ticket.number %}"
-                  class="btn btn-danger btn-ticket-del"
-                  data-bs-dismiss="modal"
-                  data-jq-ticket-del-redirect="{% url 'collector:tickets' %}"
-                >Delete</a>
-            </div>
-          </div>
         </div>
       </div>
     </div>
-  </section>
+  </div>
-</main>
+  <!-- Modal Archive -->
-{% endblock content %}
+  {% for archive in ticket.archive_set.all %}
+    {% include 'collector/includes/modal_archive.html' %}
+  {% endfor %}
+  <!-- Modal Ticket -->
+  {% include 'collector/includes/modal_ticket.html' %}
+</div>
+{% endblock main %}
 {% block jquery %}
   <script src="{% static 'collector/js/jq.ticket.detail.js' %}"></script>
 {% endblock jquery %}

logs_collector/collector/templates/collector/tickets.html

@@ -1,24 +1,15 @@
 {% extends 'collector/base.html' %}
 {% load static %}
-{% block content %}
+{% block title %}<title>Collector</title>{% endblock title %}
-
+{% block main %}
-{% include 'collector/navigation.html' %}
-<!-- Tickets -->
 <div class="container mt-3">
+  {% csrf_token %}
+  <!-- Ticket -->
   {% for ticket in tickets %}
     <div class="row">
-      <!-- Ticket -->
+    <div id="div-ticket-{{ ticket.number }}" class="list-group mb-2">
-      <div class="list-group mb-2">
         <div class="list-group-item list-group-item-action disable" aria-current="true">
-          <div class="d-flex w-100 justify-content-between mb-2">
+          {% include 'collector/includes/ticket_info.html' %} 
-            <h5 class="mb-1">Ticket: {{ ticket.number }}</h5>
-            <small>{{ ticket.time_create }}</small>
-          </div>
-          <div class="col-xl-6 mb-2">
-            <!-- Info -->
-            <h6 class="mb-1">Platform: {{ ticket.platform.pretty_name }}</h6>
-            <h6 class="mb-1">Owner: {{ ticket.user.username }}</h6>
-          </div>   
           <div class="col-xl-6 mt-1 mb-2">
             <div class="accordion" id="#archive_{{ ticket.number }}">
               {% if ticket.note %}
@@ -60,18 +51,10 @@
                   data-bs-parent="#archive_{{ ticket.number }}"
                 >
                   <div class="accordion-body">
-                    <ul class="list-group mb-2">
+                    <ul class="list-group col mb-2 mt-2">
-                    {% for archive in ticket.archive_set.all %}
+                      {% for archive in ticket.archive_set.all %}
-                      <li class="list-group-item list-group-item-action">
+                        {% include 'collector/includes/ticket_archives.html' %}
-                        <a 
+                      {% endfor %}
-                          href="{{ archive.get_absolute_url }}"
-                          data-bs-toggle="tooltip"
-                          data-bs-placement="top" 
-                          data-bs-title="Size: {{ archive.size }}"
-                          style="word-wrap: break-word"
-                        >{{ archive.file }}</a>
-                      </li>
-                    {% endfor %}
                     </ul>
                   </div>
                 </div>
@@ -84,14 +67,29 @@
               href="{{ ticket.get_absolute_url }}"
               class="btn btn-outline-primary mb-1 mt-1"
             >Open</a>
+            <button
+              class="btn btn-outline-danger mb-1 mt-1"
+              data-bs-toggle="modal"
+              data-bs-target="#modal-ticket-del-{{ ticket.number }}"
+            ><i class="bi bi-trash"></i> Delete
+            </button>
           </div>
         </div>
       </div>
     </div>
+    <!-- Modal ticket -->
+    {% include 'collector/includes/modal_ticket.html' %}
+    <!-- Modal archive -->
+    {% for archive in ticket.archive_set.all %}
+      {% include 'collector/includes/modal_archive.html' %}
+    {% endfor %}
   {% endfor %}
-  {% include 'collector/pagination.html' %}
+  {% include 'collector/includes/pagination.html' %}
 </div>
-{% endblock content %}
+{% endblock main %}
 {% block bs %}
 <script src="{% static 'collector/js/bs.tooltip.js' %}"></script>
 {% endblock bs %}
+{% block jquery %}
+  <script src="{% static 'collector/js/jq.ticket.detail.js' %}"></script>
+{% endblock jquery %}