新增版本編輯功能

前端：
- 新增編輯按鈕至基本資訊區塊右側
- 實作編輯版本對話框顯示版本標題和更新日誌表單
- 支援開發模式模擬測試
- 包含表單驗證和錯誤處理

後端：
- 新增 PUT /api/admin/versions/{version}/edit 端點
- 支援編輯版本標題和更新日誌
- 支援 Revit 和 AutoCAD 產品類型
- 包含輸入驗證和錯誤處理
- 同步更新 Supabase 資料庫

app/api/version_routes.py

@@ -544,6 +544,78 @@ async def replace_version_file(
         logger.error(f"Replace version file error: {e}")
         raise HTTPException(status_code=500, detail=str(e))
 
+@router.put("/admin/versions/{version}/edit")
+async def edit_version_metadata(
+    version: str,
+    product_type: str = "revit",
+    request: Request = None,
+    current_user = Depends(verify_admin)
+):
+    """
+    編輯版本的元資料（標題和更新日誌）
+    - 更新版本標題 (title)
+    - 更新更新日誌 (changelog)
+    - 不影響檔案、下載 URL 等其他欄位
+    需要管理員權限
+    支援 product_type 參數: 'revit' 或 'autocad'
+    """
+    try:
+        client = supabase_clients.get_version_client()
+        if not client:
+            raise HTTPException(status_code=503, detail="Version system unavailable")
+
+        # 驗證產品類型
+        if product_type not in ['revit', 'autocad']:
+            raise HTTPException(status_code=400, detail="Invalid product_type. Must be 'revit' or 'autocad'")
+
+        # 根據產品類型選擇對應的資料表
+        table_name = 'versions_autocad' if product_type == 'autocad' else 'versions'
+
+        # 查詢版本資訊
+        version_query = client.table(table_name).select('*').eq('version', version).execute()
+
+        if not version_query.data:
+            raise HTTPException(status_code=404, detail=f"Version {version} not found in {product_type}")
+
+        # 解析請求資料
+        body = await request.json()
+        title = body.get('title', '').strip()
+        changelog = body.get('changelog', '').strip()
+
+        # 驗證必填欄位
+        if not title:
+            raise HTTPException(status_code=400, detail="Title is required")
+
+        if not changelog:
+            raise HTTPException(status_code=400, detail="Changelog is required")
+
+        # 更新資料庫記錄
+        update_data = {
+            'title': title,
+            'changelog': changelog
+        }
+
+        update_result = client.table(table_name).update(update_data).eq('version', version).execute()
+
+        if not update_result.data:
+            raise HTTPException(status_code=500, detail=f"Failed to update version {version} in database")
+
+        return {
+            "success": True,
+            "message": f"{product_type.capitalize()} version {version} metadata updated successfully",
+            "product_type": product_type,
+            "updated_fields": {
+                "title": title,
+                "changelog": changelog
+            }
+        }
+
+    except HTTPException:
+        raise
+    except Exception as e:
+        logger.error(f"Edit version metadata error: {e}")
+        raise HTTPException(status_code=500, detail=str(e))
+
 @router.get("/admin/licenses/stats")
 async def get_license_stats(current_user = Depends(verify_admin)):
     """

frontend/versions.html

@@ -622,6 +622,25 @@
             border-top: 1px solid var(--border-primary);
         }
 
+        /* 編輯按鈕樣式 */
+        .btn-edit {
+            background: linear-gradient(135deg, #8b5cf6, #7c3aed);
+            border: none;
+            color: white;
+            box-shadow: 0 2px 4px rgba(139, 92, 246, 0.3);
+            transition: all 0.2s ease;
+        }
+
+        .btn-edit:hover {
+            background: linear-gradient(135deg, #7c3aed, #6d28d9);
+            transform: translateY(-1px);
+            box-shadow: 0 4px 8px rgba(139, 92, 246, 0.4);
+        }
+
+        .btn-edit i {
+            margin-right: 0.5rem;
+        }
+
         /* 替換執行檔按鈕樣式 */
         .btn-replace {
             background: linear-gradient(135deg, #f59e0b, #f97316);
@@ -1821,7 +1840,12 @@
                 // 創建彈窗內容 (不包含 modal-header，因為 Components.createModal 會自動添加)
                 const modalContent = `
                     <div class="version-detail-section">
-                        <h4><i class="fas fa-info-circle"></i> 基本資訊</h4>
+                        <h4 style="display: flex; justify-content: space-between; align-items: center;">
+                            <span><i class="fas fa-info-circle"></i> 基本資訊</span>
+                            <button onclick="versionApp.showEditVersionDialog('${version.id}', '${version.version}', '${version.product_type}'); Components.closeModal(this.closest('.modal-overlay'));" style="margin: 0; padding: 0.5rem; background: linear-gradient(135deg, #8b5cf6, #7c3aed); border: none; border-radius: 6px; cursor: pointer; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; transition: all 0.2s ease; box-shadow: 0 2px 4px rgba(139, 92, 246, 0.3);" title="編輯版本資訊" onmouseover="this.style.background='linear-gradient(135deg, #7c3aed, #6d28d9)'; this.style.transform='translateY(-1px)'; this.style.boxShadow='0 4px 8px rgba(139, 92, 246, 0.4)'" onmouseout="this.style.background='linear-gradient(135deg, #8b5cf6, #7c3aed)'; this.style.transform='translateY(0)'; this.style.boxShadow='0 2px 4px rgba(139, 92, 246, 0.3)'">
+                                <i class="fas fa-pen" style="margin: 0; font-size: 0.85rem; color: white;"></i>
+                            </button>
+                        </h4>
                         <div class="detail-grid">
                             <div class="detail-item">
                                 <label>版本標題：</label>
@@ -1841,14 +1865,14 @@
                             </div>
                         </div>
                     </div>
-                    
+
                     ${version.changelog ? `
                         <div class="version-detail-section">
                             <h4><i class="fas fa-list"></i> 更新日誌</h4>
                             <div class="version-changelog-detail">${version.changelog.trim()}</div>
                         </div>
                     ` : ''}
-                    
+
                     <div class="modal-actions">
                         <button class="btn btn-replace" onclick="versionApp.showReplaceFileDialog('${version.id}', '${version.version}', '${version.product_type}'); Components.closeModal(this.closest('.modal-overlay'));">
                             <i class="fas fa-sync-alt"></i> 替換執行檔
@@ -2081,6 +2105,156 @@
                 }
             }
 
+            // 顯示編輯版本對話框
+            showEditVersionDialog(versionId, versionString, productType) {
+                console.log('✏️ 開啟編輯版本對話框:', { versionId, versionString, productType });
+
+                // 查找版本資訊
+                let version = null;
+                if (this.currentVersions && this.currentVersions.length > 0) {
+                    version = this.currentVersions.find(v => v.id === versionId || v.version === versionString);
+                }
+
+                if (!version) {
+                    console.error('❌ 找不到版本資訊:', versionId);
+                    Utils.showError('找不到版本資訊', `版本 ID: ${versionId}`);
+                    return;
+                }
+
+                const modalContent = `
+                    <div class="version-detail-section">
+                        <h4><i class="fas fa-info-circle"></i> 版本資訊</h4>
+                        <div class="detail-grid">
+                            <div class="detail-item">
+                                <label>版本號：</label>
+                                <span>v${versionString}</span>
+                            </div>
+                            <div class="detail-item">
+                                <label>產品類型：</label>
+                                <span>${productType === 'autocad' ? 'AutoCAD' : 'Revit'}</span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="version-detail-section">
+                        <h4><i class="fas fa-edit"></i> 編輯內容</h4>
+                        <div class="form-group">
+                            <label for="editTitle">版本標題 <span class="required">*</span></label>
+                            <input type="text" id="editTitle" value="${version.title || ''}" placeholder="例如：重大功能更新" required style="width: 100%; padding: 0.6rem 0.8rem; background: var(--bg-tertiary); border: 1px solid var(--border-primary); border-radius: 6px; color: var(--text-primary); font-size: 0.85rem;">
+                            <small class="form-hint">簡短描述此版本的特色</small>
+                        </div>
+                        <div class="form-group" style="margin-top: 1rem;">
+                            <label for="editChangelog">更新日誌 <span class="required">*</span></label>
+                            <textarea id="editChangelog" placeholder="請詳細描述此版本的更新內容" required rows="8" style="width: 100%; padding: 0.6rem 0.8rem; background: var(--bg-tertiary); border: 1px solid var(--border-primary); border-radius: 6px; color: var(--text-primary); font-size: 0.85rem; resize: vertical; min-height: 150px; font-family: 'Monaco', 'Menlo', 'Consolas', monospace;">${version.changelog || ''}</textarea>
+                            <small class="form-hint">詳細說明新功能、修復的問題和改善項目</small>
+                        </div>
+                    </div>
+
+                    <div class="modal-actions">
+                        <button class="btn btn-primary" id="confirmEditBtn">
+                            <i class="fas fa-save"></i> 儲存變更
+                        </button>
+                        <button class="btn btn-secondary" onclick="Components.closeModal(this.closest('.modal-overlay'))">
+                            取消
+                        </button>
+                    </div>
+                `;
+
+                const modal = Components.createModal({
+                    title: `<i class="fas fa-pen"></i> 編輯版本 - v${versionString}`,
+                    content: modalContent,
+                    size: 'md'
+                });
+
+                Components.showModal(modal);
+
+                // 設置儲存按鈕事件
+                setTimeout(() => {
+                    const confirmBtn = document.getElementById('confirmEditBtn');
+                    if (confirmBtn) {
+                        confirmBtn.addEventListener('click', async () => {
+                            const titleInput = document.getElementById('editTitle');
+                            const changelogInput = document.getElementById('editChangelog');
+
+                            if (!titleInput.value.trim()) {
+                                Utils.showError('欄位驗證失敗', '版本標題不能為空');
+                                return;
+                            }
+
+                            if (!changelogInput.value.trim()) {
+                                Utils.showError('欄位驗證失敗', '更新日誌不能為空');
+                                return;
+                            }
+
+                            await this.handleEditVersion(versionId, versionString, productType, titleInput.value.trim(), changelogInput.value.trim());
+                        });
+                    }
+                }, 100);
+            }
+
+            // 執行版本編輯
+            async handleEditVersion(versionId, versionString, productType, title, changelog) {
+                const confirmBtn = document.getElementById('confirmEditBtn');
+                const originalText = confirmBtn ? confirmBtn.innerHTML : '';
+
+                try {
+                    if (confirmBtn) {
+                        confirmBtn.disabled = true;
+                        confirmBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> 儲存中...';
+                    }
+
+                    if (this.isDevMode) {
+                        // 開發模式模擬編輯
+                        await new Promise(resolve => setTimeout(resolve, 1500));
+                        Utils.showSuccess('儲存成功', `版本 ${versionString} 的資訊已成功更新`);
+                        Components.closeModal(document.querySelector('.modal-overlay'));
+                        this.loadVersionsList();
+                    } else {
+                        // 生產模式實際編輯
+                        const requestData = {
+                            title: title,
+                            changelog: changelog
+                        };
+
+                        // 使用統一的 authManager 獲取 Token
+                        if (!window.authManager || !window.authManager.supabase) {
+                            throw new Error('認證系統未初始化');
+                        }
+
+                        const { data: { session }, error: sessionError } = await window.authManager.supabase.auth.getSession();
+                        if (sessionError || !session || !session.access_token) {
+                            throw new Error('無法獲取認證令牌，請重新登入');
+                        }
+
+                        const response = await fetch(`/api/admin/versions/${versionString}/edit?product_type=${productType}`, {
+                            method: 'PUT',
+                            headers: {
+                                'Authorization': `Bearer ${session.access_token}`,
+                                'Content-Type': 'application/json'
+                            },
+                            body: JSON.stringify(requestData)
+                        });
+
+                        if (!response.ok) {
+                            const error = await response.json();
+                            throw new Error(error.detail || '儲存失敗');
+                        }
+
+                        Utils.showSuccess('儲存成功', `版本 ${versionString} 的資訊已成功更新`);
+                        Components.closeModal(document.querySelector('.modal-overlay'));
+                        this.loadVersionsList();
+                    }
+                } catch (error) {
+                    console.error('儲存失敗:', error);
+                    Utils.showError('儲存失敗', error.message);
+                } finally {
+                    if (confirmBtn) {
+                        confirmBtn.disabled = false;
+                        confirmBtn.innerHTML = originalText;
+                    }
+                }
+            }
+
             // 工具方法
             formatFileSize(bytes) {
                 if (bytes === 0) return '0 Bytes';