teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

fix(publish): expand state

Browse source
This commit is contained in:
三咲智子 2022-11-29 19:57:05 +08:00
parent 653536d4dd
commit ab07165475
No known key found for this signature in database
GPG key ID: 69992F2250DFD93E
1 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
components/publish/PublishWidget.vue
View file

@ -22,7 +22,8 @@ const {
let { draft, isEmpty } = $(useDraft(draftKey, initial)) let { draft, isEmpty } = $(useDraft(draftKey, initial))
let isSending = $ref(false) let isSending = $ref(false)
let isExpanded = $ref(!isEmpty || _expanded) let isExpanded = $ref(false)
const shouldExpanded = $computed(() => _expanded || isExpanded || !isEmpty)
const { editor } = useTiptap({ const { editor } = useTiptap({
content: computed({ content: computed({
@ -30,7 +31,7 @@ const { editor } = useTiptap({
set: newVal => draft.params.status = newVal, set: newVal => draft.params.status = newVal,
}), }),
placeholder: draft.placeholder, placeholder: draft.placeholder,
autofocus: isExpanded, autofocus: shouldExpanded,
onSubmit: publish, onSubmit: publish,
onFocus() { isExpanded = true }, onFocus() { isExpanded = true },
onPaste: handlePaste, onPaste: handlePaste,
@ -177,9 +178,9 @@ const { isOverDropZone } = useDropZone(dropZoneRef, onDrop)
<EditorContent <EditorContent
:editor="editor" :editor="editor"
flex flex
:class="isExpanded ? 'min-h-120px max-h-720px of-y-auto' : ''" :class="shouldExpanded ? 'min-h-120px max-h-720px of-y-auto' : ''"
/> />
<div v-if="isExpanded" absolute right-0 bottom-0 pointer-events-none text-sm text-secondary-light> <div v-if="shouldExpanded" absolute right-0 bottom-0 pointer-events-none text-sm text-secondary-light>
{{ characterLimit - editor?.storage.characterCount.characters() }} {{ characterLimit - editor?.storage.characterCount.characters() }}
</div> </div>
</div> </div>
@ -198,7 +199,7 @@ const { isOverDropZone } = useDropZone(dropZoneRef, onDrop)
</div> </div>
<div <div
v-if="isExpanded" flex="~ gap-2" m="l--1" pt-2 v-if="shouldExpanded" flex="~ gap-2" m="l--1" pt-2
border="t base" border="t base"
> >
<CommonTooltip placement="bottom" :content="$t('tooltip.add_media')"> <CommonTooltip placement="bottom" :content="$t('tooltip.add_media')">