上传报告 放大还原

src/views/performance/assetssDetail.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-05-27 09:25:45
- * @LastEditTime: 2024-09-25 09:24:33
+ * @LastEditTime: 2024-09-25 11:14:47
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/assetssDetail.vue
@@ -424,7 +424,6 @@ export default {
         fieldCode: this.$route.query.fieldCode,
         batchCode: this.$route.query.batchCode,
       });
-
       if (result.code === 200) {
         this.downLoadSingleType(result.data);
       } else {
@@ -432,11 +431,68 @@ export default {
       }
     },
     // 下载单个类型的文件
+    // async downLoadSingleType(data) {
+    //   if (data && data !== null) {
+    //     let totalFiles = data.length;
+    //     let completedFiles = 0;
+
+    //     // 检查通知支持情况
+    //     if (!("Notification" in window)) {
+    //       alert("This browser does not support desktop notifications.");
+    //     } else if (Notification.permission !== "granted") {
+    //       Notification.requestPermission();
+    //     }
+
+    //     this.loading = true;
+
+    //     for (let i = 0; i < data.length; i++) {
+    //       try {
+    //         const formData = new FormData();
+    //         formData.append("batchCode", this.$route.query.batchCode);
+    //         formData.append("analysisTypeCode", data[i]);
+    //         formData.append("fieldCode", this.$route.query.fieldCode);
+
+    //         // 获取 Blob 对象并提供进度回调
+    //         await downloadFile(formData, (percentCompleted) => {
+    //           // 更新通知
+    //           if (Notification.permission === "granted") {
+    //             new Notification(`Downloading file ${data[i]}`, {
+    //               body: `Progress: ${percentCompleted}%`,
+    //             });
+    //           }
+    //         }).then((blob) => {
+    //           if (blob instanceof Blob) {
+    //             // 使用 FileSaver.js 直接保存文件，自动弹出保存对话框
+    //             saveAs(blob, `file_${data[i]}.pdf`);
+
+    //             // 更新下载进度
+    //             completedFiles += 1;
+    //             this.loading = false;
+    //             this.$notify({
+    //               title: "提示",
+    //               message: `已完成 ${completedFiles}/${totalFiles} 文件`,
+    //             });
+    //           } else {
+    //             throw new Error(`返回的数据不是 Blob 对象`);
+    //           }
+    //         });
+    //       } catch (error) {
+    //         console.error(`下载文件 ${data[i]} 时发生错误:`, error);
+    //         this.loading = false;
+    //         return;
+    //       }
+    //     }
+
+    //     // 完成所有文件下载后的通知
+    //     if (Notification.permission === "granted") {
+    //       new Notification("所有文件已下载", {
+    //         body: `${completedFiles}/${totalFiles} 文件已成功下载`,
+    //       });
+    //     }
+    //   }
+    // },
     async downLoadSingleType(data) {
-      console.log(data, "执行了前");
       if (data && data !== null) {
-        console.log(data, "执行了");
-
         let totalFiles = data.length;
         let completedFiles = 0;
         if (!("Notification" in window)) {
@@ -482,7 +538,6 @@ export default {
             return;
           }
         }
-
         // 生成 ZIP 文件并下载
         zip
           .generateAsync({ type: "blob" })

src/views/performance/assetssMag.vue

@@ -282,12 +282,38 @@
     <el-dialog
       title="PDF 预览"
       :visible.sync="dialogReportVisible"
-      width="80%"
+      :width="dialogWidth"
       class="pdfDialog"
+      :before-close="handleCloses"
     >
+      <span>
+        <div
+          style="
+            float: right;
+            color: #fff;
+            cursor: pointer;
+            position: absolute;
+            left: 90%;
+            top: 21px;
+          "
+        >
+          <span
+            v-if="dialogWidth === '80%'"
+            @click="() => (dialogWidth = '100%')"
+            >全屏查看</span
+          >
+          <span
+            v-if="dialogWidth === '100%'"
+            @click="() => (dialogWidth = '80%')"
+            >还原</span
+          >
+          <!-- {{ isFullscreen ? "还原" : "全屏" }} -->
+        </div>
+      </span>
       <div class="pdf-container" ref="viewer">
         <iframe :src="pdfUrl" width="100%" height="100%"></iframe>
       </div>
+      <div></div>
     </el-dialog>
   </div>
 </template>
@@ -302,6 +328,7 @@ export default {
   },
   data() {
     return {
+      dialogWidth: "80%",
       intervalId: null,
       startTime: null,
       maxPollingTime: 5 * 60 * 1000, //轮询最大时间
@@ -331,9 +358,15 @@ export default {
     this.getTableList();
   },
   methods: {
+    handleCloses(done) {
+      this.$confirm("确认关闭？")
+        .then((_) => {
+          done();
+        })
+        .catch((_) => {});
+    },
     //查看pdf 文件
     detailReportAssetss(row) {
-      console.log(row.reportAddr);
       this.dialogReportVisible = true;
       this.pdfUrl = row.reportAddr;
     },
@@ -576,15 +609,19 @@ export default {
   }
 }
 ::v-deep .pdfDialog .el-dialog {
-  height: 90% !important;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
   margin: 0 auto !important;
   .el-dialog__body {
-    height: 100% !important;
+    // height: 100% !important;
+    flex: 1;
+    background: #fff;
     .pdf-container {
       display: flex;
       justify-content: center;
       align-items: center;
-      height: 90% !important;
+      height: 100% !important;
     }
   }
 }

src/views/performance/components/PlotlyCharts.vue

@@ -152,7 +152,6 @@ export default {
     },
     renderPlot() {
       const data = [];
-      // Add traces for each turbine with colors from config
       this.powerCurveData.turbines.forEach((turbine, index) => {
         data.push({
           x: turbine.xData,