From a7413ee037725d5ec1cec29274b3eeb2f7d059cc Mon Sep 17 00:00:00 2001
From: lyf <2514544224@qq.com>
Date: Fri, 26 Jun 2026 04:17:03 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=AF=BC=E8=A7=88?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E6=96=87=E6=A1=88=E4=B8=8E=E4=B8=89=E7=BB=B4?=
 =?UTF-8?q?=E8=B7=AF=E7=BA=BF=E6=98=BE=E7=A4=BA=E8=81=94=E5=8A=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 src/components/map/ThreeMap.vue               |  14 +
 src/components/navigation/GuideMapShell.vue   | 116 ++++---
 .../navigation/RoutePlannerPanel.vue          |  32 +-
 src/pages/index/index.vue                     | 297 +++++++++++++++---
 src/repositories/SdkGuideRouteRepository.ts   | 226 +++++++++++++
 5 files changed, 592 insertions(+), 93 deletions(-)
 create mode 100644 src/repositories/SdkGuideRouteRepository.ts

diff --git a/src/components/map/ThreeMap.vue b/src/components/map/ThreeMap.vue
index a072534..4ac3e5c 100644
--- a/src/components/map/ThreeMap.vue
+++ b/src/components/map/ThreeMap.vue
@@ -48,6 +48,7 @@
 import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 import * as THREE from 'three'
 import { GLTFLoader, type GLTF } from 'three/addons/loaders/GLTFLoader.js'
