From dc5b922edf94bdd8fd96ad21d1528a663cb3f5ae Mon Sep 17 00:00:00 2001
From: zch <zangch@mesnac.com>
Date: Fri, 15 Nov 2024 16:27:23 +0800
Subject: [PATCH] =?UTF-8?q?add(VideoPlayer):=20=E6=B7=BB=E5=8A=A0=E8=A7=86?=
 =?UTF-8?q?=E9=A2=91=E4=B8=8B=E8=BD=BD=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在 DPlayer 组件中添加自定义右键菜单选项
- 实现红外线和可见光视频的下载功能
- 使用 FileSaver.js 库进行文件下载
---
 .../recordInspectionCabinet/VideoPlayer.vue   | 30 +++++++++++++++++--
 1 file changed, 28 insertions(+), 2 deletions(-)

diff --git a/ruoyi-ui/src/views/record/recordInspectionCabinet/VideoPlayer.vue b/ruoyi-ui/src/views/record/recordInspectionCabinet/VideoPlayer.vue
index 1e447e4..930f2ba 100644
--- a/ruoyi-ui/src/views/record/recordInspectionCabinet/VideoPlayer.vue
+++ b/ruoyi-ui/src/views/record/recordInspectionCabinet/VideoPlayer.vue
@@ -8,6 +8,7 @@
 
 <script>
 import DPlayer from 'dplayer';
+import { saveAs } from 'file-saver';
 
 export default {
   data() {
@@ -60,7 +61,16 @@ export default {
         video: {
           url: this.thermalVideoUrl,
           type: 'auto'
-        }
+        },
+        contextmenu: [
+          {
+            text: '下载视频',
+            link: this.thermalVideoUrl,
+            click: () => {
+              this.downloadVideo(this.thermalVideoUrl, 'thermal-video.mp4');
+            }
+          }
+        ]
       });
 
       this.visiblePlayer = new DPlayer({
@@ -69,8 +79,24 @@ export default {
         video: {
           url: this.visibleVideoUrl,
           type: 'auto'
-        }
+        },
+        contextmenu: [
+          {
+            text: '下载视频',
+            link: this.visibleVideoUrl,
+            click: () => {
+              this.downloadVideo(this.visibleVideoUrl, 'visible-video.mp4');
+            }
+          }
+        ]
       });
+    },
+
+    downloadVideo(url, filename) {
+      fetch(url)
+        .then(response => response.blob())
+        .then(blob => saveAs(blob, filename))
+        .catch(error => console.error('下载失败:', error));
     }
   },