Browse Source

fix: store richtext expanded width and height

pull/9766/head
DarkPhoenix2704 3 weeks ago
parent
commit
63745671ee
  1. 44
      packages/nc-gui/components/cell/TextArea.vue

44
packages/nc-gui/components/cell/TextArea.vue

@ -224,19 +224,45 @@ watch([widthTextArea, heightTextArea], () => {
} }
}) })
const updateSize = () => {
const size = localStorage.getItem(STORAGE_KEY)
let elem = document.querySelector('.nc-text-area-expanded') as HTMLElement
if (isRichMode.value) {
elem = document.querySelector('.nc-long-text-expanded-modal .nc-textarea-rich-editor .tiptap') as HTMLElement
}
if (size && elem) {
elem.style.width = `${JSON.parse(size).width}px`
elem.style.height = `${JSON.parse(size).height}px`
}
}
watch([isVisible, inputRef], (value) => { watch([isVisible, inputRef], (value) => {
if (value) { const observer = new ResizeObserver((entries) => {
const size = localStorage.getItem(STORAGE_KEY) for (const entry of entries) {
let elem = document.querySelector('.nc-text-area-expanded') as HTMLElement const { width, height } = entry.contentRect
if (isRichMode.value) { if (!isVisible.value) {
elem = document.querySelector('.nc-long-text-expanded-modal .nc-textarea-rich-editor .tiptap') as HTMLElement return
}
localStorage.setItem(STORAGE_KEY, JSON.stringify({ width, height }))
} }
})
if (size && elem) { if (value) {
elem.style.width = `${JSON.parse(size).width}px` if (isRichMode.value) {
elem.style.height = `${JSON.parse(size).height}px` setTimeout(() => {
observer.observe(document.querySelector('.nc-long-text-expanded-modal .nc-textarea-rich-editor .tiptap') as HTMLElement)
updateSize()
}, 50)
} else {
updateSize()
} }
} else {
observer.disconnect()
} }
}) })
</script> </script>
@ -406,7 +432,7 @@ watch([isVisible, inputRef], (value) => {
<a-textarea <a-textarea
ref="inputRef" ref="inputRef"
v-model:value="vModel" v-model:value="vModel"
class="nc-text-area-expanded !py-1 !px-3 !text-black !cursor-text !min-h-[210px] !rounded-lg focus:border-brand-500 disabled:!bg-gray-50 nc-longtext-scrollbar" class="nc-text-area-expanded !py-1 !px-3 !text-black !transition-none !cursor-text !min-h-[210px] !rounded-lg focus:border-brand-500 disabled:!bg-gray-50 nc-longtext-scrollbar"
:placeholder="$t('activity.enterText')" :placeholder="$t('activity.enterText')"
:style="{ resize: 'both' }" :style="{ resize: 'both' }"
:disabled="readOnly" :disabled="readOnly"

Loading…
Cancel
Save