💄 Post path optimization

This commit is contained in:
LittleSheep 2024-08-19 01:18:27 +08:00
parent ca253eb87b
commit b94e6906e1
8 changed files with 30 additions and 20 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<v-card :to="`/posts/${props.post.id}`" class="mx-[2.5ch] mb-3"> <v-card :to="url" class="mx-[2.5ch] mb-3">
<v-card-text> <v-card-text>
<div class="mb-3 flex flex-row gap-4"> <div class="mb-3 flex flex-row gap-4">
<v-avatar :image="post.author?.avatar" /> <v-avatar :image="post.author?.avatar" />
@ -68,4 +68,6 @@
<script setup lang="ts"> <script setup lang="ts">
const props = defineProps<{ post: any, forceShowContent?: boolean, noClickableAttachment?: boolean }>() const props = defineProps<{ post: any, forceShowContent?: boolean, noClickableAttachment?: boolean }>()
const config = useRuntimeConfig() const config = useRuntimeConfig()
const url = computed(() => props.post.alias ? `/posts/${props.post.area_alias}/${props.post.alias}` : `/posts/${props.post.id}`)
</script> </script>

View File

@ -10,7 +10,7 @@
"navPostsCaption": "Explore posts that posted by Solar Network users.", "navPostsCaption": "Explore posts that posted by Solar Network users.",
"navPostsCaptionWithTag": "Explore posts with tag {0}.", "navPostsCaptionWithTag": "Explore posts with tag {0}.",
"navPostsCaptionWithCategory": "Explore posts in category {0}.", "navPostsCaptionWithCategory": "Explore posts in category {0}.",
"navPostsCaptionWithRealm": "Explore posts in realm {0}.", "navPostsCaptionWithPublisher": "Explore posts posted by {0}.",
"indexIntroduce": "An energetic software company that create wonderful software which everyone love.", "indexIntroduce": "An energetic software company that create wonderful software which everyone love.",
"indexProductListHint": "See some of our products just there", "indexProductListHint": "See some of our products just there",
"indexActivities": "Activities", "indexActivities": "Activities",

View File

@ -10,7 +10,7 @@
"navPostsCaption": "探索整个 Solar Network 上的帖子。", "navPostsCaption": "探索整个 Solar Network 上的帖子。",
"navPostsCaptionWithTag": "探索带有 {0} 标签的帖子", "navPostsCaptionWithTag": "探索带有 {0} 标签的帖子",
"navPostsCaptionWithCategory": "探索被分类为 {0} 的帖子", "navPostsCaptionWithCategory": "探索被分类为 {0} 的帖子",
"navPostsCaptionWithRealm": "探索在领域 {0} 内的帖子", "navPostsCaptionWithPublisher": "探索 {0} 发表的帖子",
"indexIntroduce": "一家充满活力的软件公司,创造了人人喜爱的精彩软件。", "indexIntroduce": "一家充满活力的软件公司,创造了人人喜爱的精彩软件。",
"indexProductListHint": "在这里看看我们的一些产品", "indexProductListHint": "在这里看看我们的一些产品",
"indexActivities": "动态", "indexActivities": "动态",

View File

@ -94,10 +94,17 @@ const { t } = useI18n()
const { data: post } = await useFetch<any>(`${config.public.solarNetworkApi}/cgi/co/posts/${slug.value}`) const { data: post } = await useFetch<any>(`${config.public.solarNetworkApi}/cgi/co/posts/${slug.value}`)
if (!post.value) { if (!post.value) {
const { data: publisher } = await $fetch<any>(`${config.public.solarNetworkApi}/cgi/co/publishers/${route.params.id}`)
if (publisher) {
navigateTo(`/posts/publishers/${route.params.id}`)
}
throw createError({ throw createError({
statusCode: 404, statusCode: 404,
statusMessage: "Post Not Found", statusMessage: "Post Not Found",
}) })
} else if (post.value.alias) {
navigateTo(`/posts/${post.value.area_alias}/${post.value.alias}`)
} }
const title = computed(() => post.value.body?.title ? `${post.value.body?.title} from ${post.value.author.nick}` : `Post from ${post.value.author.nick}`) const title = computed(() => post.value.body?.title ? `${post.value.body?.title} from ${post.value.author.nick}` : `Post from ${post.value.author.nick}`)

View File

