Browse Source

更新代码

TrembleC 2 years ago
parent
commit
cdbb02e463

File diff suppressed because it is too large
+ 20483 - 4035
package-lock.json


+ 187 - 12
public/code/fdkk/data.json

@@ -6,16 +6,8 @@
       "short": "1",
       "scenes": [
         {
-          "id": "KJ-ICZUvSY8p7",
+          "id": "KJ-USe4FYu6YA",
           "title": "1号馆-1"
-        },
-        {
-          "id": "KJ-QtuMNdWtqw",
-          "title": "1号馆-2"
-        },
-        {
-          "id": "KJ-QtuMNdWtqw",
-          "title": "1号馆-3"
         }
       ]
     },
@@ -25,18 +17,201 @@
       "short": "2",
       "scenes": [
         {
-          "id": "KJ-QtuMNdWtqw",
+          "id": "KJ-JwYb26pM1p",
           "title": "2号馆-1"
         },
         {
-          "id": "KJ-QtuMNdWtqw",
+          "id": "KJ-PJpPXDHDym",
           "title": "2号馆-2"
         },
         {
-          "id": "KJ-QtuMNdWtqw",
+          "id": "KJ-4V3TKcZri7",
           "title": "2号馆-3"
         }
       ]
+    },
+    {
+      "id": 3,
+      "title": "3号馆",
+      "short": "3",
+      "scenes": [
+        {
+          "id": "KJ-oLPjUXMmgk",
+          "title": "3号馆-1"
+        },
+        {
+          "id": "KJ-LyaLJGE5pk",
+          "title": "3号馆-2"
+        },
+        {
+          "id": "KJ-EfSbKWePuv",
+          "title": "3号馆-3"
+        }
+      ]
+    },
+    {
+      "id": 4,
+      "title": "4号馆",
+      "short": "4",
+      "scenes": [
+        {
+          "id": "KJ-WjlJ6QGY68",
+          "title": "4号馆-1"
+        },
+        {
+          "id": "KJ-H9xLwO17Tp",
+          "title": "4号馆-2"
+        }
+      ]
+    },
+    {
+      "id": 5,
+      "title": "5号馆",
+      "short": "5",
+      "scenes": [
+        {
+          "id": "KJ-blT1nUYV3z",
+          "title": "5号馆-1"
+        },
+        {
+          "id": "KJ-ZeRqIOo25h",
+          "title": "5号馆-2"
+        },
+        {
+          "id": "KJ-yZBbQwapJ9",
+          "title": "5号馆-3"
+        },
+        {
+          "id": "KJ-6DZmcEofaE",
+          "title": "5号馆-4"
+        }
+      ]
+    },
+    {
+      "id": 6,
+      "title": "6号馆",
+      "short": "6",
+      "scenes": [
+        {
+          "id": "KJ-REGM1NzFYK",
+          "title": "6号馆-1"
+        },
+        {
+          "id": "KJ-QQlqr0G520",
+          "title": "6号馆-2"
+        },
+        {
+          "id": "KJ-BzRIoUrNr5",
+          "title": "6号馆-3"
+        },
+        {
+          "id": "KJ-sQWESCgs4Z",
+          "title": "6号馆-4"
+        }
+      ]
+    },
+    {
+      "id": 7,
+      "title": "7号馆",
+      "short": "7",
+      "scenes": [
+        {
+          "id": "KJ-wTdCULK87A",
+          "title": "7号馆-1"
+        },
+        {
+          "id": "KJ-AEK0mTl6C0",
+          "title": "7号馆-2"
+        },
+        {
+          "id": "KJ-tIJDj0MYBN",
+          "title": "7号馆-3"
+        },
+        {
+          "id": "KJ-VsV1sxxcbr",
+          "title": "7号馆-4"
+        }
+      ]
+    },
+    {
+      "id": 8,
+      "title": "8号馆",
+      "short": "8",
+      "scenes": [
+        {
+          "id": "KJ-lGUe770EVr",
+          "title": "8号馆-1"
+        },
+        {
+          "id": "KJ-QBigA11lZE",
+          "title": "8号馆-2"
+        }
+      ]
+    },
+    {
+      "id": 9,
+      "title": "9号馆",
+      "short": "9",
+      "scenes": [
+        {
+          "id": "KJ-Eksmdg394a",
+          "title": "9号馆-1"
+        },
+        {
+          "id": "KJ-Dd4DfOmFkI",
+          "title": "9号馆-2"
+        },
+        {
+          "id": "KJ-kWkIC9fpPs",
+          "title": "9号馆-3"
+        },
+        {
+          "id": "KJ-1Jmq3pKydG",
+          "title": "9号馆-4"
+        }
+      ]
+    },
+    {
+      "id": 10,
+      "title": "10号馆",
+      "short": "10",
+      "scenes": [
+        {
+          "id": "KJ-gFNKV5ln4m",
+          "title": "10号馆-1"
+        },
+        {
+          "id": "KJ-4pzSnN1eqb",
+          "title": "10号馆-2"
+        },
+        {
+          "id": "KJ-EZaC8R0dV9",
+          "title": "10号馆-3"
+        },
+        {
+          "id": "KJ-YLbDRGkwY5",
+          "title": "10号馆-4"
+        }
+      ]
+    },
+    {
+      "id": 11,
+      "title": "11号馆",
+      "short": "11",
+      "scenes": [
+        {
+          "id": "KJ-TRK4sJ1EOH",
+          "title": "11号馆-1"
+        },
+        {
+          "id": "KJ-mEZglAHhCX",
+          "title": "11号馆-2"
+        },
+        {
+          "id": "KJ-Nw80OTVroF",
+          "title": "11号馆-3"
+        }
+      ]
     }
   ]
 }

+ 82 - 0
public/code/fdkk/data2.json

@@ -0,0 +1,82 @@
+{
+  "list": [
+    {
+      "id": 12,
+      "title": "空军静展区",
+      "short": "空军静展区",
+      "scenes": [
+        {
+          "id": "KJ-ICZUvSY8p7",
+          "title": "空军静展区-1"
+        },
+        {
+          "id": "KJ-v4Ho4SuIG5",
+          "title": "空军静展区-2"
+        },
+        {
+          "id": "KJ-V9BxWXrBLj",
+          "title": "空军静展区-3"
+        },
+        {
+          "id": "KJ-9xwL5oV2qF",
+          "title": "空军静展区-4"
+        }
+      ]
+    },
+    {
+      "id": 13,
+      "title": "航天静展区",
+      "short": "航天静展区",
+      "scenes": [
+        {
+          "id": "KJ-4sq5b5AKe1",
+          "title": "航天静展区"
+        }
+      ]
+    },
+    {
+      "id": 14,
+      "title": "商务及公务机展区",
+      "short": "商务及公务机展区",
+      "scenes": [
+        {
+          "id": "KJ-tdbKwkZxn1",
+          "title": "商务及公务机展区"
+        }
+      ]
+    },
+    {
+      "id": 17,
+      "title": "航空工业静展区",
+      "short": "航空工业静展区",
+      "scenes": [
+        {
+          "id": "KJ-XvGmgndIBT",
+          "title": "航空工业静展区"
+        }
+      ]
+    },
+    {
+      "id": 18,
+      "title": "商用及公务机展区",
+      "short": "商用及公务机展区",
+      "scenes": [
+        {
+          "id": "KJ-YmXJ8wUes5",
+          "title": "商用及公务机展区"
+        }
+      ]
+    },
+    {
+      "id": 19,
+      "title": "通航展区",
+      "short": "通航展区",
+      "scenes": [
+        {
+          "id": "KJ-rYmIxLkdI1",
+          "title": "通航展区"
+        }
+      ]
+    }
+  ]
+}

