feat: wire guide data source and POI focus UI
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
@@ -4,9 +4,11 @@
|
||||
<template v-if="mapType === 'indoor'">
|
||||
<!-- #ifdef H5 -->
|
||||
<ThreeMap
|
||||
v-if="indoorModelSource"
|
||||
ref="threeMapRef"
|
||||
class="indoor-three-map"
|
||||
:asset-base-url="indoorAssetBaseUrl"
|
||||
:model-source="indoorModelSource"
|
||||
:initial-floor-id="activeFloorId"
|
||||
:initial-view="indoorInitialView"
|
||||
:show-controls="false"
|
||||
@@ -23,7 +25,11 @@
|
||||
<!-- #endif -->
|
||||
</template>
|
||||
<view v-else class="outdoor-map-bg">
|
||||
<TencentMap class="outdoor-map" />
|
||||
<TencentMap
|
||||
class="outdoor-map"
|
||||
:active-floor="activeFloor"
|
||||
:floors="props.floors"
|
||||
/>
|
||||
</view>
|
||||
<view v-if="dimmed" class="dim-layer"></view>
|
||||
</view>
|
||||
@@ -105,7 +111,7 @@
|
||||
|
||||
<view v-if="showFloor" class="floor-switcher" :style="floorSwitcherStyle">
|
||||
<view
|
||||
v-for="floor in floors"
|
||||
v-for="floor in floorLabels"
|
||||
:key="floor"
|
||||
class="floor-item"
|
||||
:class="{ active: activeFloor === floor }"
|
||||
@@ -136,11 +142,14 @@ import TencentMap from '@/components/map/TencentMap.vue'
|
||||
// #ifdef H5
|
||||
import ThreeMap from '@/components/map/ThreeMap.vue'
|
||||
// #endif
|
||||
import {
|
||||
NAV_ASSET_BASE_URL,
|
||||
NAV_FLOOR_OPTIONS,
|
||||
navFloorIdFromLabel
|
||||
} from '@/services/navAssets'
|
||||
import type {
|
||||
GuideModelSource
|
||||
} from '@/domain/guideModel'
|
||||
|
||||
interface GuideFloorOption {
|
||||
id: string
|
||||
label: string
|
||||
}
|
||||
|
||||
interface TargetPoiFocusRequest {
|
||||
requestId: number | string
|
||||
@@ -183,6 +192,9 @@ const props = withDefaults(defineProps<{
|
||||
mapType?: 'indoor' | 'outdoor'
|
||||
outdoorVariant?: 'home' | 'entrance'
|
||||
indoorAssetBaseUrl?: string
|
||||
indoorModelSource?: GuideModelSource
|
||||
floors?: GuideFloorOption[]
|
||||
normalizeFloorId?: (labelOrId: string) => string
|
||||
dimmed?: boolean
|
||||
targetFocusRequest?: TargetPoiFocusRequest | null
|
||||
}>(), {
|
||||
@@ -205,7 +217,10 @@ const props = withDefaults(defineProps<{
|
||||
modeStatusTone: 'solid',
|
||||
mapType: 'indoor',
|
||||
outdoorVariant: 'home',
|
||||
indoorAssetBaseUrl: NAV_ASSET_BASE_URL,
|
||||
indoorAssetBaseUrl: '',
|
||||
indoorModelSource: undefined,
|
||||
floors: () => [] as GuideFloorOption[],
|
||||
normalizeFloorId: (labelOrId: string) => labelOrId,
|
||||
dimmed: false,
|
||||
targetFocusRequest: null
|
||||
})
|
||||
@@ -223,9 +238,11 @@ const threeMapRef = ref<{
|
||||
switchFloor?: (floorId: string) => Promise<void> | void
|
||||
showOverview?: () => Promise<void> | void
|
||||
} | null>(null)
|
||||
const floors = NAV_FLOOR_OPTIONS.map((floor) => floor.label)
|
||||
|
||||
const activeFloorId = computed(() => navFloorIdFromLabel(props.activeFloor))
|
||||
const floorLabels = computed(() => props.floors.map((floor) => floor.label))
|
||||
const indoorModelSource = computed(() => props.indoorModelSource)
|
||||
|
||||
const activeFloorId = computed(() => props.normalizeFloorId(props.activeFloor))
|
||||
|
||||
const searchFieldStyle = computed(() => ({
|
||||
top: props.searchTop
|
||||
@@ -258,7 +275,7 @@ const handleModeChange = (mode: '2d' | '3d') => {
|
||||
}
|
||||
|
||||
const handleFloorChange = (floor: string) => {
|
||||
const floorId = navFloorIdFromLabel(floor)
|
||||
const floorId = props.normalizeFloorId(floor)
|
||||
void threeMapRef.value?.switchFloor?.(floorId)
|
||||
emit('indoorViewChange', 'floor')
|
||||
emit('floorChange', floor)
|
||||
@@ -507,10 +524,11 @@ const handleTargetFocus = (result: TargetPoiFocusResult) => {
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
width: 46px;
|
||||
height: 218px;
|
||||
height: auto;
|
||||
max-height: calc(100vh - 260px);
|
||||
padding: 1px;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow: visible;
|
||||
background: rgba(255, 255, 255, 0.84);
|
||||
border: 1px solid #dde5df;
|
||||
border-radius: 10px;
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
<text class="action-text">查看室外地图</text>
|
||||
</view>
|
||||
<view class="action-btn primary" @tap="handleShowTargetLocation">
|
||||
<text class="action-text">查看目标位置</text>
|
||||
<text class="action-text">重新定位目标</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
Reference in New Issue
Block a user