301hospital/web/src/views/scene/scene.vue

<template>
  <div class="parent-body">
    <!-- 热点 -->
    <!-- <hot/> -->
    <!-- 热点弹出框 -->
    <popup/>
    <!-- 加载初始页面 -->
    <div id="gui-thumb"></div>
    <!-- cad -->
    <cad/>
    <!-- 主容器 -->
    <div id="player"></div>
    <div id="gui-parent">
        <!-- 进度条加载 -->
        <gui-loading/>
        <div id="hot"></div>
        <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 ref="menu" @btnactive="handleActive"/>
            
            <!-- 导览 -->
            <v-guide/>

            <!-- logo -->
            <div id="myCompany"></div>
        </div>

        <!-- vr -->
        <web-vr/>

        <!-- loading -->
        <div id="gui-spinner" style="display: none;">
            <div class="gui-spinner-icon"></div>
        </div>

        <!-- guimsg -->
        <guimsg/>

        <!-- 错误提示 -->
        <v-error/>

        <vr-con/>
        
        <v-other/>
        
    </div>
    <exhibition v-if="isMainScene" class="exhibition" :isShow="isShowEXH" @isShow="handleShow" :style="{zIndex:showType?0:99}"/>
    <hovercom @close="handlepopClose" :showType="showType"/>
    <huizhang :visit="visit" @close="()=>{showhuizhang = false}" :showhuizhang="showhuizhang"/>

  </div>
</template>

<script>
import popup from './popup';
import cad from './cad';
import guiLoading from './gui/loading';
import hotspotList from './gui/hotspotlist';
import vTitle from './gui/title';
import vMenu from './gui/menu';
import vGuide from './gui/guide';
import webVr from './gui/webvr';
import guimsg from './gui/guimsg';
import vError from './gui/error';
import vrCon from './gui/vrcon';
import vOther from './gui/other';
import exhibition from '@/components/exhibition';

import vpopup from './components/popup.vue'


import hovercom from "@/newcomponents/hovercom";

import huizhang from "@/newcomponents/huizhang";

export default {
  name: 'Home',
  components: {
      popup,
      cad,
      guiLoading,
      hotspotList,
      vTitle,
      vMenu,
      vGuide,
      webVr,
      guimsg,
      vError,
      vrCon,
      vOther,
      exhibition,
      vpopup,
      hovercom,
      huizhang
  },
  watch:{
    showType(newVal){
      let tt = newVal?0:99
      $('.cad').css({zIndex:tt})
      $('.cad1').css({zIndex:tt})
    }
  },
  mounted(){
 
    this.$nextTick(() => {
      if (!window.evt) {
        window.evt = document.createEvent("HTMLEvents");
        window.evt.initEvent("loadfinish", false, false);
      }
      window.addEventListener("loadfinish", ()=>{
        this.loading=false
        this.getHotSpotList();


        this.isMainScene = window.number == '1149_2'
        

         window.parent.postMessage(
            {
              source: "loadfinish",
              data: true,
            },
            "*"
          );

        // window.player.on("openTips", () => {
        //   this.$showTips()
        // });

        window.player.director.on("tour.start", () => {
          if(!window.ISMUTED){
           this.$bus.$emit("changexlzmode","Speaking1")
          }
        });

         window.player.director.on("tour.end", () => {
           console.log('tour.end')
           this.$bus.$emit("resetxlzmode")
        });

        window.player.director.on('isPulltttttt',data=>{
          if(data) {
            this.isShowEXH = false
          }
        })
        

        window.player.director.on("action.interrupted", () => {
           this.$bus.$emit("resetxlzmode")
        });

        window.player.model.on("floor.changed", (data) => {
           this.$bus.$emit("floorchanged",data.floorIndex + 1)
        });


        window.player.on("flying.ended", (...data) => {
           this.$bus.$emit("flyingEnded", data[2])
        });

        window.player.on("openHotspot", (data) => {
          this.$showHotspot({
            hotspot: this.hotspots[data],
          });
          window.parent.postMessage(
            {
              source: "openHotspot",
              data: true,
            },
            "*"
          );
        });

        this.timer && clearTimeout(this.timer)
        this.timer = setTimeout(() => {
          this.visit = window.manage.number('visit')
          console.log(this.visit);
          this.showhuizhang = true
        }, 3 * 60 * 1000);

        document.addEventListener("visibilitychange", () =>{
          if(document.visibilityState == 'hidden'){
            window.player.director.stopTour()
          }
        });

      }, false);
    });
    
    this.$bus.$on('opendaolan',()=>{
      this.showExhibition = true
    })
    
    this.$bus.$on('openhovercom',(data)=>{
        this.showType = data
    })

    this.$bus.$on('moveCan',()=>{
      if (this.fisrstIn && this.isMainScene) {
        this.fisrstIn = false
        let rotate = player.cameraControls.controls.panorama.rotationAcc
        rotate.x = 0.3
        setTimeout(() => {
          rotate.x = 0
        }, 2000);
      }
     
    })


  },
  methods:{
    handleShow(data){
      this.isShowEXH = data;
      this.$refs.menu.handleguide('',true)
    },
    handleActive(data){
     this.showType = data
      window.player.director.stopTour()
    },
    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;
        },
      });
    },
    handleClose(){
      $('.cad').css('transform', 'translate(-150%,-50%)')
      this.showExhibition=false
    },
    handlepopClose(){
      this.showType = ''
      this.$bus.$emit('resetbtnactive')
    },
    
    destroy() {
      window.hadLoad = true;
      if (window.player) {
        window.player.sceneRenderer.suspend();
        window.player = "";
        $(".parent-body").remove();
        $("#player").remove();
        $(document).unbind('keydown')
        $(document).off('keydown')
      }
    },
 
  },
  beforeDestroy(){
    this.destroy();
  },
  data(){
      return {
        danmu:[],
        showExhibition: true,
        showhuizhang:false,
        showType:'',
        timer:null,
        cp:'',
        visit:0,
        isShowEXH:false,
        isMainScene: false,
        fisrstIn:true
      }
  }
}
</script>

<style lang="less" scoped>

.parent-body{
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}


.exhibition{
  position: absolute;
  top: 50px;
  right: 0;
  z-index: 99;
}


</style>