ayanova/src/views/ay-report-edit.vue

@@ -112,6 +112,7 @@ import * as monaco from "monaco-editor";
 
 const FORM_KEY = "ay-report-edit";
 let JUST_DELETED = false;
+let editor = null;
 export default {
   async created() {
     let vm = this;
@@ -173,20 +174,21 @@ export default {
       "javascript"
     );
     //Create the editor itself
-    vm.editor = monaco.editor.create(document.getElementById("editContainer"), {
+    editor = monaco.editor.create(document.getElementById("editContainer"), {
       model: vm.editData.template.model
     });
     //save the initial state because we're going to move away from it immediately
-    vm.editData.template.state = vm.editor.saveViewState();
+    vm.editData.template.state = editor.saveViewState();
     vm.showEditor = false;
   },
   beforeDestroy() {
-    this.editor && this.editor.dispose();
+    //dispose all models and editor
+    editor && editor.dispose();
   },
 
   data() {
     return {
-      editor: null,
+      //editor: null,
       editAreaHeight: 300,
       activeTab: "properties",
       lastTab: "properties",
@@ -257,8 +259,8 @@ Handlebars.registerHelper('loud', function (aString) {
     onViewChange() {
       let vm = this;
 
-      let currentState = vm.editor.saveViewState();
-      let currentModel = vm.editor.getModel();
+      let currentState = editor.saveViewState();
+      let currentModel = editor.getModel();
       // debugger;
       //save edit state before switching
       switch (vm.lastTab) {
@@ -285,28 +287,28 @@ Handlebars.registerHelper('loud', function (aString) {
           vm.showEditor = false;
           break;
         case "template":
-          vm.editor.setModel(vm.editData.template.model);
-          vm.editor.restoreViewState(vm.editData.template.state);
+          editor.setModel(vm.editData.template.model);
+          editor.restoreViewState(vm.editData.template.state);
           vm.showEditor = true;
-          vm.editor.focus();
+          editor.focus();
           break;
         case "style":
-          vm.editor.setModel(vm.editData.style.model);
-          vm.editor.restoreViewState(vm.editData.style.state);
+          editor.setModel(vm.editData.style.model);
+          editor.restoreViewState(vm.editData.style.state);
           vm.showEditor = true;
-          vm.editor.focus();
+          editor.focus();
           break;
         case "jsPrerender":
-          vm.editor.setModel(vm.editData.jsPrerender.model);
-          vm.editor.restoreViewState(vm.editData.jsPrerender.state);
+          editor.setModel(vm.editData.jsPrerender.model);
+          editor.restoreViewState(vm.editData.jsPrerender.state);
           vm.showEditor = true;
-          vm.editor.focus();
+          editor.focus();
           break;
         case "jsHelpers":
-          vm.editor.setModel(vm.editData.jsHelpers.model);
-          vm.editor.restoreViewState(vm.editData.jsHelpers.state);
+          editor.setModel(vm.editData.jsHelpers.model);
+          editor.restoreViewState(vm.editData.jsHelpers.state);
           vm.showEditor = true;
-          vm.editor.focus();
+          editor.focus();
           break;
       }
       vm.lastTab = vm.activeTab;
@@ -316,8 +318,8 @@ Handlebars.registerHelper('loud', function (aString) {
       //https://github.com/Microsoft/monaco-editor/issues/28
       let el = document.getElementById("editContainer");
       el.style = `width:100%;height:${window.innerHeight * 0.77}px`;
-      if (this.editor != null) {
-        this.editor.layout();
+      if (editor != null) {
+        editor.layout();
       }
     },
     canSave: function() {