|
|
@@ -6,9 +6,9 @@
|
|
|
}"
|
|
|
>
|
|
|
<div class="pinBottom center">
|
|
|
- <div id="view-controllers"></div>
|
|
|
+ <div id="view-controllers" />
|
|
|
</div>
|
|
|
-
|
|
|
+
|
|
|
<div class="pinBottom left">
|
|
|
<div>
|
|
|
<div class="viewContainer">
|
|
|
@@ -37,7 +37,7 @@
|
|
|
<a>
|
|
|
<img
|
|
|
:src="require('@/assets/images/play.png')"
|
|
|
- />
|
|
|
+ >
|
|
|
</a>
|
|
|
</div>
|
|
|
<div
|
|
|
@@ -54,7 +54,7 @@
|
|
|
:src="require('@/assets/images/pause.png')"
|
|
|
data-original-title="暂停"
|
|
|
:style="{opacity: '1',}"
|
|
|
- />
|
|
|
+ >
|
|
|
</a>
|
|
|
</div>
|
|
|
<!-- <div
|
|
|
@@ -71,13 +71,16 @@
|
|
|
></i>
|
|
|
</a>
|
|
|
</div> -->
|
|
|
- <div id="gui-modes-map" class="ui-icon double active">
|
|
|
+ <div
|
|
|
+ id="gui-modes-map"
|
|
|
+ class="ui-icon double active"
|
|
|
+ >
|
|
|
<div
|
|
|
- data-original-title="导览"
|
|
|
- @click="isGuide = !isGuide"
|
|
|
id="pullTab"
|
|
|
+ data-original-title="导览"
|
|
|
rel="tooltip"
|
|
|
title="场景导览"
|
|
|
+ @click="isGuide = !isGuide"
|
|
|
>
|
|
|
<!-- 鼠标移入的显示 -->
|
|
|
<!-- <div class="hoverTit">导览列表</div> -->
|
|
|
@@ -88,13 +91,13 @@
|
|
|
:style="{
|
|
|
opacity: isGuide ? '1' : '',
|
|
|
}"
|
|
|
- />
|
|
|
+ >
|
|
|
</div>
|
|
|
|
|
|
<div
|
|
|
v-show="!isMobile"
|
|
|
- data-original-title="全景漫游"
|
|
|
id="gui-modes-inside"
|
|
|
+ data-original-title="全景漫游"
|
|
|
rel="tooltip"
|
|
|
>
|
|
|
<!-- 鼠标移入的显示 -->
|
|
|
@@ -102,13 +105,13 @@
|
|
|
<img
|
|
|
class="icon icon-inside"
|
|
|
:src="require('@/assets/images/inside.png')"
|
|
|
- />
|
|
|
+ >
|
|
|
</div>
|
|
|
<div
|
|
|
v-show="!isMobile"
|
|
|
+ id="gui-modes-dollhouse"
|
|
|
title="迷你模型"
|
|
|
data-original-title="迷你模型"
|
|
|
- id="gui-modes-dollhouse"
|
|
|
rel="tooltip"
|
|
|
>
|
|
|
<!-- 鼠标移入的显示 -->
|
|
|
@@ -116,12 +119,12 @@
|
|
|
<img
|
|
|
class="icon icon-inside"
|
|
|
:src="require('@/assets/images/dollhouse.png')"
|
|
|
- />
|
|
|
+ >
|
|
|
</div>
|
|
|
<div
|
|
|
v-show="!isMobile"
|
|
|
- data-original-title="俯视图"
|
|
|
id="gui-modes-floorplan"
|
|
|
+ data-original-title="俯视图"
|
|
|
rel="tooltip"
|
|
|
title="顶部俯视"
|
|
|
>
|
|
|
@@ -130,7 +133,7 @@
|
|
|
<img
|
|
|
class="icon icon-inside"
|
|
|
:src="require('@/assets/images/floor.png')"
|
|
|
- />
|
|
|
+ >
|
|
|
</div>
|
|
|
<!-- <div
|
|
|
data-original-title="VR"
|
|
|
@@ -146,16 +149,16 @@
|
|
|
</div> -->
|
|
|
<!-- 没有这个元素会导致报错 -->
|
|
|
<div
|
|
|
+ id="hotList"
|
|
|
style="display: none;"
|
|
|
data-original-title="热点列表"
|
|
|
- id="hotList"
|
|
|
rel="tooltip"
|
|
|
title=""
|
|
|
>
|
|
|
<img
|
|
|
class="icon icon-inside"
|
|
|
:src="require('@/assets/images/hotlist.png')"
|
|
|
- />
|
|
|
+ >
|
|
|
</div>
|
|
|
<!-- <div
|
|
|
data-original-title="消除外壳"
|
|
|
@@ -176,6 +179,52 @@
|
|
|
|
|
|
<div class="pinBottom right hideTarget">
|
|
|
<div class="rightViewContainer clearfix">
|
|
|
+ <div
|
|
|
+ class="ui-icon my-floor"
|
|
|
+ @click="ChangeFloor('1265')"
|
|
|
+ >
|
|
|
+ <a>
|
|
|
+ <img
|
|
|
+ :class="{
|
|
|
+ active: currentSceneCode === '1265'
|
|
|
+ }"
|
|
|
+ src="@/assets/images/floor-1.png"
|
|
|
+ alt=""
|
|
|
+ draggable="false"
|
|
|
+ >
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="ui-icon my-floor"
|
|
|
+ @click="ChangeFloor('1263')"
|
|
|
+ >
|
|
|
+ <a>
|
|
|
+ <img
|
|
|
+ :class="{
|
|
|
+ active: currentSceneCode === '1263'
|
|
|
+ }"
|
|
|
+ src="@/assets/images/floor-2.png"
|
|
|
+ alt=""
|
|
|
+ draggable="false"
|
|
|
+ >
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="ui-icon my-floor"
|
|
|
+ @click="ChangeFloor('1264')"
|
|
|
+ >
|
|
|
+ <a>
|
|
|
+ <img
|
|
|
+ :class="{
|
|
|
+ active: currentSceneCode === '1264'
|
|
|
+ }"
|
|
|
+ src="@/assets/images/floor-3.png"
|
|
|
+ alt=""
|
|
|
+ draggable="false"
|
|
|
+ >
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+
|
|
|
<!-- 音乐 -->
|
|
|
<div
|
|
|
id="volume"
|
|
|
@@ -186,22 +235,22 @@
|
|
|
<img
|
|
|
id="openMusic"
|
|
|
style="display: block"
|
|
|
- @click="switchBGM(true)"
|
|
|
src="../../assets/images/music-muted.png"
|
|
|
alt=""
|
|
|
title="打开音乐"
|
|
|
- />
|
|
|
+ @click="switchBGM(true)"
|
|
|
+ >
|
|
|
<img
|
|
|
id="closeMusic"
|
|
|
style="display: none"
|
|
|
- @click="switchBGM(false)"
|
|
|
:style="{
|
|
|
opacity: '1',
|
|
|
}"
|
|
|
src="../../assets/images/music.png"
|
|
|
alt=""
|
|
|
title="关闭音乐"
|
|
|
- />
|
|
|
+ @click="switchBGM(false)"
|
|
|
+ >
|
|
|
</a>
|
|
|
</div>
|
|
|
|
|
|
@@ -214,7 +263,10 @@
|
|
|
title="全屏"
|
|
|
>
|
|
|
<a>
|
|
|
- <img title="全屏" :src="require('@/assets/images/full.png')" />
|
|
|
+ <img
|
|
|
+ title="全屏"
|
|
|
+ :src="require('@/assets/images/full.png')"
|
|
|
+ >
|
|
|
</a>
|
|
|
</div>
|
|
|
|
|
|
@@ -231,13 +283,11 @@
|
|
|
<img
|
|
|
title="关闭全屏"
|
|
|
:src="require('@/assets/images/fullAc.png')"
|
|
|
- />
|
|
|
+ >
|
|
|
</a>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -247,27 +297,40 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
isGuide: false,
|
|
|
- };
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ currentSceneCode() {
|
|
|
+ return this.$route.query.m
|
|
|
+ }
|
|
|
},
|
|
|
watch: {
|
|
|
},
|
|
|
- computed: {},
|
|
|
mounted() {
|
|
|
+ console.log('sakldfjklwfl', this.currentSceneCode)
|
|
|
},
|
|
|
methods: {
|
|
|
switchBGM(flag) {
|
|
|
if (flag) {
|
|
|
- window.manage.switchBgmState(true);
|
|
|
- document.querySelector("#openMusic").style.display = "none";
|
|
|
- document.querySelector("#closeMusic").style.display = "block";
|
|
|
+ window.manage.switchBgmState(true)
|
|
|
+ document.querySelector("#openMusic").style.display = "none"
|
|
|
+ document.querySelector("#closeMusic").style.display = "block"
|
|
|
} else {
|
|
|
- window.manage.switchBgmState(false);
|
|
|
- document.querySelector("#openMusic").style.display = "block";
|
|
|
- document.querySelector("#closeMusic").style.display = "none";
|
|
|
+ window.manage.switchBgmState(false)
|
|
|
+ document.querySelector("#openMusic").style.display = "block"
|
|
|
+ document.querySelector("#closeMusic").style.display = "none"
|
|
|
}
|
|
|
},
|
|
|
+ ChangeFloor(sceneCode) {
|
|
|
+ console.log(sceneCode)
|
|
|
+ const locationQuerySection = new URLSearchParams(location.href.split('?')[1])
|
|
|
+ locationQuerySection.set('m', sceneCode)
|
|
|
+ const newLocation = location.href.split('?')[0] + '?' + locationQuerySection.toString()
|
|
|
+ location.assign(newLocation)
|
|
|
+ location.reload(true)
|
|
|
+ }
|
|
|
},
|
|
|
-};
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
@@ -326,20 +389,21 @@ export default {
|
|
|
// }
|
|
|
// -------end of tooltip相关--------------
|
|
|
|
|
|
-@wh: 50px;
|
|
|
+@width: 99px;
|
|
|
+@height: 125px;
|
|
|
// ----------左下方菜单--------------
|
|
|
.pinBottom.left {
|
|
|
bottom: 30px;
|
|
|
> div {
|
|
|
> .viewContainer {
|
|
|
flex-direction: row;
|
|
|
- margin-left: 30px;
|
|
|
+ margin-left: 50px;
|
|
|
padding: 0;
|
|
|
#play,
|
|
|
#pause {
|
|
|
margin-right: 30px;
|
|
|
- width: @wh;
|
|
|
- height: @wh;
|
|
|
+ width: 99px;
|
|
|
+ height: 125px;
|
|
|
padding: 0;
|
|
|
img {
|
|
|
height: 100%;
|
|
|
@@ -350,8 +414,8 @@ export default {
|
|
|
#gui-modes-map {
|
|
|
> div {
|
|
|
margin-right: 30px;
|
|
|
- width: @wh;
|
|
|
- height: @wh;
|
|
|
+ width: @width;
|
|
|
+ height: @height;
|
|
|
padding: 0;
|
|
|
> img {
|
|
|
height: 100%;
|
|
|
@@ -377,10 +441,11 @@ export default {
|
|
|
.rightViewContainer {
|
|
|
display: flex !important;
|
|
|
align-items: center !important;
|
|
|
- margin-right: 30px;
|
|
|
+ margin-right: 54px;
|
|
|
+ padding-bottom: 20px;
|
|
|
.ui-icon {
|
|
|
- width: @wh;
|
|
|
- height: @wh;
|
|
|
+ width: 88px;
|
|
|
+ height: 91px;
|
|
|
margin-left: 30px;
|
|
|
margin-right: initial;
|
|
|
background: none;
|
|
|
@@ -394,6 +459,16 @@ export default {
|
|
|
height: 100%;
|
|
|
opacity: 0.7;
|
|
|
}
|
|
|
+ > img.active {
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ > #gui-fullscreen, #gui-fullscreen-exit {
|
|
|
+ > a {
|
|
|
+ > img {
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
任一存