BIN
public/code/videos/once.mp4


+ 10 - 0
public/show.html

@@ -7,6 +7,16 @@
     <link rel="icon" href="<%= BASE_URL %>favicon.png">
     <link rel="stylesheet" href="<%= VUE_APP_STATIC_DIR %>resource/js/scrollbar/perfect-scrollbar.css"/>
     <title>第14届中国航展</title>
+    <script>
+      var _hmt = _hmt || [];
+      (function() {
+        var hm = document.createElement("script");
+        hm.src = "https://hm.baidu.com/hm.js?d832f83b23b622976d17bd411fe9f17d";
+        var s = document.getElementsByTagName("script")[0]; 
+        s.parentNode.insertBefore(hm, s);
+      })();
+      </script>
+      
   </head>
   <body>
     <div id="app"></div>

+ 10 - 0
public/showMobile.html

@@ -6,6 +6,16 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.png">
     <title>第14届中国航展</title>
+    <script>
+      var _hmt = _hmt || [];
+      (function() {
+        var hm = document.createElement("script");
+        hm.src = "https://hm.baidu.com/hm.js?d832f83b23b622976d17bd411fe9f17d";
+        var s = document.getElementsByTagName("script")[0]; 
+        s.parentNode.insertBefore(hm, s);
+      })();
+      </script>
+      
   </head>
   <body>
     <div id="app"></div>

+ 17 - 6
src/components/welcome/index.vue

@@ -2,9 +2,9 @@
   <div
     class="welcome"
     :style="{
-      backgroundImage: !isVideo?`url(${g_CDN}images/${
-        g_isMobile ? 'mbbg' : 'bg'
-      }.jpg)`:'',
+      backgroundImage: !isVideo
+        ? `url(${g_CDN}images/${g_isMobile ? 'mbbg' : 'bg'}.jpg)`
+        : '',
     }"
   >
     <img class="logo" :src="`${g_CDN}images/logo.png`" alt="" />
@@ -42,14 +42,15 @@ export default {
     return {
       showJump: "",
       isVideo: false,
+      isKj: false,
     };
   },
   watch: {},
   methods: {
     select(type) {
       this.$bus.$emit("changeType", type);
-      this.$bus.$emit('toggleBgm',true)
-      this.handleJump()
+      this.$bus.$emit("toggleBgm", true);
+      this.handleJump();
       // this.isVideo = true;
       // this.startplay();
     },
@@ -67,7 +68,17 @@ export default {
         }
       });
     },
-  }
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.isKj = this.getQueryVariable("type") == "kj";
+      if (this.isKj) {
+        setTimeout(() => {
+          this.select("pano");
+        }, 0);
+      }
+    });
+  },
 };
 </script>
 

+ 2 - 2
src/framework/show/fdkk.vue

@@ -4,7 +4,7 @@
       allowfullscreen="true"
       ref="iframe"
       :key="selected.id"
-      :src="`https://www.4dkankan.com/spg.html?m=${selected.id}`"
+      :src="`https://www.4dkankan.com/spc.html?m=${selected.id}`"
       frameborder="0"
       @click="handleifrclk"
       @load="onIframLoad"
@@ -19,7 +19,7 @@
             :class="{ active: selected.id == item.id }"
           >
             <div>
-              <img :src="`https://4dkk.4dage.com/scene_edit_data/${item.id}/user/thumb-1k.jpg?v=0&rnd=0.4671252901999361&x-oss-process=image/resize,m_fill,w_80,h_60/quality,q_70`" v-errorimg="`${fdkk_CDN}/hangzhan/images/images${item.id}/result.png`" alt="" />
+              <img :src="`https://4dkk.4dage.com/images/images${item.id}/floor_0.png?t=1667802021476?v=0&rnd=0.5813201205835572&x-oss-process=image/resize,m_fill,w_80,h_60/quality,q_70`" v-errorimg="`${fdkk_CDN}/hangzhan/images/images${item.id}/result.png`" alt="" />
               <rollName
                 :offset="20"
                 :active="selected.id == item.id"

+ 2 - 0
src/framework/show/index.vue

@@ -29,6 +29,7 @@ export default {
       exhibition:'',
       isBgm: false,
       welcome: false,
+      isKj:false
     }
   },
   watch:{
@@ -54,6 +55,7 @@ export default {
     })
 
     this.exhibition = this.getQueryVariable('exhibition')
+   
   }
 }
 </script>

+ 385 - 0
src/framework/show/pano copy.vue

