deleting documents, bug fixes

2024-01-28 20:49:58 +03:00
parent d4592ac250
commit 0b1d5e8b79
6 changed files with 117 additions and 32 deletions
--- a/static/scripts/documents-table.js
+++ b/static/scripts/documents-table.js
@@ -7,15 +7,16 @@ $(document).ready(function () {

    documents.forEach((doc) => {
      const row = document.createElement("tr");
-      row.setAttribute(
-        "onclick",
-        `window.open('` + API_SERVER + `/` + doc.path + `', '_blank')`
-      );

      const data = document.createElement("td");

      const rowContainer = document.createElement("div");
-      rowContainer.setAttribute("class", "row-container");
+      rowContainer.setAttribute("class", "row-container with-button");
+
+      rowContainer.setAttribute(
+        "onclick",
+        `window.open('` + API_SERVER + `/` + doc.path + `', '_blank')`
+      );

      const rowIcon = document.createElement("div");
      rowIcon.setAttribute("class", "row-icon");
@@ -62,6 +63,7 @@ $(document).ready(function () {

      const documentName = document.createElement("h1");
      documentName.textContent = doc.name;
+      documentName.setAttribute("id", `doc-name-${doc.id}`);
      rowContent.appendChild(documentName);

      const documentType = document.createElement("h2");
@@ -74,27 +76,31 @@ $(document).ready(function () {

      rowContainer.appendChild(rowContent);

-      //   const deleteIcon = document.createElement("div");
-      //   deleteIcon.setAttribute("class", "row-delete-icon");
-
-      //   let deleteContent = `
-      //   <svg xmlns="http://www.w3.org/2000/svg" width="21" height="25" viewBox="0 0 21 25" fill="none">
-      //   <g clip-path="url(#clip0_369_11)">
-      //     <path d="M6.98543 19.8025C7.38047 19.8025 7.64032 19.553 7.62993 19.1892L7.3077 8.06653C7.29731 7.7027 7.03742 7.46362 6.6632 7.46362C6.2682 7.46362 6.00831 7.71309 6.0187 8.07692L6.33058 19.1892C6.34097 19.5634 6.60082 19.8025 6.98543 19.8025ZM10.0624 19.8025C10.4574 19.8025 10.738 19.553 10.738 19.1892V8.07692C10.738 7.71309 10.4574 7.46362 10.0624 7.46362C9.66737 7.46362 9.39709 7.71309 9.39709 8.07692V19.1892C9.39709 19.553 9.66737 19.8025 10.0624 19.8025ZM13.1497 19.8025C13.5239 19.8025 13.7838 19.5634 13.7942 19.1892L14.106 8.07692C14.1164 7.71309 13.8565 7.46362 13.4615 7.46362C13.0873 7.46362 12.8275 7.7027 12.817 8.07692L12.5052 19.1892C12.4948 19.553 12.7547 19.8025 13.1497 19.8025ZM5.49895 4.75051H7.15178V2.52599C7.15178 1.93347 7.56755 1.54886 8.19128 1.54886H11.9127C12.5364 1.54886 12.9522 1.93347 12.9522 2.52599V4.75051H14.605V2.42204C14.605 0.914762 13.6278 0 12.027 0H8.07692C6.47611 0 5.49895 0.914762 5.49895 2.42204V4.75051ZM0.779624 5.58214H19.3555C19.7817 5.58214 20.1247 5.21831 20.1247 4.79211C20.1247 4.3659 19.7817 4.01248 19.3555 4.01248H0.779624C0.363825 4.01248 0 4.3659 0 4.79211C0 5.2287 0.363825 5.58214 0.779624 5.58214ZM5.30147 23.1497H14.8337C16.3202 23.1497 17.3181 22.183 17.3908 20.6965L18.1185 5.38462H16.4449L15.7484 20.5198C15.7277 21.1435 15.2807 21.5801 14.6673 21.5801H5.447C4.85449 21.5801 4.4075 21.1331 4.37629 20.5198L3.63825 5.38462H2.00624L2.74428 20.7069C2.81705 22.1933 3.79418 23.1497 5.30147 23.1497Z" fill="#FF3B30" fill-opacity="0.85"/>
-      //   </g>
-      //   <defs>
-      //     <clipPath id="clip0_369_11">
-      //       <rect width="20.1247" height="25" fill="white"/>
-      //     </clipPath>
-      //   </defs>
-      // </svg>
-      //     `;
-
-      //   deleteIcon.innerHTML = deleteContent;
-
-      //   rowContainer.appendChild(deleteIcon);
-
      data.appendChild(rowContainer);
+
+      if (isAdmin && isFull) {
+        const deleteContainer = document.createElement("div");
+        deleteContainer.setAttribute("class", "row-delete-container");
+        deleteContainer.setAttribute("onclick", `deleteDoc(${doc.id});`);
+
+        let deleteContent = `
+        <svg xmlns="http://www.w3.org/2000/svg" width="21" height="25" viewBox="0 0 21 25" fill="none">
+        <g clip-path="url(#clip0_369_11)">
+          <path d="M6.98543 19.8025C7.38047 19.8025 7.64032 19.553 7.62993 19.1892L7.3077 8.06653C7.29731 7.7027 7.03742 7.46362 6.6632 7.46362C6.2682 7.46362 6.00831 7.71309 6.0187 8.07692L6.33058 19.1892C6.34097 19.5634 6.60082 19.8025 6.98543 19.8025ZM10.0624 19.8025C10.4574 19.8025 10.738 19.553 10.738 19.1892V8.07692C10.738 7.71309 10.4574 7.46362 10.0624 7.46362C9.66737 7.46362 9.39709 7.71309 9.39709 8.07692V19.1892C9.39709 19.553 9.66737 19.8025 10.0624 19.8025ZM13.1497 19.8025C13.5239 19.8025 13.7838 19.5634 13.7942 19.1892L14.106 8.07692C14.1164 7.71309 13.8565 7.46362 13.4615 7.46362C13.0873 7.46362 12.8275 7.7027 12.817 8.07692L12.5052 19.1892C12.4948 19.553 12.7547 19.8025 13.1497 19.8025ZM5.49895 4.75051H7.15178V2.52599C7.15178 1.93347 7.56755 1.54886 8.19128 1.54886H11.9127C12.5364 1.54886 12.9522 1.93347 12.9522 2.52599V4.75051H14.605V2.42204C14.605 0.914762 13.6278 0 12.027 0H8.07692C6.47611 0 5.49895 0.914762 5.49895 2.42204V4.75051ZM0.779624 5.58214H19.3555C19.7817 5.58214 20.1247 5.21831 20.1247 4.79211C20.1247 4.3659 19.7817 4.01248 19.3555 4.01248H0.779624C0.363825 4.01248 0 4.3659 0 4.79211C0 5.2287 0.363825 5.58214 0.779624 5.58214ZM5.30147 23.1497H14.8337C16.3202 23.1497 17.3181 22.183 17.3908 20.6965L18.1185 5.38462H16.4449L15.7484 20.5198C15.7277 21.1435 15.2807 21.5801 14.6673 21.5801H5.447C4.85449 21.5801 4.4075 21.1331 4.37629 20.5198L3.63825 5.38462H2.00624L2.74428 20.7069C2.81705 22.1933 3.79418 23.1497 5.30147 23.1497Z" fill="#FF3B30" fill-opacity="0.85"/>
+        </g>
+        <defs>
+          <clipPath id="clip0_369_11">
+            <rect width="20.1247" height="25" fill="white"/>
+          </clipPath>
+        </defs>
+      </svg>
+          `;
+
+        deleteContainer.innerHTML = deleteContent;
+
+        data.appendChild(deleteContainer);
+      }
+
      row.appendChild(data);
      tbody.appendChild(row);
    });
--- a/static/styles/main.css
+++ b/static/styles/main.css
@@ -1461,21 +1461,47 @@ input::placeholder {
  border-radius: 8px;
 }

-.project-content td,
-.progress-content td {
+.project-content td .row-container,
+.progress-content td .row-container {
  border-radius: 8px;
  cursor: pointer;
  padding: 0 10px;
 }

-.project-content td:hover,
-.progress-content td:hover {
+.progress-content td {
+  display: flex;
+  flex-direction: row;
+  flex-grow: 1;
+  flex-shrink: 1;
+}
+
+.project-content td .row-container:hover,
+.progress-content td .row-container:hover {
+  background: rgba(232, 232, 237, 0.8);
+}
+
+.row-delete-container {
+  margin: auto 10px;
+  padding: 9px;
+  border-radius: 5px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  align-content: center;
+  justify-items: center;
+  transition: 0.3s;
+  cursor: pointer;
+}
+
+.row-delete-container:hover {
  background: rgba(232, 232, 237, 0.8);
 }

 .project-content .row-container,
 .progress-content .row-container {
  display: flex;
+  width: 100%;
+  box-sizing: border-box;
 }

 .project-content .row-icon,
--- a/static/templates/project/documents.html
+++ b/static/templates/project/documents.html
@@ -27,6 +27,8 @@
            },
            {{/each}}
        ];
+        const isAdmin = {{IsAdmin}};
+        const isFull = true;
  </script>
  <script src="../../scripts/projects.js"></script>
  <script src="../../scripts/documents-table.js"></script>
@@ -231,6 +233,17 @@
  </div>
  </form>

+  {{#if IsAdmin}}
+  <div id="deletedocument-form-popup-bg" class="form-popup-bg not-main" >
+    <div class="form-container">
+        <img src="../../img/xmark.svg" id="btnCloseDeleteForm" class="close-button">
+        <h1>Вы уверены что хотите удалить документ <span style="display: inline; font-weight: bold;" id="deleteDocName"></span>?</h1>
+
+        <button type="button" class="form-button" onclick="confirmDelete();" id="deleteConfirm">Удалить документ</button>
+    </div>
+</div>
+  {{/if}}
+
  <script>
    document.addEventListener("DOMContentLoaded", function() {

@@ -411,6 +424,45 @@
        });
    });

+    {{#if IsAdmin}}
+
+    function deleteDoc(id) {
+              $("#deleteDocName").text($(`#doc-name-${id}`).text())
+              $('#deletedocument-form-popup-bg').addClass('is-visible');
+              $('#deleteConfirm').attr('onclick', `confirmDelete(${id})`);
+            }
+
+    $(document).ready(function($) {
+      
+            $('#deletedocument-form-popup-bg').on('click', function(event) {
+                if ($(event.target).is('#deletedocument-form-popup-bg') || $(event.target).is('#btnCloseDeleteForm')) {
+                event.preventDefault();
+                $(this).removeClass('is-visible');
+                }
+            });
+
+          });
+
+          function confirmDelete(id) {
+            $.ajax({
+              url: API_SERVER + "/document?id=" + id, 
+              method: "DELETE",
+              headers: {
+                  Authorization: getCookie("token"),
+                },
+              success: function(response) {
+                location.reload();
+                },
+                error: function() {
+                  alert("Произошла ошибка при запросе к серверу.");
+                }
+            });
+              
+            }
+
+      {{/if}}
+
+

            
    </script>
--- a/static/templates/project/project.html
+++ b/static/templates/project/project.html
@@ -12,6 +12,8 @@
  <script src="https://cdn.jsdelivr.net/npm/js-circle-progress/dist/circle-progress.min.js" type="module"></script>
  <script>
    const API_SERVER = "{{API_SERVER}}";
+    const isAdmin = {{IsAdmin}};
+    const isFull = false;
  </script>
  <script type="module">
    import { minidenticonSvg } from 'https://cdn.jsdelivr.net/npm/minidenticons@4.2.0/minidenticons.min.js'
@@ -304,7 +306,7 @@
                        </div>
                        <div class="header-name">
                            <h1>Оплата проекта</h1>
-                            <h2>последние 3 транзакции</h2>
+                            <h2>последние 2 транзакции</h2>
                        </div>
                    </div>

--- a/static/templates/project/settings/payment.html
+++ b/static/templates/project/settings/payment.html
@@ -458,7 +458,6 @@
      location.reload();
      },
      error: function() {
-        // Обработка ошибки при запросе к серверу
        alert("Произошла ошибка при запросе к серверу.");
      }
  });
--- a/static/templates/user/settings.html
+++ b/static/templates/user/settings.html
@@ -181,7 +181,7 @@
            <div class="setting-top">
              <h1>Пароль</h1>
              <h2>Если хотите изменить пароль, укажите новый ниже</h2>
-              <input oninput="handlePasswordChange(this)" id="password-input" type="password" required>
+              <input oninput="handlePasswordChange(this)" id="password-input" type="password" autocomplete="new-password" required>
            </div>
            <div class="setting-bottom">
              <h2>Используйте минимум 5 символов.</h2>