Главная Обзор Помощь
Регистрация Вход
lanxin
/
ScienceEduBaseScene
1
0
Ответвить 0
Файлы Обсуждения 0 Запросы на слияние 0 Вики
Просмотр исходного кода

feat

lanxin 2 месяцев назад
Родитель
157322ff15
Сommit
4264df80c6
50 измененных файлов с 1789 добавлено и 34302 удалено
Единый вид Показать статистику Diff
  1. 8 3
      hot/babel.config.js
  2. 30 0
      hot/index.html
  3. 0 26499
      hot/package-lock.json
  4. 10 8
      hot/package.json
  5. 0 34
      hot/public/index.html
  6. 0 6
      hot/src/assets/base.css
  7. BIN
      hot/src/assets/images/logo.png
  8. BIN
      hot/src/assets/images/pc/left.png
  9. BIN
      hot/src/assets/images/pc/right.png
  10. BIN
      hot/src/assets/images/textBg.png
  11. 18 17
      hot/src/main.js
  12. 99 102
      hot/src/views/Home.vue
  13. 38 0
      hot/vite.config.js
  14. 0 3
      hot/vue.config.js
  15. 1414 7455
      hot/yarn.lock
  16. 10 7
      scene/public/css/oldVer/main0.css
  17. BIN
      scene/public/images/4dagePoint.png
  18. BIN
      scene/public/images/4dagePoint2.png
  19. BIN
      scene/public/images/Volume btn_off.png
  20. BIN
      scene/public/images/Volume btn_on.png
  21. BIN
      scene/public/images/auto-suspend.png
  22. BIN
      scene/public/images/auto.png
  23. BIN
      scene/public/images/back.png
  24. BIN
      scene/public/images/back2_active.png
  25. BIN
      scene/public/images/close1.png
  26. BIN
      scene/public/images/dollhouse.png
  27. BIN
      scene/public/images/dollhouse_active.png
  28. BIN
      scene/public/images/floor.png
  29. BIN
      scene/public/images/floor_active.png
  30. BIN
      scene/public/images/hotlist.png
  31. BIN
      scene/public/images/hotlist_active.png
  32. BIN
      scene/public/images/inside.png
  33. BIN
      scene/public/images/inside_active.png
  34. BIN
      scene/public/images/pause.png
  35. BIN
      scene/public/images/play.png
  36. 1 1
      scene/public/index.html
  37. 3 1
      scene/public/js/Hot.js
  38. 1 1
      scene/public/js/loadCAD.js
  39. 2 8
      scene/public/showa/js/loadCAD.js
  40. BIN
      scene/src/assets/font/ssgst.TTF
  41. BIN
      scene/src/assets/img/back.png
  42. BIN
      scene/src/assets/img/close.png
  43. BIN
      scene/src/assets/img/hotlist_bg.png
  44. BIN
      scene/src/assets/img/hotlist_bg_M.png
  45. 1 7
      scene/src/assets/styles/base.css
  46. 3 11
      scene/src/pages/A0base/index.tsx
  47. 4 2
      scene/src/pages/A2main/index.module.scss
  48. 10 44
      scene/src/pages/A2main/index.tsx
  49. 114 74
      scene/src/pages/A3hotList/index.module.scss
  50. 23 19
      scene/src/pages/A3hotList/index.tsx

+ 8 - 3
hot/babel.config.js
Просмотреть файл 

@@ -1,5 +1,10 @@
 
 module.exports = {

 module.exports = {

   presets: [

   presets: [

-    '@vue/cli-plugin-babel/preset'

-  ]

-}

+    [

+      "@babel/preset-env",

+      {

+        targets: "defaults", // 自动适配目标浏览器

+      },

+    ],

+  ],

+};

+ 30 - 0
hot/index.html
Просмотреть файл 

@@ -0,0 +1,30 @@
 
+<!DOCTYPE html>

+<html lang="en">

+  <head>

+    <meta charset="utf-8" />

+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

+    <meta name="viewport" content="width=device-width,initial-scale=1.0" />

+    <title>hotspot</title>

+  </head>

+

+  <body>

+    <noscript>

+      <strong>We're sorry but hotspot doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>

+    </noscript>

+    <div id="app"></div>

+    <script type="module" src="./src/main.js"></script>

+    <!-- built files will be auto injected -->

+  </body>

+  <script type="text/javascript">

+    document.oncontextmenu = function () {

+      return false;

+    };

+    document.onkeydown = function () {

+      if (window.event && window.event.keyCode === 123) {

+        event.keyCode = 0;

+        event.returnValue = false;

+        return false;

+      }

+    };

+  </script>

+</html>

Разница между файлами не показана из-за своего большого размера
+ 0 - 26499
hot/package-lock.json


+ 10 - 8
hot/package.json
Просмотреть файл 

@@ -3,30 +3,32 @@
 
   "version": "0.1.0",

   "version": "0.1.0",

   "private": true,

   "private": true,

   "scripts": {

   "scripts": {

-    "serve": "vue-cli-service serve",

-    "build": "vue-cli-service build",

-    "lint": "vue-cli-service lint"

+    "serve": "vite",

+    "build": "vite build",

+    "lint": "eslint . --ext .vue,.js"

   },

   },

   "dependencies": {

   "dependencies": {

     "axios": "^0.20.0",

     "axios": "^0.20.0",

     "core-js": "^3.6.5",

     "core-js": "^3.6.5",

     "swiper": "^5.4.5",

     "swiper": "^5.4.5",

     "v-viewer": "^1.5.1",

     "v-viewer": "^1.5.1",

+    "vite-plugin-vue2": "^2.0.3",

     "vue": "^2.6.11",

     "vue": "^2.6.11",

     "vue-awesome-swiper": "^4.1.1",

     "vue-awesome-swiper": "^4.1.1",

     "vue-lazyload": "^1.3.3",

     "vue-lazyload": "^1.3.3",

     "vue-router": "^3.2.0"

     "vue-router": "^3.2.0"

   },

   },

   "devDependencies": {

   "devDependencies": {

-    "@vue/cli-plugin-babel": "~4.5.0",

-    "@vue/cli-plugin-eslint": "~4.5.0",

-    "@vue/cli-plugin-router": "~4.5.0",

-    "@vue/cli-service": "~4.5.0",

+    "@babel/preset-env": "^7.28.3",

+    "@vitejs/plugin-vue2": "2.3.4",

     "babel-eslint": "^10.1.0",

     "babel-eslint": "^10.1.0",

     "eslint": "^6.7.2",

     "eslint": "^6.7.2",

-    "eslint-plugin-vue": "^6.2.2",

+    "eslint-plugin-vue": "^10.5.0",

     "less": "^3.0.4",

     "less": "^3.0.4",

     "less-loader": "^5.0.0",

     "less-loader": "^5.0.0",

+    "vite": "4.5.0",

+    "vite-plugin-commonjs": "^0.10.4",

+    "vite-plugin-vue2-svg": "0.4.0",

     "vue-template-compiler": "^2.6.11"

     "vue-template-compiler": "^2.6.11"

   }

   }

 }

 }

+ 0 - 34
hot/public/index.html
Просмотреть файл 

@@ -1,34 +0,0 @@
 
-<!DOCTYPE html>

-<html lang="en">

-

-<head>

-  <meta charset="utf-8">

