Explorar o código

在处理的操作面板中添加下载功能,帮助用户下载曝光后的图像

dengdx hai 2 semanas
pai
achega
1b59378a75
Modificáronse 1 ficheiros con 106 adicións e 2 borrados
  1. 106 2
      src/pages/view/components/TransferArea.tsx

+ 106 - 2
src/pages/view/components/TransferArea.tsx

@@ -1,12 +1,14 @@
-import React from 'react';
-import { Button,Flex } from 'antd';
+import React, { useState } from 'react';
+import { Button, Flex, message } from 'antd';
 import { useDispatch } from 'react-redux';
 import { switchToSendPanel } from '../../../states/panelSwitchSliceForView';
 import { useButtonAvailability } from '@/utils/useButtonAvailability';
+import * as cornerstone from '@cornerstonejs/core';
 
 const TransferArea = () => {
   const dispatch = useDispatch();
   const { disabled } = useButtonAvailability('Send');
+  const [downloading, setDownloading] = useState(false);
 
   const handleSendClick = () => {
     if (disabled) {
@@ -15,6 +17,95 @@ const TransferArea = () => {
     dispatch(switchToSendPanel());
   };
 
+  const handleDownloadClick = async () => {
+    if (downloading) return; // 防止重复点击
+
+    setDownloading(true);
+    message.loading({ content: '正在下载 DICOM 图像...', key: 'download' });
+    try {
+      // 获取所有启用的元素
+      const enabledElements = cornerstone.getEnabledElements();
+
+      if (enabledElements.length === 0) {
+        message.error({ content: '未找到可用的图像查看器', key: 'download' });
+        return;
+      }
+
+      // 使用第一个启用的 viewport
+      const viewport = enabledElements[0].viewport as cornerstone.StackViewport;
+
+      // 获取所有图像 ID(原始 URL 数组)
+      const allImageIds = viewport.getImageIds();
+
+      if (!allImageIds || allImageIds.length === 0) {
+        message.error({ content: '未找到图像数据', key: 'download' });
+        return;
+      }
+
+      // 获取当前图像的索引
+      const currentIndex = viewport.getCurrentImageIdIndex();
+
+      if (currentIndex < 0 || currentIndex >= allImageIds.length) {
+        message.error({ content: '当前图像索引无效', key: 'download' });
+        return;
+      }
+
+      // 获取当前图像的原始 URL
+      const downloadUrl = allImageIds[currentIndex];
+
+      if (!downloadUrl) {
+        message.error({ content: '无法获取图像下载地址', key: 'download' });
+        return;
+      }
+
+      console.log('Downloading from URL:', downloadUrl);
+      const downloadUrlWithoutPrefix = downloadUrl.slice(9);
+
+      // 下载完整的 DICOM 文件
+      const response = await fetch(downloadUrlWithoutPrefix
+      //   , {
+      //   // headers: {
+      //   //   'Authorization': `Bearer ${localStorage.getItem('token') || ''}`,
+      //   //   'Language': 'en',
+      //   //   'Product': 'VETDROS',
+      //   //   'Source': 'Electron',
+      //   // }
+      // }
+    );
+
+      if (!response.ok) {
+        throw new Error(`HTTP error! status: ${response.status}`);
+      }
+
+      const dicomBlob = await response.blob();
+
+      // 创建文件名
+      const timestamp = new Date().toISOString().slice(0, 19).replace(/:/g, '-');
+      const filename = `dicom-image-${timestamp}.dcm`;
+
+      // 创建下载链接
+      const url = URL.createObjectURL(dicomBlob);
+      const link = document.createElement('a');
+      link.href = url;
+      link.download = filename;
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+
+      // 清理 URL 对象
+      URL.revokeObjectURL(url);
+
+      message.success({ content: 'DICOM 图像下载成功!', key: 'download' });
+      console.log('DICOM image downloaded successfully from URL:', downloadUrl);
+
+    } catch (error) {
+      console.error('Error downloading DICOM image:', error);
+      message.error({ content: '下载失败,请重试', key: 'download' });
+    } finally {
+      setDownloading(false);
+    }
+  };
+
   return (
     <Flex wrap gap="small" align="center" justify="start" className="p-1">
       <Button
@@ -29,6 +120,19 @@ const TransferArea = () => {
       >
         Send
       </Button>
+      <Button
+        style={{
+          width: '1.5rem',
+          height: '1.5rem',
+          padding: 0,
+        }}
+        onClick={handleDownloadClick}
+        loading={downloading}
+        disabled={downloading}
+        title="Download DICOM Image"
+      >
+        ↓
+      </Button>
     </Flex>
   );
 };