@ -2,10 +2,11 @@
<div> <div>
<div class="my-3" v-if="!route.query['no-title']"> <div class="my-3" v-if="!route.query['no-title']">
<h1 class="text-2xl">{{ route.query["title"] ?? t("navPosts") }}</h1> <h1 class="text-2xl">{{ route.query["title"] ?? t("navPosts") }}</h1>
<span>{{ route.query["caption"] ?? t("navPostsCaptionWithRealm", [`#${route.params.id}`]) }}</span> <span>{{ route.query["caption"] ?? t("navPostsCaptionWithPublisher", [publisher.data.name]) }}</span>
</div> </div>
<post-list class="mx-[-2.5ch]" :realm-id="parseInt(route.params.id?.toString())" /> <post-list v-if="publisher.type == 'realm'" class="mx-[-2.5ch]" :realm="route.params.id?.toString()" />
<post-list v-else class="mx-[-2.5ch]" :author="route.params.id?.toString()" />
</div> </div>
</template> </template>
@ -17,13 +18,9 @@ definePageMeta({
const { t } = useI18n() const { t } = useI18n()
const route = useRoute() const route = useRoute()
const config = useRuntimeConfig()
if(Number.isNaN(parseInt(route.params.id?.toString()))) { const { data: publisher } = useFetch<any>(`${config.public.solarNetworkApi}/cgi/co/publishers/${route.params.id}`)
throw createError({
statusCode: 400,
statusMessage: "Realm ID must be a Number",
})
}
useHead({ useHead({
title: t("navPosts"), title: t("navPosts"),

View File

@ -71,7 +71,7 @@ const { data: products } = await useAsyncData("products", () => {
} }
.content-section { .content-section {
height: calc(100vh - 80px); min-height: calc(100vh - 80px);
display: flex; display: flex;
place-items: center; place-items: center;
} }

View File

@ -93,10 +93,17 @@ const { t } = useI18n()
const { data: post } = await useFetch<any>(`${config.public.solarNetworkApi}/cgi/co/posts/${slug.value}`) const { data: post } = await useFetch<any>(`${config.public.solarNetworkApi}/cgi/co/posts/${slug.value}`)
if (!post.value) { if (!post.value) {
const { data: publisher } = await $fetch<any>(`${config.public.solarNetworkApi}/cgi/co/publishers/${route.params.id}`)
if (publisher) {
navigateTo(`/posts/publishers/${route.params.id}`)
}
throw createError({ throw createError({
statusCode: 404, statusCode: 404,
statusMessage: "Post Not Found", statusMessage: "Post Not Found",
}) })
} else if (post.value.alias) {
navigateTo(`/posts/${post.value.area_alias}/${post.value.alias}`)
} }
const title = computed(() => post.value.body?.title ? `${post.value.body?.title} from ${post.value.author.nick}` : `Post from ${post.value.author.nick}`) const title = computed(() => post.value.body?.title ? `${post.value.body?.title} from ${post.value.author.nick}` : `Post from ${post.value.author.nick}`)

View File

@ -2,10 +2,11 @@
<v-container class="content-container mx-auto"> <v-container class="content-container mx-auto">
<div class="my-3 mx-[3.5ch]"> <div class="my-3 mx-[3.5ch]">
<h1 class="text-2xl">{{ t("navPosts") }}</h1> <h1 class="text-2xl">{{ t("navPosts") }}</h1>
<span>{{ t("navPostsCaptionWithRealm", [`#${route.params.id}`]) }}</span> <span>{{ t("navPostsCaptionWithPublisher", [publisher.data.name]) }}</span>
</div> </div>
<post-list :realm="route.params.id?.toString()" /> <post-list v-if="publisher.type == 'realm'" :realm="route.params.id?.toString()" />
<post-list v-else :author="route.params.id?.toString()" />
</v-container> </v-container>
</template> </template>
@ -13,13 +14,9 @@
const { t } = useI18n() const { t } = useI18n()
const route = useRoute() const route = useRoute()
const config = useRuntimeConfig()
if(Number.isNaN(parseInt(route.params.id?.toString()))) { const { data: publisher } = useFetch<any>(`${config.public.solarNetworkApi}/cgi/co/publishers/${route.params.id}`)
throw createError({
statusCode: 400,
statusMessage: "Realm ID must be a Number",
})
}
useHead({ useHead({
title: t("navPosts"), title: t("navPosts"),