Преглед на файлове

显示3d场景,在右侧提示“不可编辑”。已有场景咋办?让全景看看那边给个接口,通过sceneCode查询版本?

任一存 преди 2 години
родител
ревизия
e983f1bbb1

BIN
packages/qjkankan-editor/src/assets/images/default/empty-go-4dkk.png


BIN
packages/qjkankan-editor/src/assets/images/default/goto-4dage.png


+ 1 - 0
packages/qjkankan-editor/src/components/sceneGroupInEditor.vue

@@ -318,6 +318,7 @@ export default {
             sceneTitle: item.sceneName,
             category: this.level === 1 ? this.groupNode.children[0].id : this.groupNode.id,
             type: "4dkk",
+            version: item.buildType, // 'V3' OR 'V4'. 全景看看v1.3新增
             id:'s_'+this.$randomWord(true,8,8)
           })
         }

+ 9 - 15
packages/qjkankan-editor/src/framework/play/pano/components/list.vue

@@ -8,12 +8,16 @@
        id="swScenes" ref="sw"
         v-swiper:mySwiper="swiperOptions" v-if="currentScenesList.length > 0">
         <ul class="swiper-wrapper">
-          <li v-tooltip="item.type === '4dkk' ? $i18n.t('navigation.scene_edit_tips') : ''" @click="tabCurrentScene(item)"
-            class="swiper-slide" :class="{
+          <li
+            v-tooltip="item.type === '4dkk' ? $i18n.t('navigation.scene_edit_tips') : ''" @click="tabCurrentScene(item)"
+            class="swiper-slide"
+            :class="{
               active: currentScene.id == item.id,
               loopspan: item.sceneTitle.length > spanlength && currentScene.id == item.id,
-            }" :style="{ backgroundImage: `url(${item.icon})`, opacity: item.type === '4dkk' ? 0.5 : 1, }"
-            v-for="(item, i) in currentScenesList" :key="item.id">
+            }"
+            :style="{ backgroundImage: `url(${item.icon})`,}"
+            v-for="(item, i) in currentScenesList" :key="item.id"
+          >
             <i class="iconfont icon-edit_type_3d" :class="{ iconedit_type_panorama: item.type !== '4dkk' }"></i>
             <div>
               <span v-if="currentScene.id == item.id">{{ item.sceneTitle }}</span>
@@ -165,17 +169,7 @@ export default {
     },
 
     tabCurrentScene(data) {
-      if (data.type === '4dkk') {
-        if (this.scenes.some((item) => {
-          return item.type === 'pano'
-        })) {
-          return
-        } else {
-          this.$store.commit("scene/setCurrentScene", data);
-        }
-      } else {
-        this.$store.commit("scene/setCurrentScene", data);
-      }
+      this.$store.commit("scene/setCurrentScene", data);
     },
 
     tabSecondary(data) {

+ 17 - 34
packages/qjkankan-editor/src/framework/play/pano/index.vue

@@ -1,6 +1,14 @@
 <template>
   <div class="panocon">
-    <div id="pano"></div>
+    <div v-show="currentScene.type !== '4dkk'" id="pano">
+    </div>
+    <iframe
+      id="iframe-4dkk"
+      width=""
+      v-if="currentScene.type === '4dkk'"
+      :src="`https://test.4dkankan.com/sp${currentScene.version === 'V3' ? 'c' : currentScene.version === 'V4' ? 'g' : 'c'}.html?m=${currentScene.sceneCode}&lang=${lang}`"
+      frameborder="0"
+    />
 
     <div class="showexplanation" v-if="showExplanation&&currentScene.explanation && currentScene.explanation.audioId">
       <img :src="require(`@/assets/images/commentary@2x.png`)" alt="">
@@ -12,11 +20,6 @@
       <button class="ui-button submit set-initial-view" :class="{disable: currentScene.type === '4dkk',}" @click="onClick">{{$i18n.t('screen.setting_screen')}}</button>
     </template>
 
-    <div class="btn-4dkk-tip" v-if="currentScene.type ==='4dkk'">
-      <img src="@/assets/images/default/empty-go-4dkk.png" alt="" draggable="false">
-      <div>{{$i18n.t('navigation.scene_edit_tips')}}~</div>
-      <button class="ui-button submit" @click="onClickGo4dkk">{{$i18n.t('navigation.go_scene_editor')}}</button>
-    </div>
   </div>
 </template>
 
@@ -27,7 +30,7 @@ import * as krfn from "@/core/index.js";
 import { $waiting } from "@/components/shared/loading";
 import Snapshot from "@/components/Snapshot";
 import { uploadCover } from "@/api";
-
+import config from '@/config'
 
 let __krfn = krfn.default;
 
@@ -37,6 +40,7 @@ export default {
     return {
       showFlash: false,
       inter: null,
+      lang: config.lang || 'zh',
     }
   },
   computed: {
@@ -64,7 +68,6 @@ export default {
         })
       }
       if (newVal.type == '4dkk') {
-        console.log(newVal.type);
         $("#pano").empty();
         return
       } else {
@@ -105,7 +108,7 @@ export default {
             passQueryParameters: true,
           });
         }
