-
-
-
+
+ {displayed}
+
+
+ );
+}
-
- 欢迎使用 Koring Launcher
-
-
- 这是 OOBE（开箱体验）页面。在这里可以引导用户完成初始设置。
-
+export function Oobe() {
+ const navigate = useRouteStore((s) => s.navigate);
+ return (
+
+ {/* 中心动画文字 */}
+
+
+
+
+ {/* 下方按钮 */}
+
diff --git a/src/pages/oobe/layout.tsx b/src/pages/oobe/layout.tsx
new file mode 100644
index 0000000..7f06e9e
--- /dev/null
+++ b/src/pages/oobe/layout.tsx
@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+
+interface OobeLayoutProps {
+ children: ReactNode;
+}
+
+export function OobeLayout({ children }: OobeLayoutProps) {
+ return (
+
+ {children}
+
+ );
+}
diff --git a/src/pages/oobe/next-button.tsx b/src/pages/oobe/next-button.tsx
new file mode 100644
index 0000000..9a9eabb
--- /dev/null
+++ b/src/pages/oobe/next-button.tsx
@@ -0,0 +1,18 @@
+interface NextButtonProps {
+ onClick: () => void;
+ disabled?: boolean;
+}
+
+export function NextButton({ onClick, disabled = false }: NextButtonProps) {
+ return (
+
+
+
+ );
+}
diff --git a/src/pages/oobe/step-agreement.tsx b/src/pages/oobe/step-agreement.tsx
new file mode 100644
index 0000000..73351ee
--- /dev/null
+++ b/src/pages/oobe/step-agreement.tsx
@@ -0,0 +1,60 @@
+import { useState, useEffect } from "react";
+import { useRouteStore } from "@/stores/routeStore";
+import { OobeLayout } from "./layout";
+import { NextButton } from "./next-button";
+
+export function OobeAgreement() {
+ const navigate = useRouteStore((s) => s.navigate);
+ const [text, setText] = useState("");
+ const [checked, setChecked] = useState(false);
+
+ useEffect(() => {
+ fetch(`${import.meta.env.BASE_URL}protocol-user.txt`)
+ .then((r) => r.text())
+ .then(setText)
+ .catch(() => setText("无法加载协议内容"));
+ }, []);
+
+ return (
+
+
+ {/* 标题 */}
+
+
Koring Team 产品用户协议
+
您需要同意才可以继续
+
+
+ {/* 协议内容 */}
+
+
+ {/* 勾选框 */}
+
+
+ );
+}
diff --git a/src/pages/oobe/step-beta-test.tsx b/src/pages/oobe/step-beta-test.tsx
new file mode 100644
index 0000000..8ae87ce
--- /dev/null
+++ b/src/pages/oobe/step-beta-test.tsx
@@ -0,0 +1,77 @@
+import { useState, useEffect } from "react";
+import { useRouteStore } from "@/stores/routeStore";
+import { OobeLayout } from "./layout";
+import { NextButton } from "./next-button";
+import { Loader2 } from "lucide-react";
+
+export function OobeBetaTest() {
+ const navigate = useRouteStore((s) => s.navigate);
+ const [loading, setLoading] = useState(true);
+ const [text, setText] = useState("");
+ const [checked, setChecked] = useState(false);
+
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ fetch(`${import.meta.env.BASE_URL}protocol-beta.txt`)
+ .then((r) => r.text())
+ .then(setText)
+ .catch(() => setText("无法加载协议内容"))
+ .finally(() => setLoading(false));
+ }, 1500);
+ return () => clearTimeout(timer);
+ }, []);
+
+ if (loading) {
+ return (
+
+
+
+ 正在确认版本信息，并激活...
+
+
+ );
+ }
+
+ return (
+
+
+ {/* 标题 */}
+
+
Koring APP Beta 测试协议
+
您需要同意才可以继续
+
+
+ {/* 协议内容 */}
+
+
+ {/* 勾选框 */}
+
+
+ );
+}
diff --git a/src/pages/oobe/step-finish.tsx b/src/pages/oobe/step-finish.tsx
new file mode 100644
index 0000000..849556a
--- /dev/null
+++ b/src/pages/oobe/step-finish.tsx
@@ -0,0 +1,31 @@
+import { useRouteStore } from "@/stores/routeStore";
+import { useConfigStore } from "@/stores/configStore";
+import { OobeLayout } from "./layout";
+import { AppleHelloEnglishEffect } from "@/components/ui/apple-hello-effect";
+
+export function OobeFinish() {
+ const navigate = useRouteStore((s) => s.navigate);
+ const setOobe = useConfigStore((s) => s.setOobe);
+
+ const handleFinish = () => {
+ setOobe(false);
+ navigate("home");
+ };
+
+ return (
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/pages/oobe/step-language.tsx b/src/pages/oobe/step-language.tsx
new file mode 100644
index 0000000..4232ffe
--- /dev/null
+++ b/src/pages/oobe/step-language.tsx
@@ -0,0 +1,51 @@
+import { useState } from "react";
+import { useRouteStore } from "@/stores/routeStore";
+import { OobeLayout } from "./layout";
+import { NextButton } from "./next-button";
+import { Check } from "lucide-react";
+
+const languages = [
+ { key: "zh-CN", label: "简体中文", available: true },
+ { key: "zh-TW", label: "繁体中文", available: false },
+ { key: "en", label: "English", available: false },
+ { key: "ja", label: "日本語", available: false },
+ { key: "ko", label: "한국어", available: false },
+ { key: "lzh", label: "文言文（中国）", available: false },
+];
+
+export function OobeLanguage() {
+ const navigate = useRouteStore((s) => s.navigate);
+ const [selected, setSelected] = useState("zh-CN");
+
+ return (
+
+
+ {languages.map((lang) => (
+
+ ))}
+
+
+ navigate("oobe/agreement")} />
+
+ );
+}
diff --git a/src/pages/oobe/step-version.tsx b/src/pages/oobe/step-version.tsx
new file mode 100644
index 0000000..417e6f0
--- /dev/null
+++ b/src/pages/oobe/step-version.tsx
@@ -0,0 +1,67 @@
+import { useState, useEffect } from "react";
+import { useRouteStore } from "@/stores/routeStore";
+import { OobeLayout } from "./layout";
+import { NextButton } from "./next-button";
+import { VERSION } from "@/lib/version";
+import { BUILD_MODE } from "@/lib/mode";
+
+export function OobeVersion() {
+ const navigate = useRouteStore((s) => s.navigate);
+ const [changelog, setChangelog] = useState("");
+
+ const isTestBuild = BUILD_MODE === "dev" || BUILD_MODE === "beta";
+ const badgeLabel = BUILD_MODE === "dev" ? "DEV" : BUILD_MODE === "beta" ? "BETA" : null;
+
+ const nextRoute = isTestBuild ? "oobe/beta-test" : "oobe/finish";
+
+ useEffect(() => {
+ fetch(`${import.meta.env.BASE_URL}changelog-${VERSION}.txt`)
+ .then((r) => r.text())
+ .then(setChangelog)
+ .catch(() => setChangelog("暂无更新内容"));
+ }, []);
+
+ return (
+
+
+ {/* 标题 */}
+
核对您的版本信息
+
+ {/* 版本号 + Badge */}
+
+
+ v{VERSION}
+
+ {badgeLabel && (
+
+ {badgeLabel}
+
+ )}
+
+
+ {/* 测试版警告 */}
+ {isTestBuild && (
+
+ 您正在使用测试版本，它并不稳定，不建议用于正式游戏体验，具体内容请以发行版本为准。
+
+ )}
+
+ {/* 更新内容 */}
+
+
+ );
+}
diff --git a/src/pages/setting/general/about.tsx b/src/pages/setting/general/about.tsx
index f3b4bf3..6fa845f 100644
--- a/src/pages/setting/general/about.tsx
+++ b/src/pages/setting/general/about.tsx
@@ -1,6 +1,7 @@
import { VersionCard } from "@/components/VersionCard";
import { BUILD_MODE } from "@/lib/mode";
-import { ExternalLink, GitFork } from "lucide-react";
+import { ExternalLink, GitFork, RotateCcw } from "lucide-react";
+import { useConfirmDialogStore } from "@/stores/confirmDialogStore";
function GlassCard({ children }: { children: React.ReactNode }) {
return
{children}
;
@@ -28,10 +29,22 @@ const GITHUB_URL = "https://github.com/koring-launcher/koring-launcher";
const OFFICIAL_URL = "https://koring.app";
export function AboutSetting() {
+ const openDialog = useConfirmDialogStore((s) => s.openDialog);
+
const openLink = (url: string) => {
window.electronAPI?.openExternal(url);
};
+ const handleResetClick = () => {
+ openDialog({
+ title: "您确定要还原所有配置吗？",
+ description: "您还原后，您的实例将会保留，但是所有个性化配置将全部丢失，并且需要重新进行激活",
+ confirmLabel: "确认还原",
+ countdown: 5,
+ onConfirm: () => window.electronAPI?.resetConfig(),
+ });
+ };
+
return (
关于
@@ -92,6 +105,22 @@ export function AboutSetting() {