@@ -0,0 +1,385 @@
+<template>
+  <div class="ifrcon">
+    <div id="pano" class="pano"></div>
+    <div v-if="selected" class="title">{{ selected.sceneTitle }}</div>
+    <mbui :type="type" :class="{ uicon: exhibition }" :isShow="isShowM" @close="isShowM = false">
+      <div class="img_ul clip-scroller" slot="imgList">
+        <ul>
+          <li v-for="(item, i) in currentScenes" @click="handleItem(item)" :key="i"
+            :class="{ active: selected.id == item.id }">
+            <div>
+              <img :src="item.icon"
+                alt="" />
+              <rollName :offset="20" :active="selected.id == item.id" class="pic-name" :myref="'subw' + item.id"
+                :name="item.sceneTitle" />
+            </div>
+            <span class="bar"></span>
+          </li>
+        </ul>
+      </div>
+      <div class="txt_ul clip-scroller" slot="txtList" v-if="!exhibition">
+        <ul>
+          <li v-for="(item, i) in list" @click="selectExh = item" :key="i" :class="{ active: selectExh.id == item.id }">
+            <span>{{ item.title }}</span>
+          </li>
+        </ul>
+      </div>
+
+      <div v-if="!isShowM" @click="isShowM = true" class="btn_zhankai" slot="btn_zhankai">
+        <i class="iconfont icon-more"></i>
+      </div>
+      <vAside class="ui_header" slot="aside" />
+      <vSelect slot="select" v-if="!exhibition" :type="type"></vSelect>
+    </mbui>
+  </div>
+</template>
+
+<script>
+import mbui from "./ui";
+import vAside from "./ui/aside.vue";
+import vSelect from "./ui/select.vue";
+
+
+
+export default {
+  props: ['type', 'exhibition'],
+  components: {
+    mbui,
+    vSelect,
+    vAside
+  },
+  data() {
+    return {
+      params: "",
+      isShowM: true,
+      selected: {},
+      selectExh: {},
+      currentScenes:[],
+      list: [],
+      isFirst:true,
+      loadFinish: false
+    };
+  },
+  watch: {
+    selectExh: {
+      deep: true,
+      handler: function (newVal) {
+        if (newVal) {
+          this.isFirst = true
+          window.$.ajax({
+            dataType:'json',
+            url: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.id}/someData.json?_=0.0672449349999431`, success: (data) => {
+              this.selected = data.scenes[0]
+              this.currentScenes = data.scenes
+              this.loadFinish = false
+            }
+          })
+        }
+      }
+    },
+    selected: {
+      deep: true,
+      handler: function (newVal) {
+          window.vrViewFn = () => {
+            try {
+              this.loadFilsh = true
+              if (this.isFirst) {
+                this.isFirst = false
+              }
+              setTimeout(() => {
+                this.loadFinish = true
+              }, 4000);
+            } catch (error) {
+              error;
+            }
+          };
+
+          var settings = {
+            "events[skin_events].onloadcomplete": "js(window.vrViewFn());",
+            "skin_settings.littleplanetintro":this.isFirst,
+            "view.vlookat": newVal.initVisual ? newVal.initVisual.vlookat : 0,
+            "view.hlookat": newVal.initVisual ? newVal.initVisual.hlookat : 0,
+          };
+
+
+          window.$("#pano").empty();
+          window.removepano("#pano");
+          window.embedpano({
+            // https://4dkk.4dage.com/720yun_fd_manage/fd720_FC5BmPHcV/vtour/tour.xml
+            // xml: "%HTMLPATH%/static/template/tour.xml",
+            xml: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.sceneCode}/vtour/tour.xml`,
+            swf: `${this.g_CDN}resource/tour.swf`,
+            target: "pano",
+            html5: "auto",
+            mobilescale: 1,
+            vars: settings,
+            passQueryParameters: true,
+          });
+
+          // var krpano = document.getElementById("krpanoSWFObject");
+          // krpano.call(`loadscene('scene_${this.selectExh.id}__(${newVal.id})')`)
+          // setTimeout(() => {
+          //   if (newVal.view) {
+          //     console.log(newVal.view);
+          //     krpano.set("view.vlookat", newVal.view.vlookat || 0);
+          //     krpano.set("view.hlookat", newVal.view.hlookat || 0);
+          //   }
+          // });
+      }
+    }
+  },
+  methods: {
+    handleItem(item) {
+      if (this.loadFinish) {
+        this.selected = item
+      }
+    },
+    getList() {
+      // window.$.ajax({url:`code/pano/data.json`,success:(data)=>{
+      window.$.ajax({
+        url: `${this.g_CDN}pano/data.json`, success: (data) => {
+          this.list = data.list
+          if (this.exhibition) {
+            this.selectExh = this.list.find(item => item.id == this.exhibition)
+          } else {
+            this.selectExh = this.list[0]
+          }
+        }
+      })
+    }
+  },
+  mounted() {
+    this.getList()
+    this.$nextTick(() => {
+      let el1 = window.$(".clip-scroller > ul")
+      Array.from(el1).forEach(item => {
+        let frame1 = new window.PerfectScrollbar(item, {
+          useBothWheelAxes: true,
+          suppressScrollY: true,
+          wheelSpeed: 0.8,
+        });
+        window.$(item).data("scrollbar", frame1);
+      })
+    });
+  }
+};
+</script>
+<style lang="less" scoped>
+.ifrcon {
+  width: 100%;
+  height: 100%;
+  background: #fcfcfc;
+  text-align: center;
+
+  .pano {
+    width: 100%;
+    height: 100%;
+  }
+
+  .title {
+    --height: 40px;
+    position: fixed;
+    z-index: 99;
+    margin: 0;
+    height: var(--height);
+    line-height: var(--height);
+    font-size: 18px;
+    font-weight: 700;
+    color: #fff;
+    padding: 0 15px;
+    display: inline-block;
+    text-shadow: 1px 0 2px rgb(0 0 0 / 16%);
+    left: 50%;
+    -webkit-transform: translateX(-50%) translateY(0);
+    transform: translateX(-50%) translateY(0);
+    -webkit-transition: background 0.3s ease, min-width 0.3s ease,
+      border-radius 0.3s ease;
+    transition: background 0.3s ease, min-width 0.3s ease,
+      border-radius 0.3s ease;
+    width: 40%;
+    top: 20px;
+    background: -webkit-gradient(linear,
+        left top,
+        right top,
+        from(transparent),
+        color-stop(29%, rgba(0, 0, 0, 0.2)),
+        color-stop(69%, rgba(0, 0, 0, 0.2)),
+        to(transparent));
+    background: linear-gradient(90deg,
+        transparent,
+        rgba(0, 0, 0, 0.2) 29%,
+        rgba(0, 0, 0, 0.2) 69%,
+        transparent);
+    margin-top: 0;
+    text-align: center;
+  }
+
+  .uicon {
+    & /deep/ .btm-menu {
+      height: 250px;
+    }
+  }
+
+  .img_ul {
+    position: relative;
+    display: inline-block;
+    min-width: 50%;
+    max-width: 100%;
+
+    >ul {
+      display: inline-block;
+      white-space: nowrap;
+      background: linear-gradient(to right, rgba(32, 32, 32, 0), rgba(32, 32, 32, 1), rgba(32, 32, 32, 0));
+      width: 100%;
+
+      >li {
+        cursor: pointer;
+        list-style: none;
+        display: inline-block;
+        margin: 8px 10px;
+        position: relative;
+        padding-bottom: 8px;
+
+        >div {
+          width: 68px;
+          height: 68px;
+          overflow: hidden;
+          position: relative;
+          border-radius: 4px;
+          cursor: pointer;
+          color: rgba(256, 256, 256, 0.4);
+
+          >img {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            height: 100%;
+            transform: translate(-50%, -50%);
+          }
+
+          .iconfont {
+            position: absolute;
+            left: 4px;
+            top: 4px;
+            z-index: 99;
+          }
+
+          >span {
+            text-align: center;
+            display: inline-block;
+            background: rgba(0, 0, 0, 0.3);
+            position: absolute;
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+            left: 0;
+            bottom: 0;
+            width: 100%;
+          }
+        }
+
+        .bar {
+          display: none;
+        }
+
+        .pic-name {
+          background: rgba(0, 0, 0, 0.6);
+          position: absolute;
+          left: 0;
+          bottom: 0;
+          text-align: center;
+
+          /deep/ span {
+            word-break: keep-all;
+            white-space: nowrap;
+            font-size: 12px;
+          }
+        }
+
+        &.active {
+          .bar {
+            display: inline-block;
+            position: absolute;
+            bottom: 0px;
+            width: 80%;
+            left: 50%;
+            transform: translateX(-50%);
+            height: 2px;
+            background: @color;
+          }
+
+          >div {
+            color: rgba(256, 256, 256, 1);
+          }
+        }
+      }
+    }
+  }
+
+  .txt_ul {
+    margin: 18px auto;
+    border: 2px solid @color;
+    border-radius: 30px;
+    padding: 6px 15px;
+    display: inline-block;
+    position: relative;
+    width: 80%;
+
+    >ul {
+      width: 100%;
+      display: inline-block;
+      white-space: nowrap;
+
+      >li {
+        border: 1px solid rgba(256, 256, 256, 0.4);
+        border-radius: 24px;
+        padding: 6px 9px;
+        margin: 0 5px;
+        cursor: pointer;
+        display: inline-block;
+
+        >span {
+          font-size: 16px;
+          display: inline-block;
+          vertical-align: middle;
+          line-height: 1.2;
+          word-break: keep-all;
+          color: rgba(256, 256, 256, 0.4);
+        }
+
+        &.active {
+          padding: 6px 12px;
+          border: 1px solid @color;
+
+          >span {
+            color: #fff;
+          }
+        }
+      }
+    }
+  }
+
+  .btn_zhankai {
+    position: fixed;
+    left: 50%;
+    bottom: 8px;
+    transform: translateX(-50%);
+    background: rgba(0, 0, 0, .3);
+    border-radius: 50%;
+    padding: 6px;
+    cursor: pointer;
+
+    >i {
+      font-size: 28px;
+      cursor: pointer;
+    }
+  }
+
+}
+</style>
+
+<style lang="less">
+.ps__thumb-x {
+  width: 0px !important;
+}
+</style>

