feat: 配方卡片加入上传个人二维码功能

- RecipeDetailOverlay: 未上传二维码/背景图时,卡片上方显示提示横幅,下方出现「上传我的二维码」按钮,点击跳转到 MyDiary 品牌设置页并记录来源配方
- MyDiary: 新增二维码图片上传区域(直接上传图片文件,存为 base64 → PUT /api/brand qr_code 字段);上传成功后若有待返回配方则自动跳回配方卡片;修复 loadBrandSettings 字段名与后端不一致的问题
- RecipeSearch: 支持 ?openRecipe= 查询参数,页面挂载时自动打开指定配方卡片,实现从 MyDiary 上传后无缝返回

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-04-07 21:58:17 +00:00
parent 70413971e3
commit 81ec5987b3
3 changed files with 148 additions and 15 deletions

View File

@@ -123,7 +123,8 @@
</template>
<script setup>
import { ref, computed, onMounted, nextTick } from 'vue'
import { ref, computed, onMounted, nextTick, watch } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { useAuthStore } from '../stores/auth'
import { useOilsStore } from '../stores/oils'
import { useRecipesStore } from '../stores/recipes'
@@ -136,6 +137,8 @@ const auth = useAuthStore()
const oils = useOilsStore()
const recipeStore = useRecipesStore()
const ui = useUiStore()
const route = useRoute()
const router = useRouter()
const searchQuery = ref('')
const selectedCategory = ref(null)
@@ -154,6 +157,27 @@ onMounted(async () => {
} catch {
// category modules are optional
}
// Return to a recipe card after QR upload redirect
const openRecipeId = route.query.openRecipe
if (openRecipeId) {
router.replace({ path: '/', query: {} })
const tryOpen = () => {
const idx = recipeStore.recipes.findIndex(r => r._id === openRecipeId)
if (idx >= 0) {
openDetail(idx)
return true
}
return false
}
if (!tryOpen()) {
// Recipes might not be loaded yet, watch until available
const stop = watch(
() => recipeStore.recipes.length,
() => { if (tryOpen()) stop() },
)
}
}
})
function selectCategory(cat) {