Procházet zdrojové kódy

reactor:附件处理;

zhangchong před 6 měsíci
rodič
revize
b8a0d39a18
2 změnil soubory, kde provedl 42 přidání a 15 odebrání
  1. 15 0
      src/api/public/file.ts
  2. 27 15
      src/components/AnnexList/index.vue

+ 15 - 0
src/api/public/file.ts

@@ -51,3 +51,18 @@ export const fileDownload = (params: object) => {
 		reduce_data_format:false
 	});
 };
+/**
+ * @description 下载文件 (文件服务)
+ * @param {object}  params
+ */
+export const fileDownloadByUrl = (params: object) => {
+	return request({
+		url: `/file/downloadfile`,
+		method: 'get',
+		responseType: 'blob',
+		params,
+		baseURL: import.meta.env.VITE_API_UPLOAD_URL,
+	},{
+		reduce_data_format:false
+	});
+};

+ 27 - 15
src/components/AnnexList/index.vue

@@ -14,7 +14,7 @@
 			:on-success="updateData"
 			:disabled="props.readonly"
 			:on-error="onUploadError"
-      :limit="fileLimit"
+			:limit="fileLimit"
 		>
 			<template v-if="!props.readonly">
 				<el-button> <SvgIcon name="ele-Upload" /> {{ props.name }} </el-button>
@@ -26,7 +26,7 @@
 			<slot> </slot>
 			<template #file="{ file }">
 				<div class="el-upload-list__item-info">
-					<a class="el-upload-list__item-name" @click="onPreview(file)" >
+					<a class="el-upload-list__item-name" @click="onPreview(file)">
 						<SvgIcon class="mr3" name="ele-Document" size="16px" />
 						<span class="el-upload-list__item-file-name" :title="file.name">{{ file.name }}</span>
 						<span @click.stop="" v-if="!props.readonly">
@@ -58,7 +58,8 @@ import { computed, ref, watch } from 'vue';
 import { downloadFileBySrc } from '@/utils/tools';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import Other from '@/utils/other';
-const emit = defineEmits(['update:modelValue', 'update:format','change']);
+import { fileDownloadByUrl } from '@/api/public/file';
+const emit = defineEmits(['update:modelValue', 'update:format', 'change']);
 const props = defineProps({
 	name: {
 		// 上传按钮名称
@@ -109,7 +110,7 @@ const updateData = () => {
 	emit('update:modelValue', fileList.value);
 	const data = formatData(Other.deepClone(fileList.value));
 	emit('update:format', data);
-  emit('change',fileList.value,data)
+	emit('change', fileList.value, data);
 };
 // 获取文件的文件名
 const getFileName = (fileName: string): string | undefined => {
@@ -124,14 +125,14 @@ const formatData = (data: any) => {
 	return data.map((v: any) => {
 		return {
 			name: v.name,
-			fileName:v.name,
+			fileName: v.name,
 			additions: v?.response?.result.id,
 			path: v?.response?.result?.path,
 			publicity: v?.publicity ? 1 : 0,
 			classify: props.classify,
 			key: props.businessId,
-			url:import.meta.env.VITE_API_UPLOAD_URL + v?.response?.result?.path,
-			allPath:import.meta.env.VITE_API_UPLOAD_URL + v?.response?.result?.path,
+			url: import.meta.env.VITE_API_UPLOAD_URL + v?.response?.result?.path,
+			allPath: import.meta.env.VITE_API_UPLOAD_URL + v?.response?.result?.path,
 		};
 	});
 };
@@ -154,7 +155,7 @@ const handleChangeFile = (file: any, fileList: any) => {
 };
 // 上传失败
 const onUploadError = (error: Error) => {
-  const errMessage = JSON.parse(error.message)?.message ?? '上传失败';
+	const errMessage = JSON.parse(error.message)?.message ?? '上传失败';
 	ElMessage.error(errMessage);
 };
 // 删除
@@ -174,8 +175,8 @@ const handleRemove = (uploadFile: any) => {
 };
 // 下载
 const handleDownload = (uploadFile: any) => {
-	const path = uploadFile.path ? uploadFile.path : uploadFile.response.result.path ? uploadFile.response?.result.path : '';
-	if (!path) {
+	const id = uploadFile.path ? uploadFile.additions : uploadFile.response.result.id ? uploadFile.response?.result.id : '';
+	if (!id) {
 		ElMessage.error('附件不存在');
 		return;
 	}
@@ -188,9 +189,20 @@ const handleDownload = (uploadFile: any) => {
 		cancelButtonClass: 'default-button',
 	})
 		.then(() => {
-			const fileName = uploadFile.name;
-			const url = import.meta.env.VITE_API_UPLOAD_URL + path;
-			downloadFileBySrc(url, fileName);
+			fileDownloadByUrl({
+				Source: 'hotline',
+				Id: uploadFile.response.result.id,
+			}).then((res: any) => {
+				let blob: Blob = new Blob([res.data], { type: res.data.type }); // 创建blob 设置blob文件类型 data 设置为后端返回的文件(例如mp3,jpeg) type:这里设置后端返回的类型 为 mp3
+				let down: HTMLAnchorElement = document.createElement('a'); // 创建A标签
+				let href: string = window.URL.createObjectURL(blob); // 创建下载的链接
+				down.href = href; // 下载地址
+				down.download = uploadFile.response.result.fileName; // 下载文件名
+				document.body.appendChild(down);
+				down.click(); // 模拟点击A标签
+				document.body.removeChild(down); // 下载完成移除元素
+				window.URL.revokeObjectURL(href); // 释放blob对象
+			});
 		})
 		.catch(() => {});
 };
@@ -203,7 +215,7 @@ const onPreview = (file: any) => {
 	}
 	// 确定是否下载
 	const url = import.meta.env.VITE_API_UPLOAD_URL + path;
-  window.open(url);
+	window.open(url);
 };
 watch(
 	() => props.modelValue,
@@ -212,7 +224,7 @@ watch(
 		emit('update:modelValue', fileList.value);
 		const data = formatData(Other.deepClone(fileList.value));
 		emit('update:format', data);
-    emit('change',fileList.value,data)
+		emit('change', fileList.value, data);
 	},
 	{ deep: true, immediate: true }
 );