feat: 下载问题

罗广辉

2025-11-25 f04f9d69cedbc72444bbe3bbefd36cd822b59c8b

 src/views/job/components/DeviceJobDetails.vue

@@ -4,7 +4,7 @@
      :width="pxToRem(1800)" :close-on-click-modal="false" :destroy-on-close="true">
      <div class="content">
         <div class="contentLeft">
            <div class="machineTableDetailsTitle"><span>详情</span></div>
            <div class="machineTableDetailsTitle"><img src="/src/assets/images/task/sign.svg" alt=""><span>详情</span></div>
            <div class="infoBox">
               <div class="itemBoxLeft">
                  <div v-for="(item, index) in infoList" :key="index" class="itemCon">
@@ -29,11 +29,14 @@
            </div>
            <JobRelatedEvents :jobTimes="jobTimes" :batchNo="batchNo" />
            <div class="devicetitle" v-if="isShow">
            <div>
                  <img src="/src/assets/images/task/sign.svg" alt="">
               <p>
                  成果数据
                  <span>{{ total }}</span>
                  个
               </p>
            </div>
               <div class="rightBox" v-if="total">
                  <div class="downloadBtn" @click="htlsrwxq === 100 && downloadFun()">
                     <el-progress v-if="htlsrwxq !== 100" :percentage="htlsrwxq" :show-text="false" striped striped-flow :duration="1" />
@@ -150,7 +153,7 @@

<script setup>
import PanoramaPopup from '@/components/PanoramaPopup/PanoramaPopup.vue';
import { getShowImg, getSmallImg, getzsSmallImg,getzsShowImg } from '@/utils/util';
import { getShowImg, getSmallImg, getzsSmallImg, getzsShowImg, aLinkDownloadUtil } from '@/utils/util';
import { getaiImagesPageAPI,cancelDownloadApi,getDownloadStatusApi,attachDownload,aiImagesPage} from '@/api/dataCenter/dataCenter';
import { pxToRem } from '@/utils/rem'
import JobRelatedEvents from './JobRelatedEvents.vue'
@@ -159,6 +162,7 @@
import { droneEventList } from '../const/drc'
import { ElMessage,ElLoading } from 'element-plus'
import { useStore } from 'vuex';
import EventBus from '@/utils/eventBus';
const store = useStore();
const htlsrwxq = computed(() => store.state.common.downloadProgress?.htlsrwxq || 100)
const isShow = defineModel('show')
@@ -181,10 +185,11 @@
   { name: '任务类型', value: '', field: 'industry_type_str' },
   { name: '飞行事件', value: '', field: 'event_number' },
   { name: '所属机巢', value: '', field: 'device_names' },
   { name: '所属单位', value: '', field: 'dept_name' },
   { name: '所属部门', value: '', field: 'dept_name' },
   { name: '任务时间', value: '', field: 'cycle_time_value' },
   { name: '关联算法', value: '', field: 'ai_type_str' },
   { name: '任务描述', value: '', field: 'remark' },
  { name: '自定义识别区', value: '', field: 'enable_custom_area' },
   // { name: '任务执行次数', value: '', field: 'job_num' },
])
// 机巢状态
@@ -268,6 +273,9 @@
               droneEventList.filter(({ value }) => actionActuatorFunc === value)
            )
         }
      if (item.name === '自定义识别区') {
        item.value = res.data.data.enable_custom_area ? '是': '否'
      }
            getJobsAllFiles({
         wayLineJobId: detailsData.value.way_lines.map(item => item.job_id).join(','),
         resultTypes: [0, 2, 4, 5],
@@ -307,8 +315,8 @@
   if (!list?.length) return ElMessage.warning('请选择文件')
   if (list.length === 1) {
      list.forEach((item, index) => {
         const suffix = item.url.split('.').pop()
         aLinkDownloadUtil(item.url, item.nickName + '.' + suffix)
         const suffix = item.link.split('.').pop()
         aLinkDownloadUtil(item.link, item.nickName + '.' + suffix)
      })
   } else {
      loadingData = ElLoading.service({ background: 'rgba(0, 0, 0, 0.5)', text: '打包中，请稍等...' })
@@ -347,7 +355,9 @@
function cancelDownload() {
   cancelDownloadApi({ type:'htlsrwxq' }).then(res =>{
      ElMessage.success('取消成功')
   })
   }).catch(e =>{
    EventBus.emit('useGlobalWS-messageHandler', {biz_code: 'DOWNLOAD_PROGRESS',data:{status: 'CANCELLED',type:'htlsrwxq'}})
  })
}
onMounted(() => {
   getDetails()
@@ -384,14 +394,18 @@

      .machineTableDetailsTitle {
         margin-bottom: 10px;
         background: url('/src/assets/images/task/detailtitle.png') no-repeat center;
         // background: url('/src/assets/images/task/detailtitle.png') no-repeat center;
         border-bottom: 2px solid #e4e7ed;
         background-size: 100% 100%;

         img{
         width: 15px;
         height: 15px;}
         span {
            display: inline-block;
            margin-left: 30px;
            margin-left: 10px;
            font-size: 16px;
            color: #0282ff;
            // color: #0282ff;
            color: #303133;
            line-height: 20px;
            text-align: left;
            margin-bottom: 8px;
@@ -400,12 +414,13 @@

      .devicetitle {
         margin-bottom: 16px;
         background: url('/src/assets/images/task/detailtitle.png') no-repeat center;
         // background: url('/src/assets/images/task/detailtitle.png') no-repeat center;
         border-bottom: 2px solid #e4e7ed;
         background-size: 100% 100%;
         display: flex;
         justify-content: space-between;
         align-content: center;
.rightBox{
         .rightBox{
            display: flex;
            align-items: center;
            padding-right: 10px;
@@ -451,9 +466,12 @@

            }
         }
         img{
         width: 15px;
         height: 15px;}
         p {
            display: inline-block;
            margin-left: 30px;
            margin-left: 10px;
            font-size: 16px;
            color: #363636;
            line-height: 20px;