@@ -83,6 +83,7 @@
:preview-src-list="srcList"
:initial-index="0"
fit="contain"
+ @load="onImageLoad"
>
@@ -122,6 +123,7 @@
times: [],
currentTime: null,
imgUrl: '/images/default-picture.png',
+ downloadImgUrl: '/images/default-picture.png',
srcList: [],
isPlay: false,
title: null,
@@ -190,6 +192,42 @@
options.srcList = [options.imgUrl];
}
+ const onImageLoad = (event) => {
+ if (event.currentTarget.getAttribute('src') !== '/images/default-picture.png')
+ converToBase64(options.imgUrl);
+ else
+ return
+ }
+
+ const onDownloadClick = () => {
+ let params = {
+ model: 'weibo',
+ station: options.currentRegion,
+ element: options.currentElement,
+ type: options.currentTab,
+ time: [options.times[0].date, options.times[options.times.length - 1].date],
+ urls: []
+ }
+ }
+
+ const converToBase64 = (path) => {
+ let img = new Image();
+ img.src = path;
+ let canvas = document.createElement("canvas") as HTMLCanvasElement;
+ canvas.width = img.width;
+ canvas.height = img.height;
+
+ let ctx = canvas.getContext("2d");
+ let base64 = '';
+
+ img.setAttribute("crossOrigin",'Anonymous')
+ img.onload = function() {
+ ctx.drawImage(img, 0, 0);
+ base64 = canvas.toDataURL("image/png");
+ options.downloadImgUrl = base64;
+ };
+ }
+
const initTimeLine = () => {
options.times = [];
options.currentTime = moment(options.date).hour(parseInt(options.currentHour)).format('YYYY-MM-DD HH:mm');
@@ -292,7 +330,7 @@
options.index = 0;
setCurrentPlayElement(element);
- }, 2000)
+ }, 5000)
}
const clearTimer = () => {
@@ -333,7 +371,9 @@
onNextImgClick,
onRefreshClick,
onPlayClick,
- onChange
+ onChange,
+ onImageLoad,
+ onDownloadClick
}
}
}
diff --git a/04.系统编码/Frontend/src/components/RamanLidar.vue b/04.系统编码/Frontend/src/components/RamanLidar.vue
index 26abd61..f39bba9 100644
--- a/04.系统编码/Frontend/src/components/RamanLidar.vue
+++ b/04.系统编码/Frontend/src/components/RamanLidar.vue
@@ -49,13 +49,13 @@
{{isPlay ? '暂停动画' : '播放动画'}}
-
下载动画
+
下载动画