无人机管理后台前端(已迁走)
张含笑
2025-09-01 2ca94de8ede18ac07ccfd8dec7b6f6a707adde9b
src/views/dataCenter/dataCenter.vue
@@ -4,19 +4,23 @@
  >
    <div class="dataCenter-table">
      <searchData
      ref="searchBoxRef"
      :searchjobId="searchjobId"
      :switchFolders="switchFolders"
        @search="searchClick"
        @downFun="downloadFile"
        @allDownFun="aLLDownloadFile"
          @handleswitchFolders="handleswitchFolders"
        @handleswitchFolders="handleswitchFolders"
        @handleBack ="handleBack"
       :viewDetails ="viewDetails"
      ></searchData>
      <!-- 文件夹 -->
      <div v-if="switchFolders"  v-loading="loadings "   element-loading-text="加载中">
      <div v-if="switchFolders" class="dataTable">
            <el-table
         class="custom-header custom-body"
          v-loading="loadings"
          element-loading-text="加载中"
          element-loading-text=""
          :data="folderList"  
            @selection-change="foldersSelectionChange"
        >
@@ -24,14 +28,23 @@
          <el-table-column label="序号" type="index" width="60">
            <template #default="{ $index }">
              {{
                ($index + 1 + (jobListParams.current - 1) * jobListParams.size)
                ($index + 1 + (FolderListParams.page - 1) * FolderListParams.page_size)
                  .toString()
                  .padStart(2, '0')
              }}
            </template>
          </el-table-column>
          <el-table-column property="name" label="任务名称" show-overflow-tooltip />
          <el-table-column property="nickname" label="所属机巢" />
          <el-table-column property="name" label="任务名称" show-overflow-tooltip />
           <el-table-column property="regionName" label="所属区域">
             <template #default="scope">
              <span>{{scope.row.city_name ? scope.row.city_name :'--'}},{{scope.row.area_name ? scope.row.area_name :'--'}}</span>
            </template>
            </el-table-column>
          <el-table-column property="nickname" label="所属机巢" >
             <template #default="scope">
              <span>{{scope.row.nickname ? scope.row.nickname :'--'}}</span>
            </template>
            </el-table-column>
          <el-table-column label="操作" align="center">
            <template #default="scope">
              <el-button icon="el-icon-view" type="text" @click="foldersOpen(scope.row)"
@@ -45,7 +58,7 @@
      <div class="dataTable" v-else>
        <el-table   
          v-loading="loadings"
          element-loading-text="加载中"
          element-loading-text=""
          :data="tableData"
          class="custom-header"
          @selection-change="handleSelectionChange"
@@ -323,14 +336,6 @@
import EventPopUpBox from '@/hooks/components/EventPopUpBox.vue';
import { nextTick, render } from 'vue';
import defaultIcon from '@/assets/images/dataCenter/datamap/eventCompleted.png';
const userInfo = computed(() => store.getters.userInfo);
const isShow = defineModel('show');
const viewerRef = shallowRef(null);
let viewer = null;
const viewInstance = shallowRef(null);
const store = useStore();
const currentAreaPosition = ref({ height: 1987280, latitude: 27.636112, longitude: 115.732975 });
let handler = null;
import EventBus from '@/utils/eventBus';
import dataCenterMap from '@/views/dataCenter/components/dataCenterMap.vue';
import PanoramaPopup from '@/components/PanoramaPopup/PanoramaPopup.vue'; //全景
@@ -346,8 +351,15 @@
  updataTitleApi,
  getOrthoimageInfo, getDownloadStatusApi,getJobIdsBySnApi
} from '@/api/dataCenter/dataCenter';
const userInfo = computed(() => store.getters.userInfo);
const isShow = defineModel('show');
const viewerRef = shallowRef(null);
let viewer = null;
const viewInstance = shallowRef(null);
const store = useStore();
const currentAreaPosition = ref({ height: 1987280, latitude: 27.636112, longitude: 115.732975 });
let handler = null;
const switchFolders = ref(false)
function bytesToMB(bytes, decimalPlaces = 2) {
  if (typeof bytes !== 'number' || bytes < 0) return '0';
  return (bytes / 1048576).toFixed(decimalPlaces) + ' MB';
@@ -436,10 +448,10 @@
    startTime: jobListParams.searchParams.startTime?.slice(0, 10),
    endTime: jobListParams.searchParams.endTime?.slice(0, 10),
     waylineName:'',
    dockSn:'',
    areaCode:''
});
const tableData = ref([]);
// 获取列表数据
const getaiImagesPage = () => {
  loadings.value = true;
@@ -472,29 +484,17 @@
      loadings.value = false; 
    });
};
const folderList = ref([])
// 获取文件夹数据
const getFolderList=(nestDataList)=>{
 loadings.value = true;
 const apiParams = {
    ...FolderListParams,
  };
  getJobIdsBySnApi(apiParams)
const getFolderList=()=>{
    loadings.value = true;
    const apiParams = {
      ...FolderListParams,
      };
    getJobIdsBySnApi(apiParams)
      .then(res => {
     folderList.value = res.data.data.records?.map(i=>{
       let nickname = '';
      nestDataList?.forEach(nestItem=>{
      if(i.device_sn === nestItem.device_sn){
        nickname = nestItem.nickname
      }
      })
       return {
          ...i,
          nickname: nickname,
          checked: false
        };
     })
    folderList.value = res.data.data.records.map(i => ({ ...i, checked: false }))
    total.value = res.data.data.total  
      })
      .finally(() => {
@@ -502,30 +502,44 @@
      })
}
const searchjobId = ref('')
const viewDetails = ref('')
// 文件夹查看
const foldersOpen = (val)=>{
    loadings.value = true;
    tableData.value=[]
    searchjobId.value = val.job_id
    switchFolders.value = false
    viewDetails.value = true
}
// 获取数据时使用各自的分页参数
const fetchData = (val) => {
const fetchData = () => {
  if (switchFolders.value) {
    getFolderList(val);
    getFolderList();
  } else {
    getaiImagesPage();  
  }
};
// 切换文件夹
 const handleswitchFolders = (val) => {
 const handleswitchFolders = () => {
 searchjobId.value = ''
     switchFolders.value = !switchFolders.value;
     jobListParams.current = 1;
     FolderListParams.page = 1;
     fetchData(val);
     searchBoxRef.value?.handleReset();
      fetchData();
   };
   const handleBack =()=>{
    searchjobId.value = ''
    switchFolders.value = true
    viewDetails.value = false
    jobListParams.current = 1;
    FolderListParams.page = 1;
     fetchData();
   }
   const searchBoxRef = ref(null);
// 查询
const searchClick = params => {
  if(switchFolders.value){
@@ -534,6 +548,8 @@
    FolderListParams.startTime = params?.startTime?.slice(0, 10); 
    FolderListParams.endTime = params?.endTime?.slice(0, 10);
    FolderListParams.waylineName=params?.jobName,
   FolderListParams.dockSn = params?.deviceSn
   FolderListParams.areaCode = params?.areaCode
    getFolderList()
  }else{
     jobListParams.current = 1;