update

src/assets/styles/prosemirror.scss

@@ -7,7 +7,7 @@
   font-family: '微软雅黑';
 
   ::selection {
-    background-color: rgba(27, 110, 232, 0.3);
+    background-color: rgba(#41464b, 0.3);
     color: inherit;
   }
 

src/views/Editor/Canvas/hooks/useDropImageOrText.ts

@@ -1,8 +1,13 @@
-import { onMounted, onUnmounted, Ref } from 'vue'
+import { computed, onMounted, onUnmounted, Ref } from 'vue'
+import { useStore } from 'vuex'
+import { State } from '@/store'
 import { getImageDataURL } from '@/utils/image'
 import useCreateElement from '@/hooks/useCreateElement'
 
 export default (elementRef: Ref<HTMLElement | null>) => {
+  const store = useStore<State>()
+  const disableHotkeys = computed(() => store.state.disableHotkeys)
+
   const { createImageElement } = useCreateElement()
 
   const handleDrop = (e: DragEvent) => {
@@ -17,6 +22,7 @@ export default (elementRef: Ref<HTMLElement | null>) => {
     }
     else if(dataTransferItem.kind === 'string' && dataTransferItem.type === 'text/plain') {
       dataTransferItem.getAsString(text => {
+        if(disableHotkeys.value) return
         console.log(text)
       })
     }

src/views/components/element/TextElement/index.vue

@@ -120,6 +120,11 @@ export default defineComponent({
       editorView.dom.innerHTML = textContent.value
     })
 
+    const editable = computed(() => !props.elementInfo.lock)
+    watch(editable, () => {
+      editorView.setProps({ editable: () => editable.value })
+    })
+
     onMounted(() => {
       editorView = initProsemirrorEditor((editorViewRef.value as Element), textContent.value, {
         handleDOMEvents: {
@@ -127,6 +132,7 @@ export default defineComponent({
           blur: handleBlur,
           keydown: handleInput,
         },
+        editable: () => editable.value,
       })
     })
     onUnmounted(() => {