up

web/public/static/js/main_2020_show.js

@@ -3215,7 +3215,8 @@ window.Modernizr = function(n, e, t) {
             var hotList = $('#hotListWrap')[0];
             hotList.classList.remove('hotListActive');
             $('#hotListContent ul .active').removeClass('active');
-            $('#hotList')[0].classList.remove('active')
+            if($('#hotList')&&$('#hotList')[0]) $('#hotList')[0].classList.remove('active')
+            
         }
         ,
         n.prototype.onTouchMove = function(e) {
@@ -7414,7 +7415,8 @@ window.Modernizr = function(n, e, t) {
                     var hotList = $('#hotListWrap')[0];
                     hotList.classList.remove('hotListActive');
                     $('#hotListContent ul .active').removeClass('active');
-                    $('#hotList')[0].classList.remove('active')
+                    if($('#hotList')&&$('#hotList')[0]) $('#hotList')[0].classList.remove('active')
+                    
                 })
             }
             

web/src/components/iframe/index.vue

@@ -60,6 +60,7 @@ activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
   width: 100vw;
   height: 100vh;
   z-index: 99999;
+  position: relative;
   .btn{
     display: flex;
     align-items: center;

web/src/components/welcome/index.vue

@@ -1,39 +1,16 @@
 <template>
+  <!-- isMobile -->
   <div class="welcome">
-    <img
-      class="bg"
-      :src="
-        require(`@/assets/images/project/${isMobile ? 'mobile.jpg' : 'pc.jpg'}`)
-      "
-      alt=""
-    />
-    <div
-      class="btn"
-      @click.stop="clickBtn"
-      :style="{
-        backgroundImage: `url(${require('@/assets/images/project/btn.png')})`,
-      }"
-    >
-      <span v-if="!isMobile"
-        >主办方：珠海高新技术产业开发区党群工作部、珠海高新区（唐家湾镇）文化中心、珠海四维时代科技有限公司、中国移动通信集团有限公司</span
-      >
-    </div>
-    <div class="shouji" v-if="isMobile">
-      <span>主办方：</span>
-      珠海高新技术产业开发区党群工作部、珠海高新区（唐家湾镇）<i
-        >文化中心、珠海四维时代科技有限公司、中国移动通信集团有限公司</i
-      >
-    </div>
-
-    <!-- <div class="btn" v-else @click.stop="$emit('close')" :style="{backgroundImage:`url(${require('@/assets/images/project/btnMo.png')})`}">
-      <span class="txt">进入线上展厅</span>
-      <span>主办方：珠海高新技术产业开发区</span>
-      </div> -->
+    <MapMo v-if="isMobile" @toVr='clickBtn'/>
+    <MapPc v-else @toVr='clickBtn'/>
   </div>
 </template>
 
 <script>
