43 lines
872 B
Vue
43 lines
872 B
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue';
|
|
import type { AdminLocale } from '../i18n/admin-messages';
|
|
|
|
const LOCALE_COUNTRY: Record<AdminLocale, string> = {
|
|
'zh-CN': 'cn',
|
|
'en-US': 'us',
|
|
'ms-MY': 'my',
|
|
};
|
|
|
|
const props = withDefaults(
|
|
defineProps<{ locale: AdminLocale | string; size?: number }>(),
|
|
{ size: 18 },
|
|
);
|
|
|
|
const countryCode = computed(() => {
|
|
const code = props.locale as AdminLocale;
|
|
return LOCALE_COUNTRY[code] ?? 'us';
|
|
});
|
|
|
|
const src = computed(() => `/flags/${countryCode.value}.svg`);
|
|
</script>
|
|
|
|
<template>
|
|
<img
|
|
:src="src"
|
|
:width="size"
|
|
:height="Math.round(size * 0.67)"
|
|
class="admin-locale-flag-img"
|
|
:alt="countryCode"
|
|
/>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.admin-locale-flag-img {
|
|
display: block;
|
|
flex-shrink: 0;
|
|
border-radius: 2px;
|
|
object-fit: cover;
|
|
box-shadow: 0 0 0 1px var(--border);
|
|
}
|
|
</style>
|