SolarNetwork/FloatingIsland
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨ Click to goto pub profile

Browse Source
This commit is contained in:
LittleSheep
2025-11-08 14:02:29 +08:00
parent 23b1cb4a63
commit 8f6c5b01c6
1 changed files with 24 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
app/components/Post/PostHeader.vue
View File

@@ -1,10 +1,17 @@
<template> <template>
<div :class="['flex gap-3 items-center', { 'gap-2': compact }]"> <div :class="['flex gap-3 items-center', { 'gap-2': compact }]">
<v-avatar :image="publisherAvatar" :size="compact ? 24 : 40" :border="compact" /> <v-avatar
:image="publisherAvatar"
:size="compact ? 24 : 40"
:border="compact"
@click="router.push('/publishers/' + props.item.publisher.name)"
/>
<div class="grow flex flex-col"> <div class="grow flex flex-col">
<p v-if="compact" class="flex gap-1 items-baseline text-sm"> <p v-if="compact" class="flex gap-1 items-baseline text-sm">
<span class="font-bold">{{ props.item.publisher.nick }}</span> <span class="font-bold">{{ props.item.publisher.nick }}</span>
<span class="text-xs opacity-80">{{ DateTime.fromISO(props.item.createdAt).toRelative() }}</span> <span class="text-xs opacity-80">{{
DateTime.fromISO(props.item.createdAt).toRelative()
}}</span>
</p> </p>
<template v-else> <template v-else>
<p class="flex gap-1 items-baseline"> <p class="flex gap-1 items-baseline">
@@ -14,7 +21,9 @@
<p class="text-xs flex gap-1"> <p class="text-xs flex gap-1">
<span>{{ DateTime.fromISO(props.item.createdAt).toRelative() }}</span> <span>{{ DateTime.fromISO(props.item.createdAt).toRelative() }}</span>
<span class="font-bold">·</span> <span class="font-bold">·</span>
<span>{{ DateTime.fromISO(props.item.createdAt).toLocaleString() }}</span> <span>{{
DateTime.fromISO(props.item.createdAt).toLocaleString()
}}</span>
</p> </p>
</template> </template>
</div> </div>
@@ -22,14 +31,20 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { computed } from 'vue' import { computed } from "vue"
import { DateTime } from 'luxon' import { DateTime } from "luxon"
import type { SnPost } from '~/types/api'; import type { SnPost } from "~/types/api"
const props = withDefaults(defineProps<{ item: SnPost, compact?: boolean }>(), { compact: false }) const router = useRouter()
const apiBase = useSolarNetworkUrl(); const props = withDefaults(defineProps<{ item: SnPost; compact?: boolean }>(), {
compact: false
})
const apiBase = useSolarNetworkUrl()
const publisherAvatar = computed(() => const publisherAvatar = computed(() =>
props.item.publisher.picture ? `${apiBase}/drive/files/${props.item.publisher.picture.id}` : undefined, props.item.publisher.picture
? `${apiBase}/drive/files/${props.item.publisher.picture.id}`
: undefined
) )
</script> </script>