feat：.

packages/qjkankan-editor/src/Store/modules/base.js

@@ -1,6 +1,7 @@
 import Vue from "vue";
 import { i18n } from "@/lang";
 import { saveBaseWorkInfo } from "@/api";
+import { deepClone, isSameObject } from "@/utils/other.js";
 import { $waiting } from "@/components/shared/loading";
 let vue = new Vue();
 export default {
@@ -332,7 +333,7 @@ export default {
             $waiting.hide();
             // this.getInfo();
             // this.$store.commit("UpdateIsShowState", true);
-            this.commit("TakeInfoSnapShotAtSave");
+            // this.commit("TakeInfoSnapShotAtSave");
             resolve(res);
           },
           (rej) => {

packages/qjkankan-editor/src/components/dragTree/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div v-if="info">
     <!-- <div v-if="isRenaming">
       <input ref="rename" type="text" @blur="onInputNewNameComplete" v-model="inputData.name" />
     </div> -->
@@ -7,7 +7,7 @@
     <el-tree
       :highlight-current="true"
       ref="sceneTree"
-      :data="this.info.navigationTrees"
+      :data="info?.navigationTrees"
       :expand-on-click-node="false"
       node-key="id"
       class="custom-tree"

packages/qjkankan-editor/src/framework/EditorHead.vue

@@ -71,15 +71,17 @@ export default {
   mounted() {
     this.getSettingsInfo();
     this.$bus.on("canLoad", (data) => {
+      // console.error("canLoad", data);
       this.canLoad = data;
-      if (data) {
-        this.getInfo().then((res) => {
-          // getInfo里调用了后端接口，底层用了jquery的网络请求方法，为啥会导致promise嵌套没有展平，res拿到的不是promise 对象的resolve值而是promise对象本身？？？？
-          res.then(() => {
-            this.$store.commit("TakeInfoSnapShotAtSave");
-          });
-        });
-      }
+      // if (data) {
+        // this.getInfo().then((res) => {
+        //   // getInfo里调用了后端接口，底层用了jquery的网络请求方法，为啥会导致promise嵌套没有展平，res拿到的不是promise 对象的resolve值而是promise对象本身？？？？
+        //   res.then(() => {
+        //     // alert(1);
+        //     this.$store.commit("TakeInfoSnapShotAtSave");
+        //   });
+        // });
+      // }
     });
   },
   computed: {

packages/qjkankan-editor/src/framework/play/pano/components/new-list.vue

@@ -47,7 +47,7 @@
           <div class="swiper-wrapper second-group-wrapper">
             <div
               class="swiper-slide second-group-slide"
-              @click="tabSecond(item)"
+              @click="tabSecond(item, index)"
               v-if="item.children.length"
               v-for="(item, index) in info.navigationTrees[rootTabIndex].children"
               :class="{ active: currentSecondId == item.id, disabled: isLockV4Scene, loopspan: fixTitle(item.name).length > spanlength && currentSecondId == item.id }"
@@ -76,7 +76,7 @@
               loopspan: fixTitle(item.name).length > spanlength && currentRootId.id == item.id,
             }"
             v-for="(item, index) in info.navigationTrees"
-            @click="tabRoot(item)"
+            @click="tabRoot(item, index)"
           >
             <div class="root-group-content">
               <marquee-text :duration="Math.ceil(fixTitle(item.name).length / 10) * 5" :key="item.id" :repeat="1" v-if="fixTitle(item.name).length > spanlength && currentRootId == item.id">
@@ -113,6 +113,7 @@ export default {
       swiperOptions: {
         slidesPerView: "auto",
         centeredSlides: true,
+        slideToClickedSlide: true,
         centerInsufficientSlides: true,
         centeredSlidesBounds: true,
         freeMode: {
@@ -163,6 +164,7 @@ export default {
     ...mapGetters({
       info: "base/baseInfo",
       currentScene: "scene/currentScene",
+      sceneList: "base/sceneList",
       currentScenesList: "scene/currentScenesList",
       currentSecondId: "navigation/currentSecondId",
       currentRootId: "navigation/currentRootId",
@@ -202,22 +204,40 @@ export default {
       return name;
     },
 
-    tabRoot(item) {
+    tabRoot(item, index) {
       this.$store.commit("navigation/setData", { currentRootId: item.id, currentSecondId: null });
+      // this.handlerCurrent();
       this.changeSceneList();
+      this.$nextTick(() => {
+        // this.rootGroupSwiper.slideTo(index);
+      });
     },
-    tabSecond(item) {
+    tabSecond(item, index) {
       this.$store.commit("navigation/setData", { currentSecondId: item.id });
       let sceneList = this.info.navigationTrees[this.rootTabIndex].children[this.secondTabIndex].children;
       // console.error(sceneList.length)
       this.$store.commit("scene/setCurrentScenesList", sceneList);
-      // this.changeSceneList();
+      this.$nextTick(() => {
+        this.rootGroupSwiper.slideTo(index);
+      });
     },
     changeSceneList() {
       let currentList = null;
 
       if (this.info.navigationTrees[this.rootTabIndex].children.length && this.info.navigationTrees[this.rootTabIndex].children[0].type == "group") {
         this.$store.commit("navigation/setData", { currentSecondId: this.info.navigationTrees[this.rootTabIndex].children[0].id });
+
+        //如果有当前视图则选择二级目录
+        this.info.navigationTrees[this.rootTabIndex].children.forEach((item, index) => {
+          if (item.children.length) {
+            item.children.forEach((t_item, t_index) => {
+              if (t_item.id == this.currentScene.id || (t_item.sid && this.currentScene.sid && t_item.sid == this.currentScene.sid)) {
+                this.$store.commit("navigation/setData", { currentSecondId: item.id });
+              }
+            });
+          }
+        });
+
         currentList = this.info.navigationTrees[this.rootTabIndex].children[this.secondTabIndex].children;
         this.$store.commit("scene/setCurrentScenesList", currentList);
       }
@@ -237,6 +257,17 @@ export default {
         }
       });
     },
+    handlerCurrent() {
+      this.$nextTick(() => {
+        this.SecondGroupSwiper.slideTo(this.secondTabIndex);
+        let sceneIndex = this.currentScenesList.findIndex((item) => {
+          return item.id == this.currentScene.id || (item.sid && this.currentScene.sid && item.sid == this.currentScene.sid);
+        });
+        if (sceneIndex >= 0) {
+          this.SceneSwiper.slideTo(this.sceneIndex);
+        }
+      });
+    },
     initSceneSwiper() {
       if (this.SceneSwiper) {
         this.SceneSwiper.destroy();
@@ -246,6 +277,14 @@ export default {
         return;
       }
       this.SceneSwiper = new Swiper(".scene-list", this.swiperOptions);
+      this.$nextTick(() => {
+        let sceneIndex = this.currentScenesList.findIndex((item) => {
+          return item.id == this.currentScene.id || (item.sid && this.currentScene.sid && item.sid == this.currentScene.sid);
+        });
+        if (sceneIndex >= 0) {
+          this.SceneSwiper.slideTo(sceneIndex);
+        }
+      });
     },
 
     tabCurrentScene(data, index) {
@@ -259,6 +298,11 @@ export default {
         this.SecondGroupSwiper = null;
       }
       this.SecondGroupSwiper = new Swiper(".second-group-list", this.swiperOptions);
+      this.$nextTick(() => {
+        if (this.secondTabIndex >= 0) {
+          this.SecondGroupSwiper.slideTo(this.secondTabIndex);
+        }
+      });
     },
 
     tabCurrentSecondGroup(data, index) {
@@ -273,6 +317,11 @@ export default {
         this.rootGroupSwiper = null;
       }
       this.rootGroupSwiper = new Swiper(".root-group-list", this.swiperOptions);
+      this.$nextTick(() => {
+        if (this.rootTabIndex >= 0) {
+          this.rootGroupSwiper.slideTo(this.rootTabIndex);
+        }
+      });
     },
 
     tabCurrentRootGroup(data, index) {

packages/qjkankan-editor/src/pages/Edit.vue

@@ -14,7 +14,11 @@ export default {
     AppLayout,
   },
   computed: {
-    ...mapGetters(["isInfoChangedSinceSave"]),
+    // ...mapGetters(["isInfoChangedSinceSave"]),
+    ...mapGetters({
+      isInfoChangedSinceSave: "isInfoChangedSinceSave",
+      saveApiList: "scene/saveApiList",
+    }),
   },
   watch: {
     $route() {
@@ -80,18 +84,23 @@ export default {
     document.title = this.$i18n.t("gather.editpage_name");
     window.store = this.$store;
 
-    // window.addEventListener(
-    //   "beforeunload",
-    //   (e) => {
-    //     if (this.isInfoChangedSinceSave) {
-    //       e.preventDefault();
-    //       e.returnValue = "您有未保存的修改，仍要离开？"; // 如今的浏览器不会显示这条信息了。
-    //     }
-    //   },
-    //   {
-    //     capture: true,
-    //   }
-    // );
+    window.addEventListener(
+      "beforeunload",
+      (e) => {
+        // if (this.isInfoChangedSinceSave) {
+        //   e.preventDefault();
+        //   e.returnValue = "您有未保存的修改，仍要离开？"; // 如今的浏览器不会显示这条信息了。
+        // }
+      
+        if (this.saveApiList.length) {
+          e.preventDefault();
+          e.returnValue = "您有未保存的修改，仍要离开？"; // 如今的浏览器不会显示这条信息了。
+        }
+      },
+      {
+        capture: true,
+      }
+    );
     this.$store.dispatch("notice/getNotice");
   },
 };

packages/qjkankan-editor/src/views/base/index.vue

@@ -42,8 +42,9 @@ export default {
   watch: {
     newInfo: {
       handler(newVal, oldVal) {
-        if (JSON.stringify(newVal).length != JSON.stringify(oldVal).length && this.$route.name == "base") {
-          console.error("base change", JSON.stringify(newVal).length, JSON.stringify(oldVal).length);
+        if (newVal && this.$route.name == "base") {
+        // if (JSON.stringify(newVal).length != JSON.stringify(oldVal).length && this.$route.name == "base") {
+          console.error("base change");
           this.$store.commit("scene/setSaveApiList", "base");
         }
       },

packages/qjkankan-editor/src/views/explanation/explanationSettings.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="explanation-settings" app-border dir-left>
+  <div v-if="currentScene" class="explanation-settings" app-border dir-left>
     <template v-if="currentScene.type !== '4dkk' && currentExplanation">
       <div class="title">
         {{ $i18n.t("explanation.explanation_settings") }}
@@ -72,7 +72,7 @@ export default {
       workExplanationList: "explanation/workExplanationList",
     }),
     currentExplanation() {
-      return this.workExplanationList.find((item) => item.navigationId == this.currentScene.id ||  item.navigationId == this.currentScene.sid);
+      return this.workExplanationList.find((item) => item.navigationId == this.currentScene.id || item.navigationId == this.currentScene.sid);
     },
   },
   data() {

packages/qjkankan-editor/src/views/mask/setting.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="cover-panel">
+  <div v-if="currentScene" class="cover-panel">
     <template v-if="currentScene?.type !== '4dkk' && currentMask">
       <div class="title">
         {{ $i18n.t("edit_settings.mask_setting") }}

packages/qjkankan-editor/src/views/navigation/groupSettings.vue

@@ -57,14 +57,16 @@ export default {
   watch: {
     "info.navigationTrees": {
       // immediate: true,
-      handler: function (newVal) {
-        if (newVal && this.$route.name == "navigation") {
-          if (!this.isSave) {
-            console.error("navigationTrees change", this.isSave);
-            this.$store.commit("scene/setSaveApiList", "navigation");
-          } else {
-            this.$store.commit("navigation/setData", { isSave: false });
-          }
+      handler: function (newVal, oldVal) {
+        if (newVal && oldVal && this.$route.name == "navigation") {
+          // console.error("navigationTrees change", this.isSave);
+          this.$store.commit("scene/setSaveApiList", "navigation");
+          // if (!this.isSave && oldVal) {
+          //   console.error("navigationTrees change", this.isSave);
+          //   this.$store.commit("scene/setSaveApiList", "navigation");
+          // } else {
+          //   this.$store.commit("navigation/setData", { isSave: false });
+          // }
         }
       },
       deep: true,

packages/qjkankan-editor/src/views/navigation/initialSceneSettings.vue

@@ -4,10 +4,10 @@
       {{ $i18n.t("navigation.init_scene") }}
       <i class="iconfont icon-help_i tool-tip-for-editor" v-tooltip="$i18n.t('navigation.init_scene_tips')" />
     </div>
-    <img class="preview" v-if="info.firstScene" :src="info.firstScene.icon" alt="" />
+    <img class="preview" v-if="info?.firstScene" :src="info?.firstScene.icon" alt="" />
     <img class="placeholder" v-else src="@/assets/images/pano-image-placeholder.png" alt="" />
 
-    <div class="change-init" v-if="info.firstScene">
+    <div class="change-init" v-if="info?.firstScene">
       <button class="ui-button deepcancel" @click="deleteIndexInfo">
         {{ $i18n.t("navigation.delete_init_scene") }}
       </button>

packages/qjkankan-editor/src/views/screen/Setting.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="view-setting" app-border dir-left>
+  <div v-if="currentScene" class="view-setting" app-border dir-left>
     <div class="title">
       {{ $i18n.t("screen.init_screen") }}
       <i class="iconfont icon-help_i tool-tip-for-editor" v-tooltip="$i18n.t('screen.screen_tips')" />

packages/qjkankan-view/src/components/UIGather/list.vue

@@ -157,8 +157,15 @@ const showSecondTab = computed(() => {
 });
 
 const scenesListW = computed(() => currentScenesList.value.length * (swidth.value["swScenes"] + 10));
-const secondaryW = computed(() => metadata.value.navigationTrees[secondTabIndex.value].length * (swidth.value["swSecondary"] + 10));
-const catalogRootW = computed(() => metadata.value.navigationTrees.length * (swidth.value["swcatalogRoot"] + 10));
+
+const secondaryW = computed(() => {
+  let list = metadata.value?.navigationTrees[rootTabIndex.value].children.filter((item) => item.children.length);
+  return list.length * (swidth.value["swSecondary"] + 10) - 10;
+});
+const catalogRootW = computed(() => {
+  let list = metadata.value.navigationTrees.filter((item) => item.children.length);
+  return list.length * (swidth.value["swcatalogRoot"] + 10);
+});
 
 const innerW = computed(() => 1150);
 watch(
@@ -198,6 +205,7 @@ const fixTitle = (name) => {
 const swiperOptions = {
   slidesPerView: "auto",
   centeredSlides: true,
+  slideToClickedSlide: true,
   spaceBetween: 10,
   centerInsufficientSlides: true,
   centeredSlidesBounds: true,
@@ -210,26 +218,33 @@ const swiperOptions = {
 };
 
 const tabRoot = (item, index) => {
-  store.commit("scene/setData", { currentRootId: item.id });
-  store.commit("scene/setData", { currentSecondId: null });
-  changeSceneList();
+  store.commit("scene/setData", { currentRootId: item.id, currentSecondId: null });
   setTimeout(() => {
-    rootGroupSwiper.value.slideTo(index);
+    changeSceneList();
   }, 0);
 };
 const tabSecond = (item, index) => {
   store.commit("scene/setData", { currentSecondId: item.id });
   let sceneList = metadata.value.navigationTrees[rootTabIndex.value].children[secondTabIndex.value].children;
   store.commit("scene/setCurrentScenesList", sceneList);
-  setTimeout(() => {
-    SecondGroupSwiper.value.slideTo(index);
-  }, 0);
 };
 const changeSceneList = () => {
   let currentList = null;
 
   if (metadata.value.navigationTrees[rootTabIndex.value].children.length && metadata.value.navigationTrees[rootTabIndex.value].children[0].type == "group") {
     store.commit("scene/setData", { currentSecondId: metadata.value.navigationTrees[rootTabIndex.value].children[0].id });
+
+    //如果有当前视图则选择二级目录
+    metadata.value.navigationTrees[rootTabIndex.value].children.forEach((item, index) => {
+      if (item.children.length) {
+        item.children.forEach((t_item, t_index) => {
+          if (t_item.id == currentScene.value.id || (t_item.sid && currentScene.value.sid && t_item.sid == currentScene.value.sid)) {
+            store.commit("scene/setData", { currentSecondId: item.id });
+          }
+        });
+      }
+    });
+
     currentList = metadata.value.navigationTrees[rootTabIndex.value].children[secondTabIndex.value].children;
     store.commit("scene/setCurrentScenesList", currentList);
   }
@@ -240,10 +255,10 @@ const changeSceneList = () => {
     store.commit("scene/setCurrentScenesList", rootList.children);
   }
   nextTick(() => {
-    initSceneSwiper();
-    initRootGroupSwiper();
+    // initSceneSwiper();
+    // initRootGroupSwiper();
     if (metadata.value.navigationTrees[currentRootId.value]?.children[currentSecondId.value]?.type == "group") {
-      initSecondGroupSwiper();
+      // initSecondGroupSwiper();
     }
   });
 };
@@ -259,13 +274,16 @@ const initSceneSwiper = () => {
   nextTick(() => {
     SceneSwiper.value = new Swiper(".scene-list", swiperOptions);
     let index = currentScenesList.value.findIndex((item) => item.id == currentScene.value.id);
-    SceneSwiper.value.slideTo(index);
+
+    if (index >= 0) {
+      SceneSwiper.value.slideTo(index);
+    }
   });
 };
 const tabCurrentScene = (data, index) => {
   store.commit("scene/setCurrentScene", data);
 
-  SceneSwiper.value.slideTo(index);
+  // SceneSwiper.value.slideTo(index);
 };
 const initSecondGroupSwiper = () => {
   if (SecondGroupSwiper.value) {
@@ -275,7 +293,9 @@ const initSecondGroupSwiper = () => {
 
   nextTick(() => {
     SecondGroupSwiper.value = new Swiper(".second-group-list", swiperOptions);
-    SecondGroupSwiper.value.slideTo(secondTabIndex.value);
+    if (secondTabIndex.value >= 0) {
+      SecondGroupSwiper.value.slideTo(secondTabIndex.value);
+    }
   });
 };
 
@@ -296,15 +316,16 @@ const initRootGroupSwiper = () => {
 
   if (!rootGroupSwiper.value) {
     rootGroupSwiper.value = new Swiper(".root-group-list", swiperOptions);
-    rootGroupSwiper.value.slideTo(rootTabIndex.value);
+    if (rootTabIndex.value >= 0) {
+      rootGroupSwiper.value.slideTo(rootTabIndex.value);
+    }
     initSecondGroupSwiper();
   }
 };
 
 const tabCurrentRootGroup = (data, index) => {
   // store.commit("scene/setCurrentScene", data);
-
-  SecondGroupSwiper.value.slideTo(index);
+  // SecondGroupSwiper.value.slideTo(index);
 };
 
 onMounted(() => {

packages/qjkankan-view/src/components/UIGather/mobile/list.vue

@@ -159,8 +159,15 @@ const showSecondTab = computed(() => {
 });
 
 const scenesListW = computed(() => currentScenesList.value.length * (swidth.value["swScenes"] + 10) - 10);
-const secondaryW = computed(() => metadata.value?.navigationTrees[rootTabIndex.value].children.chilength * (swidth.value["swSecondary"] + 10) - 10);
-const catalogRootW = computed(() => metadata.value.navigationTrees.length * (swidth.value["swcatalogRoot"] + 10) - 10);
+const secondaryW = computed(() => {
+  let list = metadata.value?.navigationTrees[rootTabIndex.value].children.filter((item) => item.children.length);
+  return list.length * (swidth.value["swSecondary"] + 10) - 10;
+});
+
+const catalogRootW = computed(() => {
+  let list = metadata.value.navigationTrees.filter((item) => item.children.length);
+  return list.length * (swidth.value["swcatalogRoot"] + 10);
+});
 
 const innerW = computed(() => window.innerWidth);
 
@@ -202,6 +209,7 @@ const fixTitle = (name) => {
 const swiperOptions = {
   slidesPerView: "auto",
   centeredSlides: true,
+  slideToClickedSlide: true,
   spaceBetween: 10,
   centerInsufficientSlides: true,
   centeredSlidesBounds: true,
@@ -214,10 +222,10 @@ const tabRoot = (item, index) => {
   store.commit("scene/setData", { currentRootId: item.id });
   store.commit("scene/setData", { currentSecondId: null });
   changeSceneList();
-  setTimeout(() => {
-    rootGroupSwiper.value.slideTo(index);
-    SecondGroupSwiper.value.slideTo(rootTabIndex.value);
-  }, 0);
+  // setTimeout(() => {
+  //   rootGroupSwiper.value.slideTo(index);
+  //   SecondGroupSwiper.value.slideTo(rootTabIndex.value);
+  // }, 0);
 };
 const tabSecond = (item, index) => {
   store.commit("scene/setData", { currentSecondId: item.id });
@@ -226,9 +234,9 @@ const tabSecond = (item, index) => {
 
   //
 
-  setTimeout(() => {
-    SecondGroupSwiper.value.slideTo(index);
-  }, 0);
+  // setTimeout(() => {
+  //   SecondGroupSwiper.value.slideTo(index);
+  // }, 0);
 
   // changeSceneList();
 };
@@ -237,6 +245,17 @@ const changeSceneList = () => {
 
   if (metadata.value.navigationTrees[rootTabIndex.value].children.length && metadata.value.navigationTrees[rootTabIndex.value].children[0].type == "group") {
     store.commit("scene/setData", { currentSecondId: metadata.value.navigationTrees[rootTabIndex.value].children[0].id });
+    //如果有当前视图则选择二级目录
+    metadata.value.navigationTrees[rootTabIndex.value].children.forEach((item, index) => {
+      if (item.children.length) {
+        item.children.forEach((t_item, t_index) => {
+          if (t_item.id == currentScene.value.id || (t_item.sid && currentScene.value.sid && t_item.sid == currentScene.value.sid)) {
+            store.commit("scene/setData", { currentSecondId: item.id });
+          }
+        });
+      }
+    });
+
     currentList = metadata.value.navigationTrees[rootTabIndex.value].children[secondTabIndex.value].children;
     store.commit("scene/setCurrentScenesList", currentList);
   }
@@ -266,13 +285,15 @@ const initSceneSwiper = () => {
   nextTick(() => {
     SceneSwiper.value = new Swiper(".scene-list", swiperOptions);
     let index = currentScenesList.value.findIndex((item) => item.id == currentScene.value.id);
-    SceneSwiper.value.slideTo(index);
+    if (index >= 0) {
+      SceneSwiper.value.slideTo(index);
+    }
   });
 };
 const tabCurrentScene = (data, index) => {
   store.commit("scene/setCurrentScene", data);
 
-  SceneSwiper.value.slideTo(index);
+  // SceneSwiper.value.slideTo(index);
 };
 const initSecondGroupSwiper = () => {
   console.error("initSecondGroupSwiper");
@@ -283,7 +304,9 @@ const initSecondGroupSwiper = () => {
 
   nextTick(() => {
     SecondGroupSwiper.value = new Swiper(".second-group-list", swiperOptions);
-    SecondGroupSwiper.value.slideTo(secondTabIndex.value);
+    if (secondTabIndex.value >= 0) {
+      SecondGroupSwiper.value.slideTo(secondTabIndex.value);
+    }
   });
 };
 
@@ -304,7 +327,9 @@ const initRootGroupSwiper = () => {
 
   if (!rootGroupSwiper.value) {
     rootGroupSwiper.value = new Swiper(".root-group-list", swiperOptions);
-    rootGroupSwiper.value.slideTo(rootTabIndex.value);
+    if (rootGroupSwiper.value >= 0) {
+      rootGroupSwiper.value.slideTo(rootTabIndex.value);
+    }
     initSecondGroupSwiper();
   }
 };

packages/qjkankan-view/src/pages/show.js

@@ -4,22 +4,23 @@ import i18n, { getLocale, setI18nLanguage, loadLocaleMessages } from "../i18n";
 import Components from "@/global_components";
 import Show from "./show.vue";
 import { createApp } from "vue";
-import Checkbrowser from '@/components/assembly/Checkbrowser.vue'
+import Checkbrowser from "@/components/assembly/Checkbrowser.vue";
 import ClickOutSide from "../utils/fns/ClickOutSide";
 import ToolTip from "../utils/fns/ToolTip";
-import VueLazyLoad from 'vue3-lazyload'
+import VueLazyLoad from "vue3-lazyload";
 import browser from "../utils/browser";
 import Deferred from "@/utils/Deferred";
-import store from '../store'
+import store from "../store";
 import Toast from "vue-toastification";
 // Import the CSS or use your own!
 import "vue-toastification/dist/index.css";
 
+
 const options = {
-  transition: 'Vue-Toastification__bounce',
+  transition: "Vue-Toastification__bounce",
   maxToasts: 3,
   newestOnTop: true,
-  position: 'top-right',
+  position: "top-right",
   timeout: 2000,
   closeOnClick: true,
   pauseOnFocusLoss: true,
@@ -28,13 +29,11 @@ const options = {
   draggablePercent: 0.7,
   showCloseButtonOnHover: false,
   hideProgressBar: true,
-  closeButton: 'button',
+  closeButton: "button",
   icon: true,
-  rtl: false
+  rtl: false,
 };
 
-
-
 let App;
 if (
   browser.detectChrome() ||
@@ -51,12 +50,11 @@ if (
 ) {
   App = Show;
 } else {
-  App = Checkbrowser
+  App = Checkbrowser;
 }
 
 const local = getLocale();
 
-
 loadLocaleMessages(i18n, local).then(() => {
   setI18nLanguage(i18n, local);