优化导览页面面板与楼层交互

src/pages/index/index.vue

@@ -24,19 +24,20 @@
       :indoor-model-source="indoorModelSource"
       :floors="guideFloors"
       :normalize-floor-id="normalizeGuideFloorId"
-      indoor-initial-view="floor"
+      indoor-initial-view="overview"
       :indoor-view="indoorView"
       :layer-mode="indoorLayerMode"
       :active-floor="activeGuideFloor"
       layer-mode-toggle-top="154px"
-      floor-top="420px"
-      floor-side="left"
+      floor-top="clamp(128px, 18vh, 180px)"
+      floor-max-height="min(342px, calc(100vh - clamp(128px, 18vh, 180px) - 300px))"
+      floor-side="right"
       show-floor-header
       :show-layer-mode-toggle="false"
       :show-floor="is3DMode"
-      tools-top="130px"
+      tools-top="calc(50% - 126px)"
       show-zoom-controls
-      zoom-controls-top="560px"
+      zoom-controls-top="calc(100vh - 284px)"
       show-location-control
       location-control-bottom="54px"
       show-more-control
@@ -44,6 +45,8 @@
       :tools="guide3DTools"
       :route-preview="activeRoutePreview"
       :show-route="Boolean(activeRoutePreview)"
+      :auto-switch-threshold-low="0.58"
+      :auto-switch-threshold-high="1.18"
       @search-tap="handleGuideSearchTap"
       @mode-change="handleModeChange"
       @floor-change="handleFloorChange"
@@ -107,8 +110,17 @@
         </template>
       </view>
 
-      <view v-if="showGuideMoreMenu && !showRoutePlanner" class="guide-more-popover">
-        <view class="more-popover-handle"></view>
+      <view
+        v-if="showGuideMoreMenu && !showRoutePlanner"
+        class="guide-more-popover"
+        @touchstart.stop="handleGuideMoreTouchStart"
+        @touchmove.stop="handleGuideMoreTouchMove"
+        @touchend.stop="handleGuideMoreTouchEnd"
+        @mousedown.stop="handleGuideMoreMouseStart"
+        @mousemove.stop="handleGuideMoreMouseMove"
+        @mouseup.stop="handleGuideMoreMouseEnd"
+      >
+        <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>
@@ -122,14 +134,6 @@
             <text class="more-action-title">推荐入口</text>
             <text class="more-action-desc">入口参考</text>
           </view>
-          <view class="more-action" @tap="handleEnter3DMode">
-            <text class="more-action-title">室内3D</text>
-            <text class="more-action-desc">位置预览</text>
-          </view>
-          <view class="more-action" @tap="handleMoreToggleLayer">
-            <text class="more-action-title">{{ indoorLayerMode === 'multi' ? '单层' : '多层' }}</text>
-            <text class="more-action-desc">切换楼层</text>
-          </view>
         </view>
       </view>
 
@@ -153,6 +157,7 @@
         @clear="handleRouteClear"
         @view-route="handleRouteView"
         @simulate-guide="handleRouteSimulate"
+        @back="handleRouteBack"
       />
 
       <view v-if="isSimulatingRoute && activeRoutePreview" class="route-sim-top-pill">
@@ -262,7 +267,7 @@ const initialTopTab = (): GuideTopTab => topTabFromHash() || 'guide'
 // 3D 模式状态
 const is3DMode = ref(true)
 const guideOutdoorState = ref<'home' | 'entrance'>('home')
-const indoorView = ref<GuideIndoorView>('floor')
+const indoorView = ref<GuideIndoorView>('overview')
 const activeGuideFloor = ref('1F')
 const selectedGuidePoi = ref<GuideRenderPoi | null>(null)
 
@@ -281,6 +286,8 @@ const activeRoutePreview = ref<GuideRouteResult | null>(null)
 const showGuideMoreMenu = ref(false)
 const isSimulatingRoute = ref(false)
 const isPoiCardCollapsed = ref(false)
+const guideMoreTouchStartY = ref(0)
+const guideMoreTouchCurrentY = ref(0)
 
 const indoorNavAssetBaseUrl = guideUseCase.getAssetBaseUrl()
 const indoorModelSource = guideUseCase.getModelSource()
