无人机管理后台前端(已迁走)
张含笑
2025-08-05 c832bf2e80ac465e71b7a1c1f7a59d4252030989
src/views/dataCenter/dataCenter.vue
@@ -13,10 +13,10 @@
        <el-table
          v-loading="loadings"
          element-loading-text="加载中"
          stripe
          :data="tableData"
          class="custom-header"
          @selection-change="handleSelectionChange"
          @cell-click="handleCellClick"
        >
          <el-table-column type="selection" width="55" />
          <el-table-column label="序号" type="index" width="60">
@@ -35,7 +35,14 @@
          </el-table-column>
          <el-table-column property="nestName" label="所属机巢" />
          <el-table-column property="jobName" label="任务名称" show-overflow-tooltip />
          <el-table-column prop="nickName" label="文件名称" show-overflow-tooltip />
          <el-table-column prop="nickName" label="文件名称" width="160">
            <template #default="scope">
              <el-tooltip-copy :content="scope.row.nickName" :showCopyText="true">
                {{scope.row.nickName}}
              </el-tooltip-copy>
            </template>
          </el-table-column>
          <el-table-column property="link" label="缩略图" width="120">
            <template #default="scope">
              <img
@@ -45,13 +52,21 @@
                :src="scope.row?.smallUrl"
                alt=""
              />
              <img
                v-else-if="scope.row?.resultType === 1"
                :src="convertVideoUrlToThumbnail(scope.row?.link)"
                alt=""
                class="imageBox"
                @click="enterFullScreen(scope.row)"
              />
              <!-- 视频 -->
              <div v-else-if="scope.row?.resultType === 1" class="videoItem1">
                <img
                  :src="convertVideoUrlToThumbnail(scope.row?.link)"
                  alt=""
                  class="imageBox"
                  @click="enterFullScreen(scope.row)"
                />
                <img
                  class="playBox"
                  @click="enterFullScreen(scope.row)"
                  src="@/assets/images/dataCenter/videoplay.png"
                  alt=""
                />
              </div>
              <!-- 正射 -->
              <el-image
                v-else-if="scope.row?.resultType === 4"
@@ -73,7 +88,7 @@
          <el-table-column property="photoType" label="文件类别">
            <template #default="scope">
              <span>{{
                photoTypeMap[scope.row.photoType] ? photoTypeMap[scope.row.photoType] : 'tif'
                photoTypeMap[scope.row.photoType] ? photoTypeMap[scope.row.photoType] : '--'
              }}</span>
            </template>
          </el-table-column>
@@ -82,21 +97,24 @@
              <span>{{ resultTypeMap[row?.resultType] }}</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="150" align="center">
          <el-table-column label="操作" width="200" align="center">
            <template #default="scope">
              <span class="look" @click="lookDetail(scope.row)">查看</span>
              <span
                class="delete"
                @click="deleteDetail(scope.row)"
                v-if="scope.row.resultType !== 2"
                >删除</span
              <el-button icon="el-icon-view" type="text" @click="lookDetail(scope.row)"
                >查看</el-button
              >
              <span
                class="location"
                @click="positionDetail(scope.row)"
              <el-button
                v-if="scope.row.resultType !== 2"
                icon="el-icon-delete"
                type="text"
                @click="deleteDetail(scope.row)"
                >删除</el-button
              >
              <el-button
                v-if="shouldShowLocation(scope.row)"
                >定位</span
                type="text"
                @click="positionDetail(scope.row)"
              >
                <img :src="positionicon" class="custom-icon" />定位</el-button
              >
            </template>
          </el-table-column>
@@ -188,7 +206,7 @@
              文件类型:{{
                photoTypeMap[dialogDetailList?.photoType]
                  ? photoTypeMap[dialogDetailList?.photoType]
                  : 'tif'
                  : '--'
              }}
            </div>
            <div>
@@ -258,6 +276,8 @@
</template>
<script setup>
import videoplay from '@/assets/images/dataCenter/videoplay.png';
import positionicon from '@/assets/images/dataCenter/positionicon.png';
import { useStore } from 'vuex';
import { PublicCesium } from '@/utils/cesium/publicCesium';
import { Cartesian3 } from 'cesium';
@@ -291,6 +311,7 @@
import { getShowImg, getSmallImg, getzsSmallImg } from '@/utils/util';
import { onMounted, watch } from 'vue';
import dayjs from 'dayjs';
import ElTooltipCopy from '@/components/ElTooltipCopy.vue';
function bytesToMB(bytes, decimalPlaces = 2) {
  if (typeof bytes !== 'number' || bytes < 0) return '0';
@@ -697,6 +718,14 @@
  viewer = null;
  isMapInitialized.value = false;
}
function handleCellClick(row, column) {
  console.log(row,column.no)
  if (column.no === 5) {
    navigator.clipboard.writeText(row.nickName).then(() => {
      ElMessage.success('复制文件名称成功')
    })
  }
}
onMounted(() => {
  getaiImagesPage();
  // 监听打开全景事件
@@ -730,7 +759,12 @@
      cursor: pointer;
      margin-right: 10px;
    }
    .custom-icon {
      width: 14px;
      height: 14px;
      margin-right: 5px;
      vertical-align: middle;
    }
    .delete {
      color: #ff241c;
      margin-right: 10px;
@@ -756,7 +790,17 @@
    width: 76px;
    height: 72px;
  }
  .videoItem1 {
    .playBox {
      width: 20px;
      height: 20px;
      position: absolute;
      top: 46%;
      left: 43%;
      transform: translate(-50%, -50%);
      cursor: pointer;
    }
  }
  .videoDialog :deep(.el-dialog) {
    height: 600px;
    width: 54%;