feat(notes): show loader on image upload button while uploading
This commit is contained in:
@@ -118,17 +118,23 @@ const { uploadImage } = useImageUpload({
|
|||||||
|
|
||||||
const fileInput = ref<HTMLInputElement | null>(null)
|
const fileInput = ref<HTMLInputElement | null>(null)
|
||||||
const editKey = ref(0)
|
const editKey = ref(0)
|
||||||
|
const isUploading = ref(false)
|
||||||
|
|
||||||
const onImagePicked = async (e: Event) => {
|
const onImagePicked = async (e: Event) => {
|
||||||
const input = e.target as HTMLInputElement
|
const input = e.target as HTMLInputElement
|
||||||
const file = input.files?.[0]
|
const file = input.files?.[0]
|
||||||
input.value = ""
|
input.value = ""
|
||||||
if (!file || !path.value) return
|
if (!file || !path.value) return
|
||||||
|
isUploading.value = true
|
||||||
|
try {
|
||||||
const result = await uploadImage(file)
|
const result = await uploadImage(file)
|
||||||
if (!result) return
|
if (!result) return
|
||||||
const suffix = rawContent.value.endsWith("\n") ? "" : "\n\n"
|
const suffix = rawContent.value.endsWith("\n") ? "" : "\n\n"
|
||||||
rawContent.value = `${rawContent.value}${suffix}\n`
|
rawContent.value = `${rawContent.value}${suffix}\n`
|
||||||
editKey.value++
|
editKey.value++
|
||||||
|
} finally {
|
||||||
|
isUploading.value = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const {
|
const {
|
||||||
@@ -298,10 +304,16 @@ const onBadgeClick = async () => {
|
|||||||
<button
|
<button
|
||||||
v-if="isMarkdown && mode === 'edit'"
|
v-if="isMarkdown && mode === 'edit'"
|
||||||
class="action button is-text is-light"
|
class="action button is-text is-light"
|
||||||
title="Upload image"
|
:title="isUploading ? 'Uploading…' : 'Upload image'"
|
||||||
|
:disabled="isUploading"
|
||||||
@click="fileInput?.click()"
|
@click="fileInput?.click()"
|
||||||
>
|
>
|
||||||
|
<span
|
||||||
|
v-if="isUploading"
|
||||||
|
class="loading loading-spinner loading-sm"
|
||||||
|
></span>
|
||||||
<svg
|
<svg
|
||||||
|
v-else
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
class="icon icon-tabler icon-tabler-photo-plus"
|
class="icon icon-tabler icon-tabler-photo-plus"
|
||||||
width="24"
|
width="24"
|
||||||
|
|||||||
Reference in New Issue
Block a user