From cee914f1985e8580beae374a3cbb50a72458572e Mon Sep 17 00:00:00 2001 From: "wu.jian2" Date: Fri, 22 Dec 2023 15:37:39 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E5=8F=96=E6=B6=88=E7=94=9F=E6=88=90?= =?UTF-8?q?=E5=9B=BE=E7=89=87=E5=A4=B1=E8=B4=A5=E5=87=BA=E7=8E=B0=E5=BC=B9?= =?UTF-8?q?=E6=A1=86=E5=90=8E=E7=9A=84=E5=8F=96=E6=B6=88=E6=8C=89=E9=92=AE?= =?UTF-8?q?=EF=BC=8C=E7=BB=99=E7=BB=84=E4=BB=B6=E5=8F=B3=E9=94=AE=E7=94=9F?= =?UTF-8?q?=E6=88=90=E5=9B=BE=E7=89=87=E7=9A=84=E5=A4=B1=E8=B4=A5=E5=8A=A0?= =?UTF-8?q?=E4=B8=8A=E9=94=99=E8=AF=AF=E6=B6=88=E6=81=AF=E6=8F=90=E7=A4=BA?= =?UTF-8?q?=E6=A1=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../BigScreenDesign/PageDesignTop.vue | 56 ++++++++++++++++++- data-room-ui/packages/BizComponent/index.vue | 4 +- .../packages/js/mixins/chartContextMenu.js | 15 +++++ 3 files changed, 72 insertions(+), 3 deletions(-) diff --git a/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue b/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue index ee746e4d..eb2730d7 100644 --- a/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue +++ b/data-room-ui/packages/BigScreenDesign/PageDesignTop.vue @@ -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 下的所有img标签，拿到他们的src，重新请求资源，并加上请求头 '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) + // }) + // } } } diff --git a/data-room-ui/packages/BizComponent/index.vue b/data-room-ui/packages/BizComponent/index.vue index e3d53332..7983f89a 100644 --- a/data-room-ui/packages/BizComponent/index.vue +++ b/data-room-ui/packages/BizComponent/index.vue @@ -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(() => { }) diff --git a/data-room-ui/packages/js/mixins/chartContextMenu.js b/data-room-ui/packages/js/mixins/chartContextMenu.js index 2e79b7b2..7806f4f3 100644 --- a/data-room-ui/packages/js/mixins/chartContextMenu.js +++ b/data-room-ui/packages/js/mixins/chartContextMenu.js @@ -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) {