From aade1445bcdd7c3aeb05275be68f7f771ada1085 Mon Sep 17 00:00:00 2001
From: hlwwlh <geekcarl@gmail.com>
Date: Sun, 19 Jul 2020 13:54:11 +0000
Subject: [PATCH] fix: right click menu visable bug

---
 .../CodemirrorEditor/rightClickMenu.vue         |  9 ---------
 src/store/index.js                              | 17 ++++++++++++++++-
 src/view/CodemirrorEditor.vue                   |  6 +++---
 3 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/src/components/CodemirrorEditor/rightClickMenu.vue b/src/components/CodemirrorEditor/rightClickMenu.vue
index cd3ec0a..2ca6152 100644
--- a/src/components/CodemirrorEditor/rightClickMenu.vue
+++ b/src/components/CodemirrorEditor/rightClickMenu.vue
@@ -71,15 +71,6 @@ export default {
             return false;
         },
     },
-    watch: {
-        value(newVal) {
-            if (newVal) {
-                document.body.addEventListener('click', this.closeCB.bind(this));
-            } else {
-                document.body.removeEventListener('click', this.closeCB.bind(this));
-            }
-        }
-    },
 }
 </script>
 
diff --git a/src/store/index.js b/src/store/index.js
index 0d350e6..cf5d070 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -23,7 +23,8 @@ const state = {
     currentSize: '',
     currentColor: '',
     citeStatus: 0,
-    nightMode: false
+    nightMode: false,
+    rightClickMenuVisible:false
 };
 const mutations = {
     setEditorValue(state, data) {
@@ -51,6 +52,9 @@ const mutations = {
         state.currentColor = data;
         localStorage.setItem('color', data)
     },
+    setRightClickMenuVisible(state,data){
+        state.rightClickMenuVisible = data;
+    },
     themeChanged(state) {
         state.nightMode = !state.nightMode;
     },
@@ -93,6 +97,17 @@ const mutations = {
             const doc = formatDoc(DEFAULT_CONTENT)
             state.editor.setValue(doc)
         }
+
+        state.editor.on("cursorActivity",function(){
+            state.rightClickMenuVisible = false
+        });
+        state.editor.on("blur",function(){
+            state.rightClickMenuVisible = false
+        });
+        state.editor.on("scroll",function(){
+            state.rightClickMenuVisible = false
+        });
+
     },
     initCssEditorEntity(state) {
         state.cssEditor = CodeMirror.fromTextArea(
diff --git a/src/view/CodemirrorEditor.vue b/src/view/CodemirrorEditor.vue
index 0489f7a..4d2ef9f 100644
--- a/src/view/CodemirrorEditor.vue
+++ b/src/view/CodemirrorEditor.vue
@@ -82,7 +82,6 @@ export default {
             showCssEditor: false,
             aboutDialogVisible: false,
             dialogFormVisible: false,
-            rightClickMenuVisible: false,
             isCoping: false,
             isImgLoading: false,
             backLight: false,
@@ -107,7 +106,8 @@ export default {
             cssEditor: state=> state.cssEditor,
             currentSize: state=> state.currentSize,
             currentColor: state=> state.currentColor,
-            nightMode: state=> state.nightMode
+            nightMode: state=> state.nightMode,
+            rightClickMenuVisible: state=> state.rightClickMenuVisible
         })
     },
     created() {
@@ -267,7 +267,7 @@ export default {
             const left = e.clientX - offsetLeft;
             this.mouseLeft = Math.min(maxLeft, left);
             this.mouseTop = e.clientY + 10;
-            this.rightClickMenuVisible = true;
+            this.$store.commit('setRightClickMenuVisible', true);
         },
         onMenuEvent(type, info = {}) {
             switch (type) {