zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

feat(settings): metadata (#699)

Browse source 
Co-authored-by: LittleSound <464388324@qq.com>
This commit is contained in:
三咲智子 Kevin Deng 2023-01-02 23:00:11 +08:00 • committed by GitHub
parent f942ddc5a3
commit c216c81bb7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 146 additions and 60 deletions
Download patch file Download diff file Expand all files Collapse all files

51
pages/settings/profile/appearance.vue
View file

@ -1,4 +1,5 @@
<script lang="ts" setup>
import type { UpdateCredentialsParams } from 'masto'
import { useForm } from 'slimeform'
definePageMeta({
@ -7,26 +8,34 @@ definePageMeta({
keepalive: false,
})
const acccount = $computed(() => currentUser.value?.account)
const account = $computed(() => currentUser.value?.account)
const onlineSrc = $computed(() => ({
avatar: acccount?.avatar || '',
header: acccount?.header || '',
avatar: account?.avatar || '',
header: account?.header || '',
}))
const { form, reset, submitter, dirtyFields, isError } = useForm({
form: () => ({
displayName: acccount?.displayName ?? '',
note: acccount?.source.note.replaceAll('\r', '') ?? '',
form: () => {
// For complex types of objects, a deep copy is required to ensure correct comparison of initial and modified values
const fieldsAttributes = Array.from({ length: 4 }, (_, i) => {
return { ...account?.fields?.[i] || { name: '', value: '' } }
})
return {
displayName: account?.displayName ?? '',
note: account?.source.note.replaceAll('\r', '') ?? '',
avatar: null as null | File,
header: null as null | File,
avatar: null as null | File,
header: null as null | File,
// These look more like account and privacy settings than appearance settings
// discoverable: false,
// bot: false,
// locked: false,
}),
fieldsAttributes,
// These look more like account and privacy settings than appearance settings
// discoverable: false,
// bot: false,
// locked: false,
}
},
})
watch(isMastoInitialised, async (val) => {
@ -41,7 +50,7 @@ watch(isMastoInitialised, async (val) => {
const isCanSubmit = computed(() => !isError.value && !isEmptyObject(dirtyFields.value))
const { submit, submitting } = submitter(async ({ dirtyFields }) => {
const res = await useMasto().accounts.updateCredentials(dirtyFields.value)
const res = await useMasto().accounts.updateCredentials(dirtyFields.value as UpdateCredentialsParams)
.then(account => ({ account }))
.catch((error: Error) => ({ error }))
@ -51,7 +60,7 @@ const { submit, submitting } = submitter(async ({ dirtyFields }) => {
return
}
setAccountInfo(acccount!.id, res.account)
setAccountInfo(account!.id, res.account)
reset()
})
</script>
@ -108,6 +117,18 @@ const { submit, submitting } = submitter(async ({ dirtyFields }) => {
<textarea v-model="form.note" maxlength="500" min-h-10ex input-base />
</label>
<!-- metadata -->
<div space-y-2>
<div font-medium>
Profile metadata
</div>
<div text-sm text-secondary>
You can have up to 4 items displayed as a table on your profile
</div>
<SettingsProfileMetadata v-if="isHydrated" v-model:form="form" />
</div>
<!-- submit -->
<div text-right>
<button