修复穿搭图片预览功能

- 修复OutfitImageStatus枚举序列化问题，添加serde rename_all lowercase
- 修改ImagePreviewModal使用Portal渲染到modal-root容器
- 解决图片预览弹框无法显示的问题
- 确保状态正确显示为已完成而不是未知

apps/desktop/src-tauri/src/data/models/outfit_image.rs

@@ -4,6 +4,7 @@ use uuid::Uuid;
 
 /// 穿搭图片生成状态
 #[derive(Debug, Clone, Serialize, Deserialize, PartialEq)]
+#[serde(rename_all = "lowercase")]
 pub enum OutfitImageStatus {
     Pending,
     Processing,

apps/desktop/src/components/ImagePreviewModal.tsx

@@ -1,4 +1,5 @@
 import React, { useState, useCallback, useEffect } from 'react';
+import { createPortal } from 'react-dom';
 import {
   X,
   Download,
@@ -130,7 +131,14 @@ export const ImagePreviewModal: React.FC<ImagePreviewModalProps> = ({
   const categories = imageData?.categories || [];
   const releaseDate = imageData?.releaseDate;
 
-  return (
+  // 获取modal-root容器
+  const modalRoot = document.getElementById('modal-root');
+  if (!modalRoot) {
+    console.error('Modal root element not found');
+    return null;
+  }
+
+  const modalContent = (
     <div className="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-75">
       {/* 模态框背景 */}
       <div 
@@ -336,6 +344,8 @@ export const ImagePreviewModal: React.FC<ImagePreviewModalProps> = ({
       </div>
     </div>
   );
+
+  return createPortal(modalContent, modalRoot);
 };
 
 export default ImagePreviewModal;