diff --git a/src/pages/measure/components/MeasureDetail.tsx b/src/pages/measure/components/MeasureDetail.tsx index fe8f99f..501f3b8 100644 --- a/src/pages/measure/components/MeasureDetail.tsx +++ b/src/pages/measure/components/MeasureDetail.tsx @@ -144,19 +144,19 @@ export default function MeasureDetail() { setIsModaUploadlOpen(true) } - const onDownloadData = async () =>{ - setIdList([]) - let list = [...selectRows] - let Ids:number[] = [] - list.map(item => { - Ids.push(item.id) - }) - setIdList(Ids) - const response = await fetch(`/api/measurement-task/downloads/${Ids.join(',')}`); - const blob = await response.blob(); // 先获取 Blob - const arrayBuffer = await blob.arrayBuffer(); // 将 Blob 转换为 ArrayBuffer - exportFile(arrayBuffer, `坐标数据.xls`); // 传递 ArrayBuffer 给函数 - } + const onDownloadData = async () => { + // 1. 准备 id 列表 + const Ids = selectRows.map(r => r.id); + // 2. 发起请求 + const response = await fetch(`/api/measurement-data/downloads-zip/${Ids.join(',')}`); + // 3. 拿到 Blob + const blob = await response.blob(); + // 4. 解析后端文件名 + const contentDisp = response.headers.get('content-disposition'); + const filename = parseFilename(contentDisp) || 'download.zip'; + // 5. 触发下载 + exportFile(blob, filename); + }; const [percent, setPercent] = useState(0) @@ -233,14 +233,30 @@ export default function MeasureDetail() { getMeasurePoints(item) } - //导出 - const onDownloadRecord = async(item:DetailTable) => { - const response = await fetch(`/api/measurement-task/download/${item.id}`); - const blob = await response.blob(); // 先获取 Blob - const arrayBuffer = await blob.arrayBuffer(); // 将 Blob 转换为 ArrayBuffer - exportFile(arrayBuffer, `${item.name}.txt`); // 传递 ArrayBuffer 给函数 + function parseFilename(disposition: string | null): string | null { + if (!disposition) return null; + // 匹配 filename*=UTF-8''xxx 或 filename=xxx(带不带引号都能捕获) + const match = disposition.match(/filename\*?=(?:UTF-8'')?["']?([^"';]+)["']?/i); + return match ? decodeURIComponent(match[1]) : null; } + //导出 + const onDownloadRecord = async (item: DetailTable) => { + // 1. 发请求 + const response = await fetch(`/api/measurement-data/download/${item.id}`); + + // 2. 拿到 Blob + const blob = await response.blob(); + + // 3. 解析头里的文件名 + const contentDisp = response.headers.get('content-disposition'); + // fallback 到 item.name + .txt + const filename = parseFilename(contentDisp) || `${item.name}.txt`; + + // 4. 触发下载 + exportFile(blob, filename); + }; + const getMeasurePoints = (recordItem:DetailTable) => { getPointsById({id:recordItem.id}).then(res=>{ if (canvasRef.current) { diff --git a/src/utils/index.ts b/src/utils/index.ts index 3803b80..847fb09 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -87,18 +87,13 @@ export function findSymmetricPoint(px: number, py: number, ox = 0, oy = 0) { } -export function exportFile(response: ArrayBuffer, fileName: string){ - // 创建 Blob 对象 - const blob = new Blob([response], { type: 'application/octet-stream' }); - // 创建一个 URL 对象,将 Blob 对象转换为 URL - const url = window.URL.createObjectURL(blob); - const a = document.createElement('a'); - a.href = url; - a.download = fileName; - // 模拟点击 元素来触发下载 - a.click(); - // 释放 URL 对象 - window.URL.revokeObjectURL(url); +export function exportFile(blob: Blob, fileName: string) { + const url = window.URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = fileName; + a.click(); + window.URL.revokeObjectURL(url); } export function padNumber(num: number, length: number) {