mirror of https://github.com/halo-dev/halo
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 ```pull/6566/head
parent
9a0ebdad25
commit
f6747327e9
|
@ -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"
|
||||
|
|
|
@ -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 { useMutation } from "@tanstack/vue-query";
|
||||
import { onMounted, ref } from "vue";
|
||||
import { VButton, VLoading } from "@halo-dev/components";
|
||||
import { useMutation, useQuery } from "@tanstack/vue-query";
|
||||
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 (
|
||||
globalInfoStore.globalInfo &&
|
||||
globalInfoStore.globalInfo.dataInitialized === false &&
|
||||
!userStore.isAnonymous
|
||||
) {
|
||||
setupInitialData();
|
||||
if (userStore.isAnonymous) {
|
||||
window.location.href = "/";
|
||||
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 />
|
||||
<div v-if="processing" class="text-xs text-gray-600">
|
||||
{{ $t("core.setup.operations.setup_initial_data.loading") }}
|
||||
</div>
|
||||
<template v-if="info?.database.name.startsWith('H2') && !processing">
|
||||
<H2WarningAlert class="max-w-md">
|
||||
<template #actions>
|
||||
<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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -1785,6 +1785,7 @@ core:
|
|||
revoke: Revoke
|
||||
disable: Disable
|
||||
enable: Enable
|
||||
continue: Continue
|
||||
radio:
|
||||
"yes": "Yes"
|
||||
"no": "No"
|
||||
|
|
|
@ -1694,6 +1694,7 @@ core:
|
|||
revoke: 撤销
|
||||
disable: 禁用
|
||||
enable: 启用
|
||||
continue: 继续
|
||||
radio:
|
||||
"yes": 是
|
||||
"no": 否
|
||||
|
|
|
@ -1651,6 +1651,7 @@ core:
|
|||
revoke: 撤銷
|
||||
disable: 禁用
|
||||
enable: 启用
|
||||
continue: 繼續
|
||||
radio:
|
||||
"yes": 是
|
||||
"no": 否
|
||||
|
|
Loading…
Reference in New Issue