diff --git a/src/assets/styles/prosemirror.scss b/src/assets/styles/prosemirror.scss index 3867cbde..484d75d6 100644 --- a/src/assets/styles/prosemirror.scss +++ b/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; } diff --git a/src/views/Editor/Canvas/hooks/useDropImageOrText.ts b/src/views/Editor/Canvas/hooks/useDropImageOrText.ts index e5cfc3d8..e1b79ce1 100644 --- a/src/views/Editor/Canvas/hooks/useDropImageOrText.ts +++ b/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) => { + const store = useStore() + const disableHotkeys = computed(() => store.state.disableHotkeys) + const { createImageElement } = useCreateElement() const handleDrop = (e: DragEvent) => { @@ -17,6 +22,7 @@ export default (elementRef: Ref) => { } else if(dataTransferItem.kind === 'string' && dataTransferItem.type === 'text/plain') { dataTransferItem.getAsString(text => { + if(disableHotkeys.value) return console.log(text) }) } diff --git a/src/views/components/element/TextElement/index.vue b/src/views/components/element/TextElement/index.vue index 05b28ff2..585814dd 100644 --- a/src/views/components/element/TextElement/index.vue +++ b/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(() => {