♻️ Interactive v2 #1

Merged
LittleSheep merged 30 commits from refactor/v2 into master 2024-03-16 08:22:25 +00:00
2 changed files with 10 additions and 4 deletions
Showing only changes of commit 4d593fa20a - Show all commits

View File

@ -3,7 +3,7 @@
:is="props.brief ? RouterLink : 'div'" :is="props.brief ? RouterLink : 'div'"
:to="{ name: 'posts.details.moments', params: { alias: props.item?.alias } }" :to="{ name: 'posts.details.moments', params: { alias: props.item?.alias } }"
> >
<article class="prose prose-moment" v-html="parseContent(props.item?.content ?? '')" /> <article class="prose prose-moment max-w-none" v-html="parseContent(props.item?.content ?? '')" />
</component> </component>
</template> </template>

View File

@ -21,10 +21,10 @@
<h2 class="px-2 mb-1">Media list</h2> <h2 class="px-2 mb-1">Media list</h2>
<v-card variant="tonal"> <v-card variant="tonal">
<v-list> <v-list>
<v-list-item v-for="item in props.value" :title="getFileName(item)"> <v-list-item v-for="(item, idx) in props.value" :title="getFileName(item)">
<template #subtitle> {{ getFileType(item) }} · {{ formatBytes(item.filesize) }} </template> <template #subtitle> {{ getFileType(item) }} · {{ formatBytes(item.filesize) }} </template>
<template #append> <template #append>
<v-btn icon="mdi-delete" size="small" variant="text" color="error" /> <v-btn icon="mdi-delete" size="small" variant="text" color="error" @click="detach(idx)" />
</template> </template>
</v-list-item> </v-list-item>
</v-list> </v-list>
@ -66,7 +66,7 @@ async function upload(file?: any) {
headers: { Authorization: `Bearer ${getAtk()}` }, headers: { Authorization: `Bearer ${getAtk()}` },
body: data body: data
}) })
let meta: any; let meta: any
if (res.status !== 200) { if (res.status !== 200) {
error.value = await res.text() error.value = await res.text()
} else { } else {
@ -78,6 +78,12 @@ async function upload(file?: any) {
return meta return meta
} }
function detach(idx: number) {
const media = JSON.parse(JSON.stringify(props.value))
media.splice(idx)
emits("update:value", media)
}
defineExpose({ upload }) defineExpose({ upload })
function getFileName(item: any) { function getFileName(item: any) {