| | |
| | | }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="regionName" label="所属区域" > |
| | | <el-table-column prop="regionName" label="所属区域" v-if="!isDistrictLevel"> |
| | | <template #default="scope"> |
| | | <span>{{processAddress(scope.row.regionName)}}</span> |
| | | <span>{{ processAddress(scope.row.regionName) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column property="nestName" label="所属机巢" /> |
| | |
| | | <span class="delete" @click="deleteDetail(scope.row)" v-if="scope.row.resultType !== 2" |
| | | >删除</span |
| | | > |
| | | <!-- && !isTifFile(scope.row.nickName) |
| | | scope.row.resultType !== 1--> |
| | | |
| | | <span |
| | | class="location" |
| | | @click="positionDetail(scope.row)" |
| | |
| | | </template> |
| | | <div class="detailContainer"> |
| | | <div class="leftImg"> |
| | | <img |
| | | <!-- <img |
| | | v-if="dialogDetailList?.resultType === 1" |
| | | :src="convertVideoUrlToThumbnail(dialogDetailList?.link)" |
| | | alt="" |
| | | class="imageBox" |
| | | /> |
| | | /> --> |
| | | <!-- 视频 --> |
| | | <video |
| | | v-if="dialogDetailList?.resultType === 1" |
| | | style="width: 100%" |
| | | class="imageBox" |
| | | ref="videoRefs" |
| | | controls |
| | | autoplay |
| | | :src="dialogDetailList.link" |
| | | ></video> |
| | | <!-- 全景 --> |
| | | <!-- <img |
| | | class="quanjing" |
| | | @click="clickpanorama(dialogDetailList)" |
| | | v-else-if="dialogDetailList?.resultType === 5" |
| | | :src="dialogDetailList?.resultType?.smallUrl" |
| | | alt="" |
| | | /> --> |
| | | <!-- 地图 --> |
| | | <div |
| | | v-if="dialogDetailList?.resultType === 4" |
| | | v-else-if="dialogDetailList?.resultType === 4" |
| | | id="detaildataCenterMap" |
| | | class="ztzf-cesium" |
| | | ></div> |
| | |
| | | <div class="title"> |
| | | <div class="inputEdit"> |
| | | 文件名称:<span class="fileTitle" v-if="!dialogDetailList?.checkedinput">{{ |
| | | dialogDetailList?.editName |
| | | dialogDetailList?.nickName ? dialogDetailList?.nickName : '--' |
| | | }}</span> |
| | | <el-input |
| | | v-else |
| | | v-model="dialogDetailList.editName" |
| | | v-model="dialogDetailList.nickName" |
| | | @keyup.enter="saveTitle()" |
| | | class="title-input" |
| | | clearable |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div>任务名称:{{ dialogDetailList?.jobName }}</div> |
| | | <div>所属区域:{{ dialogDetailList?.regionName }}</div> |
| | | <div>拍摄机巢:{{ dialogDetailList?.nestName }}</div> |
| | | <div>任务名称:{{ dialogDetailList?.jobName ? dialogDetailList?.jobName : '--' }}</div> |
| | | <div> |
| | | 所属区域:{{ dialogDetailList?.regionName ? dialogDetailList?.regionName : '--' }} |
| | | </div> |
| | | <div>拍摄机巢:{{ dialogDetailList?.nestName ? dialogDetailList?.nestName : '--' }}</div> |
| | | <div> |
| | | 照片位置:{{ _.round(dialogDetailList?.longitude, 3) }},{{ |
| | | _.round(dialogDetailList?.latitude, 3) |
| | | }} |
| | | </div> |
| | | <div>任务时间:{{ dialogDetailList?.jobTime }}</div> |
| | | <div>拍摄时间:{{ dialogDetailList?.createTime }}</div> |
| | | <div>文件类型:{{ photoTypeMap[dialogDetailList?.photoType] }}</div> |
| | | <div>文件格式:{{ resultTypeMap[dialogDetailList?.resultType] }}</div> |
| | | <div>照片文件大小:{{ bytesToMB(dialogDetailList?.attachSize) }}</div> |
| | | <div>任务时间:{{ dialogDetailList?.jobTime ? dialogDetailList?.jobTime : '--' }}</div> |
| | | <div> |
| | | 拍摄时间:{{ dialogDetailList?.createTime ? dialogDetailList?.createTime : '--' }} |
| | | </div> |
| | | <div> |
| | | 文件类型:{{ |
| | | photoTypeMap[dialogDetailList?.photoType] |
| | | ? photoTypeMap[dialogDetailList?.photoType] |
| | | : '--' |
| | | }} |
| | | </div> |
| | | <div> |
| | | 文件格式:{{ |
| | | resultTypeMap[dialogDetailList?.resultType] |
| | | ? resultTypeMap[dialogDetailList?.resultType] |
| | | : '--' |
| | | }} |
| | | </div> |
| | | <div> |
| | | 照片文件大小:{{ |
| | | bytesToMB(dialogDetailList?.attachSize) |
| | | ? bytesToMB(dialogDetailList?.attachSize) |
| | | : '--' |
| | | }} |
| | | </div> |
| | | <div> |
| | | <el-button |
| | | type="success" |
| | |
| | | import { onMounted, watch } from 'vue'; |
| | | import dayjs from 'dayjs'; |
| | | |
| | | |
| | | |
| | | function bytesToMB(bytes, decimalPlaces = 2) { |
| | | if (typeof bytes !== 'number' || bytes < 0) return '无效输入'; |
| | | return (bytes / 1048576).toFixed(decimalPlaces) + ' MB'; |
| | |
| | | ir: '红外', |
| | | }; |
| | | // 判断省市区 |
| | | const areas = userInfo.value.detail.areaCode |
| | | const areaCode = userInfo.value?.detail?.areaCode || ''; |
| | | // 判断账号级别 |
| | | const isProvinceLevel = computed(() => areaCode.endsWith('00000000')); // 省级:后8位为0 |
| | | const isCityLevel = computed(() => !isProvinceLevel.value && areaCode.endsWith('000000')); // 市级:后6位为0 |
| | | const isDistrictLevel = computed(() => !isProvinceLevel.value && !isCityLevel.value); // 区县级 |
| | | |
| | | // 处理区域名称的函数 |
| | | function processAddress(str) { |
| | | const parts = str.split(','); |
| | | if(areas ==="360000000000"){ |
| | | return parts.filter(part => !part.endsWith('省')).join(','); |
| | | } |
| | | // |
| | | // // 检查是否有省级单位(以"省"结尾) |
| | | // const hasProvince = parts.some(part => part.endsWith('省')); |
| | | // // 检查是否有市级单位(以"市"结尾) |
| | | // const hasCity = parts.some(part => part.endsWith('市')); |
| | | |
| | | // if (hasProvince) { |
| | | // // 移除省级部分(第一个以"省"结尾的元素) |
| | | // return parts.filter(part => !part.endsWith('省')).join(','); |
| | | // } else if (hasCity) { |
| | | // // 如果有市,返回空字符串 |
| | | // return ''; |
| | | // } |
| | | |
| | | // 既没有省也没有市,返回原字符串 |
| | | return str; |
| | | if (!str) return ''; |
| | | const parts = str.split(','); |
| | | // 省级账号:显示市和区(去除省级) |
| | | if (isProvinceLevel.value) { |
| | | return parts.filter(part => !part.endsWith('省')).join(','); |
| | | } |
| | | // 市级账号:只显示区(去除省和市) |
| | | if (isCityLevel.value) { |
| | | return parts.filter(part => !part.endsWith('省') && !part.endsWith('市')).join(','); |
| | | } |
| | | // 区县级账号:不显示区域信息(在模板中已隐藏该列) |
| | | return ''; |
| | | } |
| | | const showRegionColumn = computed(() => { |
| | | // 检查表格数据中是否有任何行的 regionName 处理后不为空 |
| | | // 是否显示列 |
| | | return tableData.value.some(row => { |
| | | const processed = processAddress(row.regionName || ''); |
| | | return processed !== ''; |
| | |
| | | orderByCreateTime: jobListParams.orderByCreateTime, |
| | | ...jobListParams.searchParams, |
| | | }; |
| | | getaiImagesPageAPI(params, { current: jobListParams.current, size: jobListParams.size }).then( |
| | | res => { |
| | | |
| | | getaiImagesPageAPI(params, { |
| | | current: jobListParams.current, |
| | | size: jobListParams.size |
| | | }) |
| | | .then(res => { |
| | | total.value = res.data.data.total; |
| | | tableData.value = res.data.data.records.map(i => ({ |
| | | ...i, |
| | |
| | | showUrl: getShowImg(i?.link), |
| | | file_name: i.name.split('/').pop(), |
| | | })); |
| | | // console.log('res', tableData.value); |
| | | loadings.value = false; |
| | | } |
| | | ); |
| | | }) |
| | | .catch(error => { |
| | | // 可选:这里可以添加错误处理逻辑 |
| | | console.error("获取数据失败:", error); |
| | | }) |
| | | .finally(() => { |
| | | loadings.value = false; // 无论成功失败都会执行 |
| | | }); |
| | | }; |
| | | // 查询 |
| | | const searchClick = params => { |
| | |
| | | const fileDownload = () => { |
| | | const list = selectedRows.value.filter(i => i.checked); |
| | | if (!list?.length) return ElMessage.warning('请选择文件'); |
| | | if (list.length === 1) { |
| | | list.forEach((item, index) => { |
| | | setTimeout(() => { |
| | | aLinkDownload(item.url, item?.nickName); |
| | | }, index * 500); // 每个文件下载间隔50毫秒 |
| | | }); |
| | | } else { |
| | | if (list.length === 1) { |
| | | list.forEach((item, index) => { |
| | | const suffix = item.url.split('.').pop() |
| | | aLinkDownload(item.url, item.nickName + '.' + suffix) |
| | | }) |
| | | } else { |
| | | loading = ElLoading.service({ background: 'rgba(0, 0, 0, 0.5)', text: '打包中,请稍等...' }); |
| | | const fileIds = list.map(i => i.id); |
| | | let aaa = { |
| | |
| | | fileDownload(); |
| | | }; |
| | | const detailDownLoad = val => { |
| | | aLinkDownload(val.link, val?.nickName); |
| | | const suffix = val.url?.split('.').pop() |
| | | aLinkDownload(val.link, val?.nickName + '.' + suffix); |
| | | }; |
| | | // 全部下载 |
| | | const aLLDownloadFile = () => { |
| | |
| | | const saveTitle = item => { |
| | | const updateparams = { |
| | | id: item.id, |
| | | nickName: `${item.editName.trim()}`, |
| | | nickName: `${item.nickName.trim()}`, |
| | | }; |
| | | // 验证并提示 |
| | | if (!validateNickname(updateparams.nickName, '名称')) return; |
| | | item.checkedinput = false; |
| | | detailTitle.value = item.editName; |
| | | detailTitle.value = item.nickName; |
| | | updataTitleApi(updateparams) |
| | | .then(res => { |
| | | if (res.status === 200) { |
| | | ElMessage.success('修改成功'); |
| | | getaiImagesPage(); |
| | | } else { |
| | | ElMessage.error(res.data.message || '修改失败'); |
| | | } |
| | |
| | | }; |
| | | // 正射地图 |
| | | const yxShowBox = ref(false); |
| | | |
| | | const removeHandler = () => { |
| | | handler?.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK); |
| | | handler?.destroy(); |
| | |
| | | |
| | | // console.log('地图初始化完成'); |
| | | }; |
| | | // 查看弹框 |
| | | // 判断是否是正射 |
| | | function isTifFile(filename) { |
| | | const lastDot = filename.lastIndexOf('.'); |
| | | if (lastDot === -1) return false; // 无后缀 |
| | |
| | | const shouldShowLocation = row => { |
| | | return row.resultType !== 1 && row.resultType !== 4; |
| | | }; |
| | | // 查看弹框 |
| | | const dialogVisible = ref(false); |
| | | const dialogDetailList = ref(null); |
| | | const detailTitle = ref(''); |
| | | let curCustomImageryProvider = null; |
| | | const orthoimageApi = ref(''); |
| | | const positiongeom = ref(''); |
| | | const odmToken = ref(null); |
| | | const lookDetail = val => { |
| | | if (val.resultType === 4) { |
| | |
| | | dialogVisible.value = true; |
| | | detailTitle.value = val.nickName; |
| | | dialogDetailList.value = val; |
| | | console.log('3333', detailTitle.value, dialogDetailList.value); |
| | | |
| | | await nextTick(); |
| | | initMap(); |
| | | positiongeom.value = res.data.data.geom; |
| | | orthoimageApi.value = res.data.data.orthoimageApi; |
| | | odmToken.value = res.data.data.odmToken; |
| | | if (res.data.data != null && isMapInitialized.value === true) { |
| | |
| | | }) |
| | | ); |
| | | yxShowBox.value = true; |
| | | // 添加定位 |
| | | if (positiongeom.value) { |
| | | // 解析WKT格式的多边形坐标 |
| | | const wktString = positiongeom.value; |
| | | const coordinates = parseWKTCoordinates(wktString); |
| | | if (coordinates.length > 0) { |
| | | // 创建多边形边界 |
| | | const positions = coordinates.map(coord => |
| | | Cesium.Cartesian3.fromDegrees(coord[0], coord[1]) |
| | | ); |
| | | // 计算多边形的包围球 |
| | | const boundingSphere = Cesium.BoundingSphere.fromPoints(positions); |
| | | const viewer = viewInstance.value.getViewer(); |
| | | if (viewer && viewer.camera) { |
| | | viewer.camera.flyToBoundingSphere(boundingSphere, { |
| | | duration: 0, // 飞行动画持续时间(秒) |
| | | offset: new Cesium.HeadingPitchRange(0, -0.5, boundingSphere.radius * 1.5), |
| | | }); |
| | | } else { |
| | | console.error('无法获取有效的 Viewer 或 camera 对象'); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | }); |
| | | } else { |
| | | getAttachInfoAPI(val.id).then(res => { |
| | | detailTitle.value = res.data.data.nickName.split('.jpeg')[0]; |
| | | // dialogDetailList.value = res.data.data; |
| | | dialogDetailList.value = { |
| | | ...res.data.data, |
| | | checkedinput: false, |
| | |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // WKT坐标解析函数 |
| | | function parseWKTCoordinates(wktString) { |
| | | // 解析POLYGON格式的WKT字符串 |
| | | const regex = /POLYGON\s*\(\((.*?)\)\)/i; |
| | | const match = wktString.match(regex); |
| | | if (!match || !match[1]) return []; |
| | | // 分割坐标对 |
| | | const coordinatePairs = match[1].split(/,\s*/); |
| | | return coordinatePairs.map(pair => { |
| | | const [lon, lat] = pair.trim().split(/\s+/).map(Number); |
| | | return [lon, lat]; |
| | | }); |
| | | } |
| | | function dialogClose() { |
| | | // 对话框关闭时清理资源 |
| | | viewInstance.value?.viewerDestroy(); |