-      };
+      }
 
       var settings = {
         "events[skin_events].onxmlcomplete": "js(window.vrViewFn());",
@@ -178,9 +181,6 @@ export default {
       __krfn.utils.addhotspot(this.$getKrpano(), param, true);
       this.$store.commit("tags/setIsConfirmingPosi", param.name);
     },
-    onClickGo4dkk() {
-      window.open('/#/scene')
-    }
   },
   mounted() {
     window.__krfn = __krfn;
@@ -210,6 +210,11 @@ export default {
     height: 100%;
   }
 
+  #iframe-4dkk {
+    width: 100%;
+    height: 100%;
+  }
+  
   .showexplanation {
     position: absolute;
     top: 20px;
@@ -237,27 +242,5 @@ export default {
     z-index: 99;
   }
 
-  .btn-4dkk-tip {
-    position: absolute;
-    bottom: 50%;
-    left: 50%;
-    transform: translateX(-50%);
-    z-index: 99;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    > img {
-      width: 120px;
-    }
-    > div {
-      color: #a3a3a3;
-      font-size: 14px;
-      white-space: pre;
-      margin-top: 1em;
-    }
-    > button {
-      margin-top: 14px;
-    }
-  }
 }
 </style>

+ 4 - 2
packages/qjkankan-editor/src/lang/_en.json

@@ -808,7 +808,8 @@
   "screen": {
     "init_screen": "Start screen",
     "screen_tips": "The start screen is the initial screen that appears when entering a scene; please drag the panorama to select the appropriate screen setting.",
-    "setting_screen": "Set the current view to the start screen"
+    "setting_screen": "Set the current view to the start screen",
+    "goto_4dkk_edit_tips": "请前往四维时代个人中心编辑~"
   },
   "hotspot": {
     "hotspot_type": "热点类型",
@@ -918,7 +919,8 @@
     "add_audio": "Add audio",
     "change_audio": "Change audio",
     "default_open": "Enable",
-    "loop": "Loop"
+    "loop": "Loop",
+    "disabled_tip": "三维场景暂不支持添加讲解"
   },
   "style_key": {
     "menu_width": "88px",

+ 4 - 2
packages/qjkankan-editor/src/lang/_zh.json

@@ -812,7 +812,8 @@
   "screen": {
     "init_screen": "初始画面",
     "screen_tips": "初始画面为进入场景时第一画面,请拖动全景图选择合适的画面设置。",
-    "setting_screen": "将当前视角设为初始画面"
+    "setting_screen": "将当前视角设为初始画面",
+    "goto_4dkk_edit_tips": "请前往四维时代个人中心编辑~"
   },
   "hotspot": {
     "hotspot_type": "热点类型",
@@ -922,7 +923,8 @@
     "add_audio": "添加音频",
     "change_audio": "更换音频",
     "default_open": "默认开启",
-    "loop": "循环播放"
+    "loop": "循环播放",
+    "disabled_tip": "三维场景暂不支持添加讲解"
   },
   "style_key": {
     "menu_width": "58px",

+ 57 - 46
packages/qjkankan-editor/src/views/explanation/explanationSettings.vue

@@ -1,55 +1,60 @@
 <template>
   <div class="explanation-settings"  app-border dir-left>
-    <div class="title">
-      {{$i18n.t("explanation.explanation_settings")}}
-      <i class="iconfont icon-material_prompt tool-tip-for-editor" v-tooltip="$i18n.t('explanation.explanation_tips')"/>
-    </div>
-    <button
-      v-if="!currentScene.explanation.audioId"
-      class="ui-button submit"
-      :class="{
-        disable: !currentScene || currentScene.type ==='4dkk',
-      }"
-      @click="isShowSelectionWindow = true"
-    >
-      <i class="iconfont icon-editor_add"></i>
-      {{$i18n.t("explanation.add_audio")}}
-    </button>
-    <template v-else>
-      <div class="music-display" @click.self="onClickCurrentMusic">
-        <Audio ref="my-audio" class="audio-control" :backgroundColor="'#1A1B1D'" :myAudioUrl="currentScene.explanation.audioUrl"></Audio>
-        <div class="name" :key="currentScene.explanation.audioName" v-title="currentScene.explanation.audioName" @click="onClickCurrentMusic">{{currentScene.explanation.audioName}}</div>
-        <i class="iconfont icon-editor_list_delete" @click.stop="onClickDeleteMusicBtn"></i>
+    <template v-if="currentScene.type !== '4dkk'">
+      <div class="title">
+        {{$i18n.t("explanation.explanation_settings")}}
+        <i class="iconfont icon-material_prompt tool-tip-for-editor" v-tooltip="$i18n.t('explanation.explanation_tips')"/>
       </div>
-      <button class="ui-button" @click="isShowSelectionWindow = true">
-        <i class="iconfont icon-editor_update"></i>
-        {{$i18n.t("explanation.change_audio")}}
+      <button
+        v-if="!currentScene.explanation.audioId"
+        class="ui-button submit"
+        :class="{
+          disable: !currentScene || currentScene.type ==='4dkk',
+        }"
+        @click="isShowSelectionWindow = true"
+      >
+        <i class="iconfont icon-editor_add"></i>
+        {{$i18n.t("explanation.add_audio")}}
       </button>