+ 91 - 217
src/framework/show/pano.vue

@@ -1,35 +1,56 @@
 <template>
   <div class="ifrcon">
-    <div id="pano" class="pano"></div>
-    <div v-if="selected" class="title">{{ selected.sceneTitle }}</div>
-    <mbui :type="type" :class="{ uicon: exhibition }" :isShow="isShowM" @close="isShowM = false">
-      <div class="img_ul clip-scroller" slot="imgList">
-        <ul>
-          <li v-for="(item, i) in currentScenes" @click="handleItem(item)" :key="i"
-            :class="{ active: selected.id == item.id }">
+    <iframe
+      allowfullscreen="true"
+      ref="iframe"
+      :key="selected.id"
+      :src="`https://www.4dkankan.com/spc.html?m=${selected.id}`"
+      frameborder="0"
+      @click="handleifrclk"
+      @load="onIframLoad"
+    ></iframe>
+    <mbui :type="type" :isShow="isShow" @close="isShow =false">
+      <div class="img_ul" slot="imgList">
+        <ul v-if="selectExh.scenes">
+          <li
+            v-for="(item, i) in selectExh.scenes"
+            @click="selected = item"
+            :key="i"
+            :class="{ active: selected.id == item.id }"
+          >
             <div>
-              <img :src="item.icon"
-                alt="" />
-              <rollName :offset="20" :active="selected.id == item.id" class="pic-name" :myref="'subw' + item.id"
-                :name="item.sceneTitle" />
+              <img :src="`https://4dkk.4dage.com/images/images${item.id}/floor_0.png?t=1667802021476?v=0&rnd=0.5813201205835572&x-oss-process=image/resize,m_fill,w_80,h_60/quality,q_70`" v-errorimg="`${fdkk_CDN}/hangzhan/images/images${item.id}/result.png`" alt="" />
+              <rollName
+                :offset="20"
+                :active="selected.id == item.id"
+                class="pic-name"
+                :myref="'subw' + item.id"
+                :name="item.title"
+              />
             </div>
             <span class="bar"></span>
           </li>
         </ul>
       </div>
-      <div class="txt_ul clip-scroller" slot="txtList" v-if="!exhibition">
+
+      <div class="txt_ul" slot="txtList">
         <ul>
-          <li v-for="(item, i) in list" @click="selectExh = item" :key="i" :class="{ active: selectExh.id == item.id }">
-            <span>{{ item.title }}</span>
+          <li
+            v-for="(item, i) in list"
+            @click="selectExh = item"
+            :key="i"
+            :class="{ active: selectExh.id == item.id }"
+          >
+            <span>{{ selectExh.id == item.id ? item.title : item.short }}</span>
           </li>
         </ul>
       </div>
 
-      <div v-if="!isShowM" @click="isShowM = true" class="btn_zhankai" slot="btn_zhankai">
+      <div v-if="!isShow" @click="isShow = true" class="btn_zhankai" slot="btn_zhankai">
         <i class="iconfont icon-more"></i>
       </div>
-      <vAside class="ui_header" slot="aside" />
-      <vSelect slot="select" v-if="!exhibition" :type="type"></vSelect>
+      <vAside class="ui_header" slot="aside"/>
+      <vSelect slot="select" :type="type"></vSelect>
     </mbui>
   </div>
 </template>
@@ -40,9 +61,8 @@ import vAside from "./ui/aside.vue";
 import vSelect from "./ui/select.vue";
 
 
