From 4beae710729810a80e0714be913342eca4396d65 Mon Sep 17 00:00:00 2001
From: Hera Zhao <hera@euphon.net>
Date: Fri, 10 Apr 2026 16:27:15 +0000
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=A2=84=E8=A7=88=E6=8C=89=E9=92=AE?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E9=85=8D=E6=96=B9=E5=8D=A1=E7=89=87=EF=BC=8C?=
 =?UTF-8?q?=E5=8E=BB=E6=8E=89=E2=9C=95=E5=85=B3=E9=97=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 预览按钮生成配方卡片并用RecipeDetailOverlay展示
- 去掉编辑器右上角的✕按钮
- 预览时可返回继续编辑

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/views/RecipeManager.vue | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/frontend/src/views/RecipeManager.vue b/frontend/src/views/RecipeManager.vue
index d208388..6dc5d36 100644
--- a/frontend/src/views/RecipeManager.vue
+++ b/frontend/src/views/RecipeManager.vue
@@ -229,7 +229,6 @@
           <div class="editor-header-actions">
             <button class="action-btn action-btn-primary action-btn-sm" @click="saveCurrentRecipe">💾 保存</button>
             <button class="action-btn action-btn-sm" @click="previewRecipe">👁 预览</button>
-            <button class="detail-close-btn" @click="closeOverlay">✕</button>
           </div>
         </div>
 
@@ -369,9 +368,11 @@
 
     <!-- Recipe Detail Overlay -->
     <RecipeDetailOverlay
-      v-if="previewRecipeIndex !== null"
+      v-if="previewRecipeIndex !== null || previewRecipeData !== null"
       :recipeIndex="previewRecipeIndex"
-      @close="previewRecipeIndex = null"
+      :recipeData="previewRecipeData"
+      :isDiary="previewRecipeData !== null"
+      @close="previewRecipeIndex = null; previewRecipeData = null"
     />
 
     <!-- Tag Picker Overlay -->
@@ -615,8 +616,18 @@ async function applyBatchTags() {
 }
 
 function previewRecipe() {
-  // TODO: generate card preview
-  ui.showToast('预览功能开发中')
+  const eoIngs = formIngredients.value.filter(i => i.oil && i.oil !== '椰子油' && i.drops > 0)
+  const cleanIngs = eoIngs.map(i => ({ oil: i.oil, drops: i.drops }))
+  if (formCocoRow.value && cocoActualDrops.value > 0) {
+    cleanIngs.push({ oil: '椰子油', drops: cocoActualDrops.value })
+  }
+  previewRecipeData.value = {
+    _id: null,
+    name: formName.value || '未命名配方',
+    note: formNote.value || '',
+    tags: formTags.value,
+    ingredients: cleanIngs,
+  }
 }
 
 function doBatch(action) {
@@ -1043,6 +1054,7 @@ async function loadContribution() {
   } catch {}
 }
 const previewRecipeIndex = ref(null)
+const previewRecipeData = ref(null)
 const showBatchMenu = ref(false)
 const showBatchTagPicker = ref(false)
 const batchTagsSelected = ref([])