-    </template>
+      <template v-else>
+        <div class="music-display" @click.self="onClickCurrentMusic">
+          <Audio ref="my-audio" class="audio-control" :backgroundColor="'#1A1B1D'" :myAudioUrl="currentScene.explanation.audioUrl"></Audio>
+          <div class="name" :key="currentScene.explanation.audioName" v-title="currentScene.explanation.audioName" @click="onClickCurrentMusic">{{currentScene.explanation.audioName}}</div>
+          <i class="iconfont icon-editor_list_delete" @click.stop="onClickDeleteMusicBtn"></i>
+        </div>
+        <button class="ui-button" @click="isShowSelectionWindow = true">
+          <i class="iconfont icon-editor_update"></i>
+          {{$i18n.t("explanation.change_audio")}}
+        </button>
+      </template>
 
-    <div class="switch-wrapper">
-      <span class="label">{{$i18n.t("explanation.default_open")}}</span>
-      <Switcher
-        :disable="!currentScene || currentScene.type ==='4dkk'"
-        :value="currentScene.explanation.openByDefault" @change="currentScene.explanation.openByDefault = !currentScene.explanation.openByDefault"
-      />
-    </div>
-    <div class="switch-wrapper">
-      <span class="label">{{$i18n.t("explanation.loop")}}</span>
-      <Switcher
-        :disable="!currentScene || currentScene.type ==='4dkk'"
-        :value="currentScene.explanation.repeat" @change="currentScene.explanation.repeat = !currentScene.explanation.repeat"
-      />
-    </div>
+      <div class="switch-wrapper">
+        <span class="label">{{$i18n.t("explanation.default_open")}}</span>
+        <Switcher
+          :disable="!currentScene || currentScene.type ==='4dkk'"
+          :value="currentScene.explanation.openByDefault" @change="currentScene.explanation.openByDefault = !currentScene.explanation.openByDefault"
+        />
+      </div>
+      <div class="switch-wrapper">
+        <span class="label">{{$i18n.t("explanation.loop")}}</span>
+        <Switcher
+          :disable="!currentScene || currentScene.type ==='4dkk'"
+          :value="currentScene.explanation.repeat" @change="currentScene.explanation.repeat = !currentScene.explanation.repeat"
+        />
+      </div>
 
-    <div class="dialog" style="z-index: 2000" v-if="isShowSelectionWindow">
-      <MaterialSelector
-        :title="$i18n.t('gather.select_material')"
-        @cancle="isShowSelectionWindow = false"
-        @submit="handleSubmitFromMaterialSelector"
-        :selectableType="['audio']"
-        initialMaterialType="audio"
-      />
+      <div class="dialog" style="z-index: 2000" v-if="isShowSelectionWindow">
+        <MaterialSelector
+          :title="$i18n.t('gather.select_material')"
+          @cancle="isShowSelectionWindow = false"
+          @submit="handleSubmitFromMaterialSelector"
+          :selectableType="['audio']"
+          initialMaterialType="audio"
+        />
+      </div>
+    </template>
+    <div class="disabled-tip" v-if="currentScene.type === '4dkk'">
+      {{$i18n.t('explanation.disabled_tip')}}
     </div>
   </div>
 </template>
