编辑器-语音讲解-右侧界面功能

packages/code/src/mixins/index.js

@@ -1,7 +1,7 @@
 import Vue from "vue";
 
 import config from "../config";
-import bus from "../utils/eventbus";
+import bus from "../utils/eventbus.js";
 import { Alert, Confirm, Tips } from "../components/shared/message";
 
 import clickoutside from "./v-clickoutside";

packages/code/src/views/explanation/explanationSettings.vue

@@ -4,15 +4,14 @@
       语音讲解
       <i class="iconfont icon-material_prompt tool-tip-for-editor" v-tooltip="'您可以为当前全景图添加语音讲解音频。'"/>
     </div>
-
-    <button v-if="!audioName" class="ui-button submit" @click="isShowSelectionWindow = true">
+    <button v-if="!info.explanation.audioId" class="ui-button submit" @click="isShowSelectionWindow = true">
       <i class="iconfont icon-editor_add"></i>
       添加音频
     </button>
     <template v-else>
       <div class="music-display" @click.self="onClickCurrentMusic">
-        <Audio ref="my-audio" class="audio-control" :backgroundColor="'#1A1B1D'" :myAudioUrl="audioUrl"></Audio>
-        <div class="name" v-title="audioName" @click="onClickCurrentMusic">{{audioName}}</div>
+        <Audio ref="my-audio" class="audio-control" :backgroundColor="'#1A1B1D'" :myAudioUrl="info.explanation.audioUrl"></Audio>
+        <div class="name" v-title="info.explanation.audioName" @click="onClickCurrentMusic">{{info.explanation.audioName}}</div>
         <i class="iconfont icon-editor_list_delete" @click.stop="onClickDeleteMusicBtn"></i>
       </div>
       <button class="ui-button" @click="isShowSelectionWindow = true">
@@ -23,11 +22,11 @@
 
     <div class="switch-wrapper">
       <span class="label">默认开启</span>
-      <Switcher :value="1"></Switcher>
+      <Switcher :value="info.explanation.openByDefault" @change="info.explanation.openByDefault = !info.explanation.openByDefault"></Switcher>
     </div>
     <div class="switch-wrapper">
       <span class="label">循环播放</span>
-      <Switcher :value="1"></Switcher>
+      <Switcher :value="info.explanation.repeat" @change="info.explanation.repeat = !info.explanation.repeat"></Switcher>
     </div>
 
     <div class="dialog" style="z-index: 2000" v-if="isShowSelectionWindow">
@@ -43,6 +42,7 @@
 </template>
 
 <script>
+import { mapGetters } from "vuex";
 import Switcher from "@/components/shared/Switcher";
 import MaterialSelectorForEditor from "@/components/materialSelectorForEditor.vue";
 import Audio from "@/components/audio/audioForEditor.vue";
@@ -53,13 +53,14 @@ export default {
     MaterialSelectorForEditor,
     Audio,
   },
+  computed: {
+    ...mapGetters({
+        info: "info",
+    }),
+  },
   data() {
     return {
       isShowSelectionWindow: false,
-
-      audioId: '',
-      audioName: '',
-      audioUrl: '',
     }
   },
   methods: {
@@ -69,17 +70,28 @@ export default {
       }
     },
     onClickDeleteMusicBtn() {
-      this.audioId = ''
-      this.audioUrl = ''
-      this.audioName = ''
+      this.info.explanation.audioId = ''
+      this.info.explanation.audioUrl = ''
+      this.info.explanation.audioName = ''
     },
     handleSubmitFromMaterialSelector(selected) {
       this.isShowSelectionWindow = false
-      this.audioId = selected[0].id
-      this.audioName = selected[0].name
-      this.audioUrl = selected[0].ossPath
+      this.info.explanation.audioId = selected[0].id
+      this.info.explanation.audioName = selected[0].name
+      this.info.explanation.audioOssPath = selected[0].ossPath
     },
-  }
+  },
+  created() {
+    if (!this.info.explanation) {
+      this.$set(this.info, 'explanation', {
+        audioId: '',
+        audioName: '',
+        audioUrl: '',
+        openByDefault: true,
+        repeat: true,
+      })
+    }
+  },
 }
 </script>
 

packages/code/src/views/screen/Setting.vue

@@ -20,7 +20,7 @@ export default {
     }
   },
   mounted(){
-    this.$bus.on('initView',data=>{
+    this.$bus.on('initView', data => {
       this.initImg = data
     })
   }

packages/code/src/views/screen/index.vue

@@ -15,7 +15,7 @@
   </div>
 </template>
 <script>
-import Setting from "./Setting";
+import Setting from "./Setting.vue";
 import Core from "@/framework/core/core-v1.2.vue";
 import Toolbar from "@/framework/Toolbar.vue";