|
@@ -2,7 +2,7 @@
|
|
|
<div class="science-content">
|
|
<div class="science-content">
|
|
|
<div class="video-overlay" v-if="showVideo" @click.self="closeVideo">
|
|
<div class="video-overlay" v-if="showVideo" @click.self="closeVideo">
|
|
|
<div class="video-container">
|
|
<div class="video-container">
|
|
|
- <video ref="videoRef" class="overlay-video" loop autoplay muted>
|
|
|
|
|
|
|
+ <video ref="videoRef" class="overlay-video" loop autoplay>
|
|
|
<source :src="videoSrc" type="video/mp4">
|
|
<source :src="videoSrc" type="video/mp4">
|
|
|
</video>
|
|
</video>
|
|
|
<div class="video-close" @click="closeVideo">×</div>
|
|
<div class="video-close" @click="closeVideo">×</div>
|
|
@@ -50,6 +50,8 @@ const selectedCardIndex = ref(-1)
|
|
|
const videoSrc = computed(() => {
|
|
const videoSrc = computed(() => {
|
|
|
if (selectedCardIndex.value === 0) {
|
|
if (selectedCardIndex.value === 0) {
|
|
|
return new URL("@/assets/video/水文化.mp4", import.meta.url).href
|
|
return new URL("@/assets/video/水文化.mp4", import.meta.url).href
|
|
|
|
|
+ } else if (selectedCardIndex.value === 2) {
|
|
|
|
|
+ return new URL("@/assets/video/TSQRoam.mp4", import.meta.url).href
|
|
|
}
|
|
}
|
|
|
return ""
|
|
return ""
|
|
|
})
|
|
})
|
|
@@ -79,7 +81,8 @@ function handleCardClick(index) {
|
|
|
} else if (index === 1) {
|
|
} else if (index === 1) {
|
|
|
showQuiz.value = true
|
|
showQuiz.value = true
|
|
|
} else if (index === 2) {
|
|
} else if (index === 2) {
|
|
|
- showGuide.value = true
|
|
|
|
|
|
|
+ selectedCardIndex.value = index
|
|
|
|
|
+ showVideo.value = true
|
|
|
} else {
|
|
} else {
|
|
|
emit("navigate", index)
|
|
emit("navigate", index)
|
|
|
}
|
|
}
|