feat: i18n

zio/stable
Anthony Fu 2022-11-28 18:14:58 +08:00
parent 34be0e33ff
commit 654010b3aa
5 changed files with 41 additions and 9 deletions

View File

@ -8,14 +8,26 @@ defineProps<{
<template> <template>
<div flex gap-5> <div flex gap-5>
<NuxtLink :to="getAccountPath(account)" exact-active-class="text-primary"> <NuxtLink :to="getAccountPath(account)" text-secondary exact-active-class="text-primary">
<span font-bold>{{ formattedNumber(account.statusesCount) }}</span> <span text-secondary>Posts</span> <template #default="{ isExactActive }">
<i18n-t keypath="account.posts">
<span font-bold :class="isExactActive ? 'text-primary' : 'text-base'">{{ formattedNumber(account.statusesCount) }}</span>
</i18n-t>
</template>
</NuxtLink> </NuxtLink>
<NuxtLink :to="`${getAccountPath(account)}/following`" exact-active-class="text-primary"> <NuxtLink :to="`${getAccountPath(account)}/following`" text-secondary exact-active-class="text-primary">
<span font-bold>{{ humanReadableNumber(account.followingCount) }}</span> <span text-secondary>Following</span> <template #default="{ isExactActive }">
<i18n-t keypath="account.following">
<span font-bold :class="isExactActive ? 'text-primary' : 'text-base'">{{ humanReadableNumber(account.followingCount) }}</span>
</i18n-t>
</template>
</NuxtLink> </NuxtLink>
<NuxtLink :to="`${getAccountPath(account)}/followers`" exact-active-class="text-primary"> <NuxtLink :to="`${getAccountPath(account)}/followers`" text-secondary exact-active-class="text-primary">
<span font-bold>{{ humanReadableNumber(account.followersCount) }}</span> <span text-secondary>Followers</span> <template #default="{ isExactActive }">
<i18n-t keypath="account.following">
<span font-bold :class="isExactActive ? 'text-primary' : 'text-base'">{{ humanReadableNumber(account.followersCount) }}</span>
</i18n-t>
</template>
</NuxtLink> </NuxtLink>
</div> </div>
</template> </template>

View File

@ -9,5 +9,10 @@
"favourites": "Favourites", "favourites": "Favourites",
"bookmarks": "Bookmarks", "bookmarks": "Bookmarks",
"profile": "Profile" "profile": "Profile"
},
"account": {
"posts": "{0} Posts",
"following": "{0} Following",
"followers": "{0} Followers"
} }
} }

View File

@ -9,5 +9,10 @@
"local": "本地", "local": "本地",
"notifications": "通知", "notifications": "通知",
"profile": "个人资料" "profile": "个人资料"
},
"account": {
"followers": "被 {0} 人关注",
"following": "正在关注 {0} 人",
"posts": "{0} 条帖文"
} }
} }

View File

@ -1,19 +1,22 @@
<script setup lang="ts"> <script setup lang="ts">
import { useI18n } from 'vue-i18n'
definePageMeta({ definePageMeta({
middleware: 'auth', middleware: 'auth',
}) })
const paginator = useMasto().favourites.getIterator() const paginator = useMasto().favourites.getIterator()
const { t } = useI18n()
useHead({ useHead({
title: 'Favourites', title: () => t('nav_side.favourites'),
}) })
</script> </script>
<template> <template>
<MainContent> <MainContent>
<template #title> <template #title>
<span text-lg font-bold>Favourites</span> <span text-lg font-bold>{{ t('nav_side.favourites') }}</span>
</template> </template>
<slot> <slot>
<TimelinePaginator :paginator="paginator" /> <TimelinePaginator :paginator="paginator" />

View File

@ -1,4 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { useI18n } from 'vue-i18n'
definePageMeta({ definePageMeta({
middleware: 'auth', middleware: 'auth',
alias: ['/signin/callback'], alias: ['/signin/callback'],
@ -10,12 +12,17 @@ if (useRoute().path === '/signin/callback') {
} }
const paginator = useMasto().timelines.getHomeIterable() const paginator = useMasto().timelines.getHomeIterable()
const { t } = useI18n()
useHead({
title: () => t('nav_side.home'),
})
</script> </script>
<template> <template>
<MainContent> <MainContent>
<template #title> <template #title>
<span text-lg font-bold>Home</span> <span text-lg font-bold>{{ $t('nav_side.home') }}</span>
</template> </template>
<slot> <slot>
<PublishWidget draft-key="home" border="b base" /> <PublishWidget draft-key="home" border="b base" />