|
|
@@ -5,33 +5,20 @@
|
|
|
v-if="activeItem.type == '4dkk'"
|
|
|
@changeUrl="handleChange"
|
|
|
@otherUrl="handleOther"
|
|
|
+ :bgmUrl="bgmUrl"
|
|
|
+ :somedatainfo="somedatainfo"
|
|
|
:key="embeM||activeItem.sceneCode"
|
|
|
:url="otherLink?otherLink:`local/4dkk/${activeItem.sceneCode}/wwwroot/embed.html?from=mingyuan&m=${embeM||activeItem.sceneCode}&lang=zh&scene-link=1&rnd=${rnd}`"
|
|
|
/>
|
|
|
- <!-- -->
|
|
|
+ <!-- -->
|
|
|
|
|
|
<div v-show="activeItem.type != '4dkk'" id="pano"></div>
|
|
|
-
|
|
|
- <div
|
|
|
- class="pano-logo"
|
|
|
- v-if="showInfo.isLogo && activeItem.type != '4dkk'"
|
|
|
- >
|
|
|
- <img
|
|
|
- :src="
|
|
|
- showInfo.logo ||
|
|
|
- require('@/assets/images/default/img_logoshow@2x.png')
|
|
|
- "
|
|
|
- alt=""
|
|
|
- />
|
|
|
+
|
|
|
+ <div class="pano-logo" v-if="showInfo.isLogo && activeItem.type != '4dkk'">
|
|
|
+ <img :src="showInfo.logo || require('@/assets/images/default/img_logoshow@2x.png')" alt="" />
|
|
|
</div>
|
|
|
|
|
|
- <list
|
|
|
- v-if="canLoad&&!isVR"
|
|
|
- @select="handleSelect"
|
|
|
- :firstScene="firstScene"
|
|
|
- :select="activeItem"
|
|
|
- :mapvisit="mapvisit"
|
|
|
- ></list>
|
|
|
+ <list v-if="canLoad && !isVR" @select="handleSelect" :firstScene="firstScene" :select="activeItem" :mapvisit="mapvisit"></list>
|
|
|
|
|
|
<ul class="aside" v-show="activeItem.type != '4dkk'">
|
|
|
<li v-for="(item, i) in aside" :key="i">
|
|
|
@@ -40,47 +27,20 @@
|
|
|
</span>
|
|
|
</li>
|
|
|
</ul>
|
|
|
- <div
|
|
|
- class="oper-tips"
|
|
|
- :class="{ hidetips: !showTips }"
|
|
|
- v-if="localRemind"
|
|
|
- >
|
|
|
- <img
|
|
|
- :src="
|
|
|
- showInfo.appIcon ||
|
|
|
- require('@/assets/images/default/show/img_tipsmb_default.png')
|
|
|
- "
|
|
|
- alt=""
|
|
|
- />
|
|
|
+ <div class="oper-tips" :class="{ hidetips: !showTips }" v-if="localRemind">
|
|
|
+ <img :src="showInfo.appIcon || require('@/assets/images/default/show/img_tipsmb_default.png')" alt="" />
|
|
|
</div>
|
|
|
- <password
|
|
|
- :bg="showInfo.icon"
|
|
|
- :show="showPassword"
|
|
|
- @submit="handlePassword"
|
|
|
- @close="showPassword = false"
|
|
|
- />
|
|
|
+ <password :bg="showInfo.icon" :show="showPassword" @submit="handlePassword" @close="showPassword = false" />
|
|
|
<popup :title="'简介'" :show="showIntro" @close="showIntro = false">
|
|
|
<div slot="content" class="introcon">
|
|
|
<span>{{ showInfo.description || "暂无简介" }}</span>
|
|
|
</div>
|
|
|
</popup>
|
|
|
- <imgview
|
|
|
- @close="showImage = false"
|
|
|
- v-if="showImage"
|
|
|
- :image="currentHotspot.image"
|
|
|
- />
|
|
|
+ <imgview @close="showImage = false" v-if="showImage" :image="currentHotspot.image" />
|
|
|
|
|
|
- <preview
|
|
|
- :item="currentHotspot"
|
|
|
- :show="showPreview"
|
|
|
- @close="showPreview = false"
|
|
|
- />
|
|
|
+ <preview :item="currentHotspot" :show="showPreview" @close="showPreview = false" />
|
|
|
|
|
|
- <popup
|
|
|
- :title="currentHotspot.hotspotTitle"
|
|
|
- :show="showTextarea"
|
|
|
- @close="showTextarea = false"
|
|
|
- >
|
|
|
+ <popup :title="currentHotspot.hotspotTitle" :show="showTextarea" @close="showTextarea = false">
|
|
|
<div slot="content" class="introcon">
|
|
|
<span>{{ currentHotspot.textarea }}</span>
|
|
|
</div>
|
|
|
@@ -115,10 +75,10 @@
|
|
|
|
|
|
<script>
|
|
|
import * as krfn from "@/core/index.js";
|
|
|
-import { getPanoInfo, checkPassword, checkWork,getSceneInfomation } from "@/api";
|
|
|
+import { getPanoInfo, checkPassword, checkWork, getSceneInfomation } from "@/api";
|
|
|
import password from "./popup/password";
|
|
|
import preview from "./popup/preview";
|
|
|
-import { $smallWaiting } from '@/components/shared/loading'
|
|
|
+import { $smallWaiting } from "@/components/shared/loading";
|
|
|
|
|
|
import imgview from "./popup/imgview";
|
|
|
import vIfr from "./iframe";
|
|
|
@@ -132,6 +92,17 @@ import list from "./list";
|
|
|
|
|
|
let __krfn = krfn.default;
|
|
|
|
|
|
+let bgmMap = {
|
|
|
+ 欢快: "01.mp3",
|
|
|
+ 空灵: "02.mp3",
|
|
|
+ 节奏: "03.mp3",
|
|
|
+ 怀旧: "04.mp3",
|
|
|
+ 想念: "05.mp3",
|
|
|
+ 复古: "06.mp3",
|
|
|
+ 琴弦: "07.mp3",
|
|
|
+ 愉快: "08.mp3",
|
|
|
+};
|
|
|
+
|
|
|
export default {
|
|
|
components: {
|
|
|
list,
|
|
|
@@ -149,9 +120,11 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
- mapvisit:0,
|
|
|
- isVR:false,
|
|
|
- localRemind:false,
|
|
|
+ mapvisit: 0,
|
|
|
+ bgmUrl: "",
|
|
|
+ somedatainfo:'',
|
|
|
+ isVR: false,
|
|
|
+ localRemind: false,
|
|
|
showPreview: false,
|
|
|
audioUrl: "",
|
|
|
showTips: false,
|
|
|
@@ -168,9 +141,9 @@ export default {
|
|
|
currentHotspot: "",
|
|
|
list: [],
|
|
|
loadFinish: false,
|
|
|
- embeM:null,
|
|
|
- otherLink:null,
|
|
|
- rnd:null,
|
|
|
+ embeM: null,
|
|
|
+ otherLink: null,
|
|
|
+ rnd: null,
|
|
|
aside: [
|
|
|
{
|
|
|
id: "about",
|
|
|
@@ -184,17 +157,31 @@ export default {
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
- handleOther(data){
|
|
|
- this.otherLink=data
|
|
|
- this.rnd = Math.random()
|
|
|
+ handleOther(data) {
|
|
|
+ this.otherLink = data;
|
|
|
+ this.rnd = Math.random();
|
|
|
},
|
|
|
- handleChange(data){
|
|
|
- this.embeM=data
|
|
|
- this.rnd = Math.random()
|
|
|
+ handleChange(data) {
|
|
|
+ this.embeM = data;
|
|
|
+ this.rnd = Math.random();
|
|
|
},
|
|
|
- getSceneInfomation(){
|
|
|
- getSceneInfomation({id:this.activeItem.sceneCode}, (data) => {
|
|
|
- this.mapvisit = data.data.mapVisi
|
|
|
+ getSceneInfomation() {
|
|
|
+ getSceneInfomation({ id: this.activeItem.sceneCode }, (data) => {
|
|
|
+ this.mapvisit = data.data.mapVisi;
|
|
|
+ this.somedatainfo = data.data
|
|
|
+ if (data.data.bgMusic) {
|
|
|
+ if (bgmMap[data.data.bgMusic]) {
|
|
|
+ this.bgmUrl =
|
|
|
+ window.location.href.indexOf("www.4dkankan.com") > -1
|
|
|
+ ? `https://4dkk.4dage.com/v3/audio/${bgmMap[data.data.bgMusic]}`
|
|
|
+ : `https://4dkk.4dage.com/v3-test/audio/${bgmMap[data.data.bgMusic]}`;
|
|
|
+ }
|
|
|
+
|
|
|
+ if (data.data.bgMusic == 'user') {
|
|
|
+ this.bgmUrl = data.data.bgMusic ? `https://4dkk.4dage.com/images/images${data.data.num}/${data.data.bgMusicName}` : "";
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
});
|
|
|
},
|
|
|
handleEnded() {
|
|
|
@@ -205,16 +192,15 @@ export default {
|
|
|
this.showIntro = true;
|
|
|
}
|
|
|
if (data.id == "vr") {
|
|
|
- this.$iosGrantedTips(data=>{
|
|
|
- if (data.code==1) {
|
|
|
+ this.$iosGrantedTips((data) => {
|
|
|
+ if (data.code == 1) {
|
|
|
var krpano = document.getElementById("krpanoSWFObject");
|
|
|
var webvr = krpano.get("webvr");
|
|
|
webvr.entervr();
|
|
|
+ } else {
|
|
|
+ this.$alert({ content: "运动和方向访问失败,您需要完全关闭此应用,然后再次打开,并允许访问运动与方向" });
|
|
|
}
|
|
|
- else{
|
|
|
- this.$alert({content:'运动和方向访问失败,您需要完全关闭此应用,然后再次打开,并允许访问运动与方向'})
|
|
|
- }
|
|
|
- })
|
|
|
+ });
|
|
|
}
|
|
|
},
|
|
|
|
|
|
@@ -260,11 +246,10 @@ export default {
|
|
|
});
|
|
|
rootmp = this.$unique(rootmp);
|
|
|
|
|
|
- let sortArr = this.showInfo.catalogRoot.map(item=>item.name)
|
|
|
- rootmp.sort((a,b)=>{
|
|
|
- return sortArr.indexOf(a.name) - sortArr.indexOf(b.name)
|
|
|
- })
|
|
|
-
|
|
|
+ let sortArr = this.showInfo.catalogRoot.map((item) => item.name);
|
|
|
+ rootmp.sort((a, b) => {
|
|
|
+ return sortArr.indexOf(a.name) - sortArr.indexOf(b.name);
|
|
|
+ });
|
|
|
|
|
|
this.showInfo.catalogRoot = rootmp.map((item) => {
|
|
|
let temp = [];
|
|
|
@@ -301,9 +286,7 @@ export default {
|
|
|
}
|
|
|
|
|
|
if (this.showInfo.firstScene) {
|
|
|
- this.showInfo.firstScene = this.showInfo.scenes.find(
|
|
|
- (item) => item.sceneCode == this.showInfo.firstScene.sceneCode
|
|
|
- );
|
|
|
+ this.showInfo.firstScene = this.showInfo.scenes.find((item) => item.sceneCode == this.showInfo.firstScene.sceneCode);
|
|
|
}
|
|
|
|
|
|
this.$store.commit("SetShowInfo", this.showInfo);
|
|
|
@@ -320,7 +303,7 @@ export default {
|
|
|
watch: {
|
|
|
currentHotspot: {
|
|
|
deep: true,
|
|
|
- handler: function (newVal) {
|
|
|
+ handler: function(newVal) {
|
|
|
if (newVal) {
|
|
|
this.audioUrl = "";
|
|
|
if (newVal.hotspotType == "link") {
|
|
|
@@ -351,7 +334,7 @@ export default {
|
|
|
canLoad(newVal) {
|
|
|
if (newVal) {
|
|
|
setTimeout(() => {
|
|
|
- this.showTips = this.localRemind
|
|
|
+ this.showTips = this.localRemind;
|
|
|
setTimeout(() => {
|
|
|
this.showTips = false;
|
|
|
}, this.showInfo.remindTime * 1000);
|
|
|
@@ -361,7 +344,7 @@ export default {
|
|
|
showInfo: {
|
|
|
deep: true,
|
|
|
immediate: true,
|
|
|
- handler: function (newVal) {
|
|
|
+ handler: function(newVal) {
|
|
|
if (newVal) {
|
|
|
document.title = newVal.name || "无标题";
|
|
|
let locoR = "localRemind" + newVal.id;
|
|
|
@@ -377,7 +360,7 @@ export default {
|
|
|
localStorage.setItem(locoR, 0);
|
|
|
}
|
|
|
if (this.showInfo.firstScene) {
|
|
|
- if (this.showInfo.firstScene.type == '4dkk') {
|
|
|
+ if (this.showInfo.firstScene.type == "4dkk") {
|
|
|
this.localRemind = false;
|
|
|
}
|
|
|
}
|
|
|
@@ -399,15 +382,17 @@ export default {
|
|
|
this.otherLink = null;
|
|
|
removepano("#pano");
|
|
|
$("#pano").empty();
|
|
|
- this.getSceneInfomation()
|
|
|
+ this.getSceneInfomation();
|
|
|
return;
|
|
|
+ } else {
|
|
|
+ this.bgmUrl = "";
|
|
|
}
|
|
|
removepano("#pano");
|
|
|
- $smallWaiting.show()
|
|
|
+ $smallWaiting.show();
|
|
|
|
|
|
$("#pano").empty();
|
|
|
window.vrInitFn = () => {
|
|
|
- $smallWaiting.hide()
|
|
|
+ $smallWaiting.hide();
|
|
|
var krpano = document.getElementById("krpanoSWFObject");
|
|
|
__krfn.utils.initHotspot(krpano, newVal && newVal.someData, false);
|
|
|
};
|
|
|
@@ -446,19 +431,18 @@ export default {
|
|
|
mounted() {
|
|
|
window.__krfn = __krfn;
|
|
|
this.$bus.on("clickHotspot", (data) => {
|
|
|
- let someData = this.activeItem.someData
|
|
|
- if (typeof someData == 'string') {
|
|
|
+ let someData = this.activeItem.someData;
|
|
|
+ if (typeof someData == "string") {
|
|
|
someData = JSON.parse(this.activeItem.someData);
|
|
|
}
|
|
|
let idx = someData.hotspots.findIndex((item) => item.name == data);
|
|
|
this.currentHotspot = someData.hotspots[idx];
|
|
|
});
|
|
|
|
|
|
- this.$bus.on('isVR',(data)=>{
|
|
|
- this.isVR = data
|
|
|
- })
|
|
|
+ this.$bus.on("isVR", (data) => {
|
|
|
+ this.isVR = data;
|
|
|
+ });
|
|
|
|
|
|
-
|
|
|
this.getSceneInfo();
|
|
|
},
|
|
|
};
|
|
|
@@ -522,14 +506,14 @@ export default {
|
|
|
padding: 0 10px;
|
|
|
&.active {
|
|
|
background: rgba(0, 0, 0, 0.3);
|
|
|
- border: 1px solid #0076F6;
|
|
|
- color: #0076F6;
|
|
|
+ border: 1px solid #0076f6;
|
|
|
+ color: #0076f6;
|
|
|
}
|
|
|
- .iconedit_soundview{
|
|
|
- color: #0076F6;
|
|
|
+ .icon-edit_soundview {
|
|
|
+ color: #0076f6;
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
- .vaduio{
|
|
|
+ .vaduio {
|
|
|
visibility: hidden;
|
|
|
width: 0;
|
|
|
}
|
|
|
@@ -594,8 +578,8 @@ export default {
|
|
|
word-break: break-all;
|
|
|
max-height: 75vh;
|
|
|
overflow-y: auto;
|
|
|
- -webkit-overflow-scrolling:touch;
|
|
|
- >span{
|
|
|
+ -webkit-overflow-scrolling: touch;
|
|
|
+ > span {
|
|
|
display: inline-block;
|
|
|
-webkit-overflow-scrolling: touch;
|
|
|
text-align: justify;
|