import { createApp, watch } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'
import router from './router'
import i18n from './i18n'
import { useLanguageStore } from './stores/language'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import './assets/main.css'

const app = createApp(App)
const pinia = createPinia()

app.use(pinia)
app.use(router)
app.use(i18n)
app.use(ElementPlus)

const languageStore = useLanguageStore(pinia)

// 监听 Pinia store 中的 locale 变化，并更新 i18n
watch(
  () => languageStore.locale,
  (newLocale) => {
    i18n.global.locale.value = newLocale
  }
)

// 初始化时，确保 i18n 的 locale 与 store 同步
i18n.global.locale.value = languageStore.locale

app.mount('#app')