+import { DRACOLoader } from 'three/addons/loaders/DRACOLoader.js'
 import { OrbitControls } from 'three/addons/controls/OrbitControls.js'
 import FloorSwitcher from './FloorSwitcher.vue'
 import type {
@@ -194,6 +195,7 @@ let camera: THREE.PerspectiveCamera | null = null
 let renderer: THREE.WebGLRenderer | null = null
 let controls: OrbitControls | null = null
 let loader: GLTFLoader | null = null
+let dracoLoader: DRACOLoader | null = null
 let activeModel: THREE.Object3D | null = null
 let poiGroup: THREE.Group | null = null
 let routeGroup: THREE.Group | null = null
@@ -682,6 +684,9 @@ const initThree = async () => {
   syncControlInteractionOptions()
 
   loader = new GLTFLoader()
+  dracoLoader = new DRACOLoader()
+  dracoLoader.setDecoderPath('/static/three/draco/')
+  loader.setDRACOLoader(dracoLoader)
   poiGroup = new THREE.Group()
   poiGroup.name = 'GuideModelPOI'
   scene.add(poiGroup)
@@ -2298,6 +2303,8 @@ const disposeScene = () => {
   scene = null
   camera = null
   loader = null
+  dracoLoader?.dispose()
+  dracoLoader = null
   poiGroup = null
   routeGroup = null
 
@@ -2321,6 +2328,7 @@ defineExpose({
     queueTargetFocus(request)
   },
   clearSelection: clearMapSelection,
+  clearRoute: clearRoutePreview,
   clearNavigation: () => clearMapSelection(false),
   disableAutoSwitchTemporarily
 })
@@ -2346,6 +2354,12 @@ watch(() => [props.routePreview, props.showRoute], () => {
   deep: true
 })
 
+watch(() => props.initialView, (newView) => {
+  if (newView === 'floor' || newView === 'multi') {
+    activeView.value = newView
+  }
+})
+
 onMounted(() => {
   init3DScene()
 })
diff --git a/src/components/navigation/GuideMapShell.vue b/src/components/navigation/GuideMapShell.vue
index 2d3b975..621c4ec 100644
--- a/src/components/navigation/GuideMapShell.vue
+++ b/src/components/navigation/GuideMapShell.vue
@@ -3,25 +3,14 @@
     <view class="map-layer" :class="`map-${mapType}`">
       <template v-if="mapType === 'indoor'">
         <!-- #ifdef H5 -->
-        <SgsMapRenderer
-          v-if="useSgsMapRenderer"
-          ref="indoorRendererRef"
-          class="indoor-three-map"
-          :initial-floor-id="activeFloorId"
-          :initial-view="indoorInitialView"
-          :floors="props.floors"
-          :target-focus="targetFocusRequest"
-          @target-focus="handleTargetFocus"
-          @floor-change="handleSdkFloorChange"
-        />
         <ThreeMap
-          v-else-if="indoorModelSource"
+          v-if="effectiveIndoorModelSource"
           ref="indoorRendererRef"
           class="indoor-three-map"
           :asset-base-url="indoorAssetBaseUrl"
-          :model-source="indoorModelSource"
+          :model-source="effectiveIndoorModelSource"
           :initial-floor-id="activeFloorId"
-          :initial-view="indoorInitialView"
+          :initial-view="indoorView"
           :show-controls="false"
           :show-poi="shouldShowIndoorPois"
           :target-focus="targetFocusRequest"
@@ -50,6 +39,8 @@
           class="outdoor-map"
           :active-floor="activeFloor"
           :floors="props.floors"
+          :polylines="outdoorNavPolylines"
+          @map-tap="handleMapTap"
         />
       </view>
       <view v-if="dimmed" class="dim-layer"></view>
@@ -170,11 +161,6 @@
       </view>
     </view>
 
-    <view v-if="showLocationControl" class="location-control" :style="locationControlStyle" @tap="handleResetView">
-      <view class="location-ring"></view>
-      <view class="location-dot"></view>
-    </view>
-
     <view v-if="showMoreControl" class="more-control" :style="moreControlStyle" @tap="handleMoreTap">
       <text class="more-control-text">更多</text>
     </view>
@@ -195,14 +181,10 @@
 </template>
 
 <script setup lang="ts">
-import { computed, ref } from 'vue'
+import { computed, ref, watch } from 'vue'
 import TencentMap from '@/components/map/TencentMap.vue'
 // #ifdef H5
 import ThreeMap from '@/components/map/ThreeMap.vue'
-import SgsMapRenderer from '@/components/map/SgsMapRenderer.vue'
-import {
-  isSgsSdkMode
-} from '@/config/dataSource'
 // #endif
 import type {
   GuideModelSource,
@@ -217,6 +199,14 @@ interface GuideFloorOption {
   label: string
 }
 
+interface OutdoorNavPolyline {
+  points: Array<{ latitude: number; longitude: number }>
+  color: string
+  width: number
+}
+
+type CameraViewMode = 'reset' | 'top' | 'oblique'
+
 interface TargetPoiFocusRequest {
   requestId: number | string
   poiId: string
@@ -253,6 +243,7 @@ const props = withDefaults(defineProps<{
   layerModeToggleTop?: string
   toolsTop?: string
   tools?: string[]
+  cameraView?: CameraViewMode
   searchVariant?: 'default' | 'home'
   showVoiceIcon?: boolean
   showModeRow?: boolean
@@ -260,9 +251,9 @@ const props = withDefaults(defineProps<{
   showZoomControls?: boolean
   showLocationControl?: boolean
   showMoreControl?: boolean
+  toolsBottom?: string
   floorSide?: 'left' | 'right'
   zoomControlsTop?: string
-  locationControlBottom?: string
   moreControlBottom?: string
   showSearch?: boolean
   showFloor?: boolean
@@ -285,6 +276,7 @@ const props = withDefaults(defineProps<{
   showRoute?: boolean
   autoSwitchThresholdLow?: number
   autoSwitchThresholdHigh?: number
+  outdoorNavPolylines?: OutdoorNavPolyline[]
 }>(), {
   searchText: '请输入地点进行搜索',
   activeMode: '3d',
@@ -297,7 +289,9 @@ const props = withDefaults(defineProps<{
   floorMaxHeight: '',
   layerModeToggleTop: '154px',
   toolsTop: '406px',
+  toolsBottom: '',
   tools: () => [] as string[],
+  cameraView: 'reset',
   searchVariant: 'default',
   showVoiceIcon: false,
   showModeRow: true,
@@ -307,7 +301,6 @@ const props = withDefaults(defineProps<{
   showMoreControl: false,
   floorSide: 'right',
   zoomControlsTop: '520px',
-  locationControlBottom: '34px',
   moreControlBottom: '34px',
   showSearch: true,
   showFloor: true,
@@ -329,7 +322,8 @@ const props = withDefaults(defineProps<{
   routePreview: null,
   showRoute: false,
   autoSwitchThresholdLow: 1.0,
-  autoSwitchThresholdHigh: 1.3
+  autoSwitchThresholdHigh: 1.3,
+  outdoorNavPolylines: () => [] as OutdoorNavPolyline[]
 })
 
 const emit = defineEmits<{
@@ -344,8 +338,23 @@ const emit = defineEmits<{
   selectionClear: []
   targetFocus: [result: TargetPoiFocusResult]
   autoSwitch: [event: { from: 'overview' | 'floor'; to: 'overview' | 'floor'; trigger: string; distance: number }]
+  mapTap: [location: { latitude: number; longitude: number }]
 }>()
 
+// 监听视角切换，循环切换：reset -> top -> oblique -> reset
+watch(() => props.cameraView, (view) => {
+  if (props.mapType !== 'indoor') return
+  indoorRendererRef.value?.disableAutoSwitchTemporarily?.(10000)
+
+  if (view === 'reset') {
+    indoorRendererRef.value?.resetCamera?.()
+  } else if (view === 'top') {
+    indoorRendererRef.value?.setCameraPreset?.('top')
+  } else if (view === 'oblique') {
+    indoorRendererRef.value?.setCameraPreset?.('oblique')
+  }
+})
+
 const indoorRendererRef = ref<{
   switchFloor?: (floorId: string) => Promise<void> | void
   showOverview?: () => Promise<void> | void
@@ -354,19 +363,30 @@ const indoorRendererRef = ref<{
   setCameraPreset?: (preset: 'top' | 'oblique') => void
   zoomCamera?: (direction: 'in' | 'out') => void
   clearSelection?: (shouldEmit?: boolean) => void
+  clearRoute?: () => Promise<void> | void
   disableAutoSwitchTemporarily?: (durationMs: number) => void
 } | null>(null)
 
 const floorLabels = computed(() => props.floors.map((floor) => floor.label))
-const indoorModelSource = computed(() => props.indoorModelSource)
 // #ifdef H5
-const useSgsMapRenderer = computed(() => isSgsSdkMode())
+const effectiveIndoorModelSource = computed(() => props.indoorModelSource)
 // #endif
 const showIndoorRightControls = computed(() => (
   props.mapType === 'indoor' && props.indoorView !== 'overview'
 ))
 
-const activeFloorId = computed(() => props.normalizeFloorId(props.activeFloor))
+const activeFloorId = computed(() => {
+  const matchedFloor = props.floors.find((floor) => (
+    floor.id === props.activeFloor || floor.label === props.activeFloor
+  ))
+  if (matchedFloor) return matchedFloor.id
+
+  const normalizedFloorId = props.normalizeFloorId(props.activeFloor)
+  const normalizedFloor = props.floors.find((floor) => (
+    floor.id === normalizedFloorId || floor.label === normalizedFloorId
+  ))
+  return normalizedFloor?.id || normalizedFloorId
+})
 
 const searchFieldStyle = computed(() => ({
   top: props.searchTop
@@ -386,17 +406,15 @@ const modeRowStyle = computed(() => ({
 }))
 
 const toolStackStyle = computed(() => ({
-  top: props.toolsTop
+  ...(props.toolsTop ? { top: props.toolsTop } : {}),
+  ...(props.toolsBottom ? { bottom: props.toolsBottom } : {}),
+  left: '18px'
 }))
 
 const zoomControlsStyle = computed(() => ({
   top: props.zoomControlsTop
 }))
 
-const locationControlStyle = computed(() => ({
-  bottom: props.locationControlBottom
-}))
-
 const moreControlStyle = computed(() => ({
   bottom: props.moreControlBottom
 }))
@@ -469,11 +487,6 @@ const handleToolClick = (tool: string) => {
   emit('toolClick', tool)
 }
 
-const handleResetView = () => {
-  indoorRendererRef.value?.resetCamera?.()
-  emit('toolClick', '重置')
-}
-
 const handleZoomClick = (direction: 'in' | 'out') => {
   indoorRendererRef.value?.zoomCamera?.(direction)
   emit('toolClick', direction === 'in' ? '放大' : '缩小')
@@ -502,16 +515,23 @@ const handleTargetFocus = (result: TargetPoiFocusResult) => {
   emit('targetFocus', result)
 }
 
-const handleSdkFloorChange = (floorId: string) => {
-  const floor = props.floors.find((item) => item.id === floorId)
-  if (floor) {
-    emit('floorChange', floor.label)
-  }
-}
-
 const handleAutoSwitch = (event: { from: 'overview' | 'floor'; to: 'overview' | 'floor'; trigger: string; distance: number }) => {
   emit('autoSwitch', event)
 }
+
+const handleMapTap = (location: { latitude?: number; longitude?: number }) => {
+  const { latitude, longitude } = location
+  if (latitude !== undefined && longitude !== undefined) {
+    emit('mapTap', { latitude, longitude })
+  }
+}
+
+// 暴露 clearRoute 方法供父组件显式调用路线清除
+defineExpose({
+  clearRoute: () => {
+    indoorRendererRef.value?.clearRoute?.()
+  }
+})
 </script>
 
 <style scoped lang="scss">
@@ -958,7 +978,7 @@ const handleAutoSwitch = (event: { from: 'overview' | 'floor'; to: 'overview' |
 
 .tool-stack {
   position: absolute;
-  left: 16px;
+  left: 18px;
   display: flex;
   flex-direction: column;
   gap: 8px;
diff --git a/src/components/navigation/RoutePlannerPanel.vue b/src/components/navigation/RoutePlannerPanel.vue
index 15b9f7b..863d7eb 100644
--- a/src/components/navigation/RoutePlannerPanel.vue
+++ b/src/components/navigation/RoutePlannerPanel.vue
@@ -67,7 +67,7 @@
 
       <view v-if="startPoint && endPoint" class="route-options">
         <view class="route-options-header">
-          <text class="route-options-title">线路预览</text>
+          <text class="route-options-title">{{ routeOptionsTitle }}</text>
           <text class="route-options-note">偏好选择</text>
         </view>
         <view class="route-option-list">
@@ -84,7 +84,7 @@
       </view>
 
       <view v-if="loading || error || summary" class="panel-status">
-        <text v-if="loading" class="panel-status-text">线路预览生成中</text>
+        <text v-if="loading" class="panel-status-text">{{ loadingText }}</text>
         <text v-else-if="error" class="panel-status-text error">{{ error }}</text>
         <text v-else class="panel-status-text">{{ summary }}</text>
       </view>
@@ -136,6 +136,7 @@ const props = withDefaults(defineProps<{
   pickerLoading?: boolean
   pickerError?: string
   pickerEmptyText?: string
+  routeReady?: boolean
 }>(), {
   visible: true,
   startPoint: null,
@@ -147,7 +148,8 @@ const props = withDefaults(defineProps<{
   summary: '',
   pickerLoading: false,
   pickerError: '',
-  pickerEmptyText: '暂无匹配地点'
+  pickerEmptyText: '暂无匹配地点',
+  routeReady: false
 })
 
 const emit = defineEmits<{
@@ -194,7 +196,15 @@ const canViewRoute = computed(() => Boolean(
 const canPrimaryAction = computed(() => canViewRoute.value && !props.error)
 
 const primaryActionText = computed(() => (
-  props.hasRoutePreview ? '模拟导览' : '线路预览'
+  props.hasRoutePreview
+    ? '开始导览'
+    : (props.routeReady ? '查看路线' : '查看位置关系')
+))
+
+const routeOptionsTitle = computed(() => '室内导览')
+
+const loadingText = computed(() => (
+  props.routeReady ? '正在规划室内导览路线' : '正在生成室内位置关系'
 ))
 
 const collapsedSummary = computed(() => {
@@ -207,26 +217,32 @@ const collapsedSummary = computed(() => {
 
 const routeOptions = computed(() => {
   const unavailable = Boolean(props.error)
-  const summaryText = props.summary || '选择后查看位置关系'
+  const summaryText = props.summary || (props.routeReady ? '选择后规划真实路线' : '选择后查看位置关系')
   return [
     {
       id: 'recommended',
       title: '推荐路线',
-      meta: unavailable ? '当前为路线示意状态' : props.hasRoutePreview ? summaryText : '优先展示位置关系',
+      meta: unavailable
+        ? '当前暂不可用'
+        : props.hasRoutePreview
+          ? summaryText
+          : props.routeReady
+            ? '调用 SGS SDK 路线规划'
+            : '查看起点终点位置关系',
       active: !unavailable,
       disabled: unavailable
     },
     {
       id: 'stairs',
       title: '少走楼梯',
-      meta: '偏好预览，待路线数据验证',
+      meta: props.routeReady ? '偏好能力待接入' : '偏好预览，待路线数据验证',
       active: false,
       disabled: true
     },
     {
       id: 'elevator',
       title: '电梯优先',
-      meta: '偏好预览，待路线数据验证',
+      meta: props.routeReady ? '偏好能力待接入' : '偏好预览，待路线数据验证',
       active: false,
       disabled: true
     }
diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue
index fb5b472..ddc648a 100644
--- a/src/pages/index/index.vue
+++ b/src/pages/index/index.vue
@@ -9,6 +9,7 @@
   >
     <GuideMapShell
       v-if="currentTab === 'guide'"
+      ref="guideMapShellRef"
       :search-text="guideSearchText"
       :active-mode="guideShellMode"
       :mode-layout="'status'"
@@ -35,18 +36,18 @@
       show-floor-header
       :show-layer-mode-toggle="false"
       :show-floor="is3DMode"
-      tools-top="calc(50% - 126px)"
+      tools-bottom="54px"
       show-zoom-controls
       zoom-controls-top="calc(100vh - 284px)"
-      show-location-control
-      location-control-bottom="54px"
       show-more-control
       more-control-bottom="54px"
       :tools="guide3DTools"
+      :camera-view="guideCameraView"
       :route-preview="activeRoutePreview"
       :show-route="Boolean(activeRoutePreview)"
       :auto-switch-threshold-low="0.58"
       :auto-switch-threshold-high="1.18"
+      :outdoor-nav-polylines="outdoorNavPolylines"
       @search-tap="handleGuideSearchTap"
       @mode-change="handleModeChange"
       @floor-change="handleFloorChange"
@@ -56,6 +57,7 @@
       @tool-click="handleGuideToolClick"
       @more-click="handleGuideMoreClick"
       @auto-switch="handleAutoSwitch"
+      @map-tap="handleMapTapForOutdoorNav"
     >
       <template #overlay>
         <view v-if="guideOutdoorState === 'entrance' && !is3DMode" class="entrance-tip">
@@ -123,16 +125,12 @@
         <view class="more-popover-handle" @tap.stop="closeGuideMoreMenu"></view>
         <view class="more-popover-grid">
           <view class="more-action" @tap="handleMoreRouteGuide">
-            <text class="more-action-title">线路预览</text>
-            <text class="more-action-desc">室内到室内</text>
+            <text class="more-action-title">{{ routePlannerEntryTitle }}</text>
+            <text class="more-action-desc">{{ routePlannerEntryDesc }}</text>
           </view>
-          <view class="more-action" @tap="handleMoreOutdoorReference">
-            <text class="more-action-title">室外参考</text>
-            <text class="more-action-desc">入口位置</text>
-          </view>
-          <view class="more-action" @tap="handleMoreRecommendedEntrance">
-            <text class="more-action-title">推荐入口</text>
-            <text class="more-action-desc">入口参考</text>
+          <view class="more-action" @tap="handleMoreOutdoorNav">
+            <text class="more-action-title">室外导航</text>
+            <text class="more-action-desc">导航到博物馆</text>
           </view>
         </view>
       </view>
@@ -149,6 +147,7 @@
         :summary="routePlanSummary"
         :picker-loading="routeTargetsLoading"
         :picker-error="routeTargetsError"
+        :route-ready="routeReady"
         @update:start-point="handleRouteStartPointChange"
         @update:end-point="handleRouteEndPointChange"
         @picker-open="handleRoutePickerOpen"
@@ -189,6 +188,27 @@
       </view>
     </GuideMapShell>
 
+    <OutdoorNavigationPanel
+      v-if="currentTab === 'guide'"
+      :visible="showOutdoorNavPanel"
+      :loading="outdoorNavLoading"
+      :route-error="outdoorNavError"
+      :route-distance="outdoorNavRoute?.distance ?? 0"
+      :route-duration="outdoorNavRoute?.duration ?? 0"
+      :selecting-manual-start="outdoorNavSelectingManualStart"
+      :start-point="outdoorNavStartPoint ? { ...outdoorNavStartPoint, name: '已选位置' } : null"
+      :start-mode="outdoorNavManualMode || outdoorNavStartPoint ? 'manual' : 'gps'"
+      @close="handleOutdoorNavClose"
+      @gps-start="handleOutdoorNavGpsStart"
+      @manual-start-request="handleOutdoorNavManualStartRequest"
+      @manual-start-cancel="handleOutdoorNavManualStartCancel"
+      @manual-start-confirm="handleOutdoorNavManualStartConfirm"
+      @travel-mode-change="handleOutdoorNavTravelModeChange"
+      @start-navigation="handleOutdoorNavStartNavigation"
+      @clear-route="handleOutdoorNavClearRoute"
+      @back="handleOutdoorNavBack"
+    />
+
     <view v-else-if="currentTab === 'explain'" class="explain-page">
       <ExplainHallSelect
         :halls="explainHallItems"
@@ -207,6 +227,7 @@ import { onLoad } from '@dcloudio/uni-app'
 import GuidePageFrame from '@/components/navigation/GuidePageFrame.vue'
 import GuideMapShell from '@/components/navigation/GuideMapShell.vue'
 import RoutePlannerPanel from '@/components/navigation/RoutePlannerPanel.vue'
+import OutdoorNavigationPanel from '@/components/navigation/OutdoorNavigationPanel.vue'
 import type {
   RoutePointOption
 } from '@/components/navigation/RoutePointPicker.vue'
@@ -236,6 +257,17 @@ import type {
   MuseumExhibit,
   MuseumFloor
 } from '@/domain/museum'
+import { MUSEUM_LOCATION, type TravelMode } from '@/config/museum'
+import {
+  planWalkingRoute,
+  planDrivingRoute,
+  planTransitRoute,
+  type Route,
+  type RoutePoint
+} from '@/services/tencent/TencentMapService'
+import {
+  navigateToMuseum
+} from '@/services/MapNavigationService'
 
 type GuideIndoorView = 'overview' | 'floor' | 'multi'
 type LayerDisplayMode = 'single' | 'multi'
@@ -282,6 +314,7 @@ const routeTargetsError = ref('')
 const routePlanning = ref(false)
 const routePlanError = ref('')
 const routePreviewUnavailableMessage = ref('')
+const routeReady = ref(false)
 const activeRoutePreview = ref<GuideRouteResult | null>(null)
 const showGuideMoreMenu = ref(false)
 const isSimulatingRoute = ref(false)
@@ -289,6 +322,22 @@ const isPoiCardCollapsed = ref(false)
 const guideMoreTouchStartY = ref(0)
 const guideMoreTouchCurrentY = ref(0)
 
+// GuideMapShell 组件引用，用于显式调用路线清除方法
+const guideMapShellRef = ref<{
+  clearRoute?: () => void
+} | null>(null)
+
+// 室外导航相关状态
+const showOutdoorNavPanel = ref(false)
+const outdoorNavLoading = ref(false)
+const outdoorNavError = ref('')
+const outdoorNavRoute = ref<Route | null>(null)
+const outdoorNavPolylines = ref<Array<{ points: Array<{ latitude: number; longitude: number }>; color: string; width: number }>>([])
+const outdoorNavStartPoint = ref<{ latitude: number; longitude: number } | null>(null)
+const outdoorNavTravelMode = ref<TravelMode>('walking')
+const outdoorNavSelectingManualStart = ref(false)
+const outdoorNavManualMode = ref(false)
+
 const indoorNavAssetBaseUrl = guideUseCase.getAssetBaseUrl()
 const indoorModelSource = guideUseCase.getModelSource()
 const guideFloors = ref<MuseumFloor[]>([])
@@ -297,7 +346,7 @@ const indoorLayerMode = computed<LayerDisplayMode>(() => (
   indoorView.value === 'multi' ? 'multi' : 'single'
 ))
 const guide3DTools = computed(() => {
-  return is3DMode.value ? ['重置', '俯视', '斜视', '清除', '清路线'] : []
+  return is3DMode.value ? ['视角'] : []
 })
 
 const routePlanSummary = computed(() => {
@@ -314,7 +363,13 @@ const routePlanSummary = computed(() => {
   return ''
 })
 
-const routePanelError = computed(() => routePlanError.value || routePreviewUnavailableMessage.value)
+const routePanelError = computed(() => routePlanError.value)
+
+const routePlannerEntryTitle = computed(() => '室内导览')
+
+const routePlannerEntryDesc = computed(() => (
+  routeReady.value ? '开始路线规划' : '查看室内位置'
+))
 
 const toRoutePointOption = (target: GuideRouteTarget): RoutePointOption => ({
   poiId: target.poiId,
@@ -333,9 +388,12 @@ const selectedGuidePoiSubtitle = computed(() => {
 })
 
 const routeSimulationStepText = computed(() => {
-  if (!activeRoutePreview.value) return '路线示意 · 查看预览'
+  if (!activeRoutePreview.value) return routeReady.value ? '室内导览 · 查看路线' : '室内导览 · 查看位置'
   const hasConnector = activeRoutePreview.value.connectorPoints.length > 0
-  return hasConnector ? '路线示意 · 跨楼层连接点' : '路线示意 · 同层位置关系'
+  if (routeReady.value) {
+    return hasConnector ? '室内导览 · 跨楼层路线' : '室内导览 · 同层路线'
+  }
+  return hasConnector ? '室内导览 · 跨楼层位置关系' : '室内导览 · 同层位置关系'
 })
 
 const explainHallItems = ref<ExplainHallSelectItem[]>([])
@@ -384,6 +442,8 @@ const handleTabChange = (tabId: GuideTopTab) => {
   showRoutePlanner.value = false
   isSimulatingRoute.value = false
   isPoiCardCollapsed.value = false
+  showOutdoorNavPanel.value = false
+  clearOutdoorNavState()
 }
 
 const syncTopTabFromHash = () => {
@@ -648,13 +708,14 @@ const handleSelectedPoiRelated = () => {
   })
 }
 
-const handleGuideToolClick = (tool: string) => {
-  if (tool === '清除') {
-    selectedGuidePoi.value = null
-  } else if (tool === '清路线') {
-    clearRoutePreviewState()
-    isSimulatingRoute.value = false
-  }
+const guideCameraView = ref<'reset' | 'top' | 'oblique'>('reset')
+
+const handleGuideToolClick = (_tool: string) => {
+  // 视角循环切换：重置 -> 俯视 -> 斜视 -> 重置
+  const viewOrder: Array<'reset' | 'top' | 'oblique'> = ['reset', 'top', 'oblique']
+  const currentIndex = viewOrder.indexOf(guideCameraView.value)
+  const nextIndex = (currentIndex + 1) % viewOrder.length
+  guideCameraView.value = viewOrder[nextIndex]
 }
 
 const loadRouteTargets = async (keyword = '') => {
@@ -679,11 +740,13 @@ const loadRouteTargets = async (keyword = '') => {
 const refreshRouteReadinessState = async () => {
   try {
     const readiness = await guideRouteUseCase.getRouteReadiness()
+    routeReady.value = readiness.ready
     routePreviewUnavailableMessage.value = readiness.ready
       ? ''
       : readiness.message || '当前暂不支持正式导航，可查看位置预览和路线示意'
   } catch (error) {
     console.warn('读取路线能力状态失败:', error)
+    routeReady.value = false
     routePreviewUnavailableMessage.value = '当前暂不支持正式导航，可查看位置预览和路线示意'
   }
 }
@@ -703,6 +766,7 @@ const openRoutePlanner = () => {
 }
 
 const clearRoutePreviewState = () => {
+  guideMapShellRef.value?.clearRoute?.()
   activeRoutePreview.value = null
   routePlanError.value = ''
   isSimulatingRoute.value = false
@@ -782,7 +846,7 @@ const handleRouteView = async ({ startPoint, endPoint }: { startPoint: RoutePoin
 
     if (!result.route) {
       activeRoutePreview.value = null
-      routePlanError.value = result.error || '路线预览生成失败'
+      routePlanError.value = result.error || '室内导览位置关系生成失败'
       return
     }
 
@@ -790,9 +854,9 @@ const handleRouteView = async ({ startPoint, endPoint }: { startPoint: RoutePoin
     focusRouteFloor(result.route)
     showRoutePlanner.value = true
   } catch (error) {
-    console.error('路线预览生成失败:', error)
+    console.error('室内导览位置关系生成失败:', error)
     activeRoutePreview.value = null
-    routePlanError.value = error instanceof Error ? error.message : '路线预览生成失败'
+    routePlanError.value = error instanceof Error ? error.message : '室内导览位置关系生成失败'
   } finally {
     routePlanning.value = false
   }
@@ -864,6 +928,7 @@ const handleGuideMoreClick = () => {
 
 const closeGuideMoreMenu = () => {
   showGuideMoreMenu.value = false
+  showOutdoorNavPanel.value = false
 }
 
 const getGestureClientY = (event: TouchEvent | MouseEvent) => {
@@ -914,23 +979,181 @@ const handleMoreRouteGuide = () => {
   openRoutePlanner()
 }
 
-const openOutdoorReference = (state: 'home' | 'entrance') => {
-  is3DMode.value = false
-  guideOutdoorState.value = state
-  indoorView.value = 'overview'
+// 室外导航处理函数
+const openOutdoorNavPanel = () => {
+  showOutdoorNavPanel.value = true
+  showGuideMoreMenu.value = false
+  showRoutePlanner.value = false
   selectedGuidePoi.value = null
   isPoiCardCollapsed.value = false
-  showRoutePlanner.value = false
-  showGuideMoreMenu.value = false
-  clearRoutePreviewState()
+  // 切换到室外 2D 地图
+  is3DMode.value = false
+  clearOutdoorNavState()
 }
 
-const handleMoreOutdoorReference = () => {
-  openOutdoorReference('home')
+const clearOutdoorNavState = () => {
+  outdoorNavRoute.value = null
+  outdoorNavPolylines.value = []
+  outdoorNavStartPoint.value = null
+  outdoorNavError.value = ''
+  outdoorNavLoading.value = false
+  outdoorNavSelectingManualStart.value = false
+  outdoorNavManualMode.value = false
 }
 
-const handleMoreRecommendedEntrance = () => {
-  openOutdoorReference('entrance')
+const handleMoreOutdoorNav = () => {
+  openOutdoorNavPanel()
+}
+
+const handleOutdoorNavClose = () => {
+  showOutdoorNavPanel.value = false
+  clearOutdoorNavState()
+}
+
+const handleOutdoorNavBack = () => {
+  showOutdoorNavPanel.value = false
+  clearOutdoorNavState()
+}
+
+const handleOutdoorNavGpsStart = () => {
+  outdoorNavLoading.value = true
+  outdoorNavError.value = ''
+
+  uni.getLocation({
+    type: 'gcj02',
+    success: (res) => {
+      console.log('GPS 定位成功:', res)
+      outdoorNavStartPoint.value = {
+        latitude: res.latitude,
+        longitude: res.longitude
+      }
+      void planOutdoorRoute({
+        latitude: res.latitude,
+        longitude: res.longitude
+      })
+    },
+    fail: (err) => {
+      console.error('GPS 定位失败:', err)
+      const errMsg = err.errMsg || ''
+      if (errMsg.includes('auth deny') || errMsg.includes('auth reject')) {
+        outdoorNavError.value = '定位权限被拒绝，请在设置中开启'
+      } else if (errMsg.includes('timeout')) {
+        outdoorNavError.value = '定位超时，请重试'
+      } else if (errMsg.includes('unavailable')) {
+        outdoorNavError.value = '位置服务不可用，请检查设备设置'
+      } else {
+        outdoorNavError.value = '定位失败，请检查位置权限'
+      }
+      outdoorNavLoading.value = false
+    }
+  })
+}
+
+const handleOutdoorNavManualStartRequest = () => {
+  outdoorNavManualMode.value = true
+  outdoorNavSelectingManualStart.value = true
+  uni.showToast({
+    title: '输入地址搜索，或点击地图选择起点',
+    icon: 'none'
+  })
+}
+
+const handleOutdoorNavManualStartCancel = () => {
+  outdoorNavManualMode.value = false
+  outdoorNavSelectingManualStart.value = false
+}
+
+const handleOutdoorNavManualStartConfirm = (location: { latitude: number; longitude: number }) => {
+  outdoorNavStartPoint.value = location
+  outdoorNavManualMode.value = false
+  outdoorNavSelectingManualStart.value = false
+  void planOutdoorRoute(location)
+}
+
+const handleOutdoorNavTravelModeChange = (mode: TravelMode) => {
+  outdoorNavTravelMode.value = mode
+  if (outdoorNavStartPoint.value) {
+    outdoorNavLoading.value = true
+    void planOutdoorRoute(outdoorNavStartPoint.value)
+  }
+}
+
+const planOutdoorRoute = async (from: { latitude: number; longitude: number }) => {
+  outdoorNavLoading.value = true
+  outdoorNavError.value = ''
+
+  const to: RoutePoint = {
+    latitude: MUSEUM_LOCATION.latitude,
+    longitude: MUSEUM_LOCATION.longitude
+  }
+
+  try {
+    let result
+    switch (outdoorNavTravelMode.value) {
+      case 'walking':
+        result = await planWalkingRoute(from, to)
+        break
+      case 'driving':
+        result = await planDrivingRoute(from, to)
+        break
+      case 'transit':
+        result = await planTransitRoute(from, to)
+        break
+      default:
+        result = await planWalkingRoute(from, to)
+    }
+
+    if (result.status === 0 && result.routes && result.routes.length > 0) {
+      const route = result.routes[0]
+      outdoorNavRoute.value = route
+      outdoorNavPolylines.value = [{
+        points: route.polyline,
+        color: '#E0E100',
+        width: 6
+      }]
+      console.log('路线规划成功:', {
+        distance: route.distance,
+        duration: route.duration,
+        steps: route.steps.length
+      })
+    } else {
+      outdoorNavError.value = result.message || '路线规划失败'
+      outdoorNavRoute.value = null
+      outdoorNavPolylines.value = []
+    }
+  } catch (error) {
+    console.error('路线规划异常:', error)
+    outdoorNavError.value = '路线规划失败，请重试'
+    outdoorNavRoute.value = null
+    outdoorNavPolylines.value = []
+  } finally {
+    outdoorNavLoading.value = false
+  }
+}
+
+const handleOutdoorNavStartNavigation = async () => {
+  // 直接调起导航
+  await navigateToMuseum()
+}
+
+const handleOutdoorNavClearRoute = () => {
+  outdoorNavRoute.value = null
+  outdoorNavPolylines.value = []
+  outdoorNavStartPoint.value = null
+  outdoorNavError.value = ''
+}
+
+// 处理地图点击（用于手动选择起点）
+const handleMapTapForOutdoorNav = (location: { latitude?: number; longitude?: number }) => {
+  if (!outdoorNavSelectingManualStart.value) return
+
+  const latitude = location.latitude
+  const longitude = location.longitude
+  if (latitude !== undefined && longitude !== undefined) {
+    outdoorNavStartPoint.value = { latitude, longitude }
+    outdoorNavSelectingManualStart.value = false
+    void planOutdoorRoute({ latitude, longitude })
+  }
 }
 
 const guideShellMode = computed(() => (is3DMode.value ? '3d' : '2d'))
diff --git a/src/repositories/SdkGuideRouteRepository.ts b/src/repositories/SdkGuideRouteRepository.ts
new file mode 100644
index 0000000..015c996
--- /dev/null
+++ b/src/repositories/SdkGuideRouteRepository.ts
@@ -0,0 +1,226 @@
+import type {
+  GuideRouteReadiness,
+  GuideRouteResult,
+  GuideRouteTarget
+} from '@/domain/museum'
+import {
+  NAV_ROUTE_READINESS
+} from '@/domain/guideReadiness'
+import {
+  GuideRouteError
+} from '@/repositories/GuideRouteRepository'
+import {
+  defaultSgsSdkApiProvider,
+  type SgsNavigablePlacePayload,
+  type SgsSdkApiProvider
+} from '@/data/providers/sgsSdkApiProvider'
+import {
+  toGuideRouteResultFromSgsPlan
+} from '@/data/adapters/sgsSdkRouteAdapter'
+import { stringifyId, formatSgsFloorLabel } from '@/data/adapters/sgsSdkGuideAdapter'
+import { toAppFloorId } from '@/services/sgs/SgsMapEventAdapter'
+
+const createUnavailableReadiness = (message: string): GuideRouteReadiness => ({
+  ready: false,
+  message,
+  requiredData: ['route_graph', 'nav_data']
+})
+
+const toNumber = (value: unknown) => (
+  Number.isFinite(Number(value)) ? Number(value) : undefined
+)
+
+const positionFromPlace = (place: SgsNavigablePlacePayload): [number, number, number] | undefined => {
+  const source = place.position || {
+    x: place.x,
+    y: place.y,
+    z: place.z
+  }
+  const x = toNumber(source.x)
+  const z = toNumber(source.z)
+
+  if (typeof x !== 'number' || typeof z !== 'number') return undefined
+
+  return [
+    x,
+    toNumber(source.y) || 0,
+    z
+  ]
+}
+
+const numericId = (value: unknown) => {
+  const numberValue = Number(value)
+  return Number.isFinite(numberValue) ? numberValue : undefined
+}
+
+export class SdkGuideRouteRepository {
+  private targetsCache: GuideRouteTarget[] | null = null
+
+  constructor(
+    private readonly sdkApiProvider: SgsSdkApiProvider = defaultSgsSdkApiProvider
+  ) {}
+
+  async getRouteReadiness(): Promise<GuideRouteReadiness> {
+    try {
+      const diagnostics = await this.sdkApiProvider.getMapDiagnostics()
+      const floors = diagnostics.floors || []
+
+      if (!floors.length) {
+        return createUnavailableReadiness('SDK 地图楼层数据为空')
+      }
+
+      // 收集有路线数据的楼层
+      const readyFloors = floors.filter(
+        (floor) =>
+          floor.routePlanningReady &&
+          floor.routeNodeCount &&
+          floor.routeNodeCount > 0 &&
+          floor.routeEdgeCount &&
+          floor.routeEdgeCount > 0
+      )
+
+      // 没有楼层有路线数据时不可用
+      if (readyFloors.length === 0) {
+        return createUnavailableReadiness('SDK 路线规划数据不完整，当前暂不支持正式导航')
+      }
+
+      // 收集未就绪的楼层
+      const notReadyFloors = floors.filter((floor) => !floor.routePlanningReady)
+
+      // 如果有楼层未就绪，给出警告但仍然可用
+      if (notReadyFloors.length > 0) {
+        const floorLabels = notReadyFloors
+          .map((f) => f.floorName || f.floorCode || String(f.floorId))
+          .join('、')
+        return {
+          ready: true,
+          message: `部分楼层路线数据未就绪：${floorLabels}，已就绪楼层可正常使用导览功能`,
+          requiredData: []
+        }
+      }
+
+      return {
+        ready: true,
+        message: 'SDK 路线数据已就绪',
+        requiredData: []
+      }
+    } catch (error) {
+      return createUnavailableReadiness(
+        error instanceof Error ? error.message : 'SDK 路线数据加载失败'
+      )
+    }
+  }
+
+  async listRouteTargets(): Promise<GuideRouteTarget[]> {
+    if (this.targetsCache) return this.targetsCache
+
+    const diagnostics = await this.sdkApiProvider.getMapDiagnostics()
+    const floors = diagnostics.floors || []
+
+    const targets: GuideRouteTarget[] = []
+
+    for (const floor of floors) {
+      // 使用原始 floorId 请求 API（SDK API 需要原始 ID 如 2065808921272119298）
+      const rawFloorId = stringifyId(floor.floorId)
+      try {
+        const places = await this.sdkApiProvider.getNavigablePlaces(rawFloorId)
+
+        for (const place of places) {
+          // 过滤掉没有 nodeId 的点位，这些无法用于路线规划
+          if (place.nodeId === null || place.nodeId === undefined || place.nodeId === '') {
+            continue
+          }
+
+          const placeId = stringifyId(place.id)
+          const placeName = place.name || `目的地 ${placeId}`
+          const categoryLabel = place.category || place.typeName || place.typeCode || place.type || undefined
+          const positionGltf = positionFromPlace(place)
+
+          // 使用统一的楼层标签格式化函数，确保与 nav-assets 格式一致
+          const floorLabel = formatSgsFloorLabel(
+            place.floorCode || undefined,
+            place.floorName || floor.floorName || undefined
+          )
+
+          targets.push({
+            poiId: placeId,
+            name: placeName,
+            // 展示用标准化的 floorId（如 L1）
+            floorId: toAppFloorId(place.floorId ?? rawFloorId),
+            floorLabel,
+            categoryLabel,
+            positionGltf,
+            // 保存原始 nodeId 用于 API 调用
+            routeNodeId: stringifyId(place.nodeId)
+          })
+        }
+      } catch {
+        // 忽略单个楼层的加载错误
+      }
+    }
+
+    this.targetsCache = targets
+    return targets
+  }
+
+  async findRoute(startPoiId: string, endPoiId: string): Promise<GuideRouteResult> {
+    const readiness = await this.getRouteReadiness()
+    if (!readiness.ready) {
+      throw new GuideRouteError(
+        'ROUTE_DATA_UNAVAILABLE',
+        readiness.message || NAV_ROUTE_READINESS.message
+      )
+    }
+
+    if (!startPoiId || !endPoiId) {
+      throw new GuideRouteError('ROUTE_TARGET_MISSING', '请选择起点和终点')
+    }
+
+    if (startPoiId === endPoiId) {
+      throw new GuideRouteError('ROUTE_TARGET_MISSING', '起点和终点不能相同')
+    }
+
+    const targets = await this.listRouteTargets()
+    const startTarget = targets.find((target) => target.poiId === startPoiId)
+    const endTarget = targets.find((target) => target.poiId === endPoiId)
+
+    if (!startTarget || !endTarget) {
+      throw new GuideRouteError('ROUTE_TARGET_MISSING', '起点或终点不在 SDK 可导航目的地列表中')
+    }
+
+    try {
+      if (!startTarget.positionGltf || !endTarget.positionGltf) {
+        throw new GuideRouteError('ROUTE_TARGET_UNANCHORED', '起点或终点缺少可规划坐标')
+      }
+
+      // 获取原始 floorId 用于 API 调用
+      const diagnostics = await this.sdkApiProvider.getMapDiagnostics()
+      const floorIdMap = new Map<string, string>()
+      for (const floor of diagnostics.floors || []) {
+        floorIdMap.set(toAppFloorId(floor.floorId), stringifyId(floor.floorId))
+      }
+      const rawStartFloorId = floorIdMap.get(startTarget.floorId) || startTarget.floorId
+      const rawEndFloorId = floorIdMap.get(endTarget.floorId) || endTarget.floorId
+
+      const route = await this.sdkApiProvider.planRoute({
+        startFloorId: rawStartFloorId,
+        startX: startTarget.positionGltf[0],
+        startY: startTarget.positionGltf[2],
+        startNodeId: numericId(startTarget.routeNodeId) || null,
+        endFloorId: rawEndFloorId,
+        endX: endTarget.positionGltf[0],
+        endY: endTarget.positionGltf[2],
+        endNodeId: numericId(endTarget.routeNodeId) || null,
+        wheelchair: 0
+      })
+
+      return toGuideRouteResultFromSgsPlan(route, startTarget, endTarget)
+    } catch (error) {
+      if (error instanceof GuideRouteError) throw error
+      throw new GuideRouteError(
+        'ROUTE_NOT_FOUND',
+        error instanceof Error ? error.message : 'SGS 路线接口规划失败'
+      )
+    }
+  }
+}