commit

04.系统编码/Frontend/src/components/MicrowaveRadiation.vue

@@ -575,7 +575,6 @@
                 let pictures = document.getElementById('pictures');
                 options.urls = [options.contrast.noQCImgUrl, options.contrast.checkImgUrl, options.contrast.fillingImgUrl];
 
-                console.log(options.urls)
                 for (let i = 0; i < options.urls.length; i++) {
                     let img = new Image();
                     img.src = options.urls[i];

04.系统编码/Frontend/src/components/RamanLidar.vue

@@ -20,6 +20,8 @@
                     <el-col :span="24"><span @click="onElementClick('PM', '气溶胶PM')" :class="{'active': currentElement === 'PM'}">气溶胶PM</span></el-col>
                     <el-col :span="24"><span @click="onElementClick('ext_plot', '消光系数')" :class="{'active': currentElement === 'ext_plot'}">消光系数</span></el-col>
                     <el-col :span="24"><span @click="onElementClick('layertype', '云气溶胶分类')" :class="{'active': currentElement === 'layertype'}">云气溶胶分类</span></el-col>
+                    <el-col :span="24"><span @click="onElementClick('wv_plot', '水汽')" :class="{'active': currentElement === 'wv_plot'}">水汽</span></el-col>
+                    <el-col :span="24"><span @click="onElementClick('cloudheight', '云高')" :class="{'active': currentElement === 'cloudheight'}">云高</span></el-col>
                 </el-row>
             </div>
         </div>
@@ -48,7 +50,11 @@
             <div class="picture-view">
                 <span class="arrow arrow-prev" @click="onPrevImgClick"><img src="/images/prev-btn.png" /></span>
                 <span class="arrow arrow-next" @click="onNextImgClick"><img src="/images/next-btn.png" /></span>
-                <a :href="downloadImgUrl" download class="save-btn"><img src="/images/save.png" /></a>
+                <span class="save-btn" @click="onSaveClick" v-if="currentElement === 'PBLH'"><img src="/images/save.png" /></span>
+                <a :href="downloadImgUrl" download class="save-btn" v-else><img src="/images/save.png" /></a>
+                <div class="download-pictures" id="pictures" v-if="currentElement === 'PBLH'">
+                    <a v-for="(url, index) in urls" :key="index" download></a>
+                </div>
                 <div class="picture-container raman-picture-container">
                     <!-- <h2 class="title">{{title}}</h2> -->
                     <div class="picture">
@@ -121,7 +127,8 @@
                 isPlay: false,
                 title: null,
                 index: 0,
-                downloadSrc: null
+                downloadSrc: null,
+                urls: []
             })
 
             onMounted(() => {
@@ -209,9 +216,18 @@
                 let urls = [];
                 for(let index = 0, len = options.times.length; index < len; index++){
                     let time = moment(options.times[index].date);
-                    urls.push(RamanLidarConfig.getUrl(options.currentRegion, options.currentElement, time));
+                    
+                    if (options.currentElement === 'PBLH') {
+                        urls.push(
+                            RamanLidarConfig.getUrl(options.currentRegion, options.currentElement, time),
+                            RamanLidarConfig.getUrl(options.currentRegion, 'signal_' + options.currentElement, time)
+                        );
+                    } else
+                        urls.push(RamanLidarConfig.getUrl(options.currentRegion, options.currentElement, time));
                 }
 
+                console.log(urls)
+
                 return urls;
             }
 
@@ -247,7 +263,6 @@
                 }
 
                 options.times.reverse();
-                console.log(options.times)
                 options.index = options.times.length - 1;
 
             }
@@ -361,6 +376,34 @@
                 activeImage();
             }
 
+            const onSaveClick = () => {
+                let pictures = document.getElementById('pictures');
+                options.urls = [options.signalPBLHImgUrl, options.signalPBLHImgUrl, options.imgUrl];
+
+                for (let i = 0; i < options.urls.length; i++) {
+                    let img = new Image();
+                    img.src = options.urls[i];
+                    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 = () => {
+                        ctx.drawImage(img, 0, 0);
+                        base64 = canvas.toDataURL("image/png");
+                        pictures.children[i].setAttribute('href', base64);
+                        setTimeout(() => {
+                            let button: HTMLElement = pictures.children[i] as HTMLElement;
+                            button.click();
+                            pictures.children[i].setAttribute('href', null);
+                        }, 500);
+                    };
+                }
+            }
+
             return {
                 ...toRefs(options),
                 onRegionClick,
@@ -374,7 +417,8 @@
                 onPlayClick,
                 onChange,
                 onImageLoad,
-                onDownloadClick
+                onDownloadClick,
+                onSaveClick
             }
         }
     }