@@ -199,5 +204,11 @@ export default {
       font-size: 14px;
     }
   }
+
+  .disabled-tip {
+    text-align: center;
+    color: rgba(255, 255, 255, 0.6);
+    font-size: 14px;
+  }
 }
 </style>

+ 86 - 44
packages/qjkankan-editor/src/views/hotspot/HotSpotList.vue

@@ -4,55 +4,69 @@
       {{$i18n.t('hotspot.add_hotspot')}}
       <i class="iconfont icon-material_prompt tool-tip-for-editor" v-tooltip="$i18n.t('hotspot.hotspot_tips')" />
     </div>
-    <ul class="hotspot-type-list">
-      <li
-        class="hotspot-type-item"
-        v-for="(item, index) in hotspotTypeList"
-        :key="index"
-        @click="open({
-          isAdd: true,
-          hotspotType: item.id,
-          idxInSystemIconList: item.idxInSystemIconList
-        })"
-      >
-        <img class="icon" :src="item.icon" alt="" draggable="false">
-        <div class="type-name">{{item.name}}</div>
-        <img
-          v-if="item.isExperience"
-          class="exp-tag"
-          src="@/assets/img/experience.png"
-          alt=""
-          draggable="false"
-        >
-      </li>
-    </ul>
 
-    <div class="total-count">{{$i18n.t('hotspot.current_hotspots')}}
-      <span class="number">({{ someData.hotspots.length }})</span>
-    </div>
-    <div class="hots">
-      <ul v-if="someData.hotspots.length > 0">
-        <li v-for="(item, key) in someData.hotspots" :key="key" @click="open(item)">
-          <img class="hot-spot-thumb" :src="item.img" alt="">
-          <span class="hot-spot-title" v-title="item.hotspotTitle">{{ item.hotspotTitle }}</span>
-          <i
-            class="iconfont icon-editor_list_delete icon-delete"
-            v-tooltip="$i18n.t('hotspot.delete')"
-            @click.stop="deleIndex = key"
-          />
-          <div class="deletion-confirm-wrap">
-            <div class="deletion-confirm" :class="deleIndex == key ? 'show' : 'hide'" v-clickoutside="clickoutside"
-              @click.stop="deleteHot(item)">
-              {{$i18n.t('hotspot.delete')}}
-            </div>
-          </div>
+    <template v-if="currentScene.type !== '4dkk'">
+      <ul class="hotspot-type-list">
+        <li
+          class="hotspot-type-item"
+          v-for="(item, index) in hotspotTypeList"
+          :key="index"
+          @click="open({
+            isAdd: true,
+            hotspotType: item.id,
+            idxInSystemIconList: item.idxInSystemIconList
+          })"
+        >
+          <img class="icon" :src="item.icon" alt="" draggable="false">
+          <div class="type-name">{{item.name}}</div>
+          <img
+            v-if="item.isExperience"
+            class="exp-tag"
+            src="@/assets/img/experience.png"
+            alt=""
+            draggable="false"
+          >
         </li>
       </ul>
-      <div v-else class="empty-tip">
-        <img src="@/assets/images/default/empty_hotspot_list.png" alt="">
-        <div>{{$i18n.t('hotspot.no_hotspot')}}</div>
+
+      <div class="total-count">{{$i18n.t('hotspot.current_hotspots')}}
+        <span class="number">({{ someData.hotspots.length }})</span>
       </div>
