From 79007ab7757720d067495ea3503be67f46bc7fc8 Mon Sep 17 00:00:00 2001
From: x1ao4 <kazaf_ken@163.com>
Date: Wed, 17 Sep 2025 04:21:31 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=9F=E4=B8=80=E6=A8=A1=E6=80=81=E6=A1=86?=
 =?UTF-8?q?=E7=9A=84=20Spinner=20=E6=A0=B7=E5=BC=8F=EF=BC=8C=E5=B9=B6?=
 =?UTF-8?q?=E5=9C=A8=E7=BC=96=E8=BE=91=E5=85=83=E6=95=B0=E6=8D=AE=E6=A8=A1?=
 =?UTF-8?q?=E6=80=81=E6=A1=86=E4=B8=AD=E5=A2=9E=E5=8A=A0=20Spinner=20?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/static/css/main.css  |  9 +++++++++
 app/templates/index.html | 20 +++++++++++++++++++-
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/app/static/css/main.css b/app/static/css/main.css
index d70673e..099958f 100644
--- a/app/static/css/main.css
+++ b/app/static/css/main.css
@@ -2056,6 +2056,15 @@ button.close:focus,
   margin-left: 5px;
 }
 
+/* 统一创建/编辑任务 与 编辑元数据 模态框的标题转圈样式 */
+#createTaskModal .spinner-border-sm,
+#editMetadataModal .spinner-border-sm {
+  width: 1rem;
+  height: 1rem;
+  border-width: 0.15em;
+  margin-left: 5px;
+}
+
 /* --------------- 深度搜索任务建议样式 --------------- */
 .task-suggestions {
   width: 100%;
diff --git a/app/templates/index.html b/app/templates/index.html
index c0ea09b..5f0b19d 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -2683,7 +2683,9 @@
       <div class="modal-dialog modal-lg">
         <div class="modal-content">
           <div class="modal-header">
-            <h5 class="modal-title" style="font-weight: 600; font-family: inherit; letter-spacing: normal;">编辑元数据</h5>
+            <h5 class="modal-title" style="font-weight: 600; font-family: inherit; letter-spacing: normal;">编辑元数据
+              <div v-show="editMetadata && editMetadata.loading" class="spinner-border spinner-border-sm m-1" role="status"></div>
+            </h5>
             <button type="button" class="close" data-dismiss="modal" aria-label="Close">
               <i class="bi bi-x-lg"></i>
             </button>
@@ -2929,6 +2931,7 @@
         modalLoading: false,
         // 编辑元数据状态
         editMetadata: {
+          loading: false,
           visible: false,
           original: {
             task_name: '',
@@ -5276,6 +5279,19 @@
         // 保存编辑元数据
         async saveEditMetadata() {
           try {
+            this.editMetadata.loading = true;
+            // 立即刷新一次视图，确保标题处 spinner 及时渲染
+            await this.$nextTick();
+            // 直接强制显示并触发一次重绘，确保首帧可见
+            try {
+              var __sp = document.querySelector('#editMetadataModal .modal-title .spinner-border');
+              if (__sp) {
+                __sp.style.display = 'inline-block';
+                void __sp.offsetHeight;
+              }
+            } catch (e) {}
+            // 再让出到宏任务队列，确保浏览器先完成一次绘制
+            await new Promise(function(resolve){ setTimeout(resolve, 0); });
             if (!this.editMetadata || !this.editMetadata.form) return;
             const payload = {
               task_name: this.editMetadata.original.task_name,
@@ -5405,6 +5421,8 @@
             }
           } catch (e) {
             this.showToast('保存失败：' + (e.response?.data?.message || e.message));
+          } finally {
+            this.editMetadata.loading = false;
           }
         },
         // 根据输入内容自适应季数输入框宽度，最小32px