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

src/components/navigation/RoutePlannerPanel.vue

@@ -1,5 +1,15 @@
 <template>
-  <view v-if="visible" class="route-planner-panel" :class="{ collapsed: isCollapsed }">
+  <view
+    v-if="visible"
+    class="route-planner-panel"
+    :class="{ collapsed: isCollapsed }"
+    @touchstart.stop="handlePanelTouchStart"
+    @touchmove.stop="handlePanelTouchMove"
+    @touchend.stop="handlePanelTouchEnd"
+    @mousedown.stop="handlePanelMouseStart"
+    @mousemove.stop="handlePanelMouseMove"
+    @mouseup.stop="handlePanelMouseEnd"
+  >
     <view class="panel-handle" @tap.stop="toggleCollapsed"></view>
 
     <view v-if="isCollapsed" class="panel-collapsed" @tap="expandPanel">
@@ -19,6 +29,9 @@
           <text v-if="summary" class="panel-summary">{{ summary }}</text>
         </view>
         <view class="panel-actions">
+          <view class="panel-light-action" @tap="handleBack">
+            <text class="panel-light-action-text">返回</text>
+          </view>
           <view class="panel-light-action" @tap="collapsePanel">
             <text class="panel-light-action-text">收起</text>
           </view>
@@ -94,6 +107,7 @@
       :loading="pickerLoading"
       :error="pickerError"
       :empty-text="pickerEmptyText"
+      close-text="返回"
       @close="closePicker"
       @select="handlePointSelect"
       @search="handlePickerSearch"
@@ -148,10 +162,13 @@ const emit = defineEmits<{
   clear: []
   viewRoute: [payload: { startPoint: RoutePointOption; endPoint: RoutePointOption }]
   simulateGuide: []
+  back: []
 }>()
 
 const pickerMode = ref<PickerMode>('')
 const isCollapsed = ref(false)
+const panelTouchStartY = ref(0)
+const panelTouchCurrentY = ref(0)
 
 const pickerTitle = computed(() => (
   pickerMode.value === 'start' ? '选择起点' : '选择终点'
@@ -274,6 +291,15 @@ const handleClear = () => {
   emit('clear')
 }
 
+const handleBack = () => {
+  if (pickerMode.value) {
+    closePicker()
+    return
+  }
+
+  emit('back')
+}
+
 const collapsePanel = () => {
   isCollapsed.value = true
 }
@@ -286,6 +312,56 @@ const toggleCollapsed = () => {
   isCollapsed.value = !isCollapsed.value
 }
 
+const getGestureClientY = (event: TouchEvent | MouseEvent) => {
+  if ('changedTouches' in event) {
+    return event.changedTouches?.[0]?.clientY
+      ?? event.touches?.[0]?.clientY
+      ?? 0
+  }
+
+  return event.clientY
+}
+
+const handlePanelTouchStart = (event: TouchEvent) => {
+  if (pickerMode.value) return
+  const clientY = getGestureClientY(event)
+  panelTouchStartY.value = clientY
+  panelTouchCurrentY.value = clientY
+}
+
+const handlePanelTouchMove = (event: TouchEvent) => {
+  if (pickerMode.value) return
+  panelTouchCurrentY.value = getGestureClientY(event)
+}
+
+const handlePanelTouchEnd = (event: TouchEvent) => {
+  if (pickerMode.value) return
+  panelTouchCurrentY.value = getGestureClientY(event)
+  if (panelTouchCurrentY.value - panelTouchStartY.value > 48) {
+    collapsePanel()
+  }
+}
+
+const handlePanelMouseStart = (event: MouseEvent) => {
+  if (pickerMode.value) return
+  const clientY = getGestureClientY(event)
+  panelTouchStartY.value = clientY
+  panelTouchCurrentY.value = clientY
+}
+
+const handlePanelMouseMove = (event: MouseEvent) => {
+  if (pickerMode.value) return
+  panelTouchCurrentY.value = getGestureClientY(event)
+}
+
+const handlePanelMouseEnd = (event: MouseEvent) => {
+  if (pickerMode.value) return
+  panelTouchCurrentY.value = getGestureClientY(event)
+  if (panelTouchCurrentY.value - panelTouchStartY.value > 48) {
+    collapsePanel()
+  }
+}
+
 const handleViewRoute = () => {
   if (!canViewRoute.value || !props.startPoint || !props.endPoint) return