Commit afcb7e76 by cherishsince

【解决todo】图片下载抽离到 download

parent 557dc7d5
...@@ -36,3 +36,22 @@ const download = { ...@@ -36,3 +36,22 @@ const download = {
} }
export default download export default download
/** 图片下载(通过浏览器图片下载) */
export const downloadImage = async (imageUrl) => {
const image = new Image()
image.setAttribute('crossOrigin', 'anonymous')
image.src = imageUrl
image.onload = () => {
const canvas = document.createElement('canvas')
canvas.width = image.width
canvas.height = image.height
const ctx = canvas.getContext('2d') as CanvasDrawImage
ctx.drawImage(image, 0, 0, image.width, image.height)
const url = canvas.toDataURL('image/png')
const a = document.createElement('a')
a.href = url
a.download = 'image.png'
a.click()
}
}
...@@ -33,6 +33,7 @@ import ImageDetailDrawer from './ImageDetailDrawer.vue' ...@@ -33,6 +33,7 @@ import ImageDetailDrawer from './ImageDetailDrawer.vue'
import ImageTaskCard from './ImageTaskCard.vue' import ImageTaskCard from './ImageTaskCard.vue'
import { ElLoading, LoadingOptionsResolved } from 'element-plus' import { ElLoading, LoadingOptionsResolved } from 'element-plus'
import { AiImageStatusEnum } from '@/views/ai/utils/constants' import { AiImageStatusEnum } from '@/views/ai/utils/constants'
import { downloadImage } from '@/utils/download'
const message = useMessage() // 消息弹窗 const message = useMessage() // 消息弹窗
...@@ -150,26 +151,6 @@ const handleImageMjBtnClick = async (button: ImageMjButtonsVO, imageDetail: Imag ...@@ -150,26 +151,6 @@ const handleImageMjBtnClick = async (button: ImageMjButtonsVO, imageDetail: Imag
await getImageList() await getImageList()
} }
/** 下载 - image */
// TODO @fan:貌似可以考虑抽到 download 里面,作为一个方法
const downloadImage = async (imageUrl) => {
const image = new Image()
image.setAttribute('crossOrigin', 'anonymous')
image.src = imageUrl
image.onload = () => {
const canvas = document.createElement('canvas')
canvas.width = image.width
canvas.height = image.height
const ctx = canvas.getContext('2d') as CanvasDrawImage
ctx.drawImage(image, 0, 0, image.width, image.height)
const url = canvas.toDataURL('image/png')
const a = document.createElement('a')
a.href = url
a.download = 'image.png'
a.click()
}
}
// page change // page change
const handlePageChange = async (page) => { const handlePageChange = async (page) => {
pageNo.value = page pageNo.value = page
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment