upload

src/api/index.js

@@ -42,7 +42,7 @@ let ossUrl = config.CDN
  * @param {*} no 
  */
  export function getSceneInfomation(data, ok, no) {
-    return http.get(`/api/scene/getInfo?num=${data.id}&_=${Math.random()}`, {}, ok, no)
+    return http.get(`https://www.4dkankan.com/api/scene/getInfo?num=${data.id}&_=${Math.random()}`, {}, ok, no)
 }
 
 /**

src/framework/showMobile/iframe.vue

@@ -1,113 +1,128 @@
 <template>
   <div class="ifrcon">
     <Header :bgmUrl="tempBgm" @toggleBGM="handleBGM" :somedatainfo="somedatainfo" :bgmstatus="bgmstatus" :params="params" />
-    <iframe v-if="!isV4" allowfullscreen="true" ref="iframe" id="showifr" :src="url" frameborder="0" @load="onIframLoad"></iframe>
-    <v4_page :somedatainfo="somedatainfo" v-else/>
+    <iframe v-if="!isUpGrade" allowfullscreen="true" ref="iframe" id="showifr" :src="url" frameborder="0" @load="onIframLoad"></iframe>
+    <iframe
+      v-else
+      allowfullscreen="true"
+      ref="iframe"
+      id="showifr"
+      :src="`http://192.168.0.205:8081/showMobile.html?m=${num}`"
+      frameborder="0"
+      @load="onIframLoad"
+    ></iframe>
   </div>
 </template>
 
 <script>
 import Header from "./ui/Show.Header";
-import browser from "@/utils/browser"
-import v4_page from "./v4_page/index.vue";
+import browser from "@/utils/browser";
 
 export default {
-  props:['url','bgmUrl','somedatainfo'],
-  components:{Header,v4_page},
-  data(){
+  props: ["url", "bgmUrl", "somedatainfo","num", "isUpGrade"],
+  components: { Header },
+  data() {
     return {
-      params:'',
-      bgmstatus: false
-    }
+      params: "",
+      bgmstatus: false,
+    };
   },
-  computed:{
-    tempBgm(){
-      return this.bgmUrl
+  computed: {
+    tempBgm() {
+      return this.bgmUrl;
     },
-    isV4(){
-      return this.somedatainfo.isUpgrade
-    }
   },
-  methods:{
-    onIframLoad(){
-      window.onmessage = e =>{
+  methods: {
+    onIframLoad() {
+      window.onmessage = (e) => {
+
         if (e.data.source != "4dage") {
-            return
+          return;
         }
 
-        if (e.data.event == "guide-rooms") {
-          this.$bus.emit('guideRoomsData',e.data.params)
+        if (e.data.event == "showTours") {
+          if (e.data.data) {
+            this.$bus.emit('toggleShowList',!e.data.data)
+          }
         }
 
-          if (e.data.event == "link-click") {
-            if (e.data.params.url.indexOf('https://www.4dkankan.com/spc.html?')>-1
-            ||e.data.params.url.indexOf('https://www.4dkankan.com/smobile.html?')>-1
-            ||e.data.params.url.indexOf('https://test.4dkankan.com/spc.html?')>-1
-            ||e.data.params.url.indexOf('https://test.4dkankan.com/smobile.html?')>-1) {
-              let m = browser.urlHasValueFromUrl('m',e.data.params.url)
-              this.$emit('changeUrl',m)
-            } else{
-              this.$emit('otherUrl',e.data.params.url)
-            }
-
+        if (e.data.event == "guide-rooms") {
+          this.$bus.emit("guideRoomsData", e.data.params);
         }
 
-
-
+        if (e.data.event == "link-click") {
+          if (
+            e.data.params.url.indexOf("https://www.4dkankan.com/spc.html?") > -1 ||
+            e.data.params.url.indexOf("https://www.4dkankan.com/smobile.html?") > -1 ||
+            e.data.params.url.indexOf("https://test.4dkankan.com/spc.html?") > -1 ||
+            e.data.params.url.indexOf("https://test.4dkankan.com/smobile.html?") > -1
+          ) {
+            let m = browser.urlHasValueFromUrl("m", e.data.params.url);
+            this.$emit("changeUrl", m);
+          } else {
+            this.$emit("otherUrl", e.data.params.url);
+          }
+        }
 
         if (e.data.event == "action") {
-          this.$bus.emit('currentMode',e.data.params)
-          
+          this.$bus.emit("currentMode", e.data.params);
+
           if (e.data.params.type == "playMusic") {
-            console.log(e.data.params.data.status,'e.data');
-            this.bgmstatus = e.data.params.data.status
-            
+            console.log(e.data.params.data.status, "e.data");
+            this.bgmstatus = e.data.params.data.status;
           }
         }
 
         if (e.data.event == "loaded") {
           console.log(e.data.params);
-          this.params = e.data.params
-          this.$refs.iframe.contentWindow.postMessage({
+          this.params = e.data.params;
+          this.$refs.iframe.contentWindow.postMessage(
+            {
               source: "mingyuan",
-              event: 'guide-rooms'
-          },"*")
+              event: "guide-rooms",
+            },
+            "*"
+          );
 
-          this.$refs.iframe.contentWindow.postMessage({
-              source : "mingyuan",
-              event:"settings",
-              params:{
-                  playMusic:true
-              }
-          },"*")
+          this.$refs.iframe.contentWindow.postMessage(
+            {
+              source: "mingyuan",
+              event: "settings",
+              params: {
+                playMusic: true,
+              },
+            },
+            "*"
+          );
         }
-
-      }
+      };
+    },
+    handleBGM(status) {
+      this.$refs.iframe.contentWindow.postMessage(
+        {
+          source: "mingyuan",
+          event: "settings",
+          params: {
+            playMusic: status,
+          },
+        },
+        "*"
+      );
     },
-    handleBGM(status){
-
-       this.$refs.iframe.contentWindow.postMessage({
-            source : "mingyuan",
-            event:"settings",
-            params:{
-                playMusic:status
-            }
-        },"*")
-    }
   },
   mounted() {
-    console.log(this.somedatainfo)
+    console.log(this.somedatainfo);
   },
-}
+};
 </script>
 
 <style lang="less" scoped>
-.ifrcon{
+.ifrcon {
   width: 100%;
   height: 100%;
-  >iframe{
+  > iframe {
     width: 100%;
     height: 100%;
   }
 }
-</style>
+</style>

src/framework/showMobile/index.vue

@@ -5,8 +5,10 @@
         v-if="activeItem.type == '4dkk'"
         @changeUrl="handleChange"
         @otherUrl="handleOther"
+        :isUpGrade="isUpGrade"
         :bgmUrl="bgmUrl"
         :somedatainfo="somedatainfo"
+        :num="activeItem.sceneCode"
         :key="embeM || activeItem.sceneCode"
         :url="otherLink ? otherLink : `/embed.html?from=mingyuan&m=${embeM || activeItem.sceneCode}&lang=zh&scene-link=1&rnd=${rnd}`"
       />
@@ -126,6 +128,7 @@ export default {
       bgmUrl: "",
       somedatainfo: "",
       isVR: false,
+      isUpGrade:0,
       localRemind: false,
       showPreview: false,
       audioUrl: "",
@@ -168,7 +171,12 @@ export default {
       this.rnd = Math.random();
     },
     getSceneInfomation() {
+      this.isUpGrade = 0
       getSceneInfomation({ id: this.activeItem.sceneCode }, (data) => {
+        if (data.data.isUpgrade) {
+          this.isUpGrade = data.data.isUpgrade
+          return
+        }
         this.mapvisit = data.data.mapVisi;
         this.somedatainfo = data.data;
         if (data.data.bgMusic) {
@@ -474,6 +482,7 @@ export default {
             this.otherLink = null;
             removepano("#pano");
             $("#pano").empty();
+            console.log('執行------------------------');
             this.getSceneInfomation();
             return;
           } else {

src/framework/showMobile/list.vue

@@ -1,51 +1,73 @@
 <template>
   <div class="list">
-     <div class="l-con" :class="showList?'active':''"  v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)">
+    <div class="l-con" :class="showList ? 'active' : ''" v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)">
       <div class="pic-con">
-
-        <div class="clip-scroller" ref="sw" v-swiper:mySwiper="swiperOptions"  v-if="scenes.length>0">
+        <div class="clip-scroller" ref="sw" v-swiper:mySwiper="swiperOptions" v-if="scenes.length > 0">
           <ul class="pic-list swiper-wrapper">
-            <li class="swiper-slide" @click="handleVR(item,i)" v-for="(item,i) in scenes" :key="i">
-              <div :class="{active:selected.sceneCode==item.sceneCode}">
-                <img :src="item.icon+`?${Math.random()}`" alt="" />
-                <i class="iconfont" :class="item.type!='4dkk'?'icon-edit_type_panorama':'icon-edit_type_3d'"></i>
-                <rollName :offset="20" :active="selected.sceneCode==item.sceneCode" class="pic-name" :myref="'subw'+item.id" :name="item.sceneTitle"/>
+            <li class="swiper-slide" @click="handleVR(item, i)" v-for="(item, i) in scenes" :key="i">
+              <div :class="{ active: selected.sceneCode == item.sceneCode }">
+                <img :src="item.icon + `?${Math.random()}`" alt="" />
+                <i class="iconfont" :class="item.type != '4dkk' ? 'icon-edit_type_panorama' : 'icon-edit_type_3d'"></i>
+                <rollName :offset="20" :active="selected.sceneCode == item.sceneCode" class="pic-name" :myref="'subw' + item.id" :name="item.sceneTitle" />
               </div>
             </li>
           </ul>
         </div>
 
         <div ref="sw1" class="clip-scroller" v-swiper:mySwipera="swiperOptions" v-if="childTab.length > 1">
-          
-        <ul class="tap pp-tap swiper-wrapper"  >
-          <li class="swiper-slide" @click="handleTabtow(item,i)" v-for="(item,i) in childTab" :key="i">
-              <rollName :offset="30" :mgin="20" :active="item.id == tabtowActive.id" class="btn pic-rect" :class="{active:item.id == tabtowActive.id}" :myref="'ww'+item.id" :name="item.name"/>
-          </li>
-        </ul>
+          <ul class="tap pp-tap swiper-wrapper">
+            <li class="swiper-slide" @click="handleTabtow(item, i)" v-for="(item, i) in childTab" :key="i">
+              <rollName
+                :offset="30"
+                :mgin="20"
+                :active="item.id == tabtowActive.id"
+                class="btn pic-rect"
+                :class="{ active: item.id == tabtowActive.id }"
+                :myref="'ww' + item.id"
+                :name="item.name"
+              />
+            </li>
+          </ul>
         </div>
       </div>
-      
-      <div class="clip-scroller" ref="sw2"  v-swiper:mySwiperb="swiperOptions" v-if="showInfo.catalogRoot.length > 0 && showInfo.catalogs.length > 1">
-         <ul class="tap swiper-wrapper" v-if="showInfo.catalogRoot.length > 1">
-          <li class="swiper-slide" @click="handleTabone(item,i)" :class="{ active: item.id == taboneActive.id }" v-for="(item,i) in showInfo.catalogRoot" :key="i">
-              <rollName :offset="30" :mgin="20" :active="item.id == taboneActive.id" class="btn rect" :class="{active:item.id == taboneActive.id}" :myref="'zw'+item.id" :name="item.name"/>
+
+      <div class="clip-scroller" ref="sw2" v-swiper:mySwiperb="swiperOptions" v-if="showInfo.catalogRoot.length > 0 && showInfo.catalogs.length > 1">
+        <ul class="tap swiper-wrapper" v-if="showInfo.catalogRoot.length > 1">
+          <li
+            class="swiper-slide"
+            @click="handleTabone(item, i)"
+            :class="{ active: item.id == taboneActive.id }"
+            v-for="(item, i) in showInfo.catalogRoot"
+            :key="i"
+          >
+            <rollName
+              :offset="30"
+              :mgin="20"
+              :active="item.id == taboneActive.id"
+              class="btn rect"
+              :class="{ active: item.id == taboneActive.id }"
+              :myref="'zw' + item.id"
+              :name="item.name"
+            />
           </li>
         </ul>
       </div>
     </div>
 
-
-    <div v-if="selected.type=='4dkk' && isShowDL" class="menu">
-        <div  @click="handleDL" v-if="isShowDL">
-            <i class="iconfont" :class="isDaolan?'icon-show_suspension':'icon-show_playback'"></i>
-        </div>
+    <div v-if="selected.type == '4dkk' && isShowDL" class="menu">
+      <div @click="handleDL" v-if="isShowDL">
+        <i class="iconfont" :class="isDaolan ? 'icon-show_suspension' : 'icon-show_playback'"></i>
+      </div>
     </div>
 
-    <div class="btn dl" :class="{deepbg:showList}" v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)" @click="showList = !showList">
-      <i class="iconfont " :class="showList?'icon-nav_scene_down':'icon-nav_scene_up'"></i>场景导航
+    <div
+      class="btn dl"
+      :class="{ deepbg: showList }"
+      v-if="!(showInfo.catalogRoot.length == 1 && scenes.length == 1 && showInfo.catalogs.length == 1)"
+      @click="handleShowList"
+    >
+      <i class="iconfont " :class="showList ? 'icon-nav_scene_down' : 'icon-nav_scene_up'"></i>场景导航
     </div>
-
-  
   </div>
 </template>
 
@@ -58,214 +80,237 @@ import { directive } from "vue-awesome-swiper";
 import "swiper/css/swiper.css";
 
 export default {
-  props:['select','mapvisit'],
-  components:{rollName},
+  props: ["select", "mapvisit"],
+  components: { rollName },
   directives: {
     swiper: directive,
   },
-  data(){
-    let menu = [{
-      id:'pano',
-      name:'漫游',
-      icon:'icon-show_roaming_normal',
-      active:'icon-show_roaming_selected',
-      params:'pano'
-    },{
-      id:'2d',
-      name:'平面',
-      icon:'icon-show_plane_normal',
-      active:'icon-show_plane_selected',
-      params:'2d'
-    },{
-      id:'3d',
-      name:'三维',
-      icon:'icon-show_3d_normal',
-      active:'icon-show_3d_selected',
-      params:'3d'
-    }]
-    return{
-      isDaolan:false,
-      isShowDL:'',
-      currentActive:'pano',
-      taboneActive:{children:[]},
-      tabtowActive:'',
-      childTab:[],
+  data() {
+    let menu = [
+      {
+        id: "pano",
+        name: "漫游",
+        icon: "icon-show_roaming_normal",
+        active: "icon-show_roaming_selected",
+        params: "pano",
+      },
+      {
+        id: "2d",
+        name: "平面",
+        icon: "icon-show_plane_normal",
+        active: "icon-show_plane_selected",
+        params: "2d",
+      },
+      {
+        id: "3d",
+        name: "三维",
+        icon: "icon-show_3d_normal",
+        active: "icon-show_3d_selected",
+        params: "3d",
+      },
+    ];
+    return {
+      isDaolan: false,
+      isShowDL: "",
+      currentActive: "pano",
+      taboneActive: { children: [] },
+      tabtowActive: "",
+      childTab: [],
       sceneNum: config.sceneNum,
-      scenes:[],
+      scenes: [],
       menu,
-      showList:true,
+      showList: true,
       loadFirst: true,
-      shouqi:false,
-      canClick:true
-    }
+      shouqi: false,
+      canClick: true,
+    };
   },
   computed: {
-      ...mapGetters({
-        showInfo: "showInfo"
-      }),
-      swiperOptions() {
-        return {
-          slidesPerView: "auto",
-          // observer:true,
-          // observeParents: true,
-          centeredSlides : true,
-          centerInsufficientSlides: true,
-          centeredSlidesBounds: true,
-          freeMode:true
-        };
-      },
-      selected(){
-        return {...this.select}
-      }
+    ...mapGetters({
+      showInfo: "showInfo",
+    }),
+    swiperOptions() {
+      return {
+        slidesPerView: "auto",
+        // observer:true,
+        // observeParents: true,
+        centeredSlides: true,
+        centerInsufficientSlides: true,
+        centeredSlidesBounds: true,
+        freeMode: true,
+      };
+    },
+    selected() {
+      return { ...this.select };
+    },
   },
 
-  mounted(){
-      this.$bus.on('guideRoomsData',data=>{
-        if (data.length>0) {
-          this.isShowDL = true
-        }
-      })
+  mounted() {
+    this.$bus.on("guideRoomsData", (data) => {
+      if (data.length > 0) {
+        this.isShowDL = true;
+      }
+    });
 
-      this.$bus.on('currentMode',data=>{
-        this.delHandle()
-        this.currentActive = data.data.mode || 'pano'
-        // this.menu.findItem(item=>item.params == data.data.mode)
-      })
-      
+    this.$bus.on("toggleShowList", (data) => {
+      this.showList = data;
+    });
+
+    this.$bus.on("currentMode", (data) => {
+      this.delHandle();
+      this.currentActive = data.data.mode || "pano";
+      // this.menu.findItem(item=>item.params == data.data.mode)
+    });
   },
-  methods:{
-    handleDL(){
-      this.isDaolan = !this.isDaolan
-      let ele = document.getElementById('showifr');
-      ele.contentWindow.postMessage({
+  methods: {
+    handleShowList() {
+      this.showList = !this.showList;
+      let ele = document.getElementById("showifr");
+      ele.contentWindow.postMessage(
+        {
+          source: "qjkankan",
+          event: "showList",
+          data: this.showList,
+        },
+        "*"
+      );
+    },
+    handleDL() {
+      this.isDaolan = !this.isDaolan;
+      let ele = document.getElementById("showifr");
+      ele.contentWindow.postMessage(
+        {
           source: "mingyuan",
-          event: this.isDaolan?'guide-start':'guide-pause',
-      },"*")
+          event: this.isDaolan ? "guide-start" : "guide-pause",
+        },
+        "*"
+      );
     },
-    delHandle(){
-      this.canClick = false
+    delHandle() {
+      this.canClick = false;
       setTimeout(() => {
-        this.canClick = true
+        this.canClick = true;
       }, 1800);
     },
-    handleMenu(data){
+    handleMenu(data) {
       if (this.canClick) {
-        this.currentActive = data.id
-        let ele = document.getElementById('showifr');
-        ele.contentWindow.postMessage({
+        this.currentActive = data.id;
+        let ele = document.getElementById("showifr");
+        ele.contentWindow.postMessage(
+          {
             source: "mingyuan",
-            event: 'mode',
+            event: "mode",
             params: data.params,
-        },"*")
-        this.delHandle()
+          },
+          "*"
+        );
+        this.delHandle();
       }
     },
 
-     fixPosit(ref,i,prenum,nexnum){
-         if (i!==null) {
-        let acidx = this.$refs[ref].swiper.activeIndex
-        if (i - acidx > nexnum ) {
-          this.$refs[ref].swiper.slideNext()
+    fixPosit(ref, i, prenum, nexnum) {
+      if (i !== null) {
+        let acidx = this.$refs[ref].swiper.activeIndex;
+        if (i - acidx > nexnum) {
+          this.$refs[ref].swiper.slideNext();
         }
 
-        if (acidx - i > prenum ) {
-          this.$refs[ref].swiper.slidePrev()
+        if (acidx - i > prenum) {
+          this.$refs[ref].swiper.slidePrev();
         }
       }
     },
 
-    handleTabtow(item,i=null){
-      this.tabtowActive = item
-      this.fixPosit('sw1',i,1,1)
+    handleTabtow(item, i = null) {
+      this.tabtowActive = item;
+      this.fixPosit("sw1", i, 1, 1);
     },
 
-    handleTabone(item,i=null){
-      this.taboneActive = item
-      this.fixPosit('sw2',i,1,1)
+    handleTabone(item, i = null) {
+      this.taboneActive = item;
+      this.fixPosit("sw2", i, 1, 1);
     },
 
-    handleVR(item,i=null){
+    handleVR(item, i = null) {
       history.replaceState(null, null, "".concat(window.location.pathname, "?").concat(`id=${this.showInfo.id}&vr=${item.sceneCode}`));
-      this.sceneNum = item.sceneCode
+      this.sceneNum = item.sceneCode;
 
-      this.fixPosit('sw',i,1,1)
-
-    }
+      this.fixPosit("sw", i, 1, 1);
+    },
   },
-  watch:{
+  watch: {
     taboneActive: {
-      handler: function (newVal) {
-        let temp = []
-        newVal.children && newVal.children.forEach(item=>{
-          this.showInfo.catalogs.forEach(sub=>{
-            if (item==sub.id) {
-              temp.push(sub)
-            }
-          })
-        })
-        this.childTab = temp
+      handler: function(newVal) {
+        let temp = [];
+        newVal.children &&
+          newVal.children.forEach((item) => {
+            this.showInfo.catalogs.forEach((sub) => {
+              if (item == sub.id) {
+                temp.push(sub);
+              }
+            });
+          });
+        this.childTab = temp;
         if (!this.loadFirst) {
-            this.tabtowActive = ''
+          this.tabtowActive = "";
         }
       },
     },
     tabtowActive: {
-      handler: function (newVal) {
+      handler: function(newVal) {
         if (!newVal) {
-          this.tabtowActive = this.childTab[0]
-        } else{
-          let arr = this.showInfo.scenes.filter(item=>{
-            return newVal.id == item.category
-          })
-          this.scenes = arr.sort((a,b)=>a.weight-b.weight)
+          this.tabtowActive = this.childTab[0];
+        } else {
+          let arr = this.showInfo.scenes.filter((item) => {
+            return newVal.id == item.category;
+          });
+          this.scenes = arr.sort((a, b) => a.weight - b.weight);
         }
-      }
+      },
     },
 
-    sceneNum:{
-      deep:true,
-      immediate:true,
-      handler:function (newVal) {
-          if (!newVal) {
-            let tmp = this.showInfo.firstScene||this.showInfo.scenes[0]
-            this.handleVR(tmp)
-            return
-          }
-          let val = this.showInfo.scenes.find(item=>item.sceneCode==newVal)
-          let tmp = this.showInfo.catalogs.find(item=>item.id==val.category)
-          let rootTmp = this.showInfo.catalogRoot.find(item => {
-            return item.children.indexOf(tmp.id)>-1
-          });
-          this.taboneActive = rootTmp
-          this.tabtowActive = tmp
+    sceneNum: {
+      deep: true,
+      immediate: true,
+      handler: function(newVal) {
+        if (!newVal) {
+          let tmp = this.showInfo.firstScene || this.showInfo.scenes[0];
+          this.handleVR(tmp);
+          return;
+        }
+        let val = this.showInfo.scenes.find((item) => item.sceneCode == newVal);
+        let tmp = this.showInfo.catalogs.find((item) => item.id == val.category);
+        let rootTmp = this.showInfo.catalogRoot.find((item) => {
+          return item.children.indexOf(tmp.id) > -1;
+        });
+        this.taboneActive = rootTmp;
+        this.tabtowActive = tmp;
 
         setTimeout(() => {
-          this.$emit('select',val)
-          this.loadFirst = false 
+          this.$emit("select", val);
+          this.loadFirst = false;
         });
-      }
+      },
     },
 
-   
-    selected:{
-      handler:function (newVal) {
-        this.handleVR(newVal)
-        if (newVal.type == '4dkk') {
-          this.showList = true
+    selected: {
+      handler: function(newVal) {
+        this.handleVR(newVal);
+        if (newVal.type == "4dkk") {
+          this.showList = true;
           setTimeout(() => {
-            this.showList = false
+            this.showList = false;
           }, 800);
         }
-      }
-    }
-  }
-}
+      },
+    },
+  },
+};
 </script>
 
 <style lang="less" scoped>
-
-.btn{
- display: inline-block;
+.btn {
+  display: inline-block;
   margin: 0 auto;
   padding: 0 20px;
   height: 26px;
@@ -279,6 +324,7 @@ export default {
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
+  pointer-events: auto;
   &.active {
     border: 1px solid rgba(255, 255, 255, 1);
     color: rgba(255, 255, 255, 1);
@@ -312,25 +358,25 @@ export default {
   }
 }
 
-.line{
-  background:#0076F6;
+.line {
+  background: #0076f6;
   width: 100%;
   height: 0.1px;
   opacity: 0.5;
 }
 
-.list{
+.list {
   position: fixed;
   bottom: 44px;
   left: 0;
   text-align: right;
   width: 100%;
-
-  .clip-scroller{
+  pointer-events: none;
+  .clip-scroller {
     padding: 0 15px;
   }
 
-  .dl{
+  .dl {
     background: rgba(0, 0, 0, 0.3);
     border-radius: 18px;
     border: 1px solid rgba(255, 255, 255, 0.2);
@@ -345,66 +391,67 @@ export default {
     align-items: center;
     justify-content: center;
     width: 120px;
-    >i{
+    > i {
       margin-right: 8px;
       vertical-align: bottom;
       font-size: 18px;
     }
   }
 
-  .deepbg{
+  .deepbg {
     background: rgba(0, 0, 0, 0.5);
   }
-  .menu{
-      position: fixed;
-      left: 15px;
-      bottom: 40px;
-      >div{
-        width: 36px;
-        height: 36px;
-        display: inline-block;
-        background: rgba(0, 0, 0, 0.5);
-        border: 1px solid rgba(255, 255, 255, 0.2);
-        opacity: 1;
-        border-radius: 18px;
-        position: relative;
-        cursor: pointer;
-        >i{
-          position: absolute;
-          top: 50%;
-          left: 50%;
-          transform: translate(-50%, -50%);
-        }
+  .menu {
+    position: fixed;
+    left: 15px;
+    bottom: 40px;
+    pointer-events: auto;
+    > div {
+      width: 36px;
+      height: 36px;
+      display: inline-block;
+      background: rgba(0, 0, 0, 0.5);
+      border: 1px solid rgba(255, 255, 255, 0.2);
+      opacity: 1;
+      border-radius: 18px;
+      position: relative;
+      cursor: pointer;
+      > i {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
       }
+    }
   }
-  .l-con{
+  .l-con {
     width: 100%;
     transition: all ease 0.3s;
     max-height: 0px;
+    pointer-events: auto;
     overflow: hidden;
-    .pic-con{
+    .pic-con {
       background: rgba(0, 0, 0, 0.5);
     }
-    ul{
+    ul {
       align-items: center;
       display: flex;
-      li{
+      li {
         margin: 0 5px;
         text-align: center;
-        
       }
     }
-    .tap{
+    .tap {
       padding: 12px 0 0;
-      &::-webkit-scrollbar{
+      &::-webkit-scrollbar {
         display: none;
       }
-       > li {
-         font-size: 0;
+      > li {
+        font-size: 0;
         position: relative;
         width: 104px;
 
-        .btn{
+        .btn {
           font-size: 14px;
           width: 100%;
           padding: 0;
@@ -428,56 +475,56 @@ export default {
       }
     }
 
-    .pp-tap{
+    .pp-tap {
       padding: 8px 0 18px;
-       > li {
-         width: 88px;
+      > li {
+        width: 88px;
       }
     }
-    .pic-list{
+    .pic-list {
       padding: 10px 0;
       &::-webkit-scrollbar {
         display: none;
       }
-      >li{
+      > li {
         cursor: pointer;
         width: 70px;
         height: 70px;
-        >div{
+        > div {
           width: 100%;
           height: 100%;
-          border: 2px solid #FFFFFF;
+          border: 2px solid #ffffff;
           opacity: 1;
           border-radius: 4px;
           overflow: hidden;
           position: relative;
           cursor: pointer;
-          >img{
+          > img {
             position: absolute;
             top: 50%;
             left: 50%;
-            transform: translate(-50%,-50%);
+            transform: translate(-50%, -50%);
           }
-          .iconfont{
+          .iconfont {
             position: absolute;
             left: 4px;
             top: 4px;
             z-index: 99;
-            &::after{
+            &::after {
               background: rgba(0, 0, 0, 0.3);
-              content: '';
+              content: "";
               width: 14px;
               height: 14px;
               display: inline-block;
               position: absolute;
               top: 50%;
               left: 50%;
-              transform: translate(-50%,-50%);
+              transform: translate(-50%, -50%);
               z-index: -1;
               filter: blur(4px);
             }
           }
-          >span{
+          > span {
             display: inline-block;
             background: rgba(0, 0, 0, 0.3);
             position: absolute;
@@ -488,83 +535,83 @@ export default {
             bottom: 0;
             width: 100%;
           }
-          &.active{
-              border: 2px solid #0076F6;
+          &.active {
+            border: 2px solid #0076f6;
           }
         }
-        .pic-name{
+        .pic-name {
           background: rgba(0, 0, 0, 0.3);
           position: absolute;
           left: 0;
           bottom: 0;
           font-size: 0;
-          /deep/ span{
+          /deep/ span {
             font-size: 12px;
             word-break: keep-all;
-            white-space:nowrap;
+            white-space: nowrap;
             padding: 3px 0;
           }
         }
       }
     }
-    &.active{
+    &.active {
       max-height: 200px;
     }
   }
 }
 
 @media screen and (max-width: 350px) {
-  .list{
-  .menu{
-    .menucon{
-      padding-right: 10px;
-      >ul{
-        >li{
+  .list {
+    .menu {
+      .menucon {
+        padding-right: 10px;
+        > ul {
+          > li {
             color: #fff;
             margin: 0;
             height: 36px;
             line-height: 36px;
             padding: 0 4px;
             background: none;
-            >span{
+            > span {
               display: inline-block;
               margin-left: 6px;
             }
-            &:last-of-type{
+            &:last-of-type {
               padding-right: 14px;
             }
           }
-      }
-      >i{
+        }
+        > i {
           font-size: 12px;
           right: 8px;
           top: 50%;
           transform: translateY(-50%);
         }
-    }
-
-    .shouqi{
-      padding-right: 30px;
-      >ul{
-        max-width: 0;
-        width: 0;
       }
-      >i{
-        transform: translateY(-50%) rotate(180deg);
+
+      .shouqi {
+        padding-right: 30px;
+        > ul {
+          max-width: 0;
+          width: 0;
+        }
+        > i {
+          transform: translateY(-50%) rotate(180deg);
+        }
       }
-    }
-    .scenedl{
-      width: 36px;
-      height: 36px;
-      >i{
-        top: 50%;
-        left: 50%;
-        position: absolute;
-        transform: translate(-50%,-50%);
-        font-size: 14px;
+      .scenedl {
+        width: 36px;
+        height: 36px;
+        > i {
+          top: 50%;
+          left: 50%;
+          position: absolute;
+          transform: translate(-50%, -50%);
+          font-size: 14px;
+        }
       }
     }
   }
 }
-}
-</style>
+</style>

vue.config.js

@@ -1,6 +1,9 @@
 // const proxy_url = process.env.VUE_APP_PROXY_URL || 'http://8.135.98.231:8084'
 const proxy_url = process.env.VUE_APP_PROXY_URL || 'https://fcb.test.4dkankan.com'
 const proxy_4dkankan_url = process.env.VUE_APP_PROXY_4DKANKAN_URL || 'https://fcb.test.4dkankan.com'
+const path = require('path')
+
+const isDev = process.env.NODE_ENV === 'development'
 // https://vr-web01-uat.fcb.com.cn/
 let pages = {
   edit: 'src/pages/edit.js',
@@ -14,6 +17,7 @@ module.exports = {
   pages: pages,
   assetsDir: process.env.VUE_APP_STATIC_DIR,
   publicPath: process.env.NODE_ENV === "production" ? "/panorama/" : "",
+  outputDir: isDev ? 'dist' : path.resolve('../dist'),
   productionSourceMap: process.env.NODE_ENV !== "production",
   lintOnSave: false,
   css: {