mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-14 23:17:33 +08:00
MaysWind
33 lines
1.3 KiB
Vue
33 lines
1.3 KiB
Vue
<template>
|
|
<f7-button small popover-open=".lang-popover-menu" :disabled="disabled" :text="currentLanguageName"></f7-button>
|
|
|
|
<f7-popover class="lang-popover-menu">
|
|
<f7-list dividers>
|
|
<f7-list-item link="#" no-chevron popover-close
|
|
:key="lang.languageTag"
|
|
:title="lang.nativeDisplayName"
|
|
v-for="lang in allLanguages"
|
|
@click="updateLanguage(lang.languageTag)">
|
|
<template #after>
|
|
<f7-icon class="list-item-checked-icon" f7="checkmark_alt" v-if="isLanguageSelected(lang.languageTag)"></f7-icon>
|
|
<span v-if="!isLanguageSelected(lang.languageTag)">{{ lang.displayName }}</span>
|
|
</template>
|
|
</f7-list-item>
|
|
</f7-list>
|
|
</f7-popover>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { type LanguageSelectBaseProps, type LanguageSelectBaseEmits, useLanguageSelectButtonBase } from '@/components/base/LanguageSelectBase.ts';
|
|
|
|
const props = defineProps<LanguageSelectBaseProps>();
|
|
const emit = defineEmits<LanguageSelectBaseEmits>();
|
|
|
|
const {
|
|
allLanguages,
|
|
currentLanguageName,
|
|
updateLanguage,
|
|
isLanguageSelected
|
|
} = useLanguageSelectButtonBase(props, emit);
|
|
</script>
|