|
@@ -21,7 +21,7 @@
|
|
|
</template>
|
|
|
<script lang="ts">
|
|
|
import {defineComponent, ref} from 'vue';
|
|
|
-import {message as $message} from "ant-design-vue/lib/components";
|
|
|
+//import {message as $message} from "ant-design-vue/lib/components";
|
|
|
//引入VueOfficeDocx组件
|
|
|
import VueOfficeDocx from '@vue-office/docx'
|
|
|
import '@vue-office/docx/lib/index.css'
|
|
@@ -29,7 +29,10 @@ import VueOfficePdf from '@vue-office/pdf'
|
|
|
//引入VueOfficeExcel组件
|
|
|
import VueOfficeExcel from '@vue-office/excel'
|
|
|
import '@vue-office/excel/lib/index.css'
|
|
|
-import {handleloadByGet} from "@/utils/downloadFile";
|
|
|
+//import {handleloadByGet} from "@/utils/downloadFile";
|
|
|
+import axios from 'axios';
|
|
|
+import {ACCESS_TOKEN_KEY} from "@/enums/cacheEnum";
|
|
|
+import {Storage} from '@/utils/Storage';
|
|
|
|
|
|
export default defineComponent({
|
|
|
name: 'b-file-preview',
|
|
@@ -50,17 +53,17 @@ export default defineComponent({
|
|
|
const previewUrl = ref<any>();
|
|
|
const fileSuffix = ref("");
|
|
|
|
|
|
- function loadFile() {
|
|
|
- let fileName = stripHtmlTags(props.fileName);
|
|
|
+ async function loadFile() {
|
|
|
+ /*let fileName = stripHtmlTags(props.fileName);
|
|
|
let filePath = stripHtmlTags(props.filePath);
|
|
|
fileSuffix.value = fileName?.substring(fileName?.lastIndexOf('.') + 1).toLowerCase();
|
|
|
|
|
|
if (props.accept?.indexOf(fileSuffix.value) < 0) {
|
|
|
$message.error("不支持预览的文件格式!");
|
|
|
return;
|
|
|
- }
|
|
|
+ }*/
|
|
|
spinning.value = true;
|
|
|
- handleloadByGet("/api/wellInfo/downFile", {
|
|
|
+ /*handleloadByGet("/api/wellInfo/downFile", {
|
|
|
isShow: 1,
|
|
|
fileName: fileName,
|
|
|
filePath: filePath
|
|
@@ -80,9 +83,60 @@ export default defineComponent({
|
|
|
//previewUrl.value = new Blob([res.data], {type: "application/octet-stream"});
|
|
|
// previewUrl.value = res.data;
|
|
|
|
|
|
- })
|
|
|
+ })*/
|
|
|
+ await downloadFileInChunks();
|
|
|
+ }
|
|
|
+
|
|
|
+ async function downloadFileInChunks(chunkSize = 1024 * 1024) {
|
|
|
+ let fileName = stripHtmlTags(props.fileName);
|
|
|
+ let filePath = stripHtmlTags(props.filePath);
|
|
|
+ fileSuffix.value = fileName?.substring(fileName?.lastIndexOf('.') + 1).toLowerCase();
|
|
|
+
|
|
|
+ let offset = 0;
|
|
|
+ let totalLength: any = chunkSize;
|
|
|
+ const chunks: any[] = [];
|
|
|
+ const token = Storage.get(ACCESS_TOKEN_KEY);
|
|
|
+ while (true) {
|
|
|
+ const headers = {Authorization: token};
|
|
|
+ headers['Range'] = `bytes=${offset}-${Math.min(offset + chunkSize - 1, totalLength - 1)}`;
|
|
|
+
|
|
|
+ try {
|
|
|
+ const response = await axios("/api/wellInfo/downFile", {
|
|
|
+ method: 'GET',
|
|
|
+ params: {
|
|
|
+ isShow: 1,
|
|
|
+ fileName: fileName,
|
|
|
+ filePath: filePath
|
|
|
+ },
|
|
|
+ responseType: 'arraybuffer',
|
|
|
+ headers,
|
|
|
+ timeout: 10000,
|
|
|
+ onDownloadProgress: (progressEvent) => {
|
|
|
+ console.log('Chunk download progress:', progressEvent);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ const contentRange: string = response.headers['content-range'];
|
|
|
+ totalLength = response.headers['content-length'];
|
|
|
+ if (contentRange) {
|
|
|
+ totalLength = parseInt(contentRange.split('/').pop() || "0", 10);
|
|
|
+ }
|
|
|
+ chunks.push(response.data);
|
|
|
+ offset += chunkSize;
|
|
|
+
|
|
|
+ if (offset >= totalLength) break;
|
|
|
+ } catch (error) {
|
|
|
+ console.error('Error downloading chunk:', error);
|
|
|
+ throw error;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ previewUrl.value = new Blob(chunks);
|
|
|
+ visible.value = true;
|
|
|
+ spinning.value = false;
|
|
|
}
|
|
|
- function changeHandle(event) {
|
|
|
+
|
|
|
+ function changeHandle(event) {
|
|
|
let file = event.target.files[0]
|
|
|
let fileReader = new FileReader()
|
|
|
fileReader.readAsArrayBuffer(file)
|
|
@@ -90,6 +144,7 @@ export default defineComponent({
|
|
|
previewUrl.value = fileReader.result;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
function stripHtmlTags(htmlString: string): string {
|
|
|
return htmlString.replace(/<[^>]+>/g, '');
|
|
|
}
|
|
@@ -108,7 +163,7 @@ export default defineComponent({
|
|
|
visible, fileSuffix,
|
|
|
previewUrl,
|
|
|
loadFile,
|
|
|
- rendered, renderedError,changeHandle,
|
|
|
+ rendered, renderedError, changeHandle,
|
|
|
spinning,
|
|
|
};
|
|
|
}
|