feat(v4.4.0): 详情弹框添加导航按钮和固定底部操作栏

- 右侧固定显示向上/向下导航按钮
- 底部操作栏（转为待办、编辑、关闭）固定悬浮

xian_favor/api.py

@@ -1226,6 +1226,36 @@ INDEX_TEMPLATE = '''
         .quick-insert-area:active {
             background: #e8f4ff;
         }
+        /* 详情弹框样式 */
+        .detail-modal-body {
+            max-height: 60vh;
+            overflow-y: auto;
+            padding-bottom: 20px;
+        }
+        .detail-nav-buttons {
+            position: fixed;
+            right: 20px;
+            top: 50%;
+            transform: translateY(-50%);
+            display: flex;
+            flex-direction: column;
+            gap: 5px;
+            z-index: 10;
+        }
+        .detail-nav-buttons .btn {
+            padding: 8px 12px;
+        }
+        .detail-modal-footer {
+            position: sticky;
+            bottom: 0;
+            background: #fff;
+            border-top: 1px solid #dee2e6;
+            z-index: 10;
+        }
+        /* 解决底部按钮被遮挡的问题 */
+        .modal-dialog-scrollable .modal-body {
+            overflow-y: auto;
+        }
         .star-btn { font-size: 11px; }
         .status-pending { color: #ffc107; }
         .status-in_progress { color: #17a2b8; }
@@ -1527,18 +1557,27 @@ INDEX_TEMPLATE = '''
 
 <!-- 详情模态框 -->
 <div class="modal fade" id="detailModal" tabindex="-1">
-    <div class="modal-dialog modal-lg">
+    <div class="modal-dialog modal-lg modal-dialog-scrollable">
         <div class="modal-content">
             <div class="modal-header">
                 <h5 class="modal-title"><span id="detailTypeIcon"></span> <span id="detailTitle"></span></h5>
                 <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
             </div>
-            <div class="modal-body">
+            <div class="modal-body detail-modal-body">
+                <!-- 导航按钮 -->
+                <div class="detail-nav-buttons">
+                    <button class="btn btn-sm btn-outline-secondary" onclick="scrollDetailToTop()" title="回到顶部">
+                        <i class="bi bi-arrow-up"></i>
+                    </button>
+                    <button class="btn btn-sm btn-outline-secondary" onclick="scrollDetailToBottom()" title="去到底部">
+                        <i class="bi bi-arrow-down"></i>
+                    </button>
+                </div>
                 <div id="detailContent">
                     <!-- 动态填充 -->
                 </div>
             </div>
-            <div class="modal-footer">
+            <div class="modal-footer detail-modal-footer">
                 <button type="button" class="btn btn-outline-secondary" id="detailConvertBtn" onclick="showConvertModalFromDetail()" style="display:none;">
                     <i class="bi bi-arrow-repeat"></i> 转为待办
                 </button>
@@ -3259,6 +3298,21 @@ function showConvertModalFromDetail() {
     setTimeout(() => showConvertModal(currentDetailId), 300);
 }
 
+// 详情弹框导航
+function scrollDetailToTop() {
+    const modalBody = document.querySelector('.detail-modal-body');
+    if (modalBody) {
+        modalBody.scrollTop = 0;
+    }
+}
+
+function scrollDetailToBottom() {
+    const modalBody = document.querySelector('.detail-modal-body');
+    if (modalBody) {
+        modalBody.scrollTop = modalBody.scrollHeight;
+    }
+}
+
 // 从详情页打开编辑
 function openEditModalFromDetail() {
     bootstrap.Modal.getInstance(document.getElementById('detailModal')).hide();