client-base-v5/src/archive/ArchivalRecord.vue

<template>
  <Loading v-if="loading" />
</template>

<script setup>
import { ref, onMounted } from 'vue';
import { useRouter } from 'vue-router';
import Common from '../common/Common.js';
import UserStorageResource from '../api/base/UserStorageResource.js';
import { message } from 'ant-design-vue';
const router = useRouter();
const loading = ref(false);
onMounted(() => {
  const uuid = router.currentRoute.value.query.uuid;
  UserStorageResource.uniqueByKey(uuid).then(
    success => {
      if (success.errorCode == 0) {
        if (success.data) {
          const allData = JSON.parse(success.data);
          downloadRecord(allData[0].id);
        } else {
          message.warning('请选择一条归档记录');
        }
      } else {
        message.warning(success.errorMessage);
      }
    },
    error => {
      Common.processException(error);
    },
    router.back(),
  );
});
const downloadRecord = recordId => {
  loading.value = true;
  const xhr = new XMLHttpRequest();
  xhr.open(
    'get',
    `api/ArchivesResource/download?archiveLogId=${recordId}`,
    true,
  );
  const token = localStorage.getItem('#token');
  xhr.setRequestHeader('token', token);
  xhr.setRequestHeader('Content-type', 'application/json');
  xhr.responseType = 'blob';
  xhr.onreadystatechange = function () {
    if (xhr.readyState === 4 && xhr.status === 200) {
      loading.value = false;
      let res = xhr.response;
      let blob = new Blob([res]);
      const blobUrl = URL.createObjectURL(blob);
      const link = document.createElement('a');
      link.download = '可视数据.zip';
      link.style.display = 'none';
      link.href = blobUrl;
      document.body.appendChild(link);
      link.click();
      URL.revokeObjectURL(blobUrl);
      document.body.removeChild(link);
      message.success('下载成功');
    } else {
      loading.value = false;
    }
  };
  xhr.send();
};
</script>

<style scoped>
</style>