|
|
@@ -18,15 +18,15 @@
|
|
|
3D模型
|
|
|
</p>
|
|
|
</teleport> -->
|
|
|
- <teleport v-if="refMiniMap && player.showWidgets" :to="refMiniMap">
|
|
|
- <span :class="{ gudieDisabled: isshoppingguide && role != 'leader' }" class="button-switch" @click.stop="toggleMap">
|
|
|
- <ui-icon type="show_map_collect"></ui-icon>
|
|
|
- </span>
|
|
|
- <div v-if="controls.showDollhouse" :class="{ gudieDisabled: isshoppingguide && role != 'leader' }" class="change" @click="changeMode('dollhouse')">
|
|
|
- <ui-icon type="show_3d_normal"></ui-icon>
|
|
|
- <span> 3D模型</span>
|
|
|
- </div>
|
|
|
- </teleport>
|
|
|
+ <teleport v-if="refMiniMap && player.showWidgets" :to="refMiniMap">
|
|
|
+ <span :class="{ gudieDisabled: isshoppingguide && role != 'leader' }" class="button-switch" @click.stop="toggleMap">
|
|
|
+ <ui-icon type="show_map_collect"></ui-icon>
|
|
|
+ </span>
|
|
|
+ <div v-if="controls.showDollhouse" :class="{ gudieDisabled: isshoppingguide && role != 'leader' }" class="change" @click="changeMode('dollhouse')">
|
|
|
+ <ui-icon type="show_3d_normal"></ui-icon>
|
|
|
+ <span> 3D模型</span>
|
|
|
+ </div>
|
|
|
+ </teleport>
|
|
|
<!-- <template v-if="refMiniMap && player.showWidgets">
|
|
|
<div
|
|
|
:class="{ disabled: flying, gudieDisabled: isshoppingguide && role != 'leader' }"
|
|
|
@@ -50,23 +50,26 @@
|
|
|
</template> -->
|
|
|
|
|
|
<template v-if="refMiniMap && player.showWidgets">
|
|
|
- <div
|
|
|
+ <div
|
|
|
:class="{ disabled: flying, gudieDisabled: isshoppingguide && role != 'leader' }"
|
|
|
- v-show="mode != 'panorama'" v-if="controls.showFloorplan && controls.showDollhouse" class="tab-layer">
|
|
|
- <div class="tabs" v-if="controls.showMap">
|
|
|
- <span :class="{ active: mode === 'floorplan' }" ref="floorplan_ref" @click="changeMode('floorplan', $event)">
|
|
|
- <ui-icon :type="mode == 'floorplan' ? 'show_plane_selected' : 'show_plane_normal'"></ui-icon>
|
|
|
- 二維
|
|
|
- </span>
|
|
|
- <span :class="{ active: mode === 'dollhouse' }" ref="dollhouse_ref" @click="changeMode('dollhouse', $event)">
|
|
|
- <ui-icon :type="mode == 'dollhouse' ? 'show_3d_selected' : 'show_3d_normal'"></ui-icon>
|
|
|
-
|
|
|
- 三維
|
|
|
- </span>
|
|
|
- <div class="background" ref="background"></div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
+ v-show="mode != 'panorama'"
|
|
|
+ v-if="controls.showFloorplan && controls.showDollhouse"
|
|
|
+ class="tab-layer"
|
|
|
+ >
|
|
|
+ <div class="tabs" v-if="controls.showMap">
|
|
|
+ <span :class="{ active: mode === 'floorplan' }" ref="floorplan_ref" @click="changeMode('floorplan', $event)">
|
|
|
+ <ui-icon :type="mode == 'floorplan' ? 'show_plane_selected' : 'show_plane_normal'"></ui-icon>
|
|
|
+ 二維
|
|
|
+ </span>
|
|
|
+ <span :class="{ active: mode === 'dollhouse' }" ref="dollhouse_ref" @click="changeMode('dollhouse', $event)">
|
|
|
+ <ui-icon :type="mode == 'dollhouse' ? 'show_3d_selected' : 'show_3d_normal'"></ui-icon>
|
|
|
+
|
|
|
+ 三維
|
|
|
+ </span>
|
|
|
+ <div class="background" ref="background"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</template>
|
|
|
<!-- <UiTags /> -->
|
|
|
</div>
|
|
|
@@ -90,8 +93,6 @@ import OpenVideo from "@/components/openVideo/";
|
|
|
import Guide from "@/components/shared/Guide.vue";
|
|
|
import { Dialog } from "@/global_components/";
|
|
|
|
|
|
-
|
|
|
-
|
|
|
import { createApp } from "@/app";
|
|
|
import { ref, onMounted, computed, nextTick, watch } from "vue";
|
|
|
import { useStore } from "vuex";
|
|
|
@@ -179,7 +180,7 @@ if (!Cache.get("HIDENVIDEOEXPIRES")) {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-if (role.value) {
|
|
|
+if (browser.getURLParam("role")) {
|
|
|
hadVideo.value = true;
|
|
|
}
|
|
|
|
|
|
@@ -257,41 +258,40 @@ watch(
|
|
|
}
|
|
|
);
|
|
|
|
|
|
-
|
|
|
watch(
|
|
|
- () => mode.value,
|
|
|
- (val, old) => {
|
|
|
- console.log(val)
|
|
|
- let timer = setTimeout(() => {
|
|
|
- clearTimeout(timer)
|
|
|
- if (val == 'floorplan') {
|
|
|
- if (floorplan_ref.value && floorplan_ref.value) {
|
|
|
- background.value.style.width = floorplan_ref.value.getBoundingClientRect().width + 'px'
|
|
|
- background.value.style.left = floorplan_ref.value.offsetLeft + 'px'
|
|
|
- }
|
|
|
- } else if (val == 'dollhouse') {
|
|
|
- if (dollhouse_ref.value && dollhouse_ref.value) {
|
|
|
- background.value.style.width = dollhouse_ref.value.getBoundingClientRect().width + 'px'
|
|
|
- background.value.style.left = dollhouse_ref.value.offsetLeft + 'px'
|
|
|
- }
|
|
|
- }
|
|
|
- }, 0)
|
|
|
- },
|
|
|
- {
|
|
|
- deep: true
|
|
|
- }
|
|
|
-)
|
|
|
-const floorplan_ref = ref(null)
|
|
|
-const dollhouse_ref = ref(null)
|
|
|
-const changeMode = (name, e) => {
|
|
|
- if (e) {
|
|
|
- if (!flying.value) {
|
|
|
- store.commit('setMode', name)
|
|
|
+ () => mode.value,
|
|
|
+ (val, old) => {
|
|
|
+ console.log(val);
|
|
|
+ let timer = setTimeout(() => {
|
|
|
+ clearTimeout(timer);
|
|
|
+ if (val == "floorplan") {
|
|
|
+ if (floorplan_ref.value && floorplan_ref.value) {
|
|
|
+ background.value.style.width = floorplan_ref.value.getBoundingClientRect().width + "px";
|
|
|
+ background.value.style.left = floorplan_ref.value.offsetLeft + "px";
|
|
|
}
|
|
|
- } else {
|
|
|
- store.commit('setMode', name)
|
|
|
+ } else if (val == "dollhouse") {
|
|
|
+ if (dollhouse_ref.value && dollhouse_ref.value) {
|
|
|
+ background.value.style.width = dollhouse_ref.value.getBoundingClientRect().width + "px";
|
|
|
+ background.value.style.left = dollhouse_ref.value.offsetLeft + "px";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 0);
|
|
|
+ },
|
|
|
+ {
|
|
|
+ deep: true,
|
|
|
+ }
|
|
|
+);
|
|
|
+const floorplan_ref = ref(null);
|
|
|
+const dollhouse_ref = ref(null);
|
|
|
+const changeMode = (name, e) => {
|
|
|
+ if (e) {
|
|
|
+ if (!flying.value) {
|
|
|
+ store.commit("setMode", name);
|
|
|
}
|
|
|
-}
|
|
|
+ } else {
|
|
|
+ store.commit("setMode", name);
|
|
|
+ }
|
|
|
+};
|
|
|
const toggleMap = () => {
|
|
|
isCollapse.value = !isCollapse.value;
|
|
|
let $minmap = document.querySelector("[xui_min_map]");
|
|
|
@@ -468,6 +468,12 @@ onMounted(async () => {
|
|
|
// }
|
|
|
app.Scene.on("ready", () => {
|
|
|
show.value = true;
|
|
|
+ wxShare({
|
|
|
+ title: `cdf澳門上葡京店~`,
|
|
|
+ desc: "cdf澳門上葡京店~",
|
|
|
+ link: window.location.href.split("#")[0],
|
|
|
+ imgUrl: "https://glp-vr.cdfmembers.com/cdf/file/91dd5305525f463286f03a31abd1c154.jpg",
|
|
|
+ });
|
|
|
});
|
|
|
app.Scene.on("error", (data) => {
|
|
|
switch (data.code) {
|
|
|
@@ -612,53 +618,53 @@ onMounted(async () => {
|
|
|
pointer-events: none;
|
|
|
}
|
|
|
.tabs {
|
|
|
- pointer-events: auto;
|
|
|
- position: relative;
|
|
|
- display: flex;
|
|
|
- background: #222222;
|
|
|
+ pointer-events: auto;
|
|
|
+ position: relative;
|
|
|
+ display: flex;
|
|
|
+ background: #222222;
|
|
|
+ border-radius: 6px;
|
|
|
+ padding: 2px;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ border: 1px solid rgba(255, 255, 255, 0.1);
|
|
|
+ box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.5);
|
|
|
+ .background {
|
|
|
+ position: absolute;
|
|
|
+ left: 2px;
|
|
|
+ top: 2px;
|
|
|
+ bottom: 2px;
|
|
|
+ width: 50%;
|
|
|
+ border-radius: 4px;
|
|
|
+ background: #444444;
|
|
|
+ box-shadow: 2px 0px 4px 0px rgba(0, 0, 0, 0.3);
|
|
|
+ z-index: 0;
|
|
|
+ transition: left 0.3s;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ flex: 1;
|
|
|
+ color: #fff;
|
|
|
+ opacity: 0.5;
|
|
|
border-radius: 6px;
|
|
|
- padding: 2px;
|
|
|
- justify-content: center;
|
|
|
+ height: 0.94737rem;
|
|
|
+ font-size: 0.36842rem;
|
|
|
+ transition: all 0.3s ease;
|
|
|
+ display: flex;
|
|
|
align-items: center;
|
|
|
- border: 1px solid rgba(255, 255, 255, 0.1);
|
|
|
- box-shadow: inset 0px 0px 6px 0px rgba(0, 0, 0, 0.5);
|
|
|
- .background {
|
|
|
- position: absolute;
|
|
|
- left: 2px;
|
|
|
- top: 2px;
|
|
|
- bottom: 2px;
|
|
|
- width: 50%;
|
|
|
- border-radius: 4px;
|
|
|
- background: #444444;
|
|
|
- box-shadow: 2px 0px 4px 0px rgba(0, 0, 0, 0.3);
|
|
|
- z-index: 0;
|
|
|
- transition: left 0.3s;
|
|
|
- }
|
|
|
- span {
|
|
|
- flex: 1;
|
|
|
- color: #fff;
|
|
|
- opacity: 0.5;
|
|
|
- border-radius: 6px;
|
|
|
- height: 0.94737rem;
|
|
|
- font-size: 0.36842rem;
|
|
|
- transition: all 0.3s ease;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- padding-left: 10px;
|
|
|
- padding-right: 10px;
|
|
|
- white-space: nowrap;
|
|
|
- z-index: 1;
|
|
|
- i {
|
|
|
- font-size: 0.47368rem;
|
|
|
- margin-right: 4px;
|
|
|
- pointer-events: none;
|
|
|
- }
|
|
|
+ justify-content: center;
|
|
|
+ padding-left: 10px;
|
|
|
+ padding-right: 10px;
|
|
|
+ white-space: nowrap;
|
|
|
+ z-index: 1;
|
|
|
+ i {
|
|
|
+ font-size: 0.47368rem;
|
|
|
+ margin-right: 4px;
|
|
|
+ pointer-events: none;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- span.active {
|
|
|
- opacity: 1;
|
|
|
- }
|
|
|
+ span.active {
|
|
|
+ opacity: 1;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
[xui_tags_view] {
|
tremble