diff --git a/src/components/input/editor.vue b/src/components/input/editor.vue index e4fe87a0c..c2a01b91a 100644 --- a/src/components/input/editor.vue +++ b/src/components/input/editor.vue @@ -25,44 +25,6 @@

- - diff --git a/src/components/input/editor/TipTap.vue b/src/components/input/editor/TipTap.vue index 234a7759d..1bcbda36a 100644 --- a/src/components/input/editor/TipTap.vue +++ b/src/components/input/editor/TipTap.vue @@ -70,6 +70,29 @@ ref="uploadInputRef" @change="addImage" /> + + + + {{ $t('misc.save') }} + @@ -109,13 +132,14 @@ import suggestionSetup from './suggestion' // load all highlight.js languages import {lowlight} from 'lowlight' -import type {UploadCallback} from './types' +import type {BottomAction, UploadCallback} from './types' import type {ITask} from '@/modelTypes/ITask' import type {IAttachment} from '@/modelTypes/IAttachment' import AttachmentModel from '@/models/attachment' import AttachmentService from '@/services/attachment' import {useI18n} from 'vue-i18n' import BaseButton from '@/components/base/BaseButton.vue' +import XButton from '@/components/input/button.vue' const {t} = useI18n() @@ -140,15 +164,22 @@ const CustomTableCell = TableCell.extend({ }, }) + const { modelValue, uploadCallback, + isEditEnabled = true, + bottomActions = [], + showSave = false, } = defineProps<{ modelValue: string, uploadCallback?: UploadCallback, + isEditEnabled?: boolean, + bottomActions?: BottomAction[], + showSave?: boolean, }>() -const emit = defineEmits(['update:modelValue', 'change']) +const emit = defineEmits(['update:modelValue', 'save']) const inputHTML = ref('') watch( @@ -172,7 +203,7 @@ watch( ) function onImageAdded() { - bubbleChanges() + bubbleSave() loadImages() } @@ -211,11 +242,15 @@ function loadImages() { const debouncedInputHTML = refDebounced(inputHTML, 1000) -watch(debouncedInputHTML, () => bubbleChanges()) +watch(debouncedInputHTML, () => bubbleNow()) -function bubbleChanges() { +function bubbleNow() { emit('update:modelValue', TIPTAP_TEXT_VALUE_PREFIX + inputHTML.value) - emit('change', TIPTAP_TEXT_VALUE_PREFIX + inputHTML.value) // FIXME: remove this +} + +function bubbleSave() { + bubbleNow() + emit('save', TIPTAP_TEXT_VALUE_PREFIX + inputHTML.value) } const editor = useEditor({ @@ -302,9 +337,9 @@ function addImage() { if (!files || files.length === 0) { return } - + uploadAndInsertFiles(files) - + return } diff --git a/src/components/input/editor/types.ts b/src/components/input/editor/types.ts index 93429b72c..d9435897b 100644 --- a/src/components/input/editor/types.ts +++ b/src/components/input/editor/types.ts @@ -1 +1,6 @@ export type UploadCallback = (files: File[] | FileList) => Promise + +export interface BottomAction { + title: string + action: Function +}