SevicheCC/Seigwai
1
0
Fork 0
mirror of https://codeberg.org/Sevichecc/Seigwai.git synced 2025-04-30 07:49:30 +08:00
Code Issues Projects Releases Packages Wiki Activity

fix: cannot edit existed url

Browse source
This commit is contained in:
Seviche CC 2023-03-29 20:22:53 +08:00
parent c13b7b5b76
commit 8dcd44f1be
Signed by: SevicheCC
GPG key ID: C577000000000000
1 changed files with 20 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/components/Tiptap/BubbleMenu.vue
View file

@ -10,33 +10,33 @@ const showUrlInput = ref(false)
const inputUrl = ref<HTMLInputElement | null>(null)
const openLinkInput = () => {
url.value = editor.getAttributes('link').href || ''
showUrlInput.value = true
nextTick(() =>
inputUrl.value?.focus(),
)
nextTick(() => inputUrl.value?.focus())
}
const setLink = () => {
const previousUrl = editor.getAttributes('link').href
if (previousUrl)
inputUrl.value = previousUrl
// cancelled
if (url.value === null)
return
if (url.value === '') {
editor.chain().focus().extendMarkRange('link').unsetAllMarks().run()
if (url.value === null) {
showUrlInput.value = false
return
}
// empty
if (url.value === '') {
editor.chain().focus().extendMarkRange('link').unsetLink().run()
showUrlInput.value = false
return
}
// unpdate link
editor
.chain()
.focus()
.extendMarkRange('link')
.setLink({ href: url.value })
.run()
showUrlInput.value = false
}
</script>
@ -90,7 +90,9 @@ const setLink = () => {
>
<span
:class="[
editor.isActive('blockquote') ? 'i-tabler-quote-off' : 'i-tabler-quote',
editor.isActive('blockquote')
? 'i-tabler-quote-off'
: 'i-tabler-quote',
]"
/>
</button>
@ -106,18 +108,15 @@ const setLink = () => {
/>
</button>
</div>
<div
v-show="showUrlInput"
class="input-group input-group-sm border-slate-300 border-1"
>
<div v-show="showUrlInput" class="input-group input-group-sm">
<input
ref="inputUrl"
v-model.trim="url"
class="input input-sm focus:outline-none"
placeholder="Add Link to text"
@blur="showUrlInput = false"
@blur="setLink"
>
<button class="btn btn-sm btn-square" @click="setLink">
<button class="btn btn-sm btn-square">
<span class="i-tabler-link p-2" />
</button>
</div>