|
@@ -1,32 +1,104 @@
|
|
<template>
|
|
<template>
|
|
- <div class="zhanlan">
|
|
|
|
- <iframe v-if="currentScene" :src="`https://gdbwg.4dage.com${currentScene.filePath}/wwwroot/spg.html?m=${currentScene.fileName.replace('.zip','')}`" frameborder="0"></iframe>
|
|
|
|
|
|
+ <div
|
|
|
|
+ class="zhanlan"
|
|
|
|
+ :class="{
|
|
|
|
+ mobile: isMobile,
|
|
|
|
+ }"
|
|
|
|
+ >
|
|
|
|
+ <iframe v-if="currentScene && currentScene.filePath && currentScene.fileName" :src="`https://gdbwg.4dage.com${currentScene.filePath}/wwwroot/spc.html?m=${currentScene.fileName.replace('.zip','')}`" frameborder="0"></iframe>
|
|
|
|
+ <div class="empty-tip" v-else>
|
|
|
|
+ <img src="@/assets/images/resource/searchNone.svg" alt="no result" draggable="false">
|
|
|
|
+ <span>暂无展览场景</span>
|
|
|
|
+ <img
|
|
|
|
+ class="close"
|
|
|
|
+ @click="onClickClose"
|
|
|
|
+ :src="require(`@/assets/images/icon/close.png`)"
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
import { ref, reactive, onMounted, watch, computed, nextTick } from "vue";
|
|
import { ref, reactive, onMounted, watch, computed, nextTick } from "vue";
|
|
-
|
|
|
|
import { getExhibitionDetail } from "@/config/api";
|
|
import { getExhibitionDetail } from "@/config/api";
|
|
-
|
|
|
|
import { useRouter, useRoute } from "vue-router";
|
|
import { useRouter, useRoute } from "vue-router";
|
|
|
|
+import { throttle } from "@/utils/index.js";
|
|
|
|
|
|
const route = useRoute();
|
|
const route = useRoute();
|
|
|
|
+const router = useRouter()
|
|
|
|
|
|
const currentScene = ref(null)
|
|
const currentScene = ref(null)
|
|
|
|
|
|
getExhibitionDetail({id:route.params.id},data=>{
|
|
getExhibitionDetail({id:route.params.id},data=>{
|
|
currentScene.value = data.data
|
|
currentScene.value = data.data
|
|
})
|
|
})
|
|
-
|
|
|
|
|
|
+
|
|
|
|
+const onClickClose = throttle(() => {
|
|
|
|
+ router.go(-1)
|
|
|
|
+}, 1000)
|
|
|
|
+
|
|
|
|
+import browser from '@/utils/browser'
|
|
|
|
+const isMobile = ref(false)
|
|
|
|
+onMounted(() => {
|
|
|
|
+ if (browser.isMobile()) {
|
|
|
|
+ isMobile.value = true
|
|
|
|
+ } else {
|
|
|
|
+ isMobile.value = false
|
|
|
|
+ }
|
|
|
|
+})
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
-.zhanlan{
|
|
|
|
|
|
+.zhanlan {
|
|
width: 100%;
|
|
width: 100%;
|
|
- >iframe{
|
|
|
|
|
|
+ > iframe {
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
+ > .empty-tip {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ align-items: center;
|
|
|
|
+ flex-direction: column;
|
|
|
|
+ position: relative;
|
|
|
|
+ img {
|
|
|
|
+ width: 240px;
|
|
|
|
+ height: 216px;
|
|
|
|
+ }
|
|
|
|
+ span {
|
|
|
|
+ margin-top: 24px;
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
|
|
|
+ color: #333333;
|
|
|
|
+ line-height: 36px;
|
|
|
|
+ }
|
|
|
|
+ .close {
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 40px;
|
|
|
|
+ right: 60px;
|
|
|
|
+ width: 70px;
|
|
|
|
+ height: 70px;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+.zhanlan.mobile {
|
|
|
|
+ > .empty-tip {
|
|
|
|
+ img {
|
|
|
|
+ width: 50%;
|
|
|
|
+ height: auto;
|
|
|
|
+ }
|
|
|
|
+ span {
|
|
|
|
+ margin-top: 20px;
|
|
|
|
+ font-size: 20px;
|
|
|
|
+ line-height: 30px;
|
|
|
|
+ }
|
|
|
|
+ .close {
|
|
|
|
+ display: none;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|