fix: 手机保存图片使用 navigator.share 直接保存到相册
Some checks failed
PR Preview / teardown-preview (pull_request) Has been skipped
Test / unit-test (push) Successful in 5s
Test / build-check (push) Successful in 4s
PR Preview / test (pull_request) Successful in 4s
PR Preview / deploy-preview (pull_request) Successful in 15s
Test / e2e-test (push) Failing after 52s

- 新增 composables/useSaveImage.js
  - saveImageFromUrl: data URL → 手机分享/桌面下载
  - captureAndSave: DOM元素 → html2canvas → 保存
  - saveCanvasImage: canvas → 保存
- RecipeDetailOverlay: saveImage 改用 saveImageFromUrl
- OilReference: saveModalImage 改用 captureAndSave
- 手机端调用 navigator.share({files}) 弹出系统分享面板

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-04-09 08:58:53 +00:00
parent 3a65cb7209
commit 029071dbab
3 changed files with 94 additions and 23 deletions

View File

@@ -583,11 +583,14 @@ async function saveImage() {
await generateCardImage()
}
if (!cardImageUrl.value) return
const link = document.createElement('a')
link.download = `${recipe.value.name || '配方'}_配方卡.png`
link.href = cardImageUrl.value
link.click()
ui.showToast('已保存图片')
const filename = `${recipe.value.name || '配方'}_配方卡`
try {
const { saveImageFromUrl } = await import('../composables/useSaveImage')
await saveImageFromUrl(cardImageUrl.value, filename)
ui.showToast('已保存图片')
} catch {
ui.showToast('保存失败')
}
}
function copyText() {