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

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

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

const bg = usePageBackground("bg-contacts.png");

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

// ✅ 使用通用 SEO 配置
useSeoSetup({
  titles: {
    zh: "邮件提醒订阅 | 获取最新资讯 | FiEE",
    en: "Email Alerts Subscription | Stay Informed | FiEE",
    ja: "メールアラート登録 | 最新情報を入手 | FiEE",
    "zh-TW": "郵件提醒訂閱 | 獲取最新資訊 | FiEE",
  },
  descriptions: {
    zh: "订阅FiEE邮件提醒服务，第一时间接收最新新闻稿、财务报告、业绩公告和投资者更新信息。",
    en: "Subscribe to FiEE email alerts to receive the latest press releases, financial reports, earnings announcements and investor updates directly to your inbox.",
    ja: "FiEEメールアラートに登録して、最新のプレスリリース、財務レポート、業績発表、投資家向け情報を直接受信箱で受け取ります。",
    "zh-TW":
      "訂閱FiEE郵件提醒服務，第一時間接收最新新聞稿、財務報告、業績公告和投資者更新信息。",
  },
  ogImage: "/assets/image/og-email.png",
  pageType: "website",
});

provide("pageBg", bg);
</script>

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