补充提交
This commit is contained in:
BIN
src/DataView/assets/加载失败.png
Normal file
BIN
src/DataView/assets/加载失败.png
Normal file
Binary file not shown.
After Width: | Height: | Size: 7.0 KiB |
@ -70,6 +70,11 @@ async function onloaddata(data) {
|
|||||||
|
|
||||||
// 处理数据
|
// 处理数据
|
||||||
await processSpectralData();
|
await processSpectralData();
|
||||||
|
|
||||||
|
if (!spectralDataList.value || spectralDataList.value.length === 0) {
|
||||||
|
const typeLabel = spectralTypeList.find(i => i.value === fromData.value.comBox1)?.label || fromData.value.comBox1;
|
||||||
|
ElMessage.warning(`当前数据没有${typeLabel}数据`);
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('加载数据失败:', error);
|
console.error('加载数据失败:', error);
|
||||||
updateChildComponents([], [], []);
|
updateChildComponents([], [], []);
|
||||||
|
@ -2,14 +2,13 @@
|
|||||||
<div class="maincontainer">
|
<div class="maincontainer">
|
||||||
<div class="container_item">
|
<div class="container_item">
|
||||||
<!-- 文件名显示 -->
|
<!-- 文件名显示 -->
|
||||||
<div class="filename_display" v-if="!isLastPage && currentItem?.url">
|
<div class="filename_display" v-if="!isLastPage">
|
||||||
<img src="../assets/文件图标-面.png">
|
<img src="../assets/文件图标-面.png">
|
||||||
{{ currentItem?.name || '暂无文件' }}
|
{{ currentItem?.name || '暂无文件' }}
|
||||||
</div>
|
</div>
|
||||||
<div class="filename_display" v-else>
|
<div class="filename_display" v-else>
|
||||||
地图
|
地图
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 轮播内容区域 -->
|
<!-- 轮播内容区域 -->
|
||||||
<div class="carousel-container">
|
<div class="carousel-container">
|
||||||
<!-- 左侧导航按钮 -->
|
<!-- 左侧导航按钮 -->
|
||||||
@ -22,9 +21,13 @@
|
|||||||
</svg>
|
</svg>
|
||||||
</button>
|
</button>
|
||||||
<div class="contemer_content">
|
<div class="contemer_content">
|
||||||
<img v-if="!isLastPage && currentItem?.url" :src="currentItem.url" />
|
<div class="jzsb" v-if="!isLastPage && currentItem.url == 'jzsb'">
|
||||||
|
<img src="../assets/加载失败.svg"></img>
|
||||||
|
<span>图片加载失败</span>
|
||||||
|
</div>
|
||||||
|
<img v-else-if="!isLastPage" :src="currentItem.url" />
|
||||||
<div v-else class="last-page-box">
|
<div v-else class="last-page-box">
|
||||||
<MapContainer :dataListMap="dataListMap"></MapContainer>
|
<MapContainer ref="mapRef" :dataListMap="dataListMap"></MapContainer>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -50,11 +53,12 @@ import MapContainer from "./MapContainer.vue";
|
|||||||
const imgeList = ref([])
|
const imgeList = ref([])
|
||||||
const currentIndex = ref(0)
|
const currentIndex = ref(0)
|
||||||
const dataListMap = ref([])
|
const dataListMap = ref([])
|
||||||
|
const mapRef = ref(null)
|
||||||
const isLastPage = computed(() => currentIndex.value === imgeList.value.length)
|
const isLastPage = computed(() => currentIndex.value === imgeList.value.length)
|
||||||
|
|
||||||
const currentItem = computed(() => {
|
const currentItem = computed(() => {
|
||||||
if (isLastPage.value) {
|
if (isLastPage.value) {
|
||||||
return null
|
return {}
|
||||||
}
|
}
|
||||||
return imgeList.value[currentIndex.value] || {}
|
return imgeList.value[currentIndex.value] || {}
|
||||||
})
|
})
|
||||||
@ -68,6 +72,14 @@ const onloaddata = async (jsondata, dataList) => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 新增:清空方法,确保图片与地图点都能被清理
|
||||||
|
const clear = () => {
|
||||||
|
imgeList.value = []
|
||||||
|
dataListMap.value = []
|
||||||
|
currentIndex.value = 0
|
||||||
|
mapRef.value?.clearMap()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// 上一项
|
// 上一项
|
||||||
const prevItem = () => {
|
const prevItem = () => {
|
||||||
@ -91,7 +103,8 @@ const goToItem = (index) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
onloaddata
|
onloaddata,
|
||||||
|
clear
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -144,7 +157,7 @@ defineExpose({
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 30vh;
|
height: 30vh;
|
||||||
display: flex;
|
display: flex;
|
||||||
padding-top: 20px;
|
// padding-top: 20px;
|
||||||
|
|
||||||
&>img {
|
&>img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -157,6 +170,23 @@ defineExpose({
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
& > .jzsb {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
&>img {
|
||||||
|
width: 70%;
|
||||||
|
height: 70%;
|
||||||
|
}
|
||||||
|
&>span {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #6B7181;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-button {
|
.nav-button {
|
||||||
|
Reference in New Issue
Block a user