优化代码

src/components/LanguageSwitcher.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="language-switcher">
+    <button 
+      @click="setLanguage('ZH')" 
+      :class="{ active: currentLanguage === 'ZH' }"
+    >
+      中文
+    </button>
+    <button 
+      @click="setLanguage('EN')" 
+      :class="{ active: currentLanguage === 'EN' }"
+    >
+      English
+    </button>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { setLocale } from '@/i18n'
+
+const { locale } = useI18n()
+const currentLanguage = ref(locale.value)
+
+function setLanguage(lang) {
+  setLocale(lang)
+  currentLanguage.value = lang
+}
+</script>
+
+<style scoped>
+.language-switcher {
+  position: fixed;
+  top: 20px;
+  right: 20px;
+  z-index: 1000;
+}
+
+button {
+  padding: 5px 10px;
+  margin: 0 5px;
+  cursor: pointer;
+  background: #f0f0f0;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+}
+
+button.active {
+  background: #4fcacd;
+  color: white;
+}
+</style>