39 lines
1.1 KiB
Vue
39 lines
1.1 KiB
Vue
<template>
|
|
<span class="inline-flex">
|
|
<tippy ref="language" interactive trigger="click" theme="popover" arrow>
|
|
<template #trigger>
|
|
<span class="select-wrapper">
|
|
<ButtonSecondary
|
|
v-tippy="{ theme: 'tooltip' }"
|
|
:title="$t('settings.choose_language')"
|
|
class="pr-8"
|
|
outline
|
|
svg="languages"
|
|
:label="`${
|
|
$i18n.locales.find(({ code }) => code == $i18n.locale).name
|
|
}`"
|
|
/>
|
|
</span>
|
|
</template>
|
|
<NuxtLink
|
|
v-for="(locale, index) in $i18n.locales"
|
|
:key="`locale-${index}`"
|
|
:to="switchLocalePath(locale.code)"
|
|
@click="language.tippy().hide()"
|
|
>
|
|
<SmartItem
|
|
:label="locale.name"
|
|
:active-info-icon="$i18n.locale === locale.code"
|
|
:info-icon="$i18n.locale === locale.code ? 'done' : null"
|
|
/>
|
|
</NuxtLink>
|
|
</tippy>
|
|
</span>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from "@nuxtjs/composition-api"
|
|
|
|
const language = ref<any | null>(null)
|
|
</script>
|