+import MapMo from "./mapMo.vue";
+import MapPc from "./mapPc.vue";
 export default {
+  components: { MapPc, MapMo },
   data() {
     return {
       loading: true,
@@ -41,16 +18,12 @@ export default {
   },
   methods: {
     clickBtn() {
-      // fetch("http://8.135.106.227:8011/show/addVisit")
-        fetch("/show/addVisit")
-        .then((response) => response.json())
-        .then((data) => {
-          console.log("------------", data);
-        });
       this.$emit("close");
     },
   },
-  mounted() {},
+  mounted() {
+
+  },
 };
 </script>
 
@@ -61,111 +34,11 @@ export default {
   left: 0;
   width: 100%;
   height: 100%;
-  z-index: 9999;
+  z-index: 9100;
   font-size: 0;
   transition: all ease 0.3s;
-  background-color: #a6160e;
-  .bg {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-  }
-
-  .btn {
-    position: absolute;
-    bottom: 15%;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 9999;
-    font-size: 0;
-    display: inline-block;
-    cursor: pointer;
-    width: 316px;
-    height: 104px;
-    background-size: cover;
-    background-color: none;
-    > span {
-      font-size: 24px;
-      position: fixed;
-      top: 180%;
-      left: 50%;
-      transform: translateX(-50%);
-      letter-spacing: 2px;
-      color: #edd3b0;
-    }
-  }
-}
-
-.loading {
-  position: fixed;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  z-index: 10000;
-  background: #000;
-  > span {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translateX(-50%, -50%);
-    color: #fff;
-    font-size: 16px;
-    display: inline-block;
-  }
 }
 
-@media only screen and (max-width: 487px) {
-  @scale: 0.7;
-  .welcome {
-    .bg {
-      background-repeat: no-repeat;
-    }
-    .btn {
-      position: absolute;
-      bottom: 25%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      z-index: 99;
-      width: 180px;
-      height: 70px;
-      background-size: 100% 100%;
-      > span {
-        top: 110%;
-        font-size: 14px;
-        left: 50%;
-        transform: translateX(-50%);
-      }
-      .txt {
-        font-size: 14px;
-        color: #f3d4bd;
-        z-index: 99999;
-        top: 45%;
-        transform: translate(-52%, -50%);
-      }
-    }
-    .shouji {
-      padding: 0 5px;
-      text-align: center;
-      font-size: 12px;
-      line-height: 14px;
-      z-index: 9999;
-      position: absolute;
-      bottom: 10px;
-      left: 0;
-      width: 100%;
-      color: #edd3b0;
-      & > span {
-        display: block;
-        font-weight: 700;
-      }
-      & > i {
-        display: block;
-      }
-    }
-  }
+@media only screen and (max-width: 600px) {
 }
 </style>

web/src/components/welcome/mapMo.vue

@@ -0,0 +1,189 @@
+<template>
+  <div class="mapMo">
+    <Iframe :url="iframeUrl" :myIframe.sync="myIframe" />
+    <img class="wbBac" src="../../assets/tabMo/mobile.jpg" alt="" />
+    <div class="box">
+      <div class="row row0" @click="$emit('toVr')"></div>
+      <div
+        class="row row1"
+        @click="skipIframe('http://www.4dmodel.com/SuperTwo/index.html?m=1257')"
+      ></div>
+      <div class="row row2" @click="toHideHot('C9Xzw4A682213')"></div>
+      <div
+        class="row row3"
+        @click="
+          skipIframe('https://www.4dkankan.com/spc.html?m=uqNseUZY9F&lang=zh')
+        "
+      ></div>
+      <div
+        class="row row4"
+        @click="
+          skipIframe('https://www.4dkankan.com/spc.html?m=rVuZY399SA&lang=zh')
+        "
+      ></div>
+      <div
+        class="row row5"
+        @click="skipIframe('https://www.4dmodel.com/SuperTwo/index.html?m=997')"
+      ></div>
+      <div class="row row6"></div>
+      <div
+        class="row row7"
+        @click="skipIframe('http://www.4dmodel.com/SuperTwo/index.html?m=1034')"
+      ></div>
+      <div
+        class="row row8"
+        @click="
+          skipIframe('https://www.4dkankan.com/spc.html?m=9ZqmhsI1Iq&lang=zh')
+        "
+      ></div>
+      <div class="row row9" @click="toHideHot('SkJMnNI650604')"></div>
+      <div class="row row10" @click="toHideHot('LKkKYP679393')"></div>
+      <div class="row row11" @click="toHideHot('1jugHED669838')"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+import Iframe from "@/components/iframe";
+export default {
+  name: "mapMo",
+  components: { Iframe },
+  data() {
+    //这里存放数据
+    return {
+      iframeUrl: "",
+      myIframe: false,
+    };
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    //移动端跳转
+    skipIframe(url) {
+      this.iframeUrl = url;
+      this.myIframe = true;
+    },
+
+    toHideHot(id) {
+      let temp = window.myHotList.filter((v) => v.sid == id)[0];
+      setTimeout(() => {
+        temp && temp.examine(window.player, true);
+      }, 200);
+      console.log("----", temp);
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='less' scoped>
+.mapMo {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  .wbBac {
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+  .box {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    .row {
+      position: absolute;
+      width: 30%;
+      height: 10%;
+    }
+    .row0 {
+      right: 6%;
+      top: 43%;
+      width: 23%;
+      height: 12%;
+    }
+    .row1 {
+      left: 14%;
+      top: 57%;
+      width: 39%;
+      height: 7%;
+    }
+    .row2 {
+      left: 62%;
+      top: 57%;
+      width: 32%;
+      height: 7%;
+    }
+    .row3 {
+      left: 14%;
+      bottom: 27%;
+      width: 20%;
+      height: 6%;
+    }
+    .row4 {
+      left: 40%;
+      bottom: 27%;
+      width: 20%;
+      height: 6%;
+    }
+    .row5 {
+      left: 62%;
+      bottom: 27%;
+      width: 26%;
+      height: 6%;
+    }
+    .row6 {
+      left: 14%;
+      bottom: 17%;
+      width: 21%;
+      height: 6%;
+    }
+    .row7 {
+      left: 40%;
+      bottom: 17%;
+      width: 20%;
+      height: 6%;
+    }
+    .row8 {
+      left: 62%;
+      bottom: 17%;
+      width: 27%;
+      height: 6%;
+    }
+    .row9 {
+      left: 16%;
+      bottom: 7%;
+      width: 18%;
+      height: 6%;
+    }
+    .row10 {
+      left: 40%;
+      bottom: 7%;
+      width: 18%;
+      height: 6%;
+    }
+    .row11 {
+      left: 62%;
+      bottom: 7%;
+      width: 18%;
+      height: 6%;
+    }
+  }
+}
+</style>

web/src/components/welcome/mapPc.vue

@@ -0,0 +1,249 @@
+<template>
+  <div class="mapPc">
+    <img class="wbBac" src="../../assets/tab/tab1dw.jpg" alt="" />
+    <div class="box">
+      <div class="row row0" @click="$emit('toVr')"></div>
+      <div
+        class="row row1"
+        @click="skipIframe('http://www.4dmodel.com/SuperTwo/index.html?m=1257')"
+      ></div>
+      <div class="row row2" @click="toHideHot('C9Xzw4A682213')"></div>
+      <div
+        class="row row3"
+        @click="
+          skipIframe('https://www.4dkankan.com/spc.html?m=uqNseUZY9F&lang=zh')
+        "
+      ></div>
+      <div
+        class="row row4"
+        @click="
+          skipIframe('https://www.4dkankan.com/spc.html?m=rVuZY399SA&lang=zh')
+        "
+      ></div>
+      <div
+        class="row row5"
+        @click="skipIframe('https://www.4dmodel.com/SuperTwo/index.html?m=997')"
+      ></div>
+      <!-- <div class="row row6"></div> -->
+      <div
+        class="row row7"
+        @click="skipIframe('http://www.4dmodel.com/SuperTwo/index.html?m=1034')"
+      ></div>
+      <div
+        class="row row8"
+        @click="
+          skipIframe('https://www.4dkankan.com/spc.html?m=9ZqmhsI1Iq&lang=zh')
+        "
+      ></div>
+      <div class="row row9" @click="toHideHot('SkJMnNI650604')"></div>
+      <div class="row row10" @click="toHideHot('LKkKYP679393')"></div>
+      <div class="row row11" @click="toHideHot('1jugHED669838')"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "mapPc",
+  components: {},
+  data() {
+    //这里存放数据
+    return {};
+  },
+  //监听属性 类似于data概念
+  computed: {},
+  //监控data中的数据变化
+  watch: {},
+  //方法集合
+  methods: {
+    //移动端跳转
+    skipIframe(url) {
+      window.open(url, "_blank");
+    },
+
+    toHideHot(id) {
+      let temp = window.myHotList.filter((v) => v.sid == id)[0];
+      setTimeout(() => {
+        temp && temp.examine(window.player, true);
+      }, 200);
+      console.log("----", temp);
+    },
+  },
+  //生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  //生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  beforeCreate() {}, //生命周期 - 创建之前
+  beforeMount() {}, //生命周期 - 挂载之前
+  beforeUpdate() {}, //生命周期 - 更新之前
+  updated() {}, //生命周期 - 更新之后
+  beforeDestroy() {}, //生命周期 - 销毁之前
+  destroyed() {}, //生命周期 - 销毁完成
+  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
+};
+</script>
+<style lang='less' scoped>
+.mapPc {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  background-color: #fff;
+  .wbBac {
+    pointer-events: none;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+  }
+  .box {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    top: 0;
+    left: 0;
+    .row {
+      cursor: pointer;
+      position: absolute;
+      width: 30%;
+      height: 10%;
+      &::before {
+        position: absolute;
+        left: 50%;
+        width: 160px;
+        transform: translateX(-50%);
+        top: -60px;
+        text-align: center;
+        padding: 15px;
+        border-radius: 15px;
+        background-color: rgba(0, 0, 0, 0.6);
+        color: #fff;
+        font-size: 16px;
+      }
+    }
+    .row0 {
+      right: 21%;
+      bottom: 16%;
+      width: 8.5%;
+      height: 18%;
+      &:hover {
+        &::before {
+          content: "红色云展厅";
+        }
+      }
+    }
+    .row1 {
+      left: 20%;
+      top: 47%;
+      width: 8%;
+      height: 5%;
+      &:hover {
+        &::before {
+          content: "金鼎党群服务中心";
+        }
+      }
+    }
+    .row2 {
+      left: 23%;
+      top: 31%;
+      width: 5.5%;
+      height: 6%;
+      &:hover {
+        &::before {
+          content: "上栅村史馆";
+        }
+      }
+    }
+    .row3 {
+      right: 30%;
+      top: 20%;
+      width: 3%;
+      height: 4%;
+      &:hover {
+        &::before {
+          content: "淇澳广场";
+        }
+      }
+    }
+    .row4 {
+      right: 27.3%;
+      top: 24%;
+      width: 4%;
+      height: 4%;
+      &:hover {
+        &::before {
+          content: "淇澳村使馆";
+        }
+      }
+    }
+    .row5 {
+      right: 31.4%;
+      top: 24.3%;
+      width: 5%;
+      height: 4%;
+      &:hover {
+        &::before {
+          content: "苏兆征故居陈列馆";
+        }
+      }
+    }
+    // .row6 {
+    // }
+    .row7 {
+      left: 41%;
+      bottom: 39.5%;
+      width: 7.5%;
+      height: 3%;
+      &:hover {
+        &::before {
+          content: "望慈山房";
+        }
+      }
+    }
+    .row8 {
+      left: 40%;
+      bottom: 43%;
+      width: 6.5%;
+      height: 4%;
+      &:hover {
+        &::before {
+          content: "共乐园";
+        }
+      }
+    }
+    .row9 {
+      left: 50%;
+      bottom: 33%;
+      width: 3.5%;
+      height: 5%;
+      &:hover {
+        &::before {
+          content: "金山软件";
+        }
+      }
+    }
+    .row10 {
+      left: 37%;
+      top: 39%;
+      width: 4%;
+      height: 5%;
+      &:hover {
+        &::before {
+          content: "世纪鼎利";
+        }
+      }
+    }
+    .row11 {
+      left: 34%;
+      top: 33%;
+      width: 3.5%;
+      height: 5%;
+      &:hover {
+        &::before {
+          content: "世纪鼎利";
+        }
+      }
+    }
+  }
+}
+</style>

web/src/pages/Home.vue

@@ -31,7 +31,7 @@
         <v-title />
 
         <!-- 底部菜单 -->
-        <v-menu @openIndex="showWelcome = true" ref="menuRef"/>
+        <v-menu @openIndex="showWelcome = true" ref="menuRef" />
 
         <!-- 导览 -->
         <v-guide />
@@ -125,8 +125,7 @@ export default {
       this.showWelcome = false;
       window.manage.switchBgmState(true);
 
-
-      this.$refs.menuRef.openOneSon()
+      // this.$refs.menuRef.openOneSon()
     },
     getHotSpotList() {
       $.ajax({
@@ -148,6 +147,12 @@ export default {
   },
 
   mounted() {
+    fetch("/show/addVisit")
+      .then((response) => response.json())
+      .then((data) => {
+        console.log("------------", data);
+      });
+
     this.$nextTick(() => {
       window.evt = document.createEvent("HTMLEvents");
       window.evt.initEvent("loadfinish", false, false);

web/src/views/gui/menu.vue

@@ -318,7 +318,13 @@
         </div>
         <!-- 3个小地图 -->
         <div class="minMap minMap1">
-          <a href="javascript:;"></a>
+          <a href="javascript:;"
+                      @click="
+              skipIframe(
+                'http://www.4dmodel.com/SuperTwo/index.html?m=1257'
+              )
+            "
+          ></a>
           <a href="javascript:;" @click="toHideHot('C9Xzw4A682213')"></a>
         </div>
         <div class="minMap minMap2">
@@ -347,7 +353,12 @@
         </div>
         <div class="minMap minMap3">
           <a href="javascript:;"></a>
-          <a href="javascript:;"></a>
+          <a href="javascript:;"
+                      @click="
+              skipIframe(
+                'http://www.4dmodel.com/SuperTwo/index.html?m=1034'
+              )
+            "></a>
           <a
             href="javascript:;"
             @click="
@@ -585,7 +596,7 @@
         ></div>
         <!-- 地图 -->
         <div class="map">
-          <img src="../../assets/tab/tab1dw.jpg" alt="" />
+          <img src="../../assets/tab/weBac.jpg" alt="" />
         </div>
 
         <!-- 后面加的图片对应的点击事件 -->
@@ -649,64 +660,7 @@
           title="派诺科技"
           @click="toHideHot('1jugHED669838')"
         ></a>
-        <!-- 最下面的跳转链接 -->
-        <!-- <div class="bottom">
-          <div>
-            <a href="javascript:;"></a>
-            <a
-              href="javascript:;"
-              title="上栅村史馆"
-              @click="toHideHot('C9Xzw4A682213')"
-            ></a>
-          </div>
-          <div>
-            <a
-              target="_blank"
-              href="https://www.4dkankan.com/spc.html?m=uqNseUZY9F&lang=zh"
-              title="淇澳广场"
-            ></a>
-            <a
-              target="_blank"
-              href="https://www.4dkankan.com/spc.html?m=rVuZY399SA&lang=zh"
-              title="淇澳村使馆"
-            ></a>
-            <a
-              target="_blank"
-              href="https://www.4dmodel.com/SuperTwo/index.html?m=997"
-              title="苏兆征故居陈列馆"
-            ></a>
-          </div>
-          <div>
-            <a href="javascript:;"></a>
-            <a
-              target="_blank"
-              href="http://www.4dmodel.com/SuperTwo/index.html?m=1034"
-              title="望慈山房"
-            ></a>
-            <a
-              target="_blank"
-              href="https://www.4dkankan.com/spc.html?m=9ZqmhsI1Iq&lang=zh"
-              title="共乐园"
-            ></a>
-          </div>
-          <div>
-            <a
-              href="javascript:;"
-              title="金山软件"
-              @click="toHideHot('SkJMnNI650604')"
-            ></a>
-            <a
-              href="javascript:;"
-              title="世纪鼎利"
-              @click="toHideHot('LKkKYP679393')"
-            ></a>
-            <a
-              href="javascript:;"
-              title="派诺科技"
-              @click="toHideHot('1jugHED669838')"
-            ></a>
-          </div>
-        </div> -->
+
       </div>
     </div>
     <!-- pc  --答题 -------------------------->
@@ -1423,6 +1377,8 @@ export default {
       cursor: pointer;
       position: absolute;
       z-index: 10;
+      background-color: #5e1616;
+      opacity: .5;
     }
     .imgClick1 {
       top: 365px;