<script setup>
import { defineAsyncComponent } from "vue";

const size375 = defineAsyncComponent(() =>
  import("@/views/events-calendar/index.vue")
);
const size768 = defineAsyncComponent(() =>
  import("@/views/events-calendar/index.vue")
);
const size1440 = defineAsyncComponent(() =>
  import("@/views/events-calendar/index.vue")
);
const size1920 = defineAsyncComponent(() =>
  import("@/views/events-calendar/index.vue")
);

const { viewComponent, componentKey } = useViewSelector({
  size375,
  size768,
  size1440,
  size1920,
});

const bg = usePageBackground("bg-events-calendar.png");

definePageMeta({
  layout: "default",
});

// ✅ 使用通用 SEO 配置
useSeoSetup({
  titles: {
    zh: "活动日历 | 投资者活动与财报会议 | FiEE",
    en: "Events Calendar | Investor Events & Earnings Calls | FiEE",
    ja: "イベントカレンダー | 投資家イベントと決算説明会 | FiEE",
    "zh-TW": "活動日曆 | 投資者活動與財報會議 | FiEE",
  },
  descriptions: {
    zh: "查看即将举行的FiEE投资者活动、财报电话会议、企业演示和股东大会。了解重要的公司活动日程和投资者关系事件。",
    en: "View upcoming FiEE investor events, earnings calls, corporate presentations and shareholder meetings. Stay informed about important company events and IR activities.",
    ja: "今後のFiEE投資家イベント、決算説明会、企業プレゼンテーション、株主総会をご覧ください。重要な企業イベントとIR活動について情報を入手してください。",
    "zh-TW":
      "查看即將舉行的FiEE投資者活動、財報電話會議、企業演示和股東大會。了解重要的公司活動日程和投資者關係事件。",
  },
  ogImage: "/assets/image/og-events.png",
  pageType: "website",
});

// Provide background to layout
provide("pageBg", bg);
</script>

<template>
  <component :is="viewComponent" :key="componentKey" />
</template>