-  <meta http-equiv="X-UA-Compatible" content="IE=edge">

-  <meta name="viewport" content="width=device-width,initial-scale=1.0">

-  <title>

-    <%= htmlWebpackPlugin.options.title %>

-  </title>

-</head>

-

-<body>

-  <noscript>

-    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.

-        Please enable it to continue.</strong>

-  </noscript>

-  <div id="app"></div>

-  <!-- built files will be auto injected -->

-</body>

-<script type="text/javascript">

-  document.oncontextmenu = function () {

-    return false

-  }

-  document.onkeydown = function () {

-    if (window.event && window.event.keyCode === 123) {

-      event.keyCode = 0

-      event.returnValue = false

-      return false

-    }

-  }

-</script>

-

-</html>

+ 0 - 6
hot/src/assets/base.css
Просмотреть файл 

@@ -31,10 +31,4 @@ body {
 
     bottom: auto;

     bottom: auto;

     top: 10px;

     top: 10px;

   }

   }

-}

-

-@font-face {

-  font-family: 'fzFont';

-  /* 自定义字体名称 */

-  src: url('./font/fzFont.TTF') format('truetype');

 }
 
 }

BIN
hot/src/assets/images/logo.png
Просмотреть файл


BIN
hot/src/assets/images/pc/left.png
Просмотреть файл


BIN
hot/src/assets/images/pc/right.png
Просмотреть файл


BIN
hot/src/assets/images/textBg.png
Просмотреть файл


+ 18 - 17
hot/src/main.js
Просмотреть файл 

@@ -1,23 +1,24 @@
 
-import Vue from 'vue'

-import App from './App.vue'

-import router from './router'

-import axios from 'axios'

-import 'viewerjs/dist/viewer.css'

-import Viewer from 'v-viewer'

+import Vue from "vue";

+import App from "./App.vue"; // 根组件

+import router from "./router"; // 路由（若使用 Vue Router）

+import axios from "axios";

+import "viewerjs/dist/viewer.css";

+import Viewer from "v-viewer";

 // 图片懒加载

 // 图片懒加载

-import VueLazyLoad from 'vue-lazyload'

+import VueLazyLoad from "vue-lazyload";

 Vue.use(VueLazyLoad, {

 Vue.use(VueLazyLoad, {

-  error: require('@/assets/images/IMGerror.png'),

-  loading: require('@/assets/images/loading.gif')

-})

+  error: require("@/assets/images/IMGerror.png"),

+  loading: require("@/assets/images/loading.gif"),

+});

 

 

-Vue.config.productionTip = false

-Vue.prototype.$http = axios

+Vue.config.productionTip = false;

+Vue.prototype.$http = axios;

 

 

-Vue.use(Viewer)

+Vue.use(Viewer);

 

 

-import './assets/base.css'

+import "./assets/base.css";

+// 初始化 Vue 实例

 new Vue({

 new Vue({

-  router,

-  render: h => h(App)

-}).$mount('#app')

+  router, // 注入路由（如有）

+  render: (h) => h(App), // 渲染根组件

+}).$mount("#app"); // 挂载到 index.html 中的 #app 元素

+ 99 - 102
hot/src/views/Home.vue
Просмотреть файл 

@@ -1,7 +1,9 @@
 
 <template>

 <template>

   <div class="home">

   <div class="home">

     <div class="main">

     <div class="main">

-      <div class="myTitle">{{ myTitle }}</div>

+      <div class="logo"><img :src="require('@/assets/images/logo.png')" alt="" draggable="false" /></div>

+

+      <!-- <div class="myTitle">{{ myTitle }}</div> -->

       <div class="mainCon" v-show="!oneTxt">

       <div class="mainCon" v-show="!oneTxt">

         <audio id="myAudio" v-if="audio" v-show="isOneAduio" :src="urlToFitFu(audio)" controls></audio>

         <audio id="myAudio" v-if="audio" v-show="isOneAduio" :src="urlToFitFu(audio)" controls></audio>

         <!-- 如果只有一个模块 -->

         <!-- 如果只有一个模块 -->

@@ -18,8 +20,7 @@
 
 

 

         <div class="contenBoxMain swiper-container">

         <div class="contenBoxMain swiper-container">

           <div class="swiper-wrapper">

           <div class="swiper-wrapper">

-            <div class="contenBox swiper-slide" v-for="(item, index) in data[myType]"

-              :key="myType === 'video' ? item.url : item">

+            <div class="contenBox swiper-slide" v-for="(item, index) in data[myType]" :key="myType === 'video' ? item.url : item">

               <!-- 模型页面 -->

               <!-- 模型页面 -->

               <div class="modelBox" v-if="myType === 'model'">

               <div class="modelBox" v-if="myType === 'model'">

                 <iframe :src="urlToFitFu(item)" frameborder="0" v-if="index === myInd"></iframe>

                 <iframe :src="urlToFitFu(item)" frameborder="0" v-if="index === myInd"></iframe>

@@ -38,11 +39,8 @@
 
           </div>

           </div>

           <!-- 左右箭头 -->

           <!-- 左右箭头 -->

           <template v-if="!isMobile">

           <template v-if="!isMobile">

-            <div @click="cutMyInd(-1, myInd === 0)" class="leftJJ awccJJ" :class="{ noClick: myInd === 0 }"

-              v-if="data[myType] && data[myType].length > 1"></div>

-            <div @click="cutMyInd(1, myInd === data[myType].length - 1)" class="rightJJ awccJJ"

-              :class="{ noClick: myInd === data[myType].length - 1 }" v-if="data[myType] && data[myType].length > 1">

-            </div>

+            <div @click="cutMyInd(-1, myInd === 0)" class="leftJJ awccJJ" :class="{ noClick: myInd === 0 }" v-if="data[myType] && data[myType].length > 1"></div>

+            <div @click="cutMyInd(1, myInd === data[myType].length - 1)" class="rightJJ awccJJ" :class="{ noClick: myInd === data[myType].length - 1 }" v-if="data[myType] && data[myType].length > 1"></div>

           </template>

           </template>

         </div>

         </div>

       </div>

       </div>

@@ -52,12 +50,10 @@
 
       <!-- 下面的文字介绍 -->

       <!-- 下面的文字介绍 -->

       <div class="flooTxt" :class="{ flooTxtOne: oneTxt }">

       <div class="flooTxt" :class="{ flooTxtOne: oneTxt }">

         <div class="flooTxtBox">

         <div class="flooTxtBox">

-          <!-- <div class="myTitle">{{ myTitle }}</div> -->

+          <div class="myTitle">{{ myTitle }}</div>

           <!-- 视频的介绍 -->

           <!-- 视频的介绍 -->

-          <div class="myTxt" v-if="myType === 'video' && videoTxt[myInd]" v-html="videoTxt[myInd]">

-          </div>

-          <div class="myTxt" v-if="myType === 'img' && imgTxt[myInd]" v-html="imgTxt[myInd]">

-          </div>

+          <div class="myTxt" v-if="myType === 'video' && videoTxt[myInd]" v-html="videoTxt[myInd]"></div>

+          <div class="myTxt" v-if="myType === 'img' && imgTxt[myInd]" v-html="imgTxt[myInd]"></div>

           <div class="myTxt" v-html="myTxt"></div>

           <div class="myTxt" v-html="myTxt"></div>

         </div>

         </div>

       </div>

       </div>

