修复添加背景页面从历史记录恢复大图时，背景图无法恢复的问题

src/views/tools/add_background/add_background.vue

@@ -654,6 +654,7 @@ interface HistoryItem {
   originalImageFile: File | null
   resultImage: string
   backgroundColor: string
+  backgroundImageUrl?: string
   timestamp: number
 }
 
@@ -903,12 +904,14 @@ const applyBackgroundImage = async (imageUrl: string) => {
         originalImageFile: uploadedImage.value,
         resultImage: dataUrl,
         backgroundColor: backgroundColor.value,
+        backgroundImageUrl: imageUrl,
         timestamp: Date.now()
       }
       historyList.value.unshift(historyItem)
       currentHistoryIndex.value = 0
     } else if (currentHistoryIndex.value >= 0) {
       historyList.value[currentHistoryIndex.value].resultImage = dataUrl
+      historyList.value[currentHistoryIndex.value].backgroundImageUrl = imageUrl
     }
     
     // Auto-close mobile color picker on mobile
@@ -1957,6 +1960,7 @@ const applyBackgroundSilent = async () => {
         originalImageFile: uploadedImage.value,
         resultImage: dataUrl,
         backgroundColor: backgroundColor.value,
+        backgroundImageUrl: undefined,
         timestamp: Date.now()
       }
       historyList.value.unshift(historyItem)
@@ -1964,6 +1968,7 @@ const applyBackgroundSilent = async () => {
     } else if (currentHistoryIndex.value >= 0) {
       historyList.value[currentHistoryIndex.value].resultImage = dataUrl
       historyList.value[currentHistoryIndex.value].backgroundColor = backgroundColor.value
+      historyList.value[currentHistoryIndex.value].backgroundImageUrl = undefined
     }
   } catch (error: any) {
     console.error('Apply background error:', error)
@@ -2045,6 +2050,7 @@ const clearBackground = async () => {
         originalImageFile: uploadedImage.value,
         resultImage: dataUrl,
         backgroundColor: '',
+        backgroundImageUrl: undefined,
         timestamp: Date.now()
       }
       historyList.value.unshift(historyItem)
@@ -2052,6 +2058,7 @@ const clearBackground = async () => {
     } else if (currentHistoryIndex.value >= 0) {
       historyList.value[currentHistoryIndex.value].resultImage = dataUrl
       historyList.value[currentHistoryIndex.value].backgroundColor = ''
+      historyList.value[currentHistoryIndex.value].backgroundImageUrl = undefined
     }
     
     // processing.value = false
@@ -2138,7 +2145,7 @@ const selectHistoryItem = async (index: number) => {
     await cacheResultImage(item.resultImage)
   }
   
-  // Re-render canvas with the saved result
+  // Re-render canvas with the saved result (including background image if exists)
   await initializeCanvasFromResult(item)
 }
 
@@ -2255,15 +2262,60 @@ const initializeCanvasFromResult = async (item: HistoryItem) => {
       scaleY: 1
     })
     
-    // Apply saved background color or leave transparent
-    if (item.backgroundColor) {
-      fabricCanvas.backgroundColor = item.backgroundColor
+    // Check if this history item has a background image
+    if (item.backgroundImageUrl) {
+      // Load and apply background image
+      const bgImg = await FabricImage.fromURL(item.backgroundImageUrl, {
+        crossOrigin: 'anonymous'
+      })
+      
+      if (bgImg) {
+        // Scale background image to cover canvas
+        const bgScale = Math.max(
+          imgWidth / (bgImg.width || 1),
+          imgHeight / (bgImg.height || 1)
+        )
+        
+        bgImg.set({
+          scaleX: bgScale,
+          scaleY: bgScale,
+          left: imgWidth / 2,
+          top: imgHeight / 2,
+          originX: 'center',
+          originY: 'center',
+          selectable: false,
+          evented: false
+        })
+        
+        // Add background image first, then foreground
+        fabricCanvas.add(bgImg)
+        fabricCanvas.sendObjectToBack(bgImg)
+        fabricCanvas.add(img)
+        fabricCanvas.centerObject(img)
+        
+        // Clear background color when using background image
+        fabricCanvas.backgroundColor = null
+      } else {
+        // Fallback to color background if image loading fails
+        if (item.backgroundColor) {
+          fabricCanvas.backgroundColor = item.backgroundColor
+        } else {
+          fabricCanvas.backgroundColor = null
+        }
+        fabricCanvas.add(img)
+        fabricCanvas.centerObject(img)
+      }
     } else {
-      fabricCanvas.backgroundColor = null
+      // Apply saved background color or leave transparent
+      if (item.backgroundColor) {
+        fabricCanvas.backgroundColor = item.backgroundColor
+      } else {
+        fabricCanvas.backgroundColor = null
+      }
+      fabricCanvas.add(img)
+      fabricCanvas.centerObject(img)
     }
     
-    fabricCanvas.add(img)
-    fabricCanvas.centerObject(img)
     fabricCanvas.renderAll()
     
     // Adjust visual display size to fit container