2021-12-17 11:55:42 +08:00
|
|
|
<template>
|
|
|
|
<n-dropdown
|
|
|
|
trigger="hover"
|
|
|
|
@select="handleSelect"
|
|
|
|
:show-arrow="true"
|
|
|
|
:options="options"
|
|
|
|
>
|
|
|
|
<n-button quaternary>
|
|
|
|
<n-icon size="20" :depth="1">
|
|
|
|
<LanguageIcon />
|
|
|
|
</n-icon>
|
|
|
|
</n-button>
|
|
|
|
</n-dropdown>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
import { useLangStore } from '@/store/modules/langStore/langStore'
|
|
|
|
import { langList } from '@/settings/designSetting'
|
|
|
|
import { LangEnum } from '@/enums/styleEnum'
|
2021-12-20 16:39:19 +08:00
|
|
|
import { icon } from '@/plugins'
|
2021-12-17 11:55:42 +08:00
|
|
|
|
2021-12-20 16:39:19 +08:00
|
|
|
const { LanguageIcon } = icon.ionicons5
|
2021-12-17 11:55:42 +08:00
|
|
|
const langStore = useLangStore()
|
|
|
|
const options = langList
|
|
|
|
|
|
|
|
const handleSelect = (key: LangEnum) => {
|
|
|
|
langStore.changeLang(key)
|
|
|
|
}
|
|
|
|
</script>
|