import { router } from "@/router/index";
import { applyDisplayMode, useSettingsStore } from '@/store/settings'; // Import store and helper
import '@/styles/element-variables.scss';
import "@/styles/style.css";
import { setTheme } from '@/styles/theme'; // Import setTheme
import 'element-plus/theme-chalk/dark/css-vars.css';
import { createPinia } from "pinia";
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';
import { createApp } from "vue";
import App from "./App.vue";

// 引入 Element Plus
import ElementPlus from 'element-plus';
import zhCn from 'element-plus/dist/locale/zh-cn.mjs';


const pinia = createPinia();
pinia.use(piniaPluginPersistedstate)

const app = createApp(App);
app.use(pinia); // Pinia is now available

// Access the store *after* app.use(pinia)
// The store state will be hydrated from localStorage here by the persistence plugin
const settingsStore = useSettingsStore();

// Apply persisted/initial settings
applyDisplayMode(settingsStore.displayMode);
setTheme(settingsStore.theme);
// Apply initial animation setting
if (!settingsStore.animationsEnabled) {
  document.body.classList.add('no-animations');
} else {
  // Ensure the class is not present if animations are enabled initially
  document.body.classList.remove('no-animations');
}

app.use(router);
app.use(ElementPlus, {
  locale: zhCn,
})
app.mount("#app");
