feat(attachments): 新增附件管理页面

2026-06-06 22:45:48 +08:00
parent 0fca20756b
commit df3f393dd2
7 changed files with 660 additions and 6 deletions
--- a/static/js/attachment_manager.js
+++ b/static/js/attachment_manager.js
@@ -0,0 +1,147 @@
+(function () {
+  var page = document.querySelector(".attachment-manager-page");
+  if (!page) {
+    return;
+  }
+
+  var conversationSelect = document.getElementById("attachmentConversationSelect");
+  var uploadDropzone = document.getElementById("managerUploadDropzone");
+  var attachmentInput = document.getElementById("managerAttachmentInput");
+  var uploadStatus = document.getElementById("managerUploadStatus");
+  var searchInput = document.getElementById("attachmentSearch");
+  var table = document.getElementById("attachmentManagerTable");
+
+  function csrfToken() {
+    var cookie = document.cookie.split("; ").find(function (item) {
+      return item.indexOf("csrftoken=") === 0;
+    });
+    return cookie ? decodeURIComponent(cookie.split("=")[1]) : "";
+  }
+
+  function selectedConversationUrl(id) {
+    return id ? "/attachments/?conversation=" + encodeURIComponent(id) : "/attachments/";
+  }
+
+  async function patchAttachment(row, payload) {
+    var response = await fetch(row.getAttribute("data-update-url"), {
+      method: "PATCH",
+      headers: {
+        "Content-Type": "application/json",
+        "X-CSRFToken": csrfToken(),
+      },
+      body: JSON.stringify(payload),
+    });
+    if (!response.ok) {
+      throw new Error("附件更新失败。");
+    }
+    return response.json();
+  }
+
+  async function deleteAttachment(row) {
+    var response = await fetch(row.getAttribute("data-update-url"), {
+      method: "DELETE",
+      headers: { "X-CSRFToken": csrfToken() },
+    });
+    if (!response.ok) {
+      throw new Error("附件删除失败。");
+    }
+  }
+
+  async function uploadFiles(files) {
+    if (!uploadDropzone || !files || !files.length) {
+      return;
+    }
+    var formData = new FormData();
+    Array.prototype.forEach.call(files, function (file) {
+      formData.append("files", file);
+    });
+    if (uploadStatus) {
+      uploadStatus.textContent = "上传中...";
+    }
+    try {
+      var response = await fetch(uploadDropzone.getAttribute("data-upload-url"), {
+        method: "POST",
+        headers: { "X-CSRFToken": csrfToken() },
+        body: formData,
+      });
+      if (!response.ok) {
+        throw new Error("上传失败。");
+      }
+      window.location.reload();
+    } catch (error) {
+      if (uploadStatus) {
+        uploadStatus.textContent = "上传失败，请重试。";
+      }
+    }
+  }
+
+  if (conversationSelect) {
+    conversationSelect.addEventListener("change", function () {
+      window.location.href = selectedConversationUrl(conversationSelect.value);
+    });
+  }
+
+  if (uploadDropzone && attachmentInput) {
+    uploadDropzone.addEventListener("click", function () {
+      attachmentInput.click();
+    });
+    uploadDropzone.addEventListener("dragover", function (event) {
+      event.preventDefault();
+      uploadDropzone.classList.add("dragging");
+    });
+    uploadDropzone.addEventListener("dragleave", function () {
+      uploadDropzone.classList.remove("dragging");
+    });
+    uploadDropzone.addEventListener("drop", function (event) {
+      event.preventDefault();
+      uploadDropzone.classList.remove("dragging");
+      uploadFiles(event.dataTransfer.files);
+    });
+    attachmentInput.addEventListener("change", function () {
+      uploadFiles(attachmentInput.files);
+      attachmentInput.value = "";
+    });
+  }
+
+  if (searchInput && table) {
+    searchInput.addEventListener("input", function () {
+      var keyword = searchInput.value.trim().toLowerCase();
+      table.querySelectorAll("tbody tr[data-attachment-id]").forEach(function (row) {
+        var name = (row.querySelector(".attachment-name") || row).textContent.toLowerCase();
+        row.hidden = keyword && name.indexOf(keyword) === -1;
+      });
+    });
+  }
+
+  if (table) {
+    table.addEventListener("click", async function (event) {
+      var actionButton = event.target.closest("[data-attachment-action]");
+      if (!actionButton) {
+        return;
+      }
+      var row = actionButton.closest("tr[data-attachment-id]");
+      if (!row) {
+        return;
+      }
+      var action = actionButton.getAttribute("data-attachment-action");
+      try {
+        if (action === "edit") {
+          var nameCell = row.querySelector(".attachment-name");
+          var nextName = window.prompt("请输入新的附件展示名", nameCell ? nameCell.textContent.trim() : "");
+          if (nextName) {
+            await patchAttachment(row, { original_name: nextName });
+            window.location.reload();
+          }
+        } else if (action === "toggle") {
+          await patchAttachment(row, { is_active: actionButton.textContent.trim() === "启用" });
+          window.location.reload();
+        } else if (action === "delete" && window.confirm("确认删除该附件？")) {
+          await deleteAttachment(row);
+          window.location.reload();
+        }
+      } catch (error) {
+        window.alert(error.message || "附件操作失败。");
+      }
+    });
+  }
+})();