@@ -69,19 +65,11 @@
 
 

 

     <!-- 底部的tab -->

     <!-- 底部的tab -->

     <div class="flooTabBox" v-if="flooTab.length > 1">

     <div class="flooTabBox" v-if="flooTab.length > 1">

-      <div @click="myType = item.type" class="tabRow" :class="{ tabRowAc: myType === item.type }"

-        v-for="item in flooTab" :key="item.id">

-        <img :src="require(`@/assets/images/pc/icon${item.id}${myType === item.type ? 'Ac' : ''

-          }.png`)

-          " alt="" />

+      <div @click="myType = item.type" class="tabRow" :class="{ tabRowAc: myType === item.type }" v-for="item in flooTab" :key="item.id">

+        <img :src="require(`@/assets/images/pc/icon${item.id}${myType === item.type ? 'Ac' : ''}.png`)" alt="" />

         <div>

         <div>

           {{ item.name }}

           {{ item.name }}

-          <span v-if="

-            data[item.type] &&

-            data[item.type].length &&

-            data[item.type].length > 1

-          ">{{ item.type === myType ? myInd + 1 + "/" : null

-          }}{{ data[item.type].length }}</span>

+          <span v-if="data[item.type] && data[item.type].length && data[item.type].length > 1">{{ item.type === myType ? myInd + 1 + "/" : null }}{{ data[item.type].length }}</span>

         </div>

         </div>

       </div>

       </div>

       <!-- 音频图标 -->

       <!-- 音频图标 -->

@@ -94,13 +82,12 @@
 
 </template>

 </template>

 

 

 <script>

 <script>

-import Swiper from "swiper"

-import "swiper/css/swiper.min.css"

+import Swiper from "swiper";

+import "swiper/css/swiper.min.css";

 

 

 export default {

 export default {

   name: "Home",

   name: "Home",

-  components: {

-  },

+  components: {},

   data() {

   data() {

     return {

     return {

       isMobile: /iPhone|iPad|iPod|Android/i.test(navigator.userAgent),

       isMobile: /iPhone|iPad|iPod|Android/i.test(navigator.userAgent),

@@ -143,29 +130,29 @@ export default {
 
 

 

       // 只有标题和文字（没有视频，没有模型，没有图片）

       // 只有标题和文字（没有视频，没有模型，没有图片）

       oneTxt: false,

       oneTxt: false,

-    }

+    };

   },

   },

   watch: {

   watch: {

     myType() {

     myType() {

-      this.myInd = 0

+      this.myInd = 0;

     },

     },

     // 音频的开启和关闭

     // 音频的开启和关闭

     audioSta(val) {

     audioSta(val) {

-      const dom = document.querySelector("#myAudio")

+      const dom = document.querySelector("#myAudio");

       if (val) {

       if (val) {

-        dom.play()

+        dom.play();

         dom.onended = () => {

         dom.onended = () => {

           // console.log("----音频播放完毕");

           // console.log("----音频播放完毕");

-          this.audioSta = false

-        }

-      } else dom.pause()

+          this.audioSta = false;

+        };

+      } else dom.pause();

     },

     },

   },

   },

   computed: {},

   computed: {},

   methods: {

   methods: {

     // 本地化 url 适配

     // 本地化 url 适配

     urlToFitFu(url) {

     urlToFitFu(url) {

-      return url

+      return url;

       // const resUrl = url;

       // const resUrl = url;

       // if (url.includes("https://super.4dage.com")) {

       // if (url.includes("https://super.4dage.com")) {

       //   return url.replace("https://super.4dage.com", "");

       //   return url.replace("https://super.4dage.com", "");

@@ -176,22 +163,22 @@ export default {
 
 

 

     // 点击左右箭头

     // 点击左右箭头

     cutMyInd(num) {

     cutMyInd(num) {

-      console.log(num, this.swiper)

-      if (!this.swiper) return

+      console.log(num, this.swiper);

+      if (!this.swiper) return;

       if (num > 0) {

       if (num > 0) {

-        this.swiper.slideNext()

+        this.swiper.slideNext();

       } else {

       } else {

-        this.swiper.slidePrev()

+        this.swiper.slidePrev();

       }

       }

     },

     },

     // 点击查看大图

     // 点击查看大图

     lookImg(url) {

     lookImg(url) {

       // console.log(url)

       // console.log(url)

-      let dom = this.$refs.viewer.$viewer

-      this.lookPics = [url]

+      let dom = this.$refs.viewer.$viewer;

+      this.lookPics = [url];

       // console.log(Object.keys(dom))

       // console.log(Object.keys(dom))

-      dom.options.toolbar = false

-      dom.show()

+      dom.options.toolbar = false;

+      dom.show();

     },

     },

     async getData() {

     async getData() {

       // https://www.4dmodel.com/

       // https://www.4dmodel.com/

@@ -202,83 +189,76 @@ export default {
 
         // let url = `/data/${

         // let url = `/data/${

         //本地化部署

         //本地化部署

         this.id

         this.id

-        }/hot/js/data.js?time=${Math.random()}`

-      let result = (await this.$http.get(url)).data

-      const resData = result[this.m]

+      }/hot/js/data.js?time=${Math.random()}`;

+      let result = (await this.$http.get(url)).data;

+      const resData = result[this.m];

       // console.log("----", resData);

       // console.log("----", resData);

       if (resData) {

       if (resData) {

-        this.audio = resData.backgroundMusic

+        this.audio = resData.backgroundMusic;

         // 只有单独的音频上传

         // 只有单独的音频上传

-        if (

-          resData.backgroundMusic &&

-          !resData.model &&

-          !resData.video &&

-          !resData.images

-        ) {

-          this.isOneAduio = true

+        if (resData.backgroundMusic && !resData.model && !resData.video && !resData.images) {

+          this.isOneAduio = true;

         }

         }

         // 底部的tab

         // 底部的tab

-        const arr = []

-        const obj = {}

+        const arr = [];

+        const obj = {};

         if (resData.model) {

         if (resData.model) {

-          obj.model = resData.model

-          arr.push({ id: 1, type: "model", name: "模型" })

+          obj.model = resData.model;

+          arr.push({ id: 1, type: "model", name: "模型" });

         }

         }

         if (resData.video) {

         if (resData.video) {

-          obj.video = resData.video

-          arr.push({ id: 2, type: "video", name: "视频" })

+          obj.video = resData.video;

+          arr.push({ id: 2, type: "video", name: "视频" });

         }

         }

         if (resData.images) {

         if (resData.images) {

-          obj.img = resData.images

-          arr.push({ id: 3, type: "img", name: "图片" })

+          obj.img = resData.images;

+          arr.push({ id: 3, type: "img", name: "图片" });

         }

         }

-        this.flooTab = arr

-        this.data = obj

+        this.flooTab = arr;

+        this.data = obj;

 

 

         // 当前type的值 应该为

         // 当前type的值 应该为

-        if (resData.model) this.myType = "model"

-        else if (resData.video) this.myType = "video"

-        else if (resData.images) this.myType = "img"

+        if (resData.model) this.myType = "model";

+        else if (resData.video) this.myType = "video";

+        else if (resData.images) this.myType = "img";

 

 

-        this.myTitle = resData.title || ""

-        this.myTxt = resData.content || ""

-        this.videoTxt = resData.videosDesc || []

-        this.imgTxt = resData.imagesDesc || []

+        this.myTitle = resData.title || "";

+        this.myTxt = resData.content || "";

+        this.videoTxt = resData.videosDesc || [];

+        this.imgTxt = resData.imagesDesc || [];

 

 

         // 只有 标题和 文字介绍（没有视频，没有模型，没有图片）

         // 只有 标题和 文字介绍（没有视频，没有模型，没有图片）

         if (!obj.model && !obj.video && !obj.img && !resData.backgroundMusic) {

         if (!obj.model && !obj.video && !obj.img && !resData.backgroundMusic) {

-          this.oneTxt = true

+          this.oneTxt = true;

         }

         }

 

 

         this.$nextTick(() => {

         this.$nextTick(() => {

-          const _this = this

-          this.swiper = new Swiper('.contenBoxMain', {

+          const _this = this;

+          this.swiper = new Swiper(".contenBoxMain", {

             on: {

             on: {

               slideChange() {

               slideChange() {

-                _this.myInd = this.activeIndex

-              }

+                _this.myInd = this.activeIndex;

+              },

             },

             },

             pagination: {

             pagination: {

-              el: '.swiper-pagination',

-            }

-          })

-        })

+              el: ".swiper-pagination",

+            },

+          });

+        });

       }

       }

     },

     },

   },

   },

   mounted() {

   mounted() {

-    this.getData()

+    this.getData();

   },

   },

