feat(settings): support drop file on avatar&header

This commit is contained in:
三咲智子 Kevin Deng 2023-01-20 00:33:17 +08:00
parent eb966976db
commit 0f5476c190
No known key found for this signature in database
GPG key ID: 69992F2250DFD93E

View file

@ -1,7 +1,9 @@
<script lang="ts" setup>
import type { mastodon } from 'masto'
import { ofetch } from 'ofetch'
import { useForm } from 'slimeform'
import { parse } from 'ultrahtml'
import type { Component } from 'vue'
definePageMeta({
middleware: 'auth',
@ -15,6 +17,9 @@ useHeadFixed({
const { client } = $(useMasto())
const avatarInput = ref<any>()
const headerInput = ref<any>()
const account = $computed(() => currentUser.value?.account)
const onlineSrc = $computed(() => ({
@ -81,6 +86,15 @@ const refreshInfo = async () => {
reset()
}
useDropZone(avatarInput, (files) => {
if (files?.[0])
form.avatar = files[0]
})
useDropZone(headerInput, (files) => {
if (files?.[0])
form.header = files[0]
})
onHydrated(refreshInfo)
onReactivated(refreshInfo)
</script>
@ -98,6 +112,7 @@ onReactivated(refreshInfo)
<!-- banner -->
<div of-hidden bg="gray-500/20" aspect="3">
<CommonInputImage
ref="headerInput"
v-model="form.header"
:original="onlineSrc.header"
w-full h-full
@ -108,6 +123,7 @@ onReactivated(refreshInfo)
<!-- avatar -->
<div px-4 flex="~ gap4">
<CommonInputImage
ref="avatarInput"
v-model="form.avatar"
:original="onlineSrc.avatar"
mt--10