import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import ElementPlus from "element-plus";
import "element-plus/dist/index.css";
import * as ElementPlusIconsVue from "@element-plus/icons-vue";
import CardTitle from "./components/CardTitle.vue";
import { withFallbackImage } from "./utils";
import "./styles/scrollbar.css";
import "./styles/elui.css";
import "./styles/main.css";
import '@/assets/fonts/font.css'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'

import AreaTag from '@/components/base/areaTag/AreaTag.vue'
import leftBtn from "@/components/base/pageBtn/leftBtn.vue";
import rightBtn from "@/components/base/pageBtn/rightBtn.vue";
import OverviewBox from '@/components/base/boxBackground/overviewBox.vue'
import AnalysisBox from '@/components/base/boxBackground/analysisBox.vue'
import NewsList from '@/components/base/newsList/NewsList.vue'
import ModuleHeader from '@/components/base/moduleHeader/index.vue'
import RiskSignal from "@/components/base/riskSignal/RiskSignal.vue";
import MessageBubble from "@/components/base/messageBubble/MessageBubble.vue";

// 引入 Pinia 实例
import pinia from './stores'
const app = createApp(App);

// 注册所有图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}

// 注册全局函数
app.config.globalProperties.$withFallbackImage = withFallbackImage;
app.use(router);
app.use(ElementPlus, {
  locale: zhCn,
})
app.use(pinia) // 挂载 Pinia
app.component("CardTitle", CardTitle);
app.component('AreaTag', AreaTag)  // 领域标签
app.component('leftBtn', leftBtn)  // 向左按钮 
app.component('rightBtn', rightBtn)  // 向右按钮
app.component('OverviewBox', OverviewBox)  // 概览页模块背景
app.component('AnalysisBox', AnalysisBox)  // 分析页模块背景
app.component('ModuleHeader', ModuleHeader)  // 模块头部
app.component('RiskSignal', RiskSignal)  // 风险信号
app.component('NewsList', NewsList)  // 新闻资讯
app.component('MessageBubble', MessageBubble)  // 社交媒体

app.mount("#app");
