|
@@ -3,158 +3,176 @@
|
|
<!-- 热点 -->
|
|
<!-- 热点 -->
|
|
<!-- <hot/> -->
|
|
<!-- <hot/> -->
|
|
<!-- 热点弹出框 -->
|
|
<!-- 热点弹出框 -->
|
|
- <popup/>
|
|
|
|
|
|
+ <popup />
|
|
<!-- 加载初始页面 -->
|
|
<!-- 加载初始页面 -->
|
|
<div id="gui-thumb"></div>
|
|
<div id="gui-thumb"></div>
|
|
-
|
|
|
|
|
|
+
|
|
<!-- 主容器 -->
|
|
<!-- 主容器 -->
|
|
<div id="player"></div>
|
|
<div id="player"></div>
|
|
<div id="gui-parent">
|
|
<div id="gui-parent">
|
|
- <!-- 进度条加载 -->
|
|
|
|
- <gui-loading/>
|
|
|
|
- <div id="gui" style="display: none;">
|
|
|
|
-
|
|
|
|
- <!-- 退出VR模式按钮 -->
|
|
|
|
- <div id="vrOff">
|
|
|
|
- <img id="vrOffImg" src="images/vrOffImg.png" alt="">
|
|
|
|
- </div>
|
|
|
|
-
|
|
|
|
- <!-- 热点列表 -->
|
|
|
|
- <hotspot-list/>
|
|
|
|
-
|
|
|
|
- <!-- 标题 -->
|
|
|
|
- <v-title/>
|
|
|
|
-
|
|
|
|
- <!-- 底部菜单 -->
|
|
|
|
- <v-menu/>
|
|
|
|
-
|
|
|
|
- <!-- 导览 -->
|
|
|
|
- <v-guide/>
|
|
|
|
-
|
|
|
|
- <!-- logo -->
|
|
|
|
- <div id="myCompany"
|
|
|
|
- style="width:100%;position:absolute;bottom:20px;text-align:center;font-size:14px;font-family: '微软雅黑';font-weight:580;color: rgba(255, 255, 255, 0.8);">
|
|
|
|
- 四维时代提供技术支持
|
|
|
|
- </div>
|
|
|
|
|
|
+ <!-- 进度条加载 -->
|
|
|
|
+ <gui-loading />
|
|
|
|
+ <div id="gui" style="display: none;">
|
|
|
|
+ <!-- 退出VR模式按钮 -->
|
|
|
|
+ <div id="vrOff">
|
|
|
|
+ <img id="vrOffImg" src="images/vrOffImg.png" alt="" />
|
|
</div>
|
|
</div>
|
|
|
|
|
|
- <!-- vr -->
|
|
|
|
- <web-vr/>
|
|
|
|
|
|
+ <!-- 热点列表 -->
|
|
|
|
+ <hotspot-list />
|
|
|
|
+
|
|
|
|
+ <!-- 标题 -->
|
|
|
|
+ <v-title />
|
|
|
|
+
|
|
|
|
+ <!-- 底部菜单 -->
|
|
|
|
+ <v-menu />
|
|
|
|
|
|
- <!-- loading -->
|
|
|
|
- <div id="gui-spinner" style="display: none;">
|
|
|
|
- <div class="gui-spinner-icon"></div>
|
|
|
|
|
|
+ <!-- 导览 -->
|
|
|
|
+ <v-guide />
|
|
|
|
+
|
|
|
|
+ <!-- logo -->
|
|
|
|
+ <div
|
|
|
|
+ id="myCompany"
|
|
|
|
+ style="width:100%;position:absolute;bottom:20px;text-align:center;font-size:14px;font-family: '微软雅黑';font-weight:580;color: rgba(255, 255, 255, 0.8);"
|
|
|
|
+ >
|
|
|
|
+ 四维时代提供技术支持
|
|
</div>
|
|
</div>
|
|
|
|
+ </div>
|
|
|
|
|
|
- <!-- guimsg -->
|
|
|
|
- <guimsg/>
|
|
|
|
|
|
+ <!-- vr -->
|
|
|
|
+ <web-vr />
|
|
|
|
|
|
- <!-- 错误提示 -->
|
|
|
|
- <v-error/>
|
|
|
|
|
|
+ <!-- loading -->
|
|
|
|
+ <div id="gui-spinner" style="display: none;">
|
|
|
|
+ <div class="gui-spinner-icon"></div>
|
|
|
|
+ </div>
|
|
|
|
|
|
- <vr-con/>
|
|
|
|
-
|
|
|
|
- <v-other/>
|
|
|
|
|
|
+ <!-- guimsg -->
|
|
|
|
+ <guimsg />
|
|
|
|
|
|
- <welcome @close='showWelcome=false' v-if="showWelcome"/>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <!-- 错误提示 -->
|
|
|
|
+ <v-error />
|
|
|
|
+
|
|
|
|
+ <vr-con />
|
|
|
|
|
|
|
|
+ <v-other />
|
|
|
|
+
|
|
|
|
+ <welcome @close="hideWelcome" v-if="showWelcome" />
|
|
|
|
+
|
|
|
|
+ <div class="loading" v-if="loading">
|
|
|
|
+ <span>加载中...</span>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
-import Vue from 'vue'
|
|
|
|
-
|
|
|
|
-import popup from '@/views/popup';
|
|
|
|
-import guiLoading from '@/views/gui/loading';
|
|
|
|
-import hotspotList from '@/views/gui/hotspotlist';
|
|
|
|
-import vTitle from '@/views/gui/title';
|
|
|
|
-import vMenu from '@/views/gui/menu';
|
|
|
|
-import vGuide from '@/views/gui/guide';
|
|
|
|
-import webVr from '@/views/gui/webvr';
|
|
|
|
-import guimsg from '@/views/gui/guimsg';
|
|
|
|
-import vError from '@/views/gui/error';
|
|
|
|
-import vrCon from '@/views/gui/vrcon';
|
|
|
|
-import vOther from '@/views/gui/other';
|
|
|
|
-import welcome from '@/components/welcome';
|
|
|
|
|
|
+import popup from "@/views/popup";
|
|
|
|
+import guiLoading from "@/views/gui/loading";
|
|
|
|
+import hotspotList from "@/views/gui/hotspotlist";
|
|
|
|
+import vTitle from "@/views/gui/title";
|
|
|
|
+import vMenu from "@/views/gui/menu";
|
|
|
|
+import vGuide from "@/views/gui/guide";
|
|
|
|
+import webVr from "@/views/gui/webvr";
|
|
|
|
+import guimsg from "@/views/gui/guimsg";
|
|
|
|
+import vError from "@/views/gui/error";
|
|
|
|
+import vrCon from "@/views/gui/vrcon";
|
|
|
|
+import vOther from "@/views/gui/other";
|
|
|
|
+import welcome from "@/components/welcome";
|
|
|
|
|
|
export default {
|
|
export default {
|
|
- name: 'Home',
|
|
|
|
|
|
+ name: "Home",
|
|
components: {
|
|
components: {
|
|
- popup,
|
|
|
|
- guiLoading,
|
|
|
|
- hotspotList,
|
|
|
|
- vTitle,
|
|
|
|
- vMenu,
|
|
|
|
- vGuide,
|
|
|
|
- webVr,
|
|
|
|
- guimsg,
|
|
|
|
- vError,
|
|
|
|
- vrCon,
|
|
|
|
- vOther,
|
|
|
|
- welcome
|
|
|
|
|
|
+ popup,
|
|
|
|
+ guiLoading,
|
|
|
|
+ hotspotList,
|
|
|
|
+ vTitle,
|
|
|
|
+ vMenu,
|
|
|
|
+ vGuide,
|
|
|
|
+ webVr,
|
|
|
|
+ guimsg,
|
|
|
|
+ vError,
|
|
|
|
+ vrCon,
|
|
|
|
+ vOther,
|
|
|
|
+ welcome,
|
|
},
|
|
},
|
|
-
|
|
|
|
- data(){
|
|
|
|
- return {
|
|
|
|
- showWelcome: true,
|
|
|
|
- hotspots:''
|
|
|
|
- }
|
|
|
|
|
|
+
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ showWelcome: true,
|
|
|
|
+ hotspots: "",
|
|
|
|
+ loading: true
|
|
|
|
+ };
|
|
},
|
|
},
|
|
|
|
|
|
- methods:{
|
|
|
|
- getHotSpotList(){
|
|
|
|
- $.ajax({
|
|
|
|
- url: g_Prefix+"data/" + window.number + "/hot/js/data.js" +'?'+ Math.random(),
|
|
|
|
- type: "get",
|
|
|
|
- dataType: "json",
|
|
|
|
- contentType: "application/json",
|
|
|
|
- success: (result) => {
|
|
|
|
- this.hotspots = result
|
|
|
|
- }
|
|
|
|
- });
|
|
|
|
-
|
|
|
|
- }
|
|
|
|
|
|
+ methods: {
|
|
|
|
+ hideWelcome() {
|
|
|
|
+ this.showWelcome = false;
|
|
|
|
+ window.manage.switchBgmState(true);
|
|
|
|
+ },
|
|
|
|
+ getHotSpotList() {
|
|
|
|
+ $.ajax({
|
|
|
|
+ url:
|
|
|
|
+ g_Prefix +
|
|
|
|
+ "data/" +
|
|
|
|
+ window.number +
|
|
|
|
+ "/hot/js/data.js" +
|
|
|
|
+ "?" +
|
|
|
|
+ Math.random(),
|
|
|
|
+ type: "get",
|
|
|
|
+ dataType: "json",
|
|
|
|
+ contentType: "application/json",
|
|
|
|
+ success: (result) => {
|
|
|
|
+ this.hotspots = result;
|
|
|
|
+ },
|
|
|
|
+ });
|
|
|
|
+ },
|
|
},
|
|
},
|
|
|
|
|
|
- mounted(){
|
|
|
|
|
|
+ mounted() {
|
|
this.$nextTick(() => {
|
|
this.$nextTick(() => {
|
|
- window.evt = document.createEvent('HTMLEvents')
|
|
|
|
- window.evt.initEvent('loadfinish',false,false)
|
|
|
|
- window.addEventListener('loadfinish', ()=> {
|
|
|
|
- this.getHotSpotList()
|
|
|
|
- window.player.on("openHotspot", (data)=> {
|
|
|
|
- this.$showHotspot({
|
|
|
|
- hotspot:this.hotspots[data]
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
|
|
+ window.evt = document.createEvent("HTMLEvents");
|
|
|
|
+ window.evt.initEvent("loadfinish", false, false);
|
|
|
|
+ window.addEventListener("loadfinish", () => {
|
|
|
|
+ this.loading=false
|
|
|
|
+ this.getHotSpotList();
|
|
|
|
+ window.player.on("openTips", () => {
|
|
|
|
+ this.$showTips()
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+ window.player.on("openHotspot", (data) => {
|
|
|
|
+ this.$showHotspot({
|
|
|
|
+ hotspot: this.hotspots[data],
|
|
|
|
+ });
|
|
|
|
+ });
|
|
|
|
+ });
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+};
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
<style lang="less" scoped>
|
|
-.parent-body{
|
|
|
|
- width: 100%;
|
|
|
|
- height: 100%;
|
|
|
|
|
|
+.parent-body {
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
}
|
|
}
|
|
-.hover-pages{
|
|
|
|
|
|
+
|
|
|
|
+.loading{
|
|
position: fixed;
|
|
position: fixed;
|
|
- top: 0;
|
|
|
|
left: 0;
|
|
left: 0;
|
|
|
|
+ top: 0;
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 100%;
|
|
height: 100%;
|
|
- z-index: 9999;
|
|
|
|
- background: rgba(0, 0, 0, 0.8);
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-.exhibition{
|
|
|
|
- position: fixed;
|
|
|
|
- top: 50px;
|
|
|
|
- right: 0;
|
|
|
|
- z-index: 99;
|
|
|
|
-}
|
|
|
|
-.exhibition-mb{
|
|
|
|
-}
|
|
|
|
-</style>
|
|
|
|
|
|
+ z-index: 10000;
|
|
|
|
+ background: #000;
|
|
|
|
+ >span{
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 50%;
|
|
|
|
+ left: 50%;
|
|
|
|
+ transform: translate(-50%,-50%);
|
|
|
|
+ color: #fff;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+</style>
|