-}

+};

 </script>

 </script>

 

 

 <style lang="less" scoped>

 <style lang="less" scoped>

 .home {

 .home {

-  background: url("../assets/images/pc/hot_bg.png") no-repeat center center;

-  background-color: rgba(transparent, 0.8);

+  background-color: rgba(rgba(248, 242, 232, 0.8));

   background-size: 100% 100%;

   background-size: 100% 100%;

-  border-radius: 10px;

-  color: rgba(80, 61, 42, 0.9);

+  color: #9d0800;

   .swiper-pagination {

   .swiper-pagination {

     margin: 10px 0 0;

     margin: 10px 0 0;

     position: relative;

     position: relative;

@@ -288,7 +268,7 @@ export default {
 
     gap: 6px;

     gap: 6px;

     width: 100%;

     width: 100%;

 

 

-    :deep(.swiper-pagination-bullet) {

+    ::v-deep .swiper-pagination-bullet {

       width: 24px;

       width: 24px;

       height: 4px;

       height: 4px;

       border-radius: 2px;

       border-radius: 2px;

@@ -296,7 +276,7 @@ export default {
 
       opacity: 1;

       opacity: 1;

 

 

       &.swiper-pagination-bullet-active {

       &.swiper-pagination-bullet-active {

-        background: #603C23;

+        background: #603c23;

       }

       }

     }

     }

   }

   }

@@ -327,14 +307,18 @@ export default {
 
       font-size: 22px;

       font-size: 22px;

       font-weight: 700;

       font-weight: 700;

       margin-bottom: 20px;

       margin-bottom: 20px;

-      text-align: center;

+    }

+    .logo {

+      position: fixed;

+      top: 30px;

+      left: 30px;

     }

     }

     .mainCon {

     .mainCon {

       position: relative;

       position: relative;

       border-radius: 6px;

       border-radius: 6px;

       overflow: hidden;

       overflow: hidden;

       width: 100%;

       width: 100%;

-      height: calc(100% - 200px);

+      height: calc(100% - 320px);

       .oneTabNum {

       .oneTabNum {

         z-index: 10;

         z-index: 10;

         position: absolute;

         position: absolute;

@@ -363,14 +347,14 @@ export default {
 
           }

           }

         }

         }

         .videoBox {

         .videoBox {

-          padding: 0px 50px;

+          padding: 0px 350px;

           video {

           video {

             width: 100%;

             width: 100%;

             height: 100%;

             height: 100%;

           }

           }

         }

         }

         .imgBox {

         .imgBox {

-          padding: 0px 50px;

+          padding: 0px 350px;

           .smImgBox {

           .smImgBox {

             width: 100%;

             width: 100%;

             height: 100%;

             height: 100%;

@@ -388,9 +372,9 @@ export default {
 
         position: absolute;

         position: absolute;

         top: 50%;

         top: 50%;

         transform: translateY(-50%);

         transform: translateY(-50%);

-        left: 30px;

-        width: 16px;

-        height: 30px;

+        left: 16%;

+        width: 40px;

+        height: 40px;

         background-image: url("../assets/images/pc/left.png");

         background-image: url("../assets/images/pc/left.png");

         background-size: 100% 100%;

         background-size: 100% 100%;

         z-index: 1;

         z-index: 1;

@@ -400,7 +384,7 @@ export default {
 
       }

       }

       .rightJJ {

       .rightJJ {

         left: auto;

         left: auto;

-        right: 30px;

+        right: 16%;

         background-image: url("../assets/images/pc/right.png");

         background-image: url("../assets/images/pc/right.png");

       }

       }

       .noClick {

       .noClick {

@@ -486,13 +470,12 @@ export default {
 
 // 移动端

 // 移动端

 @media screen and (max-width: 1000px) {

 @media screen and (max-width: 1000px) {

   .home {

   .home {

-    background: url("../assets/images/pc/hot_bg_M.png") no-repeat center center;

-    background-size: cover !important;

+    background-color: rgba(rgba(248, 242, 232, 0.9));

     .swiper-pagination {

     .swiper-pagination {

       margin: 10px 0 0;

       margin: 10px 0 0;

       gap: 4px;

       gap: 4px;

 

 

-      :deep(.swiper-pagination-bullet) {

+      ::v-deep .swiper-pagination-bullet {

         width: 15px;

         width: 15px;

         height: 3px;

         height: 3px;

       }

       }

@@ -506,12 +489,17 @@ export default {
 
       height: 100%;

       height: 100%;

       padding: 0;

       padding: 0;

       position: absolute;

       position: absolute;

+      justify-content: end;

       .myTitle {

       .myTitle {

         font-size: 16px;

         font-size: 16px;

       }

       }

+      .logo {

+        display: none;

+      }

       .mainCon {

       .mainCon {

         border-radius: 0;

         border-radius: 0;

         height: calc(100% - 195px);

         height: calc(100% - 195px);

+        margin: 92px 0 20px;

         .contenBox {

         .contenBox {

           .videoBox {

           .videoBox {

             padding: 0 30px;

             padding: 0 30px;

@@ -551,11 +539,20 @@ export default {
 
         margin-top: -5px;

         margin-top: -5px;

         width: 100%;

         width: 100%;

         padding: 10px 15px 0px 15px;

         padding: 10px 15px 0px 15px;

-        max-height: 98px;

-

+        max-height: 200px;

+        padding-bottom: 20px;

+        background: url("../assets/images/textBg.png") no-repeat;

+        background-size: 100% 100%;

+        border-radius: 30px 30px 0 0;

         .flooTxtBox {

         .flooTxtBox {

           padding: 0;

           padding: 0;

+          height: 92%;

+          margin-top: 20px;

+          .myTitle {

+            color: #e1bd83;

+          }

           .myTxt {

           .myTxt {

+            color: #fff;

             font-size: 14px;

             font-size: 14px;

             line-height: 22px;

             line-height: 22px;

           }

           }

+ 38 - 0
hot/vite.config.js
Просмотреть файл 

@@ -0,0 +1,38 @@
 
+import { defineConfig } from "vite";
 
+import { createVuePlugin } from "vite-plugin-vue2";
 
+import svgLoader from "vite-plugin-vue2-svg";
 
+// 1. 导入 CommonJS 转换插件
 
+import commonjs from "vite-plugin-commonjs";
 
+import path from "path";
 
+
 
+export default defineConfig({
 
+  base: "./",
 
+  plugins: [
 
+    createVuePlugin(),
 
+    svgLoader,
 
+    // 2. 添加插件，转换 CommonJS 语法
 
+    commonjs({
 
+      // 配置需要转换的文件范围
 
+      include: [/src\/assets\/images\//, /node_modules/],
 
+    }),
 
+  ],
 
+  resolve: {
 
+    alias: {
 
+      "@": path.resolve(__dirname, "./src"),
 
+    },
 
+    extensions: [".vue", ".js", ".json", ".less"],
 
+  },
 
+  server: {
 
+    port: 8080, // 保持与 Vue CLI 相同的端口
 
+    open: true, // 启动时自动打开浏览器
 
+    cors: true,
 
+  },
 
+  css: {
 
+    preprocessorOptions: {
 
+      less: {
 
+        // 配置 Less 全局变量等
 
+        javascriptEnabled: true,
 
+      },
 
+    },
 
+  },
 
+});

+ 0 - 3
hot/vue.config.js
Просмотреть файл 

@@ -1,3 +0,0 @@
 
-module.exports = {

-  publicPath: "./"

-};

Разница между файлами не показана из-за своего большого размера
+ 1414 - 7455
hot/yarn.lock


+ 10 - 7
scene/public/css/oldVer/main0.css
Просмотреть файл 

@@ -78,8 +78,8 @@ iframe {
 
 }
 
 }
 
 .popup-content {
 
 .popup-content {
 
   position: relative;
 
   position: relative;
 
-  width: 60%;
 
-  height: 65%;
 
+  width: 100%;
 
+  height: 100%;
 
   overflow: hidden;
 
   overflow: hidden;
 
 }
 
 }
 
 #id1 {
 
 #id1 {
 
@@ -90,9 +90,12 @@ iframe {
 
   opacity: 0.1;
 
   opacity: 0.1;
 
 }
 
 }
 
 #closepop {
 
 #closepop {
 
+  position: fixed;
 
+  top: 40px;
 
+  right: 30px;
 
   background: url(../../images/close1.png) no-repeat;
 
   background: url(../../images/close1.png) no-repeat;
 
-  width: 60px;
 
-  height: 60px;
 
+  width: 40px;
 
+  height: 40px;
 
   cursor: pointer;
 
   cursor: pointer;
 
   text-indent: -999em;
 
   text-indent: -999em;
 
   background-size: 100% 100%;
 
   background-size: 100% 100%;
 
@@ -203,8 +206,8 @@ a {
 
 }
 
 }
 
 @media screen and (max-width: 1000px) {
 
 @media screen and (max-width: 1000px) {
 
   .popup-content {
 
   .popup-content {
 
-    width: 90%;
 
-    height: 80%;
 
+    width: 100%;
 
+    height: 100%;
 
   }
 
   }
 
 }
 
 }
 
 @media screen and (max-width: 768px) {
 
 @media screen and (max-width: 768px) {
 
@@ -289,4 +292,4 @@ a {
 
   .pinTop {
 
   .pinTop {
 
     top: 0px;
 
     top: 0px;
 
   }
 
   }
 
-}
 
+}

BIN
scene/public/images/4dagePoint.png
Просмотреть файл


BIN
scene/public/images/4dagePoint2.png
Просмотреть файл


BIN
scene/public/images/Volume btn_off.png
Просмотреть файл


BIN
scene/public/images/Volume btn_on.png
Просмотреть файл


BIN
scene/public/images/auto-suspend.png
Просмотреть файл


BIN
scene/public/images/auto.png
Просмотреть файл


BIN
scene/public/images/back.png
Просмотреть файл


BIN
scene/public/images/back2_active.png
Просмотреть файл


BIN
scene/public/images/close1.png
Просмотреть файл


BIN
scene/public/images/dollhouse.png
Просмотреть файл


BIN
scene/public/images/dollhouse_active.png
Просмотреть файл


BIN
scene/public/images/floor.png
Просмотреть файл


BIN
scene/public/images/floor_active.png
Просмотреть файл


BIN
scene/public/images/hotlist.png
Просмотреть файл


BIN
scene/public/images/hotlist_active.png
Просмотреть файл


BIN
scene/public/images/inside.png
Просмотреть файл


BIN
scene/public/images/inside_active.png
Просмотреть файл


BIN
scene/public/images/pause.png
Просмотреть файл


BIN
scene/public/images/play.png
Просмотреть файл


+ 1 - 1
scene/public/index.html
Просмотреть файл 

@@ -8,7 +8,7 @@
 
     <meta name="description" content="Web site created using create-react-app" />
 
     <meta name="description" content="Web site created using create-react-app" />
 
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
 
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
 
 
 
-    <title>安徽美术馆-兹山无尽</title>
 
+    <title>科学家精神教育基地大场景</title>
 
 
 
     <!-- 大场景相关 -->
 
     <!-- 大场景相关 -->
 
     <link rel="stylesheet" href="./css/oldVer/main0.css" />
 
     <link rel="stylesheet" href="./css/oldVer/main0.css" />

+ 3 - 1
scene/public/js/Hot.js
Просмотреть файл 

@@ -55,7 +55,7 @@ window.initHot = function (model) {
 
       o = 'en' == manage.number('lang') ? '&lang=' + manage.number('lang') : ''
 
       o = 'en' == manage.number('lang') ? '&lang=' + manage.number('lang') : ''
 
     ;-1 == r.indexOf('?') ? (src = link + '?time=' + randomTime().getTime() + '&id=' + window.number + o) : (src = link + '&time=' + randomTime().getTime() + '&id=' + window.number + o)
 
     ;-1 == r.indexOf('?') ? (src = link + '?time=' + randomTime().getTime() + '&id=' + window.number + o) : (src = link + '&time=' + randomTime().getTime() + '&id=' + window.number + o)
 
 
 
-    return src.replace('https://www.4dmodel.com/SuperTwo/hot_online1', 'https://houseoss.4dkankan.com/project/AnhuiArtMuseum/hot')
 
+    return src.replace('https://www.4dmodel.com/SuperTwo/hot_online1', 'https://houseoss.4dkankan.com/project/ScientistEducationBase/hot')
 
     // return src.replace('https://www.4dmodel.com/SuperTwo/hot_online1', 'http://localhost:8080')
 
     // return src.replace('https://www.4dmodel.com/SuperTwo/hot_online1', 'http://localhost:8080')
 
     // return src
 
     // return src
 
   }
 
   }
 
@@ -1604,6 +1604,8 @@ window.initHot = function (model) {
 
       cad.style.visibility = cad.style.visibility === 'hidden' ? 'visible' : 'hidden'
 
       cad.style.visibility = cad.style.visibility === 'hidden' ? 'visible' : 'hidden'
 
     }
 
     }
 
 
 
+    window.parent.postMessage({ type: 'SHOW_BACK_BUTTON' }, 'https://houseoss.4dkankan.com')
 
+
 
     return false
 
     return false
 
   }
 
   }

+ 1 - 1
scene/public/js/loadCAD.js
Просмотреть файл 

@@ -53,7 +53,7 @@ window.grendCAD = (function grendCAD() {
 
       @media only screen and (max-width: 1000px) {
 
       @media only screen and (max-width: 1000px) {
 
         .cad {
 
         .cad {
 
             position: absolute;
 
             position: absolute;
 
-            left: 16px;
 
+            right: 16px;
 
             top: 65px;
 
             top: 65px;
 
             width: 100px;
 
             width: 100px;
 
             height: 100px;
 
             height: 100px;

+ 2 - 8
scene/public/showa/js/loadCAD.js
Просмотреть файл 

@@ -53,7 +53,7 @@ window.grendCAD = (function grendCAD() {
 
       @media only screen and (max-width: 600px) {
 
       @media only screen and (max-width: 600px) {
 
         .cad {
 
         .cad {
 
             position: absolute;
 
             position: absolute;
 
-            left: 16px;
 
+            right: 16px; 
             top: 65px;
 
             top: 65px;
 
             width: 100px;
 
             width: 100px;
 
             height: 100px;
 
             height: 100px;
 
@@ -137,13 +137,7 @@ $.ajax({
 
       url: '//super.4dage.com/data/' + window.number + '/floor.json',
 
       url: '//super.4dage.com/data/' + window.number + '/floor.json',
 
       method: 'GET',
 
       method: 'GET',
 
       success(res) {
 
       success(res) {
 
-        grendCAD(
 
-          res,
 
-          document.documentElement,
 
-          data.cadSignColor,
 
-          data.cadBorderColor,
 
-          data.cadBorderWidth
 
-        )
 
+        grendCAD(res, document.documentElement, data.cadSignColor, data.cadBorderColor, data.cadBorderWidth)
 
       }
 
       }
 
     })
 
     })
 
   }
 
   }

BIN
scene/src/assets/font/ssgst.TTF
Просмотреть файл


BIN
scene/src/assets/img/back.png
Просмотреть файл


BIN
scene/src/assets/img/close.png
Просмотреть файл


BIN
scene/src/assets/img/hotlist_bg.png
Просмотреть файл


BIN
scene/src/assets/img/hotlist_bg_M.png
Просмотреть файл


+ 1 - 7
scene/src/assets/styles/base.css
Просмотреть файл 

@@ -12,11 +12,6 @@ body {
 
   font: 1em/1.4 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
 
   font: 1em/1.4 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
 
   height: 100%;
 
   height: 100%;
 
 }
 
 }
 
-@font-face {
 
-  font-family: 'ssgstFont';
 
-  /* 自定义字体名称 */
 
-  src: url('../font/ssgst.TTF') format('truetype');
 
-}
 
 a {
 
 a {
 
   text-decoration: none;
 
   text-decoration: none;
 
   outline: none;
 
   outline: none;
 
@@ -35,7 +30,6 @@ ul {
 
 body {
 
 body {
 
   overflow: auto;
 
   overflow: auto;
 
   overflow-y: overlay;
 
   overflow-y: overlay;
 
-  font-family: 'ssgstFont' !important;
 
 }
 
 }
 
 /* 文本域取消下拉 */
 
 /* 文本域取消下拉 */
 
 textarea {
 
 textarea {
 
@@ -169,4 +163,4 @@ body,
 
   html .cad {
 
   html .cad {
 
     top: 20px;
 
     top: 20px;
 
   }
 
   }
 
-}
 
+}

+ 3 - 11
scene/src/pages/A0base/index.tsx
Просмотреть файл 

@@ -1,19 +1,11 @@
 
 import React, { useState } from 'react'
 
 import React, { useState } from 'react'
 
 import isMobile from '../../utils/isMobile'
 
 import isMobile from '../../utils/isMobile'
 
-import A5Mobile from '../A5Mobile'
 
-import A4base from '../A4base'
 
+import A2main from '../A2main'
 
 import styles from './index.module.scss'
 
 import styles from './index.module.scss'
 
 function A0base() {
 
 function A0base() {
 
-  const [show, setShow] = useState(true)
 
   return (
 
   return (
 
-    <>
 
-      {/* 初始封面 */}
 
-      {isMobile() ? (
 
-        <A5Mobile show={show} setShow={setShow} />
 
-      ) : (
 
-        <A4base show={show} setShow={setShow} />
 
-      )}
 
-    </>
 
+    <A2main />
 
+
 
   )
 
   )
 
 }
 
 }

+ 4 - 2
scene/src/pages/A2main/index.module.scss
Просмотреть файл 

@@ -62,6 +62,7 @@
 
       gap: 38px;
 
       gap: 38px;
 
       .likeBox,
 
       .likeBox,
 
       #volume,
 
       #volume,
 
+      #back,
 
       #gui-fullscreen,
 
       #gui-fullscreen,
 
       #gui-fullscreen-exit,
 
       #gui-fullscreen-exit,
 
       .A2_share_box,
 
       .A2_share_box,
 
@@ -145,7 +146,7 @@
 
       display: flex;
 
       display: flex;
 
       justify-content: flex-start;
 
       justify-content: flex-start;
 
       align-items: center;
 
       align-items: center;
 
-      gap: 10px;
 
+
 
       .thumbImg {
 
       .thumbImg {
 
         width: 140px;
 
         width: 140px;
 
         height: 130px;
 
         height: 130px;
 
@@ -244,6 +245,7 @@
 
         margin-bottom: -30px;
 
         margin-bottom: -30px;
 
         .likeBox,
 
         .likeBox,
 
         #volume,
 
         #volume,
 
+        #back,
 
         #gui-fullscreen,
 
         #gui-fullscreen,
 
         #gui-fullscreen-exit,
 
         #gui-fullscreen-exit,
 
         .A2_share_box,
 
         .A2_share_box,
 
@@ -279,7 +281,7 @@
 
         display: flex;
 
         display: flex;
 
         justify-content: flex-start;
 
         justify-content: flex-start;
 
         align-items: center;
 
         align-items: center;
 
-        gap: 10px;
 
+
 
         .thumbImg {
 
         .thumbImg {
 
           width: 100px;
 
           width: 100px;
 
           height: 80px;
 
           height: 80px;

+ 10 - 44
scene/src/pages/A2main/index.tsx
Просмотреть файл 

@@ -18,32 +18,6 @@ function A2main() {
 
   // 漫游的状态
 
   // 漫游的状态
 
   const { state3d } = useSelector((state: RootState) => state.three)
 
   const { state3d } = useSelector((state: RootState) => state.three)
 
 
 
-  // 点赞
 
-  const [like, setLike] = useState(false)
 
-  const [likeNum, setLikeNum] = useState(1)
 
-  const [viewNum, setViewNum] = useState(1)
 
-
 
-  useEffect(() => {
 
-    http.get(`https://count.4dage.com/api/count/detail/${SCENE_CODE}`).then(res => {
 
-      setLikeNum(res.data.starSum!)
 
-    })
 
-    http.get(`https://count.4dage.com/api/count/saveVisit/${SCENE_CODE}`).then(res => {
 
-      setViewNum(res.data.visitSum!)
 
-    })
 
-  }, [])
 
-
 
-  // 点击点赞
 
-  const likeFu = useCallback(() => {
 
-    if (like) return
 
-    setLike(true)
 
-    setTimeout(() => {
 
-      http.get(`https://count.4dage.com/api/count/saveStar/${SCENE_CODE}`).then(res => {
 
-        setLikeNum(likeNum + 1)
 
-        setLike(false)
 
-      })
 
-    }, 2000)
 
-  }, [like, likeNum])
 
-
 
   // 点击热点列表
 
   // 点击热点列表
 
   const [hotListShow, setHotListShow] = useState(false)
 
   const [hotListShow, setHotListShow] = useState(false)
 
 
 
@@ -146,7 +120,7 @@ function A2main() {
 
                   hiddenMap(true)
 
                   hiddenMap(true)
 
                 }}
 
                 }}
 
               >
 
               >
 
-                <img src='images/hotlist.png' alt='' />
 
+                <img src={`images/hotlist${hotListShow ? '_active' : ''}.png`} alt='' />
 
                 {/* 鼠标移入 */}
 
                 {/* 鼠标移入 */}
 
                 <div className='hoveImg'>热点列表</div>
 
                 <div className='hoveImg'>热点列表</div>
 
               </div>
 
               </div>
 
@@ -205,22 +179,14 @@ function A2main() {
 
               <div className='hoveImg'>音乐开关</div>
 
               <div className='hoveImg'>音乐开关</div>
 
             </div>
 
             </div>
 
 
 
-            {/* 点赞 */}
 
-            <div className='likeBox' onClick={likeFu}>
 
-              <img src={like ? imgArr[1] : imgArr[0]} alt='' />
 
-              {/* 鼠标移入 */}
 
-              <div className='hoveImg'>点赞{likeNum}</div>
 
-              <div className={classNames('likeMove', like ? 'likeMoveAc' : '')}>+1</div>
 
-            </div>
 
-
 
-            <div className='A2_share_box' onClick={handleShareClick}>
 
-              <img src={require('@/assets/img/share.png')} alt='' />
 
-              <div className='hoveImg'>分享</div>
 
-            </div>
 
-
 
-            <div className='A2_view_box'>
 
-              <img src={require('@/assets/img/view.png')} alt='' />
 
-              <div className='hoveImg'>浏览量{viewNum}</div>
 
+            <div id='back' onClick={() => {
 
+              window.parent.postMessage({ type: 'GO_BACK' }, 'https://houseoss.4dkankan.com')
 
+            }} className='ui-icon wide'>
 
+              {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
 
+              <a>
 
+                <img src='images/back.png' alt='' />
 
+              </a>
 
+              <div className='hoveImg'>返回</div>
 
             </div>
 
             </div>
 
 
 
             <div id='vr' className='ui-icon wide hidden' style={{ display: 'none' }}>
 
             <div id='vr' className='ui-icon wide hidden' style={{ display: 'none' }}>
 
@@ -235,7 +201,7 @@ function A2main() {
 
                 <i rel='tooltip' title='{[{ SOCIAL_SHARING }]}' className='icon icon-share'></i>
 
                 <i rel='tooltip' title='{[{ SOCIAL_SHARING }]}' className='icon icon-share'></i>
 
               </a>
 
               </a>
 
             </div>
 
             </div>
 
-            <div id='gui-fullscreen' className='ui-icon wide' data-placement='top' rel='tooltip'>
 
+            <div id='gui-fullscreen' className='ui-icon wide' data-placement='top' rel='tooltip' style={{ display: 'none' }}>
 
               {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
 
               {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */}
 
               <a>
 
               <a>
 
                 <img src='images/full.png' alt='' />
 
                 <img src='images/full.png' alt='' />

+ 114 - 74
scene/src/pages/A3hotList/index.module.scss
Просмотреть файл 

@@ -1,72 +1,79 @@
 
 .A3hotList {
 
 .A3hotList {
 
   position: absolute;
 
   position: absolute;
 
   top: 50%;
 
   top: 50%;
 
-  right: 0;
 
-  transform: translate(0, -50%);
 
-  width: 250px;
 
-  height: 100%;
 
+  left: 50%;
 
+  transform: translate(-50%, -50%);
 
+  width: 880px;
 
+  height: 590px;
 
   z-index: 30001;
 
   z-index: 30001;
 
   display: flex;
 
   display: flex;
 
   align-items: center;
 
   align-items: center;
 
-  justify-content: flex-end;
 
-
 
+  background: url('../../assets/img/hotlist_bg.png') center center;
 
+  background-size: cover;
 
   :global {
 
   :global {
 
+    .close {
 
+      position: fixed;
 
+      top: 60px;
 
+      right: 66px;
 
+      width: 30px;
 
+      height: 30px;
 
+      cursor: pointer;
 
+      & > img {
 
+        width: 100%;
 
+        height: 100%;
 
+        object-fit: cover;
 
+      }
 
+    }
 
+    .back {
 
+      display: none;
 
+    }
 
     .A3main {
 
     .A3main {
 
       display: flex;
 
       display: flex;
 
       flex-direction: column;
 
       flex-direction: column;
 
-      align-items: center;
 
       justify-content: flex-start;
 
       justify-content: flex-start;
 
-      gap: 10px;
 
-      width: 250px;
 
-      height: 100%;
 
-      background: url('../../assets/img/hotlist_bg.png') center center;
 
-      background-size: cover;
 
-      color: #9b4f2d;
 
-      font-size: 17px;
 
+      width: 100%;
 
+      height: 80%;
 
+      color: #e1bd83;
 
+      font-size: 16px;
 
       font-weight: 500;
 
       font-weight: 500;
 
       overflow: auto;
 
       overflow: auto;
 
-      padding-bottom: 40px;
 
-      border: 2px solid #9b4f2d;
 
+      margin: 40px 80px;
 
       // 隐藏滚动条
 
       // 隐藏滚动条
 
       &::-webkit-scrollbar {
 
       &::-webkit-scrollbar {
 
-        display: none;
 
+        width: 20px;
 
+        color: white;
 
       }
 
       }
 
       .A3title {
 
       .A3title {
 
-        padding: 40px 0 10px 0;
 
+        margin: 0 10px;
 
+        padding-bottom: 40px;
 
         font-size: 24px;
 
         font-size: 24px;
 
-        font-weight: 500;
 
+        font-weight: bold;
 
       }
 
       }
 
-      .A3item {
 
-        display: flex;
 
-        align-items: center;
 
-        justify-content: center;
 
-        width: 100%;
 
-        height: fit-content;
 
-        padding: 16px 3px;
 
-        color: rgba(155, 79, 45, 0.8);
 
-        cursor: pointer;
 
-        &:hover {
 
-          background-color: rgba(255, 255, 255, 0.1);
 
+      .scrollContainner {
 
+        height: 100%;
 
+        overflow: auto;
 
+        padding: 0 10px;
 
+        &::-webkit-scrollbar {
 
+          width: 6px;
 
         }
 
         }
 
-      }
 
-      .A3close {
 
-        position: fixed;
 
-        bottom: 0;
 
-        width: 250px;
 
-        height: 80px;
 
-        border-top: 1px solid rgba(43, 31, 23, 0.1);
 
-        cursor: pointer;
 
-        &:hover {
 
-          opacity: 1;
 
+        &::-webkit-scrollbar-thumb {
 
+          background-color: #e1bd83; // 滑块颜色
 
         }
 
         }
 
-        img {
 
-          position: absolute;
 
-          top: 50%;
 
-          left: 50%;
 
-          transform: translate(-50%, -50%);
 
-          width: 24px;
 
-          height: 24px;
 
-          opacity: 0.6;
 
+
 
+        .A3item {
 
+          display: flex;
 
+          width: 100%;
 
+          height: fit-content;
 
+          padding: 16px 3px;
 
+          color: #dccdbb;
 
+          cursor: pointer;
 
+          border-bottom: 1px solid #ffffff;
 
+          &:hover {
 
+            color: #c19a63;
 
+          }
 
+          &:first-child {
 
+            border-top: 1px solid #ffffff;
 
+          }
 
         }
 
         }
 
       }
 
       }
 
     }
 
     }
 
@@ -77,42 +84,75 @@
 
   .A3hotList {
 
   .A3hotList {
 
     width: 100%;
 
     width: 100%;
 
     height: 100%;
 
     height: 100%;
 
-    top: 0;
 
-    right: 0;
 
-    transform: translate(0, 0);
 
-    align-items: start;
 
+    background: url('../../assets/img/hotlist_bg_M.png') center center;
 
+    background-size: cover;
 
     :global {
 
     :global {
 
       html .cad {
 
       html .cad {
 
         z-index: -1;
 
         z-index: -1;
 
       }
 
       }
 
+      .close {
 
+        display: none;
 
+      }
 
+      .back {
 
+        display: block;
 
+        position: fixed;
 
+        top: 30px;
 
+        right: 10px;
 
+        width: 40px;
 
+        height: 40px;
 
+        cursor: pointer;
 
+        & > img {
 
+          width: 100%;
 
+          height: 100%;
 
+          object-fit: cover;
 
+        }
 
+      }
 
       .A3main {
 
       .A3main {
 
+        display: flex;
 
+        flex-direction: column;
 
+        justify-content: flex-start;
 
         width: 100%;
 
         width: 100%;
 
-        height: 60%;
 
-        background: url('../../assets/img/hotlist_bg.png') no-repeat center center;
 
-        background-size: cover;
 
-        padding-bottom: 20px;
 
+        height: 90%;
 
+        color: #e1bd83;
 
+        font-size: 16px;
 
+        font-weight: 500;
 
+        overflow: auto;
 
+        margin: 0 12px;
 
+        // 隐藏滚动条
 
+        &::-webkit-scrollbar {
 
+          width: 5px;
 
+        }
 
         .A3title {
 
         .A3title {
 
-          padding: 20px 0 10px 0;
 
-          font-size: 16px;
 
+          margin: 0 10px;
 
+          padding-bottom: 25px;
 
+          font-size: 24px;
 
+          font-weight: bold;
 
         }
 
         }
 
-        .A3item {
 
-          font-size: 14px;
 
-          padding: 10px 3px;
 
-          &:touch {
 
-            background-color: rgba(163, 143, 116, 1);
 
+        .scrollContainner {
 
+          height: 100%;
 
+          overflow: auto;
 
+          padding: 0 10px;
 
+          &::-webkit-scrollbar {
 
+            width: 6px;
 
+          }
 
+          &::-webkit-scrollbar-thumb {
 
+            background-color: #e1bd83; // 滑块颜色
 
           }
 
           }
 
-        }
 
-        .A3close {
 
-          display: none;
 
-          width: 100%;
 
-          height: 40px;
 
-          background-color: rgba(208, 191, 165, 1);
 
-          border: 4px solid #9b4f2d;
 
-          border-top: 1px solid rgba(43, 31, 23, 0.1);
 
 
 
-          img {
 
-            width: 16px;
 
-            height: 16px;
 
+          .A3item {
 
+            display: flex;
 
+            width: 100%;
 
+            height: fit-content;
 
+            padding: 16px 3px;
 
+            color: #dccdbb;
 
+            cursor: pointer;
 
+            border-bottom: none;
 
+            &:hover {
 
+              color: #c19a63;
 
+            }
 
+            &:first-child {
 
+              border-top: none;
 
+            }
 
           }
 
           }
 
         }
 
         }
 
       }
 
       }

+ 23 - 19
scene/src/pages/A3hotList/index.tsx
Просмотреть файл 

@@ -2,7 +2,7 @@ import React, { useCallback, useEffect, useState } from 'react'
 
 import styles from './index.module.scss'
 
 import styles from './index.module.scss'
 
 import { A3listType } from './type'
 
 import { A3listType } from './type'
 
 
 
-const imgArrTemp = ['close.png']
 
+const imgArrTemp = ['close.png', 'back.png']
 
 const imgArr = imgArrTemp.map(item => require(`@/assets/img/${item}`))
 
 const imgArr = imgArrTemp.map(item => require(`@/assets/img/${item}`))
 
 
 
 type Props = {
 
 type Props = {
 
@@ -20,7 +20,13 @@ function A3hotList({ show, setShow, closeFu }: Props) {
 
 
 
   const openHot = useCallback((item: A3listType) => {
 
   const openHot = useCallback((item: A3listType) => {
 
     setTimeout(() => {
 
     setTimeout(() => {
 
-      item && item.examine(window.player, true)
 
+      if (item) {
 
+        item.examine(window.player, true)
 
+        window.parent.postMessage(
 
+          { type: 'HIDE_BACK_BUTTON' },
 
+          'https://houseoss.4dkankan.com'
 
+        );
 
+      }
 
     }, 200)
 
     }, 200)
 
   }, [])
 
   }, [])
 
 
 
@@ -28,26 +34,24 @@ function A3hotList({ show, setShow, closeFu }: Props) {
 
     <div
 
     <div
 
       className={styles.A3hotList}
 
       className={styles.A3hotList}
 
       style={{ opacity: show ? '1' : '0', pointerEvents: show ? 'auto' : 'none' }}
 
       style={{ opacity: show ? '1' : '0', pointerEvents: show ? 'auto' : 'none' }}
 
-      onClick={() => {
 
-        setShow(false)
 
-      }}
 
     >
 
     >
 
+      <div className="close" onClick={closeFu}><img src={imgArr[0]} alt="" /></div>
 
+      <div className="back" onClick={closeFu}><img src={imgArr[1]} alt="" /></div>
 
       <div className='A3main'>
 
       <div className='A3main'>
 
         <div className='A3title'>热点列表</div>
 
         <div className='A3title'>热点列表</div>
 
-        {list.map((item, index) => (
 
-          <div
 
-            className='A3item'
 
-            onClick={() => {
 
-              openHot(item)
 
-              setShow(false)
 
-            }}
 
-            key={index}
 
-          >
 
-            {item.info.title || '热点'}
 
-          </div>
 
-        ))}
 
-        <div className='A3close' onClick={closeFu}>
 
-          <img className='A3close' src={imgArr[0]} alt='' />
 
+        <div className="scrollContainner">
 
+          {list.map((item, index) => (
 
+            <div
 
+              className='A3item'
 
+              onClick={() => {
 
+                openHot(item)
 
+                setShow(false)
 
+              }}
 
+              key={index}
 
+            >
 
+              {item.info.title || '热点'}
 
+            </div>
 
+          ))}
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
     </div>
 
     </div>