+      <div class="hots">
+        <ul v-if="someData.hotspots.length > 0">
+          <li v-for="(item, key) in someData.hotspots" :key="key" @click="open(item)">
+            <img class="hot-spot-thumb" :src="item.img" alt="">
+            <span class="hot-spot-title" v-title="item.hotspotTitle">{{ item.hotspotTitle }}</span>
+            <i
+              class="iconfont icon-editor_list_delete icon-delete"
+              v-tooltip="$i18n.t('hotspot.delete')"
+              @click.stop="deleIndex = key"
+            />
+            <div class="deletion-confirm-wrap">
+              <div class="deletion-confirm" :class="deleIndex == key ? 'show' : 'hide'" v-clickoutside="clickoutside"
+                @click.stop="deleteHot(item)">
+                {{$i18n.t('hotspot.delete')}}
+              </div>
+            </div>
+          </li>
+        </ul>
+        <div v-else class="empty-tip">
+          <img src="@/assets/images/default/empty_hotspot_list.png" alt="">
+          <div>{{$i18n.t('hotspot.no_hotspot')}}</div>
+        </div>
+      </div>
+    </template>
+
+    <div class="goto-4dkk-tip" v-if="currentScene.type === '4dkk'">
+      <div class="img-wrap">
+        <img class="" src="@/assets/images/default/goto-4dage.png" alt="" draggable="false">
+        <div class="tip-text">
+          {{$i18n.t('screen.goto_4dkk_edit_tips')}}
+        </div>
+      </div>
+      <button class="ui-button submit" @click="onClickGo4dkk">{{$i18n.t('navigation.go_scene_editor')}}</button>
     </div>
+
     <EditPanel
       class="adding-hotspot-panel"
       v-if="showPanel"
@@ -392,6 +406,9 @@ export default {
         this.deleIndex = -1
       }
     },
+    onClickGo4dkk() {
+      window.open('/#/scene')
+    },
   },
 }
 </script>
@@ -594,5 +611,30 @@ export default {
     right: 0;
     width: 100%;
   }
+
+  
+  .goto-4dkk-tip {
+    > .img-wrap {
+      position: relative;
+      width: 100%;
+      > .img {
+        width: 100%;
+      }
+      > .tip-text {
+        position: absolute;
+        left: 50%;
+        bottom: 32px;
+        transform: translateX(-50%);
+        font-size: 14px;
+        color: #fff;
+        opacity: 0.6;
+        white-space: pre;
+      }
+    }
+    > button {
+      margin-top: 16px;
+      width: 100%;
+    }
+  }
 }
 </style>

+ 44 - 6
packages/qjkankan-editor/src/views/screen/Setting.vue

@@ -4,11 +4,23 @@
       {{$i18n.t('screen.init_screen')}}
       <i class="iconfont icon-material_prompt tool-tip-for-editor" v-tooltip="$i18n.t('screen.screen_tips')"/>
     </div>
-    <img class="preview" v-if="initImg" :src="`${initImg}?${Math.random()}`" alt="">
-    <img class="placeholder" v-else src="@/assets/images/pano-image-placeholder.png" alt="">
+    <template v-if="currentScene.type !== '4dkk'">
+      <img class="preview" v-if="initImg" :src="`${initImg}?${Math.random()}`" alt="">
+      <img class="placeholder" v-else src="@/assets/images/pano-image-placeholder.png" alt="">
+    </template>
+
+    <div class="goto-4dkk-tip" v-if="currentScene.type === '4dkk'">
+      <div class="img-wrap">
+        <img class="" src="@/assets/images/default/goto-4dage.png" alt="" draggable="false">
+        <div class="tip-text">
+          {{$i18n.t('screen.goto_4dkk_edit_tips')}}
+        </div>
+      </div>
+      <button class="ui-button submit" @click="onClickGo4dkk">{{$i18n.t('navigation.go_scene_editor')}}</button>
+    </div>
+
   </div>
 </template>
-
 <script>
 import { mapGetters } from "vuex";
 
@@ -18,14 +30,16 @@ export default {
       currentScene: "scene/currentScene",
     })
   },
-  methods:{
-
-  },
   data(){
     return {
       initImg:''
     }
   },
+  methods:{
+    onClickGo4dkk() {
+      window.open('/#/scene')
+    }
+  },
   mounted(){
     this.$bus.on('initView', data => {
       this.initImg = data
@@ -65,5 +79,29 @@ export default {
     height: 132px;
     margin-bottom: 16px;
   }
+
+  .goto-4dkk-tip {
+    > .img-wrap {
+      position: relative;
+      width: 100%;
+      > .img {
+        width: 100%;
+      }
+      > .tip-text {
+        position: absolute;
+        left: 50%;
+        bottom: 32px;
+        transform: translateX(-50%);
+        font-size: 14px;
+        color: #fff;
+        opacity: 0.6;
+        white-space: pre;
+      }
+    }
+    > button {
+      margin-top: 16px;
+      width: 100%;
+    }
+  }
 }
 </style>