refactor: add warning alert for H2 database on data initialization page (#6564)

#### What type of PR is this?

/area ui
/kind improvement
/milestone 2.19.0

#### What this PR does / why we need it:

将 H2 数据库使用警告放置在数据初始化页面，之前放在初始化表单页面无法正确判断，因为没有登录，无法调用 /actuator/info 接口获取数据库数据。

<img width="638" alt="image" src="https://github.com/user-attachments/assets/18868104-321a-4146-a893-5babf4573146">

Fixes https://github.com/halo-dev/halo/issues/6561

#### Special notes for your reviewer:

需要使用此 PR 测试使用 H2 数据库全新安装，观察是否在数据初始化页面有 H2 数据库的使用提示。

#### Does this PR introduce a user-facing change?

```release-note
None
```

ui/console-src/views/system/Setup.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import H2WarningAlert from "@/components/alerts/H2WarningAlert.vue";
 import LocaleChange from "@/components/common/LocaleChange.vue";
 import { useGlobalInfoStore } from "@/stores/global-info";
 import type { SystemInitializationRequest } from "@halo-dev/api-client";
@@ -51,8 +50,6 @@ const inputClasses = {
     <IconLogo class="mb-8 flex-none" />
 
     <div class="flex w-72 flex-col">
-      <H2WarningAlert class="mb-3" />
-
       <FormKit
         id="setup-form"
         v-model="formState"

ui/console-src/views/system/SetupInitialData.vue

@@ -1,6 +1,8 @@
 <script lang="ts" setup>
+import H2WarningAlert from "@/components/alerts/H2WarningAlert.vue";
 import { useGlobalInfoStore } from "@/stores/global-info";
 import { useUserStore } from "@/stores/user";
+import type { Info } from "@/types";
 import {
   consoleApiClient,
   coreApiClient,
@@ -10,9 +12,10 @@ import {
   type SinglePageRequest,
   type Tag,
 } from "@halo-dev/api-client";
-import { VLoading } from "@halo-dev/components";
+import { VButton, VLoading } from "@halo-dev/components";
-import { useMutation } from "@tanstack/vue-query";
+import { useMutation, useQuery } from "@tanstack/vue-query";
-import { onMounted, ref } from "vue";
+import axios from "axios";
+import { onMounted, ref, watch } from "vue";
 import { useRouter } from "vue-router";
 import category from "./setup-data/category.json";
 import menuItems from "./setup-data/menu-items.json";
@@ -128,38 +131,72 @@ async function setupInitialData() {
         },
       },
     });
-    processing.value = false;
+
+    // Reload page to fetch plugin's bundle files
+    window.location.reload();
   }
-
-  await globalInfoStore.fetchGlobalInfo();
-
-  // Reload page to fetch plugin's bundle files
-  window.location.reload();
 }
 
 const userStore = useUserStore();
 
+const { data: info } = useQuery<Info>({
+  queryKey: ["system-info"],
+  queryFn: async () => {
+    const { data } = await axios.get<Info>(`/actuator/info`, {
+      withCredentials: true,
+    });
+    return data;
+  },
+  retry: 0,
+});
+
+watch(
+  () => info.value,
+  (value) => {
+    if (!value) {
+      return;
+    }
+    if (!value.database.name.startsWith("H2")) {
+      setupInitialData();
+    }
+  },
+  {
+    immediate: true,
+  }
+);
+
 onMounted(async () => {
   await globalInfoStore.fetchGlobalInfo();
 
-  if (
+  if (userStore.isAnonymous) {
-    globalInfoStore.globalInfo &&
+    window.location.href = "/";
-    globalInfoStore.globalInfo.dataInitialized === false &&
-    !userStore.isAnonymous
-  ) {
-    setupInitialData();
     return;
   }
 
-  router.push({ name: "Dashboard" });
+  if (globalInfoStore.globalInfo?.dataInitialized) {
+    router.push({ name: "Dashboard" });
+    return;
+  }
 });
 </script>
 
 <template>
   <div class="flex h-screen flex-col items-center justify-center">
-    <VLoading />
+    <template v-if="info?.database.name.startsWith('H2') && !processing">
-    <div v-if="processing" class="text-xs text-gray-600">
+      <H2WarningAlert class="max-w-md">
-      {{ $t("core.setup.operations.setup_initial_data.loading") }}
+        <template #actions>
-    </div>
+          <VButton type="secondary" size="sm" @click="setupInitialData()">
+            {{ $t("core.common.buttons.continue") }}
+          </VButton>
+        </template>
+      </H2WarningAlert>
+    </template>
+
+    <template v-if="processing">
+      <VLoading />
+      <div class="text-xs text-gray-600">
+        {{ $t("core.setup.operations.setup_initial_data.loading") }}
+      </div>
+    </template>
   </div>
 </template>

ui/src/components/alerts/H2WarningAlert.vue

@@ -26,5 +26,8 @@ const { data: info } = useQuery<Info>({
     <template #description>
       {{ $t("core.components.h2_warning_alert.description") }}
     </template>
+    <template #actions>
+      <slot name="actions" />
+    </template>
   </VAlert>
 </template>

ui/src/locales/en.yaml

@@ -1785,6 +1785,7 @@ core:
       revoke: Revoke
       disable: Disable
       enable: Enable
+      continue: Continue
     radio:
       "yes": "Yes"
       "no": "No"

ui/src/locales/zh-CN.yaml

@@ -1694,6 +1694,7 @@ core:
       revoke: 撤销
       disable: 禁用
       enable: 启用
+      continue: 继续
     radio:
       "yes": 是
       "no": 否

ui/src/locales/zh-TW.yaml

@@ -1651,6 +1651,7 @@ core:
       revoke: 撤銷
       disable: 禁用
       enable: 启用
+      continue: 繼續
     radio:
       "yes": 是
       "no": 否