From ad98c0f2295f691727f05bc912a003f62aaae416 Mon Sep 17 00:00:00 2001
From: wanglin2 <1013335014@qq.com>
Date: Mon, 20 Nov 2023 15:15:38 +0800
Subject: [PATCH] =?UTF-8?q?Demo=EF=BC=9A=E4=BF=AE=E5=A4=8D=E5=8F=AA?=
 =?UTF-8?q?=E8=AF=BB=E6=A8=A1=E5=BC=8F=E4=B8=8B=E4=BB=8D=E6=97=A7=E5=8F=AF?=
 =?UTF-8?q?=E4=BB=A5=E6=9B=BF=E6=8D=A2=E5=92=8C=E7=BC=96=E8=BE=91=E5=A4=A7?=
 =?UTF-8?q?=E7=BA=B2=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/pages/Edit/components/NavigatorToolbar.vue |  7 +++----
 web/src/pages/Edit/components/Outline.vue          |  4 ++--
 web/src/pages/Edit/components/OutlineEdit.vue      |  4 ++--
 web/src/pages/Edit/components/Search.vue           |  6 +++---
 web/src/store.js                                   | 10 ++++++++--
 5 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/web/src/pages/Edit/components/NavigatorToolbar.vue b/web/src/pages/Edit/components/NavigatorToolbar.vue
index c8a764bc..9b0fbaa9 100644
--- a/web/src/pages/Edit/components/NavigatorToolbar.vue
+++ b/web/src/pages/Edit/components/NavigatorToolbar.vue
@@ -119,21 +119,20 @@ export default {
       version: pkg.version,
       langList,
       lang: '',
-      isReadonly: false,
       openMiniMap: false
     }
   },
   computed: {
-    ...mapState(['isDark'])
+    ...mapState(['isDark', 'isReadonly'])
   },
   created() {
     this.lang = getLang()
   },
   methods: {
-    ...mapMutations(['setIsDark']),
+    ...mapMutations(['setIsDark', 'setIsReadonly']),
 
     readonlyChange() {
-      this.isReadonly = !this.isReadonly
+      this.setIsReadonly(!this.isReadonly)
       this.mindMap.setMode(this.isReadonly ? 'readonly' : 'edit')
     },
 
diff --git a/web/src/pages/Edit/components/Outline.vue b/web/src/pages/Edit/components/Outline.vue
index 11b58824..234d60ef 100644
--- a/web/src/pages/Edit/components/Outline.vue
+++ b/web/src/pages/Edit/components/Outline.vue
@@ -24,7 +24,7 @@
     >
       <span
         class="nodeEdit"
-        contenteditable="true"
+        :contenteditable="!isReadonly"
         :key="getKey()"
         @keydown.stop="onNodeInputKeydown($event, node)"
         @keyup.stop
@@ -69,7 +69,7 @@ export default {
     }
   },
   computed: {
-    ...mapState(['isDark'])
+    ...mapState(['isDark', 'isReadonly'])
   },
   created() {
     window.addEventListener('keydown', this.onKeyDown)
diff --git a/web/src/pages/Edit/components/OutlineEdit.vue b/web/src/pages/Edit/components/OutlineEdit.vue
index c4b76049..2a8e5bac 100644
--- a/web/src/pages/Edit/components/OutlineEdit.vue
+++ b/web/src/pages/Edit/components/OutlineEdit.vue
@@ -32,7 +32,7 @@
           >
             <span
               class="nodeEdit"
-              contenteditable="true"
+              :contenteditable="!isReadonly"
               :key="getKey()"
               @blur="onBlur($event, node)"
               @keydown.stop="onNodeInputKeydown($event, node)"
@@ -76,7 +76,7 @@ export default {
     }
   },
   computed: {
-    ...mapState(['isOutlineEdit', 'isDark'])
+    ...mapState(['isOutlineEdit', 'isDark', 'isReadonly'])
   },
   watch: {
     isOutlineEdit(val) {
diff --git a/web/src/pages/Edit/components/Search.vue b/web/src/pages/Edit/components/Search.vue
index 5d4de10d..eb12101b 100644
--- a/web/src/pages/Edit/components/Search.vue
+++ b/web/src/pages/Edit/components/Search.vue
@@ -44,10 +44,10 @@
       }}</el-button>
     </el-input>
     <div class="btnList" v-if="showReplaceInput">
-      <el-button size="small" @click="replace">{{
+      <el-button size="small" :disabled="isReadonly" @click="replace">{{
         $t('search.replace')
       }}</el-button>
-      <el-button size="small" @click="replaceAll">{{
+      <el-button size="small" :disabled="isReadonly" @click="replaceAll">{{
         $t('search.replaceAll')
       }}</el-button>
     </div>
@@ -78,7 +78,7 @@ export default {
     }
   },
   computed: {
-    ...mapState(['isDark'])
+    ...mapState(['isDark', 'isReadonly'])
   },
   watch: {
     searchText() {
diff --git a/web/src/store.js b/web/src/store.js
index c9808b36..07ca1ac6 100644
--- a/web/src/store.js
+++ b/web/src/store.js
@@ -21,7 +21,8 @@ const store = new Vuex.Store({
     },
     activeSidebar: '', // 当前显示的侧边栏
     isDark: false,// 是否是暗黑模式
-    isOutlineEdit: false// 是否是大纲编辑模式
+    isOutlineEdit: false,// 是否是大纲编辑模式
+    isReadonly: false// 是否只读
   },
   mutations: {
     /**
@@ -75,7 +76,12 @@ const store = new Vuex.Store({
     // 设置大纲编辑模式
     setIsOutlineEdit(state, data) {
       state.isOutlineEdit = data
-    }
+    },
+
+    // 设置是否只读
+    setIsReadonly(state, data) {
+      state.isReadonly = data
+    },
   },
   actions: {
     /**