fix model del & rename

2026-07-31 11:26:38 +08:00
parent feaddfee7b
commit 46c69607c5
5 changed files with 134 additions and 25 deletions
@@ -96,6 +96,14 @@ const elements = {
  reviewTarget: document.querySelector("#review-target"),
  approveReview: document.querySelector("#approve-review"),
  rejectReview: document.querySelector("#reject-review"),
+  actionDialog: document.querySelector("#action-dialog"),
+  actionDialogForm: document.querySelector("#action-dialog-form"),
+  actionDialogTitle: document.querySelector("#action-dialog-title"),
+  actionDialogMessage: document.querySelector("#action-dialog-message"),
+  actionDialogInput: document.querySelector("#action-dialog-input"),
+  actionDialogError: document.querySelector("#action-dialog-error"),
+  actionDialogCancel: document.querySelector("#action-dialog-cancel"),
+  actionDialogConfirm: document.querySelector("#action-dialog-confirm"),
  lightbox: document.querySelector("#image-lightbox"),
  lightboxTitle: document.querySelector("#lightbox-title"),
  lightboxImage: document.querySelector("#lightbox-image"),
@@ -346,6 +354,65 @@ function showError(error) {
  elements.publishResult.dataset.tone = "error";
 }

+let actionDialogState = null;
+
+function closeActionDialog(value) {
+  if (!actionDialogState) return;
+  const { resolve, previousFocus } = actionDialogState;
+  actionDialogState = null;
+  elements.actionDialog.hidden = true;
+  elements.actionDialogForm.reset();
+  elements.actionDialogError.hidden = true;
+  previousFocus?.focus();
+  resolve(value);
+}
+
+function requestModelName({ title, message, value = "", confirmLabel = "确认", danger = false, expectedValue = null }) {
+  if (actionDialogState) closeActionDialog(null);
+  elements.actionDialogTitle.textContent = title;
+  elements.actionDialogMessage.textContent = message;
+  elements.actionDialogInput.value = value;
+  elements.actionDialogConfirm.textContent = confirmLabel;
+  elements.actionDialogConfirm.classList.toggle("primary", !danger);
+  elements.actionDialogConfirm.classList.toggle("danger", danger);
+  elements.actionDialogError.hidden = true;
+  elements.actionDialog.hidden = false;
+  const previousFocus = document.activeElement;
+  window.requestAnimationFrame(() => {
+    elements.actionDialogInput.focus();
+    elements.actionDialogInput.select();
+  });
+  return new Promise((resolve) => {
+    actionDialogState = { resolve, previousFocus, expectedValue };
+  });
+}
+
+elements.actionDialogForm.addEventListener("submit", (event) => {
+  event.preventDefault();
+  const value = elements.actionDialogInput.value.trim();
+  const expectedValue = actionDialogState?.expectedValue;
+  if (!value) {
+    elements.actionDialogError.textContent = "文件名不能为空";
+    elements.actionDialogError.hidden = false;
+    elements.actionDialogInput.focus();
+    return;
+  }
+  if (expectedValue !== null && value !== expectedValue) {
+    elements.actionDialogError.textContent = "文件名不匹配，请输入完整文件名";
+    elements.actionDialogError.hidden = false;
+    elements.actionDialogInput.focus();
+    return;
+  }
+  closeActionDialog(value);
+});
+elements.actionDialogCancel.addEventListener("click", () => closeActionDialog(null));
+elements.actionDialog.addEventListener("click", (event) => {
+  if (event.target === elements.actionDialog) closeActionDialog(null);
+});
+document.addEventListener("keydown", (event) => {
+  if (event.key === "Escape" && !elements.actionDialog.hidden) closeActionDialog(null);
+});
+
 function showImage(result) {
  if (!result) return;
  const mediaType = result.mediaType === "json" || result.fileName?.toLowerCase().endsWith(".json")
@@ -698,19 +765,24 @@ document.querySelector("#upload-model").addEventListener("click", async () => {
    state.models = models.fileList;
    const selected = await runBusy("正在选择模型文件", () => window.reinloop.chooseModelUploadFile());
    if (!selected) return;
-    const enteredModelName = window.prompt("请输入模型在服务器上的文件名：", selected.fileName);
-    if (enteredModelName === null) return;
-    const modelName = enteredModelName.trim();
-    if (!modelName) return showError(new Error("服务器文件名不能为空"));
+    const modelName = await requestModelName({
+      title: "设置服务器文件名",
+      message: `已选择 ${selected.fileName}。可在上传前修改模型在服务器上的文件名。`,
+      value: selected.fileName,
+      confirmLabel: "继续上传"
+    });
+    if (modelName === null) return;
    const existing = state.models.find((model) => model.fileName === modelName);
    let overwrite = false;
    if (existing) {
-      if (!window.confirm(`服务器已存在模型 ${modelName}，覆盖后无法恢复。是否继续？`)) return;
-      const confirmation = window.prompt(`请输入服务器文件名以确认覆盖：${modelName}`);
-      if (confirmation !== modelName) {
-        setStatus("文件名不匹配，已取消覆盖", "idle");
-        return;
-      }
+      const confirmation = await requestModelName({
+        title: "确认覆盖模型",
+        message: `服务器已存在 ${modelName}，覆盖后无法恢复。请输入完整文件名以确认。`,
+        confirmLabel: "覆盖并上传",
+        danger: true,
+        expectedValue: modelName
+      });
+      if (confirmation === null) return;
      overwrite = true;
    }
    const result = await runBusy("正在上传模型", () => window.reinloop.uploadModel({
@@ -726,25 +798,33 @@ document.querySelector("#upload-model").addEventListener("click", async () => {
  }
 });
 elements.modelList.addEventListener("click", async (event) => {
-  const fileID = event.target.dataset.modelDownload || event.target.dataset.modelDelete;
+  const button = event.target.closest("button");
+  if (!button || !elements.modelList.contains(button)) return;
+  const fileID = button.dataset.modelDownload || button.dataset.modelDelete;
  if (!fileID) return;
  const model = state.models.find((item) => item.fileID === fileID);
-  if (event.target.dataset.modelDownload) {
+  if (!model) return showError(new Error("模型记录已变化，请刷新列表后重试"));
+  if (button.dataset.modelDownload) {
    const result = await runBusy("正在下载模型", () => window.reinloop.downloadModel({ fileID, fileName: model.fileName, credentials: credentials() }));
    if (result) setStatus(`模型已下载: ${result.filePath}`, "success");
  } else {
-    if (!window.confirm(`确认删除模型 ${model.fileName}？`)) return;
-    const confirmation = window.prompt(`删除不可恢复。请输入完整文件名以确认：${model.fileName}`);
-    if (confirmation !== model.fileName) {
-      setStatus("文件名不匹配，已取消删除", "idle");
-      return;
-    }
-    event.target.disabled = true;
+    const confirmation = await requestModelName({
+      title: "确认删除模型",
+      message: `删除 ${model.fileName} 后无法恢复。请输入完整文件名以确认。`,
+      confirmLabel: "永久删除",
+      danger: true,
+      expectedValue: model.fileName
+    });
+    if (confirmation === null) return;
+    button.disabled = true;
    try {
      const result = await runBusy("正在删除模型", () => window.reinloop.deleteModel({ fileID, credentials: credentials() }));
-      if (result) await refreshModels();
+      if (result) {
+        await refreshModels();
+        setStatus("模型已删除", "success");
+      }
    } finally {
-      event.target.disabled = false;
+      button.disabled = false;
    }
  }
 });