@@ -530,8 +537,9 @@ const buildExplainHallItems = (
 }
 
 const handleGuideSearchTap = () => {
-  uni.navigateTo({
-    url: '/pages/search/index'
+  uni.showToast({
+    title: '功能待开放',
+    icon: 'none'
   })
 }
 
@@ -707,6 +715,19 @@ const handleRouteClear = () => {
   clearRoutePreviewState()
 }
 
+const handleRouteBack = () => {
+  if (activeRoutePreview.value) {
+    activeRoutePreview.value = null
+    routePlanError.value = ''
+    isSimulatingRoute.value = false
+    showRoutePlanner.value = true
+    return
+  }
+
+  showRoutePlanner.value = false
+  isSimulatingRoute.value = false
+}
+
 const handleRouteStartPointChange = (point: RoutePointOption | null) => {
   routeStartPoint.value = point
   clearRoutePreviewState()
@@ -789,7 +810,7 @@ const handleRouteSimulate = () => {
 // 进入 3D 室内模式
 const handleEnter3DMode = () => {
   console.log('进入 3D 室内模式')
-  indoorView.value = 'floor'
+  indoorView.value = 'overview'
   is3DMode.value = true
   guideOutdoorState.value = 'home'
   showGuideMoreMenu.value = false
@@ -811,7 +832,7 @@ const handleModeChange = (mode: '2d' | '3d') => {
     isSimulatingRoute.value = false
     clearRoutePreviewState()
   } else {
-    indoorView.value = 'floor'
+    indoorView.value = 'overview'
     if (!routePointOptions.value.length) {
       void loadRouteTargets()
     }
@@ -841,6 +862,54 @@ const handleGuideMoreClick = () => {
   selectedGuidePoi.value = null
 }
 
+const closeGuideMoreMenu = () => {
+  showGuideMoreMenu.value = false
+}
+
+const getGestureClientY = (event: TouchEvent | MouseEvent) => {
+  if ('changedTouches' in event) {
+    return event.changedTouches?.[0]?.clientY
+      ?? event.touches?.[0]?.clientY
+      ?? 0
+  }
+
+  return event.clientY
+}
+
+const handleGuideMoreTouchStart = (event: TouchEvent) => {
+  const clientY = getGestureClientY(event)
+  guideMoreTouchStartY.value = clientY
+  guideMoreTouchCurrentY.value = clientY
+}
+
+const handleGuideMoreTouchMove = (event: TouchEvent) => {
+  guideMoreTouchCurrentY.value = getGestureClientY(event)
+}
+
+const handleGuideMoreTouchEnd = (event: TouchEvent) => {
+  guideMoreTouchCurrentY.value = getGestureClientY(event)
+  if (guideMoreTouchCurrentY.value - guideMoreTouchStartY.value > 48) {
+    closeGuideMoreMenu()
+  }
+}
+
+const handleGuideMoreMouseStart = (event: MouseEvent) => {
+  const clientY = getGestureClientY(event)
+  guideMoreTouchStartY.value = clientY
+  guideMoreTouchCurrentY.value = clientY
+}
+
+const handleGuideMoreMouseMove = (event: MouseEvent) => {
+  guideMoreTouchCurrentY.value = getGestureClientY(event)
+}
+
+const handleGuideMoreMouseEnd = (event: MouseEvent) => {
+  guideMoreTouchCurrentY.value = getGestureClientY(event)
+  if (guideMoreTouchCurrentY.value - guideMoreTouchStartY.value > 48) {
+    closeGuideMoreMenu()
+  }
+}
+
 const handleMoreRouteGuide = () => {
   openRoutePlanner()
 }
@@ -864,13 +933,6 @@ const handleMoreRecommendedEntrance = () => {
   openOutdoorReference('entrance')
 }
 
-const handleMoreToggleLayer = () => {
-  is3DMode.value = true
-  guideOutdoorState.value = 'home'
-  indoorView.value = indoorLayerMode.value === 'multi' ? 'floor' : 'multi'
-  showGuideMoreMenu.value = false
-}
-
 const guideShellMode = computed(() => (is3DMode.value ? '3d' : '2d'))
 const guideMapType = computed(() => (is3DMode.value ? 'indoor' : 'outdoor'))
 const guideOutdoorVariant = computed(() => (