feat: 取消生成图片失败出现弹框后的取消按钮,给组件右键生成图片的失败加上错误消息提示框

main
wu.jian2 1 year ago
parent abe2531245
commit cee914f198

@ -452,6 +452,7 @@ export default {
//
this.$confirm('保存封面失败我们将使用上次保存的封面它不会影响其他数据的保存。由于图片资源跨域问题导致使用toDataURL API生成图片失败我们需要将图片上传到资源库。然后在组件中使用资源库中的图片资源以确保没有跨域问题。', '提示', {
confirmButtonText: '确定',
showCancelButton: false,
type: 'warning',
customClass: 'bs-el-message-box'
}).then(async () => {
@ -579,7 +580,7 @@ export default {
//
this.$confirm('图片资源跨域导致使用toDataURL API生成图片失败请将图片上传到资源库然后在组件中使用资源库中的图片资源确保没有跨域问题。', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
showCancelButton: false,
type: 'warning',
customClass: 'bs-el-message-box'
}).then(() => { }).catch(() => { })
@ -589,6 +590,59 @@ export default {
}
})
}
// createdImg () {
// this.saveAndPreviewLoading = true
// //
// EventBus.$emit('stopMarquee')
// const node = document.querySelector('.render-theme-wrap')
// // node imgsrc 'Access-Control-Allow-Origin': '*'
// const imgTags = node.querySelectorAll('img')
// const requests = Array.from(imgTags).map(img => {
// const src = img.getAttribute('src')
// return (src, {
// headers: { 'Access-Control-Allow-Origin': '*' }
// }).then(response => {
// if (response.ok) {
// return response.blob()
// } else {
// throw new Error('Network response was not ok.')
// }
// }).then(blob => {
// return new Promise((resolve, reject) => {
// const reader = new FileReader()
// reader.onload = () => resolve(reader.result)
// reader.onerror = reject
// reader.readAsDataURL(blob)
// })
// }).then(dataUrl => {
// img.setAttribute('src', dataUrl)
// }).catch(error => {
// console.error('Fetch error:', error)
// })
// })
// Promise.all(requests).then(() => {
// toPng(node)
// .then((dataUrl) => {
// const link = document.createElement('a')
// link.download = `${this.pageInfo.name}.png`
// link.href = dataUrl
// link.click()
// link.addEventListener('click', () => {
// link.remove()
// })
// this.saveAndPreviewLoading = false
// //
// EventBus.$emit('startMarquee')
// }).catch((error) => {
// console.info(error)
// this.$message.warning('')
// this.saveAndPreviewLoading = false
// })
// }).catch(error => {
// console.error('Fetch error:', error)
// })
// }
}
}
</script>

@ -299,7 +299,7 @@ export default {
this.$confirm('确定替换为选中模板吗?未保存的代码将被覆盖!', '提示', {
distinguishCancelAndClose: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
showCancelButton: false,
cancelButtonClass: 'cancel-btn',
type: 'warning',
customClass: 'bs-el-message-box'
@ -422,7 +422,7 @@ export default {
//
this.$confirm('图片资源跨域导致使用toDataURL API生成图片失败请将图片上传到资源库然后在组件中使用资源库中的图片资源确保没有跨域问题。', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
showCancelButton: false,
type: 'warning',
customClass: 'bs-el-message-box'
}).then(() => { }).catch(() => { })

@ -114,6 +114,21 @@ export default {
link.addEventListener('click', () => {
link.remove()
})
}).catch((error) => {
if (error.type === 'error') {
// 判断的error.currentTarget是img标签如果是的就弹出消息说是图片跨域
if (error.currentTarget.tagName.toLowerCase() === 'img') {
// 确认框
this.$confirm('图片资源跨域导致使用toDataURL API生成图片失败请将图片上传到资源库然后在组件中使用资源库中的图片资源确保没有跨域问题。', '提示', {
confirmButtonText: '确定',
showCancelButton: false,
type: 'warning',
customClass: 'bs-el-message-box'
}).then(() => { }).catch(() => { })
}
} else {
this.$message.warning('出现未知错误,请重试')
}
})
}, // 右键菜单
onContextmenu (event, chart) {

Loading…
Cancel
Save