-
 export default {
-  props: ['type', 'exhibition'],
+  props:['type'],
   components: {
     mbui,
     vSelect,
@@ -51,196 +71,72 @@ export default {
   data() {
     return {
       params: "",
-      isShowM: true,
-      selected: {},
-      selectExh: {},
-      currentScenes:[],
-      list: [],
-      isFirst:true,
-      loadFinish: false
+      isShow:true,
+      selected: '',
+      selectExh:{},
+      list:[]
     };
   },
-  watch: {
-    selectExh: {
-      deep: true,
-      handler: function (newVal) {
-        if (newVal) {
-          this.isFirst = true
-          window.$.ajax({
-            dataType:'json',
-            url: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.id}/someData.json?_=0.0672449349999431`, success: (data) => {
-              this.selected = data.scenes[0]
-              this.currentScenes = data.scenes
-              this.loadFinish = false
-            }
-          })
-        }
-      }
-    },
-    selected: {
-      deep: true,
-      handler: function (newVal) {
-          window.vrViewFn = () => {
-            try {
-              this.loadFilsh = true
-              if (this.isFirst) {
-                this.isFirst = false
-              }
-              setTimeout(() => {
-                this.loadFinish = true
-              }, 4000);
-            } catch (error) {
-              error;
-            }
-          };
-
-          var settings = {
-            "events[skin_events].onloadcomplete": "js(window.vrViewFn());",
-            "skin_settings.littleplanetintro":this.isFirst,
-            "view.vlookat": newVal.initVisual ? newVal.initVisual.vlookat : 0,
-            "view.hlookat": newVal.initVisual ? newVal.initVisual.hlookat : 0,
-          };
-
-
-          window.$("#pano").empty();
-          window.removepano("#pano");
-          window.embedpano({
-            // https://4dkk.4dage.com/720yun_fd_manage/fd720_FC5BmPHcV/vtour/tour.xml
-            // xml: "%HTMLPATH%/static/template/tour.xml",
-            xml: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.sceneCode}/vtour/tour.xml`,
-            swf: `${this.g_CDN}resource/tour.swf`,
-            target: "pano",
-            html5: "auto",
-            mobilescale: 1,
-            vars: settings,
-            passQueryParameters: true,
-          });
-
-          // var krpano = document.getElementById("krpanoSWFObject");
-          // krpano.call(`loadscene('scene_${this.selectExh.id}__(${newVal.id})')`)
-          // setTimeout(() => {
-          //   if (newVal.view) {
-          //     console.log(newVal.view);
-          //     krpano.set("view.vlookat", newVal.view.vlookat || 0);
-          //     krpano.set("view.hlookat", newVal.view.hlookat || 0);
-          //   }
-          // });
+  watch:{
+    selected:{
+      deep:true,
+      handler:function (newVal) {
+        console.log(newVal);
       }
     }
   },
   methods: {
-    handleItem(item) {
-      if (this.loadFinish) {
-        this.selected = item
-      }
+    handleifrclk(){
+      console.log(1111);
+    },
+    getList(){
+      window.$.ajax({url:`${this.g_CDN}fdkk/data2.json`,success:(data)=>{
+        this.list=data.list
+        this.selectExh = this.list[0]
+        this.selected = this.selectExh.scenes[0]
+      }})
+    },
+    onIframLoad() {
+      window.onmessage = () => {
+      
+      };
     },
-    getList() {
-      // window.$.ajax({url:`code/pano/data.json`,success:(data)=>{
-      window.$.ajax({
-        url: `${this.g_CDN}pano/data.json`, success: (data) => {
-          this.list = data.list
-          if (this.exhibition) {
-            this.selectExh = this.list.find(item => item.id == this.exhibition)
-          } else {
-            this.selectExh = this.list[0]
-          }
-        }
-      })
-    }
   },
-  mounted() {
+  mounted(){
     this.getList()
-    this.$nextTick(() => {
-      let el1 = window.$(".clip-scroller > ul")
-      Array.from(el1).forEach(item => {
-        let frame1 = new window.PerfectScrollbar(item, {
-          useBothWheelAxes: true,
-          suppressScrollY: true,
-          wheelSpeed: 0.8,
-        });
-        window.$(item).data("scrollbar", frame1);
-      })
-    });
+    this.$bus.$on('showM',()=>{
+      this.isShowM = true
+    })
   }
 };
 </script>
+
 <style lang="less" scoped>
 .ifrcon {
   width: 100%;
   height: 100%;
   background: #fcfcfc;
   text-align: center;
-
-  .pano {
+  > iframe {
     width: 100%;
     height: 100%;
   }
-
-  .title {
-    --height: 40px;
-    position: fixed;
-    z-index: 99;
-    margin: 0;
-    height: var(--height);
-    line-height: var(--height);
-    font-size: 18px;
-    font-weight: 700;
-    color: #fff;
-    padding: 0 15px;
-    display: inline-block;
-    text-shadow: 1px 0 2px rgb(0 0 0 / 16%);
-    left: 50%;
-    -webkit-transform: translateX(-50%) translateY(0);
-    transform: translateX(-50%) translateY(0);
-    -webkit-transition: background 0.3s ease, min-width 0.3s ease,
-      border-radius 0.3s ease;
-    transition: background 0.3s ease, min-width 0.3s ease,
-      border-radius 0.3s ease;
-    width: 40%;
-    top: 20px;
-    background: -webkit-gradient(linear,
-        left top,
-        right top,
-        from(transparent),
-        color-stop(29%, rgba(0, 0, 0, 0.2)),
-        color-stop(69%, rgba(0, 0, 0, 0.2)),
-        to(transparent));
-    background: linear-gradient(90deg,
-        transparent,
-        rgba(0, 0, 0, 0.2) 29%,
-        rgba(0, 0, 0, 0.2) 69%,
-        transparent);
-    margin-top: 0;
-    text-align: center;
-  }
-
-  .uicon {
-    & /deep/ .btm-menu {
-      height: 250px;
-    }
-  }
-
   .img_ul {
+    width: 100%;
     position: relative;
-    display: inline-block;
-    min-width: 50%;
-    max-width: 100%;
-
-    >ul {
+    > ul {
+      overflow-x: auto;
       display: inline-block;
-      white-space: nowrap;
-      background: linear-gradient(to right, rgba(32, 32, 32, 0), rgba(32, 32, 32, 1), rgba(32, 32, 32, 0));
-      width: 100%;
-
-      >li {
+      background: linear-gradient(to right,rgba(32,32,32,0),rgba(32,32,32,1),rgba(32,32,32,0));
+      min-width: 50%;
+      > li {
         cursor: pointer;
         list-style: none;
         display: inline-block;
         margin: 8px 10px;
         position: relative;
         padding-bottom: 8px;
-
-        >div {
+        > div {
           width: 68px;
           height: 68px;
           overflow: hidden;
@@ -248,23 +144,20 @@ export default {
           border-radius: 4px;
           cursor: pointer;
           color: rgba(256, 256, 256, 0.4);
-
-          >img {
+          > img {
             position: absolute;
             top: 50%;
             left: 50%;
             height: 100%;
             transform: translate(-50%, -50%);
           }
-
           .iconfont {
             position: absolute;
             left: 4px;
             top: 4px;
             z-index: 99;
           }
-
-          >span {
+          > span {
             text-align: center;
             display: inline-block;
             background: rgba(0, 0, 0, 0.3);
@@ -277,25 +170,21 @@ export default {
             width: 100%;
           }
         }
-
         .bar {
           display: none;
         }
-
         .pic-name {
           background: rgba(0, 0, 0, 0.6);
           position: absolute;
           left: 0;
           bottom: 0;
           text-align: center;
-
           /deep/ span {
             word-break: keep-all;
             white-space: nowrap;
             font-size: 12px;
           }
         }
-
         &.active {
           .bar {
             display: inline-block;
@@ -307,8 +196,7 @@ export default {
             height: 2px;
             background: @color;
           }
-
-          >div {
+          >div{
             color: rgba(256, 256, 256, 1);
           }
         }
@@ -322,23 +210,19 @@ export default {
     border-radius: 30px;
     padding: 6px 15px;
     display: inline-block;
-    position: relative;
-    width: 80%;
-
-    >ul {
-      width: 100%;
-      display: inline-block;
-      white-space: nowrap;
-
-      >li {
+    > ul {
+      overflow-x: auto;
+      display: flex;
+      &::-webkit-scrollbar {
+        display: none;
+      }
+      > li {
         border: 1px solid rgba(256, 256, 256, 0.4);
         border-radius: 24px;
         padding: 6px 9px;
         margin: 0 5px;
         cursor: pointer;
-        display: inline-block;
-
-        >span {
+        > span {
           font-size: 16px;
           display: inline-block;
           vertical-align: middle;
@@ -346,40 +230,30 @@ export default {
           word-break: keep-all;
           color: rgba(256, 256, 256, 0.4);
         }
-
         &.active {
           padding: 6px 12px;
           border: 1px solid @color;
-
-          >span {
+          > span {
             color: #fff;
           }
         }
       }
     }
   }
-
-  .btn_zhankai {
+  
+  .btn_zhankai{
     position: fixed;
     left: 50%;
     bottom: 8px;
     transform: translateX(-50%);
-    background: rgba(0, 0, 0, .3);
+    background: rgba(0,0,0,.3);
     border-radius: 50%;
     padding: 6px;
     cursor: pointer;
-
-    >i {
+    >i{
       font-size: 28px;
       cursor: pointer;
     }
   }
-
 }
 </style>
-
-<style lang="less">
-.ps__thumb-x {
-  width: 0px !important;
-}
-</style>

File diff suppressed because it is too large
+ 13 - 6
src/framework/show/ui/intro.vue


+ 29 - 28
src/framework/showMobile/fdkk.vue

@@ -4,7 +4,7 @@
       allowfullscreen="true"
       ref="iframe"
       :key="selected.id"
-      :src="`https://www.4dkankan.com/spg.html?m=${selected.id}`"
+      :src="`https://www.4dkankan.com/spc.html?m=${selected.id}`"
       frameborder="0"
       @click="handleifrclk"
     ></iframe>
@@ -18,7 +18,7 @@
             :class="{ active: selected.id == item.id }"
           >
             <div>
-              <img :src="`https://4dkk.4dage.com/scene_edit_data/${item.id}/user/thumb-1k.jpg?v=0&rnd=0.4671252901999361&x-oss-process=image/resize,m_fill,w_80,h_60/quality,q_70`" v-errorimg="`${fdkk_CDN}/hangzhan/images/images${item.id}/result.png`" alt="" />
+              <img :src="`https://4dkk.4dage.com/images/images${item.id}/floor_0.png?t=1667802021476?v=0&rnd=0.5813201205835572&x-oss-process=image/resize,m_fill,w_80,h_60/quality,q_70`" v-errorimg="`${fdkk_CDN}/hangzhan/images/images${item.id}/result.png`" alt="" />
               <rollName
                 :offset="20"
                 :active="selected.id == item.id"
@@ -117,35 +117,36 @@ export default {
   .img_ul {
     width: 100%;
     position: relative;
-    &::before,
-    &::after {
-      background: linear-gradient(
-        to right,
-        rgba(0, 0, 0, 0.4),
-        rgba(0, 0, 0, 0)
-      );
-      position: absolute;
-      content: "";
-      width: 80px;
-      height: 67px;
-      top: 0;
-      z-index: 10;
-      pointer-events: none;
-    }
-    &::before {
-      left: 0;
-    }
-    &::after {
-      right: 0;
-      background: linear-gradient(
-        to left,
-        rgba(0, 0, 0, 0.4),
-        rgba(0, 0, 0, 0)
-      );
-    }
+    // &::before,
+    // &::after {
+    //   background: linear-gradient(
+    //     to right,
+    //     rgba(0, 0, 0, 0.4),
+    //     rgba(0, 0, 0, 0)
+    //   );
+    //   position: absolute;
+    //   content: "";
+    //   width: 80px;
+    //   height: 67px;
+    //   top: 0;
+    //   z-index: 10;
+    //   pointer-events: none;
+    // }
+    // &::before {
+    //   left: 0;
+    // }
+    // &::after {
+    //   right: 0;
+    //   background: linear-gradient(
+    //     to left,
+    //     rgba(0, 0, 0, 0.4),
+    //     rgba(0, 0, 0, 0)
+    //   );
+    // }
     > ul {
       overflow-x: auto;
       display: flex;
+      justify-content: center;
       &::-webkit-scrollbar {
         display: none;
       }

+ 339 - 0
src/framework/showMobile/pano copy.vue

@@ -0,0 +1,339 @@
+<template>
+  <div class="ifrcon">
+    <div id="pano" class="pano"></div>
+    <mbui :isShow="isShowM" :class="{ uicon: exhibition }" @close="isShowM = false">
+      <div class="img_ul" slot="imgList">
+        <ul v-if="currentScenes">
+          <li v-for="(item, i) in currentScenes" @click="handleItem(item)" :key="i"
+            :class="{ active: selected.id == item.id }">
+            <div>
+              <img :src="item.icon" alt="" />
+              <rollName :offset="20" :active="selected.id == item.id" class="pic-name" :myref="'subw' + item.id"
+                :name="item.sceneTitle" />
+            </div>
+            <span class="bar"></span>
+          </li>
+        </ul>
+      </div>
+
+      <div class="txt_ul" slot="txtList" v-if="!exhibition && list.length > 0">
+        <ul>
+          <li v-for="(item, i) in list" @click="selectExh = item" :key="i" :class="{ active: selectExh.id == item.id }">
+            <span>{{ item.title }}</span>
+          </li>
+        </ul>
+      </div>
+
+      <div class="btn_zhankai" slot="btn_zhankai">
+        <img @click="isShowM = true" :src="require('@/assets/images/menu.png')" alt="">
+      </div>
+      <vHeader :vtitle="selected.sceneTitle" class="ui_header" slot="header" />
+      <vSelect v-if="!exhibition" :type="type" slot="select"></vSelect>
+    </mbui>
+  </div>
+</template>
+
+<script>
+import mbui from "./ui";
+import vHeader from "./ui/Show.Header.vue";
+import vSelect from "./ui/select.vue";
+
+
+export default {
+  props: ['type', 'exhibition'],
+  components: {
+    mbui,
+    vSelect,
+    vHeader
+  },
+  data() {
+    return {
+      params: "",
+      isShowM: true,
+      selected: '',
+      selectExh: {},
+      currentScenes: [],
+      list: [],
+      isChange: true,
+      loadFinish: false,
+      isFirst: true
+    };
+  },
+  watch: {
+    selectExh: {
+      deep: true,
+      handler: function (newVal) {
+        if (newVal) {
+          this.isFirst = true
+          window.$.ajax({
+            dataType: 'json',
+            url: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.id}/someData.json?_=0.0672449349999431`, success: (data) => {
+              this.selected = data.scenes[0]
+              this.currentScenes = data.scenes
+              this.loadFinish = false
+            }
+          })
+        }
+      }
+
+    },
+    selected: {
+      deep: true,
+      handler: function (newVal) {
+
+        window.vrViewFn = () => {
+          try {
+            this.loadFilsh = true
+            if (this.isFirst) {
+              this.isFirst = false
+            }
+            setTimeout(() => {
+              this.loadFinish = true
+
+            }, 4000);
+          } catch (error) {
+            error;
+          }
+        };
+
+        var settings = {
+          "events[skin_events].onloadcomplete": "js(window.vrViewFn());",
+          "skin_settings.littleplanetintro": this.isFirst,
+          "view.vlookat": newVal.initVisual ? newVal.initVisual.vlookat : 0,
+          "view.hlookat": newVal.initVisual ? newVal.initVisual.hlookat : 0,
+        };
+
+
+        window.$("#pano").empty();
+        window.removepano("#pano");
+        window.embedpano({
+          // https://4dkk.4dage.com/720yun_fd_manage/fd720_FC5BmPHcV/vtour/tour.xml
+          // xml: "%HTMLPATH%/static/template/tour.xml",
+          xml: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.sceneCode}/vtour/tour.xml`,
+          swf: `${this.g_CDN}resource/tour.swf`,
+          target: "pano",
+          html5: "auto",
+          mobilescale: 1,
+          vars: settings,
+          passQueryParameters: true,
+        });
+      }
+    }
+  },
+  methods: {
+    handleItem(item) {
+      if (this.loadFinish) {
+        this.selected = item
+      }
+    },
+    getList() {
+      // window.$.ajax({url:`code/pano/data.json`,success:(data)=>{
+      window.$.ajax({
+        url: `${this.g_CDN}pano/data.json`, success: (data) => {
+          console.log(data, 222);
+          this.list = data.list
+
+
+          if (this.exhibition) {
+            this.selectExh = this.list.find(item => item.id == this.exhibition)
+          } else {
+            this.selectExh = this.list[0]
+          }
+        }
+      })
+    }
+  },
+  mounted() {
+    this.getList()
+  }
+};
+</script>
+
+<style lang="less" scoped>
+.ifrcon {
+  width: 100%;
+  height: 100%;
+  background: #fcfcfc;
+
+  .pano {
+    width: 100%;
+    height: 100%;
+  }
+
+  .uicon {
+    & /deep/ .btm-menu {
+      height: 160px;
+    }
+  }
+
+  .img_ul {
+    width: 100%;
+    position: relative;
+
+    &::before,
+    &::after {
+      background: linear-gradient(to right,
+          rgba(0, 0, 0, 0.4),
+          rgba(0, 0, 0, 0));
+      position: absolute;
+      content: "";
+      width: 80px;
+      height: 67px;
+      top: 0;
+      z-index: 10;
+      pointer-events: none;
+    }
+
+    &::before {
+      left: 0;
+    }
+
+    &::after {
+      right: 0;
+      background: linear-gradient(to left,
+          rgba(0, 0, 0, 0.4),
+          rgba(0, 0, 0, 0));
+    }
+
+    >ul {
+      overflow-x: auto;
+      display: flex;
+
+      &::-webkit-scrollbar {
+        display: none;
+      }
+
+      >li {
+        cursor: pointer;
+        list-style: none;
+        display: inline-block;
+        margin: 0 5px;
+        position: relative;
+        padding-bottom: 7px;
+
+        >div {
+          width: 68px;
+          height: 68px;
+          overflow: hidden;
+          position: relative;
+          border-radius: 8px;
+          cursor: pointer;
+
+          >img {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            height: 100%;
+            transform: translate(-50%, -50%);
+          }
+
+          .iconfont {
+            position: absolute;
+            left: 4px;
+            top: 4px;
+            z-index: 99;
+          }
+
+          >span {
+            text-align: center;
+            display: inline-block;
+            background: rgba(0, 0, 0, 0.3);
+            position: absolute;
+            text-overflow: ellipsis;
+            overflow: hidden;
+            white-space: nowrap;
+            left: 0;
+            bottom: 0;
+            width: 100%;
+          }
+        }
+
+        .bar {
+          display: none;
+        }
+
+        .pic-name {
+          background: rgba(0, 0, 0, 0.6);
+          position: absolute;
+          left: 0;
+          bottom: 0;
+          text-align: center;
+
+          /deep/ span {
+            word-break: keep-all;
+            white-space: nowrap;
+            font-size: 12px;
+          }
+        }
+
+        &.active {
+          .bar {
+            display: inline-block;
+            position: absolute;
+            bottom: 0px;
+            width: 80%;
+            left: 50%;
+            transform: translateX(-50%);
+            height: 2px;
+            background: @color;
+          }
+        }
+      }
+    }
+  }
+
+  .txt_ul {
+    width: 90%;
+    margin: 18px auto;
+    border: 2px solid @color;
+    border-radius: 30px;
+    padding: 8px 15px 10px;
+
+    >ul {
+      overflow-x: auto;
+      display: flex;
+
+      &::-webkit-scrollbar {
+        display: none;
+      }
+
+      >li {
+        border: 1px solid rgba(256, 256, 256, 0.4);
+        border-radius: 24px;
+        padding: 6px 9px;
+        margin: 0 5px;
+
+        >span {
+          font-size: 16px;
+          display: inline-block;
+          vertical-align: middle;
+          line-height: 1.2;
+          word-break: keep-all;
+          color: rgba(256, 256, 256, 0.4);
+        }
+
+        &.active {
+          padding: 6px 12px;
+          border: 1px solid @color;
+
+          >span {
+            color: #fff;
+          }
+        }
+      }
+    }
+  }
+
+  .btn_zhankai {
+    position: fixed;
+    left: 50%;
+    bottom: 24px;
+    transform: translateX(-50%);
+
+    >img {
+      width: 40px;
+      height: 40px;
+    }
+  }
+}
+</style>

+ 98 - 163
src/framework/showMobile/pano.vue

@@ -1,34 +1,55 @@
 <template>
   <div class="ifrcon">
-    <div id="pano" class="pano"></div>
-    <mbui :isShow="isShowM" :class="{ uicon: exhibition }" @close="isShowM = false">
+    <iframe
+      allowfullscreen="true"
+      ref="iframe"
+      :key="selected.id"
+      :src="`https://www.4dkankan.com/spc.html?m=${selected.id}`"
+      frameborder="0"
+      @click="handleifrclk"
+    ></iframe>
+    <mbui :isShow="isShowM" @close="isShowM =false">
       <div class="img_ul" slot="imgList">
-        <ul v-if="currentScenes">
-          <li v-for="(item, i) in currentScenes" @click="handleItem(item)" :key="i"
-            :class="{ active: selected.id == item.id }">
+        <ul v-if="selectExh.scenes">
+          <li
+            v-for="(item, i) in selectExh.scenes"
+            @click="selected = item"
+            :key="i"
+            :class="{ active: selected.id == item.id }"
+          >
             <div>
-              <img :src="item.icon" alt="" />
-              <rollName :offset="20" :active="selected.id == item.id" class="pic-name" :myref="'subw' + item.id"
-                :name="item.sceneTitle" />
+              <img :src="`https://4dkk.4dage.com/images/images${item.id}/floor_0.png?t=1667802021476?v=0&rnd=0.5813201205835572&x-oss-process=image/resize,m_fill,w_80,h_60/quality,q_70`" v-errorimg="`${fdkk_CDN}/hangzhan/images/images${item.id}/result.png`" alt="" />
+              <rollName
+                :offset="20"
+                :active="selected.id == item.id"
+                class="pic-name"
+                :myref="'subw' + item.id"
+                :name="item.title"
+              />
             </div>
             <span class="bar"></span>
           </li>
         </ul>
       </div>
 
-      <div class="txt_ul" slot="txtList" v-if="!exhibition && list.length > 0">
+      <div class="txt_ul" slot="txtList">
         <ul>
-          <li v-for="(item, i) in list" @click="selectExh = item" :key="i" :class="{ active: selectExh.id == item.id }">
-            <span>{{ item.title }}</span>
+          <li
+            v-for="(item, i) in list"
+            @click="selectExh = item"
+            :key="i"
+            :class="{ active: selectExh.id == item.id }"
+          >
+            <span>{{ selectExh.id == item.id ? item.title : item.short }}</span>
           </li>
         </ul>
       </div>
 
       <div class="btn_zhankai" slot="btn_zhankai">
-        <img @click="isShowM = true" :src="require('@/assets/images/menu.png')" alt="">
+        <img @click="isShowM=true"  :src="require('@/assets/images/menu.png')" alt="">
       </div>
-      <vHeader :vtitle="selected.sceneTitle" class="ui_header" slot="header" />
-      <vSelect v-if="!exhibition" :type="type" slot="select"></vSelect>
+      <vHeader class="ui_header" slot="header"/>
+      <vSelect :type="type" slot="select"></vSelect>
     </mbui>
   </div>
 </template>
@@ -40,7 +61,7 @@ import vSelect from "./ui/select.vue";
 
 
 export default {
-  props: ['type', 'exhibition'],
+  props:['type'],
   components: {
     mbui,
     vSelect,
@@ -49,102 +70,37 @@ export default {
   data() {
     return {
       params: "",
-      isShowM: true,
+      isShowM:true,
       selected: '',
-      selectExh: {},
-      currentScenes: [],
-      list: [],
-      isChange: true,
-      loadFinish: false,
-      isFirst: true
+      selectExh:{},
+      list:[]
     };
   },
-  watch: {
-    selectExh: {
-      deep: true,
-      handler: function (newVal) {
-        if (newVal) {
-          this.isFirst = true
-          window.$.ajax({
-            dataType: 'json',
-            url: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.id}/someData.json?_=0.0672449349999431`, success: (data) => {
-              this.selected = data.scenes[0]
-              this.currentScenes = data.scenes
-              this.loadFinish = false
-            }
-          })
-        }
-      }
-
-    },
-    selected: {
-      deep: true,
-      handler: function (newVal) {
-
-        window.vrViewFn = () => {
-          try {
-            this.loadFilsh = true
-            if (this.isFirst) {
-              this.isFirst = false
-            }
-            setTimeout(() => {
-              this.loadFinish = true
-
-            }, 4000);
-          } catch (error) {
-            error;
-          }
-        };
-
-        var settings = {
-          "events[skin_events].onloadcomplete": "js(window.vrViewFn());",
-          "skin_settings.littleplanetintro": this.isFirst,
-          "view.vlookat": newVal.initVisual ? newVal.initVisual.vlookat : 0,
-          "view.hlookat": newVal.initVisual ? newVal.initVisual.hlookat : 0,
-        };
-
-
-        window.$("#pano").empty();
-        window.removepano("#pano");
-        window.embedpano({
-          // https://4dkk.4dage.com/720yun_fd_manage/fd720_FC5BmPHcV/vtour/tour.xml
-          // xml: "%HTMLPATH%/static/template/tour.xml",
-          xml: `https://4dkk.4dage.com/720yun_fd_manage/${newVal.sceneCode}/vtour/tour.xml`,
-          swf: `${this.g_CDN}resource/tour.swf`,
-          target: "pano",
-          html5: "auto",
-          mobilescale: 1,
-          vars: settings,
-          passQueryParameters: true,
-        });
+  watch:{
+    selected:{
+      deep:true,
+      handler:function (newVal) {
+        console.log(newVal);
       }
     }
   },
   methods: {
-    handleItem(item) {
-      if (this.loadFinish) {
-        this.selected = item
-      }
+    handleifrclk(){
+      console.log(1111111);
     },
-    getList() {
-      // window.$.ajax({url:`code/pano/data.json`,success:(data)=>{
-      window.$.ajax({
-        url: `${this.g_CDN}pano/data.json`, success: (data) => {
-          console.log(data, 222);
-          this.list = data.list
-
-
-          if (this.exhibition) {
-            this.selectExh = this.list.find(item => item.id == this.exhibition)
-          } else {
-            this.selectExh = this.list[0]
-          }
-        }
-      })
+    getList(){
+      window.$.ajax({url:`${this.g_CDN}fdkk/data2.json`,success:(data)=>{
+        this.list=data.list
+        this.selectExh = this.list[0]
+        this.selected = this.selectExh.scenes[0]
+      }})
     }
   },
-  mounted() {
+  mounted(){
     this.getList()
+    this.$bus.$on('showM',()=>{
+      this.isShowM = true
+    })
   }
 };
 </script>
@@ -154,87 +110,75 @@ export default {
   width: 100%;
   height: 100%;
   background: #fcfcfc;
-
-  .pano {
+  > iframe {
     width: 100%;
     height: 100%;
   }
-
-  .uicon {
-    & /deep/ .btm-menu {
-      height: 160px;
-    }
-  }
-
   .img_ul {
     width: 100%;
     position: relative;
-
-    &::before,
-    &::after {
-      background: linear-gradient(to right,
-          rgba(0, 0, 0, 0.4),
-          rgba(0, 0, 0, 0));
-      position: absolute;
-      content: "";
-      width: 80px;
-      height: 67px;
-      top: 0;
-      z-index: 10;
-      pointer-events: none;
-    }
-
-    &::before {
-      left: 0;
-    }
-
-    &::after {
-      right: 0;
-      background: linear-gradient(to left,
-          rgba(0, 0, 0, 0.4),
-          rgba(0, 0, 0, 0));
-    }
-
-    >ul {
+    // &::before,
+    // &::after {
+    //   background: linear-gradient(
+    //     to right,
+    //     rgba(0, 0, 0, 0.4),
+    //     rgba(0, 0, 0, 0)
+    //   );
+    //   position: absolute;
+    //   content: "";
+    //   width: 80px;
+    //   height: 67px;
+    //   top: 0;
+    //   z-index: 10;
+    //   pointer-events: none;
+    // }
+    // &::before {
+    //   left: 0;
+    // }
+    // &::after {
+    //   right: 0;
+    //   background: linear-gradient(
+    //     to left,
+    //     rgba(0, 0, 0, 0.4),
+    //     rgba(0, 0, 0, 0)
+    //   );
+    // }
+    > ul {
       overflow-x: auto;
       display: flex;
-
+      justify-content: center;
       &::-webkit-scrollbar {
         display: none;
       }
 
-      >li {
+      > li {
         cursor: pointer;
         list-style: none;
         display: inline-block;
         margin: 0 5px;
         position: relative;
         padding-bottom: 7px;
-
-        >div {
+        > div {
           width: 68px;
           height: 68px;
           overflow: hidden;
           position: relative;
           border-radius: 8px;
           cursor: pointer;
-
-          >img {
+          > img {
             position: absolute;
             top: 50%;
             left: 50%;
             height: 100%;
             transform: translate(-50%, -50%);
           }
-
           .iconfont {
             position: absolute;
             left: 4px;
             top: 4px;
             z-index: 99;
           }
-
-          >span {
+          > span {
             text-align: center;
             display: inline-block;
             background: rgba(0, 0, 0, 0.3);
@@ -247,25 +191,21 @@ export default {
             width: 100%;
           }
         }
-
         .bar {
           display: none;
         }
-
         .pic-name {
           background: rgba(0, 0, 0, 0.6);
           position: absolute;
           left: 0;
           bottom: 0;
           text-align: center;
-
           /deep/ span {
             word-break: keep-all;
             white-space: nowrap;
             font-size: 12px;
           }
         }
-
         &.active {
           .bar {
             display: inline-block;
@@ -288,22 +228,18 @@ export default {
     border: 2px solid @color;
     border-radius: 30px;
     padding: 8px 15px 10px;
-
-    >ul {
+    > ul {
       overflow-x: auto;
       display: flex;
-
       &::-webkit-scrollbar {
         display: none;
       }
-
-      >li {
+      > li {
         border: 1px solid rgba(256, 256, 256, 0.4);
         border-radius: 24px;
         padding: 6px 9px;
         margin: 0 5px;
-
-        >span {
+        > span {
           font-size: 16px;
           display: inline-block;
           vertical-align: middle;
@@ -311,26 +247,25 @@ export default {
           word-break: keep-all;
           color: rgba(256, 256, 256, 0.4);
         }
-
         &.active {
           padding: 6px 12px;
           border: 1px solid @color;
-
-          >span {
+          > span {
             color: #fff;
           }
         }
       }
     }
   }
-
-  .btn_zhankai {
+  
+  .ui_header{
+  }
+  .btn_zhankai{
     position: fixed;
     left: 50%;
     bottom: 24px;
     transform: translateX(-50%);
-
-    >img {
+    >img{
       width: 40px;
       height: 40px;
     }

+ 8 - 7
src/framework/showMobile/ui/Show.Header.vue

@@ -117,19 +117,20 @@ export default {
 
   .right {
     position: absolute;
-    right: 10px;
+    right: 8px;
     top: 1px;
-    width: 38px;
-    height: 38px;
+    width: 44px;
+    height: 60px;
     display: flex;
-    align-items: center;
-    border-radius: 50%;
     > i {
-      font-size: 20px;
+      font-size: 28px;
       position: absolute;
       top: 50%;
       left: 50%;
-      transform: translate(-50%, -50%);
+      transform: translate(-50%, -70%);
+      background: rgba(0,0,0,0.6);
+      backdrop-filter: blur(10px);
+      border-radius: 4px;
     }
     > div {
       position: absolute;

File diff suppressed because it is too large
+ 27 - 20
src/framework/showMobile/ui/intro.vue