feat: 重做实例页导览为内容/文件/世界/日志四步，并修复 inspect 步点导览气泡无法继续的问题

apps/app-frontend/src/components/ui/onboarding/OnboardingDialogue.vue

@@ -35,7 +35,7 @@ const progressWidth = computed(() => `${Math.min(100, (props.current / props.tot
 					<h2 :id="`onboarding-title-${step.id}`">{{ formatMessage(step.title) }}</h2>
 				</div>
 				<ButtonStyled circular type="transparent">
-					<button :aria-label="formatMessage(onboardingMessages.skip)" @click.stop="$emit('skip')">
+					<button data-onboarding-skip :aria-label="formatMessage(onboardingMessages.skip)" @click.stop="$emit('skip')">
 						<XIcon />
 					</button>
 				</ButtonStyled>

apps/app-frontend/src/components/ui/onboarding/onboardingConfig.ts

@@ -252,6 +252,42 @@ export const onboardingMessages = defineMessages({
 		id: 'app.onboarding.instance-tabs.description',
 		defaultMessage: 'Use these tabs for content, files, screenshots, worlds, and logs. Tidy chaos.',
 	},
+	instanceContentTabTitle: {
+		id: 'app.onboarding.instance-content-tab.title',
+		defaultMessage: 'Content',
+	},
+	instanceContentTabDescription: {
+		id: 'app.onboarding.instance-content-tab.description',
+		defaultMessage:
+			'Manage this instance’s mods, resource packs, and shaders here. Search, enable or disable entries, check for updates, and browse for more.',
+	},
+	instanceFilesTabTitle: {
+		id: 'app.onboarding.instance-files-tab.title',
+		defaultMessage: 'Files',
+	},
+	instanceFilesTabDescription: {
+		id: 'app.onboarding.instance-files-tab.description',
+		defaultMessage:
+			'Browse the instance folder and open configs or logs in the built-in editor without leaving the launcher.',
+	},
+	instanceWorldsTabTitle: {
+		id: 'app.onboarding.instance-worlds-tab.title',
+		defaultMessage: 'Worlds',
+	},
+	instanceWorldsTabDescription: {
+		id: 'app.onboarding.instance-worlds-tab.description',
+		defaultMessage:
+			'Manage saved worlds: back them up, rename, edit world settings, and open the world folder.',
+	},
+	instanceLogsTabTitle: {
+		id: 'app.onboarding.instance-logs-tab.title',
+		defaultMessage: 'Logs',
+	},
+	instanceLogsTabDescription: {
+		id: 'app.onboarding.instance-logs-tab.description',
+		defaultMessage:
+			'Read the instance’s live logs to trace crashes and errors without digging through files.',
+	},
 	labTitle: {
 		id: 'app.onboarding.lab.title',
 		defaultMessage: 'Useful tools, built in',
@@ -509,15 +545,29 @@ export const onboardingTours: Record<OnboardingMode, OnboardingStep[]> = {
 			onboardingMessages.instanceActionsTitle,
 			onboardingMessages.instanceActionsDescription,
 		),
-		step(
-			'instance-tabs',
-			'inspect',
-			copy(
-				onboardingMessages.instanceTabsTitle,
-				onboardingMessages.instanceTabsDescription,
-				onboardingMessages.finishArea,
-			),
-			{ targetId: 'instance-tabs' },
+		inspect(
+			'instance-content-tab',
+			'instance-tab-content',
+			onboardingMessages.instanceContentTabTitle,
+			onboardingMessages.instanceContentTabDescription,
+		),
+		inspect(
+			'instance-files-tab',
+			'instance-tab-files',
+			onboardingMessages.instanceFilesTabTitle,
+			onboardingMessages.instanceFilesTabDescription,
+		),
+		inspect(
+			'instance-worlds-tab',
+			'instance-tab-worlds',
+			onboardingMessages.instanceWorldsTabTitle,
+			onboardingMessages.instanceWorldsTabDescription,
+		),
+		inspect(
+			'instance-logs-tab',
+			'instance-tab-logs',
+			onboardingMessages.instanceLogsTabTitle,
+			onboardingMessages.instanceLogsTabDescription,
 		),
 	],
 }

apps/app-frontend/src/components/ui/onboarding/useOnboardingTour.ts

@@ -279,8 +279,11 @@ export function useOnboardingTour(
 	function handleDocumentClick(event: MouseEvent) {
 		if (!visible.value) return
 		const clickedElement = event.target instanceof Element ? event.target : null
-		if (clickedElement?.closest('[data-onboarding-overlay-ui]')) return
 
+		// 跳过/关闭按钮由其自身处理，不在全局点击里推进
+		if (clickedElement?.closest('[data-onboarding-skip]')) return
+
+		// inspect 步：点击任意位置（含导览气泡本身）都继续下一步
 		if (step.value.interaction === 'inspect') {
 			event.preventDefault()
 			event.stopImmediatePropagation()
@@ -288,6 +291,9 @@ export function useOnboardingTour(
 			return
 		}
 
+		// 非 inspect 步：点在导览 UI 自身时不处理
+		if (clickedElement?.closest('[data-onboarding-overlay-ui]')) return
+
 		if (!step.value.targetId || !['navigate', 'activate'].includes(step.value.interaction)) return
 		if (clickedElement && handleBranchClick(clickedElement)) return
 		if (!targetElement.value?.contains(event.target as Node)) return

apps/app-frontend/src/locales/zh-CN/index.json

@@ -5995,6 +5995,30 @@
   "app.onboarding.instance-actions.title": {
     "message": "主操作台"
   },
+  "app.onboarding.instance-content-tab.title": {
+    "message": "内容"
+  },
+  "app.onboarding.instance-content-tab.description": {
+    "message": "在这里管理实例的 Mod、资源包与光影。可搜索、启用或禁用条目、检查更新，也能继续浏览安装新内容。"
+  },
+  "app.onboarding.instance-files-tab.title": {
+    "message": "文件"
+  },
+  "app.onboarding.instance-files-tab.description": {
+    "message": "浏览实例目录，用内置编辑器直接打开配置文件或日志，无需离开启动器。"
+  },
+  "app.onboarding.instance-worlds-tab.title": {
+    "message": "世界"
+  },
+  "app.onboarding.instance-worlds-tab.description": {
+    "message": "管理存档世界：备份、重命名、编辑世界设置，或打开世界所在文件夹。"
+  },
+  "app.onboarding.instance-logs-tab.title": {
+    "message": "日志"
+  },
+  "app.onboarding.instance-logs-tab.description": {
+    "message": "查看实例的实时日志，排查崩溃与报错，不必再翻找文件。"
+  },
   "app.onboarding.instance-tabs.description": {
     "message": "内容、文件、截图、世界和日志都在这些标签里。乱中有序。"
   },

apps/app-frontend/src/pages/instance/Index.vue

@@ -688,11 +688,13 @@ const tabs = computed(() => [
 		label: formatMessage(messages.contentTab),
 		href: `${basePath.value}`,
 		icon: BoxesIcon,
+		onboardingId: 'instance-tab-content',
 	},
 	{
 		label: formatMessage(messages.filesTab),
 		href: `${basePath.value}/files`,
 		icon: FolderOpenIcon,
+		onboardingId: 'instance-tab-files',
 	},
 	{
 		label: formatMessage(messages.screenshotsTab),
@@ -703,11 +705,13 @@ const tabs = computed(() => [
 		label: formatMessage(messages.worldsTab),
 		href: `${basePath.value}/worlds`,
 		icon: GlobeIcon,
+		onboardingId: 'instance-tab-worlds',
 	},
 	{
 		label: formatMessage(messages.logsTab),
 		href: `${basePath.value}/logs`,
 		icon: TerminalSquareIcon,
+		onboardingId: 'instance-tab-logs',
 	},
 ])