Compare commits
2 Commits
eca85b9fed
...
a71994d490
| Author | SHA1 | Date | |
|---|---|---|---|
| a71994d490 | |||
| ad692e233a |
@@ -1,175 +0,0 @@
|
|||||||
<template>
|
|
||||||
<view class="guide-bottom-nav">
|
|
||||||
<view class="guide-bottom-nav-inner">
|
|
||||||
<view
|
|
||||||
v-for="tab in bottomNavTabs"
|
|
||||||
:key="tab.id"
|
|
||||||
class="guide-bottom-tab"
|
|
||||||
:class="[`tab-${tab.id}`, { active: activeTab === tab.id }]"
|
|
||||||
@tap="handleTabTap(tab.id)"
|
|
||||||
>
|
|
||||||
<view class="guide-bottom-icon" aria-hidden="true">
|
|
||||||
<template v-if="tab.id === 'guide'">
|
|
||||||
<view class="guide-icon-pin"></view>
|
|
||||||
<view class="guide-icon-path"></view>
|
|
||||||
</template>
|
|
||||||
<template v-else>
|
|
||||||
<view class="explain-icon-wave top"></view>
|
|
||||||
<view class="explain-icon-wave middle"></view>
|
|
||||||
<view class="explain-icon-wave bottom"></view>
|
|
||||||
</template>
|
|
||||||
</view>
|
|
||||||
<text class="guide-bottom-label">{{ tab.label }}</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup lang="ts">
|
|
||||||
import {
|
|
||||||
GUIDE_TOP_TABS,
|
|
||||||
type GuideTopTab
|
|
||||||
} from '@/utils/guideTopTabs'
|
|
||||||
|
|
||||||
const bottomNavTabs = GUIDE_TOP_TABS.filter((tab) => tab.id !== 'explain')
|
|
||||||
|
|
||||||
withDefaults(defineProps<{
|
|
||||||
activeTab?: GuideTopTab
|
|
||||||
}>(), {
|
|
||||||
activeTab: 'guide'
|
|
||||||
})
|
|
||||||
|
|
||||||
const emit = defineEmits<{
|
|
||||||
tabChange: [tab: GuideTopTab]
|
|
||||||
}>()
|
|
||||||
|
|
||||||
const handleTabTap = (tab: GuideTopTab) => {
|
|
||||||
emit('tabChange', tab)
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
.guide-bottom-nav {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
padding: 8px 14px calc(8px + env(safe-area-inset-bottom));
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: rgba(255, 255, 255, 0.96);
|
|
||||||
border-top: 1px solid #e6e8df;
|
|
||||||
box-shadow: 0 -10px 24px rgba(36, 49, 42, 0.1);
|
|
||||||
z-index: 2200;
|
|
||||||
transform: translateZ(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-bottom-nav-inner {
|
|
||||||
height: 56px;
|
|
||||||
display: grid;
|
|
||||||
grid-template-columns: minmax(0, 1fr);
|
|
||||||
gap: 10px;
|
|
||||||
padding: 4px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: #f4f5ef;
|
|
||||||
border: 1px solid #dfe2d9;
|
|
||||||
border-radius: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-bottom-tab {
|
|
||||||
min-width: 0;
|
|
||||||
height: 46px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 8px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 6px;
|
|
||||||
color: #515151;
|
|
||||||
transition: background-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-bottom-tab.active {
|
|
||||||
background: #000000;
|
|
||||||
color: var(--museum-accent);
|
|
||||||
box-shadow: 0 6px 14px rgba(0, 0, 0, 0.14);
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-bottom-tab:active {
|
|
||||||
transform: translateY(1px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-bottom-icon {
|
|
||||||
position: relative;
|
|
||||||
width: 22px;
|
|
||||||
height: 22px;
|
|
||||||
flex: 0 0 22px;
|
|
||||||
color: currentColor;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-icon-pin {
|
|
||||||
position: absolute;
|
|
||||||
left: 4px;
|
|
||||||
top: 1px;
|
|
||||||
width: 12px;
|
|
||||||
height: 15px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 2px solid currentColor;
|
|
||||||
border-radius: 8px 8px 8px 0;
|
|
||||||
transform: rotate(-45deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-icon-pin::after {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
left: 3px;
|
|
||||||
top: 3px;
|
|
||||||
width: 3px;
|
|
||||||
height: 3px;
|
|
||||||
background: currentColor;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-icon-path {
|
|
||||||
position: absolute;
|
|
||||||
left: 1px;
|
|
||||||
right: 1px;
|
|
||||||
bottom: 2px;
|
|
||||||
height: 6px;
|
|
||||||
border-bottom: 2px solid currentColor;
|
|
||||||
border-left: 2px solid currentColor;
|
|
||||||
border-radius: 0 0 0 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.explain-icon-wave {
|
|
||||||
position: absolute;
|
|
||||||
left: 2px;
|
|
||||||
right: 2px;
|
|
||||||
height: 4px;
|
|
||||||
border: 2px solid currentColor;
|
|
||||||
border-left: 0;
|
|
||||||
border-right: 0;
|
|
||||||
border-bottom: 0;
|
|
||||||
border-radius: 999px 999px 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.explain-icon-wave.top {
|
|
||||||
top: 3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.explain-icon-wave.middle {
|
|
||||||
top: 9px;
|
|
||||||
left: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.explain-icon-wave.bottom {
|
|
||||||
top: 15px;
|
|
||||||
right: 6px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-bottom-label {
|
|
||||||
font-size: 15px;
|
|
||||||
line-height: 20px;
|
|
||||||
font-weight: 700;
|
|
||||||
color: currentColor;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<view
|
<view
|
||||||
class="guide-page-frame"
|
class="guide-page-frame"
|
||||||
:class="[`variant-${variant}`, { 'no-top-tabs': !showTopTabs, 'has-bottom-nav': showBottomNav }]"
|
:class="[`variant-${variant}`, { 'no-top-tabs': !showTopTabs }]"
|
||||||
>
|
>
|
||||||
<GuideTopTabs
|
<GuideTopTabs
|
||||||
v-if="showTopTabs"
|
v-if="showTopTabs"
|
||||||
@@ -32,16 +32,10 @@
|
|||||||
<view class="guide-page-frame-body">
|
<view class="guide-page-frame-body">
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</view>
|
</view>
|
||||||
<GuideBottomNav
|
|
||||||
v-if="showBottomNav"
|
|
||||||
:active-tab="activeTab"
|
|
||||||
@tab-change="handleTabChange"
|
|
||||||
/>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import GuideBottomNav from '@/components/navigation/GuideBottomNav.vue'
|
|
||||||
import GuideTopTabs from '@/components/navigation/GuideTopTabs.vue'
|
import GuideTopTabs from '@/components/navigation/GuideTopTabs.vue'
|
||||||
import type { GuideTopTab } from '@/utils/guideTopTabs'
|
import type { GuideTopTab } from '@/utils/guideTopTabs'
|
||||||
|
|
||||||
@@ -51,7 +45,6 @@ withDefaults(defineProps<{
|
|||||||
topTabsVariant?: 'underline' | 'segmented'
|
topTabsVariant?: 'underline' | 'segmented'
|
||||||
topTabsTop?: string
|
topTabsTop?: string
|
||||||
showTopTabs?: boolean
|
showTopTabs?: boolean
|
||||||
showBottomNav?: boolean
|
|
||||||
showBack?: boolean
|
showBack?: boolean
|
||||||
showCancel?: boolean
|
showCancel?: boolean
|
||||||
backLabel?: string
|
backLabel?: string
|
||||||
@@ -62,7 +55,6 @@ withDefaults(defineProps<{
|
|||||||
topTabsVariant: 'underline',
|
topTabsVariant: 'underline',
|
||||||
topTabsTop: '0',
|
topTabsTop: '0',
|
||||||
showTopTabs: true,
|
showTopTabs: true,
|
||||||
showBottomNav: false,
|
|
||||||
showBack: false,
|
showBack: false,
|
||||||
showCancel: false,
|
showCancel: false,
|
||||||
backLabel: '返回',
|
backLabel: '返回',
|
||||||
|
|||||||
@@ -395,7 +395,7 @@ const handlePrimaryAction = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 112px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
padding: 10px 14px 14px;
|
padding: 10px 14px 14px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|||||||
1036
src/components/search/PoiSearchPanel.vue
Normal file
1036
src/components/search/PoiSearchPanel.vue
Normal file
File diff suppressed because it is too large
Load Diff
@@ -60,12 +60,5 @@
|
|||||||
"navigationBarTitleText": "深圳自然博物馆",
|
"navigationBarTitleText": "深圳自然博物馆",
|
||||||
"navigationBarBackgroundColor": "#FFFFFF",
|
"navigationBarBackgroundColor": "#FFFFFF",
|
||||||
"backgroundColor": "#F3F3F3"
|
"backgroundColor": "#F3F3F3"
|
||||||
},
|
|
||||||
"tabBar": {
|
|
||||||
"color": "#333333",
|
|
||||||
"selectedColor": "#E0E100",
|
|
||||||
"backgroundColor": "#FFFFFF",
|
|
||||||
"borderStyle": "black",
|
|
||||||
"list": []
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,7 +3,6 @@
|
|||||||
active-tab="explain"
|
active-tab="explain"
|
||||||
variant="static"
|
variant="static"
|
||||||
:show-top-tabs="false"
|
:show-top-tabs="false"
|
||||||
show-bottom-nav
|
|
||||||
show-back
|
show-back
|
||||||
back-label="讲解首页"
|
back-label="讲解首页"
|
||||||
@tab-change="handleTopTabChange"
|
@tab-change="handleTopTabChange"
|
||||||
|
|||||||
@@ -3,7 +3,6 @@
|
|||||||
active-tab="guide"
|
active-tab="guide"
|
||||||
variant="overlay"
|
variant="overlay"
|
||||||
:show-top-tabs="false"
|
:show-top-tabs="false"
|
||||||
show-bottom-nav
|
|
||||||
show-back
|
show-back
|
||||||
@tab-change="handleTopTabChange"
|
@tab-change="handleTopTabChange"
|
||||||
@back="handlePageBack"
|
@back="handlePageBack"
|
||||||
@@ -375,7 +374,7 @@ const handlePageBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 84px;
|
left: 84px;
|
||||||
right: 16px;
|
right: 16px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 116px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
min-height: 110px;
|
min-height: 110px;
|
||||||
padding: 14px 14px 12px;
|
padding: 14px 14px 12px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@@ -498,7 +497,7 @@ const handlePageBack = () => {
|
|||||||
.detail-restore {
|
.detail-restore {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 18px;
|
right: 18px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 266px);
|
bottom: calc(env(safe-area-inset-bottom) + 152px);
|
||||||
height: 40px;
|
height: 40px;
|
||||||
min-width: 74px;
|
min-width: 74px;
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
|
|||||||
@@ -3,7 +3,6 @@
|
|||||||
:active-tab="currentTab"
|
:active-tab="currentTab"
|
||||||
variant="overlay"
|
variant="overlay"
|
||||||
:show-top-tabs="false"
|
:show-top-tabs="false"
|
||||||
show-bottom-nav
|
|
||||||
@tab-change="handleTabChange"
|
@tab-change="handleTabChange"
|
||||||
>
|
>
|
||||||
<GuideMapShell
|
<GuideMapShell
|
||||||
@@ -16,6 +15,7 @@
|
|||||||
mode-status-tone="glass"
|
mode-status-tone="glass"
|
||||||
search-top="20px"
|
search-top="20px"
|
||||||
search-variant="home"
|
search-variant="home"
|
||||||
|
:show-search="false"
|
||||||
:show-mode-row="false"
|
:show-mode-row="false"
|
||||||
mode-top="80px"
|
mode-top="80px"
|
||||||
:map-type="guideMapType"
|
:map-type="guideMapType"
|
||||||
@@ -36,14 +36,13 @@
|
|||||||
:show-layer-mode-toggle="false"
|
:show-layer-mode-toggle="false"
|
||||||
:show-floor="is3DMode && !showRoutePlanner"
|
:show-floor="is3DMode && !showRoutePlanner"
|
||||||
show-zoom-controls
|
show-zoom-controls
|
||||||
zoom-controls-top="calc(100vh - 252px)"
|
zoom-controls-top="calc(100vh - 292px)"
|
||||||
:route-preview="activeRoutePreview"
|
:route-preview="activeRoutePreview"
|
||||||
:show-route="Boolean(activeRoutePreview)"
|
:show-route="Boolean(activeRoutePreview)"
|
||||||
:disable-auto-exit="disableIndoorAutoExit"
|
:disable-auto-exit="disableIndoorAutoExit"
|
||||||
:auto-switch-threshold-low="0.58"
|
:auto-switch-threshold-low="0.58"
|
||||||
:auto-switch-threshold-high="1.18"
|
:auto-switch-threshold-high="1.18"
|
||||||
:outdoor-nav-polylines="outdoorNavPolylines"
|
:outdoor-nav-polylines="outdoorNavPolylines"
|
||||||
@search-tap="handleGuideSearchTap"
|
|
||||||
@mode-change="handleModeChange"
|
@mode-change="handleModeChange"
|
||||||
@floor-request="handleFloorRequest"
|
@floor-request="handleFloorRequest"
|
||||||
@floor-change="handleFloorChange"
|
@floor-change="handleFloorChange"
|
||||||
@@ -111,7 +110,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view
|
<view
|
||||||
v-if="showGuideQuickActions"
|
v-if="showGuideFloatingActions"
|
||||||
class="guide-quick-actions"
|
class="guide-quick-actions"
|
||||||
>
|
>
|
||||||
<view class="guide-quick-action primary" @tap="handleMoreRouteGuide">
|
<view class="guide-quick-action primary" @tap="handleMoreRouteGuide">
|
||||||
@@ -127,7 +126,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<text class="guide-quick-action-text">来馆</text>
|
<text class="guide-quick-action-text">来馆</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="guide-quick-action explain" @tap="handleExplainQuickTap">
|
<view class="guide-quick-action" @tap="handleExplainQuickTap">
|
||||||
<view class="guide-quick-icon explain">
|
<view class="guide-quick-icon explain">
|
||||||
<view class="guide-quick-explain-wave top"></view>
|
<view class="guide-quick-explain-wave top"></view>
|
||||||
<view class="guide-quick-explain-wave middle"></view>
|
<view class="guide-quick-explain-wave middle"></view>
|
||||||
@@ -137,6 +136,16 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<view
|
||||||
|
v-if="showGuideHomeDock"
|
||||||
|
class="guide-home-dock"
|
||||||
|
>
|
||||||
|
<PoiSearchPanel
|
||||||
|
variant="home"
|
||||||
|
@expanded-change="handleHomeSearchExpandedChange"
|
||||||
|
/>
|
||||||
|
</view>
|
||||||
|
|
||||||
<RoutePlannerPanel
|
<RoutePlannerPanel
|
||||||
v-if="is3DMode"
|
v-if="is3DMode"
|
||||||
:visible="showRoutePlanner"
|
:visible="showRoutePlanner"
|
||||||
@@ -263,6 +272,7 @@ import GuidePageFrame from '@/components/navigation/GuidePageFrame.vue'
|
|||||||
import GuideMapShell from '@/components/navigation/GuideMapShell.vue'
|
import GuideMapShell from '@/components/navigation/GuideMapShell.vue'
|
||||||
import RoutePlannerPanel from '@/components/navigation/RoutePlannerPanel.vue'
|
import RoutePlannerPanel from '@/components/navigation/RoutePlannerPanel.vue'
|
||||||
import OutdoorNavigationPanel from '@/components/navigation/OutdoorNavigationPanel.vue'
|
import OutdoorNavigationPanel from '@/components/navigation/OutdoorNavigationPanel.vue'
|
||||||
|
import PoiSearchPanel from '@/components/search/PoiSearchPanel.vue'
|
||||||
import type {
|
import type {
|
||||||
RoutePointOption
|
RoutePointOption
|
||||||
} from '@/components/navigation/RoutePointPicker.vue'
|
} from '@/components/navigation/RoutePointPicker.vue'
|
||||||
@@ -382,6 +392,7 @@ const isPoiCardCollapsed = ref(false)
|
|||||||
const guideMapShellRef = ref<{
|
const guideMapShellRef = ref<{
|
||||||
clearRoute?: () => void
|
clearRoute?: () => void
|
||||||
} | null>(null)
|
} | null>(null)
|
||||||
|
const homeSearchExpanded = ref(false)
|
||||||
|
|
||||||
let launchOverlayFallbackTimer: ReturnType<typeof setTimeout> | null = null
|
let launchOverlayFallbackTimer: ReturnType<typeof setTimeout> | null = null
|
||||||
let launchOverlayFadeTimer: ReturnType<typeof setTimeout> | null = null
|
let launchOverlayFadeTimer: ReturnType<typeof setTimeout> | null = null
|
||||||
@@ -527,12 +538,22 @@ const disableIndoorAutoExit = computed(() => (
|
|||||||
|| isSimulatingRoute.value
|
|| isSimulatingRoute.value
|
||||||
))
|
))
|
||||||
|
|
||||||
const showGuideQuickActions = computed(() => (
|
const showGuideHomeDock = computed(() => (
|
||||||
currentTab.value === 'guide'
|
currentTab.value === 'guide'
|
||||||
&& !showRoutePlanner.value
|
&& !showRoutePlanner.value
|
||||||
&& !showOutdoorNavPanel.value
|
&& !showOutdoorNavPanel.value
|
||||||
&& !selectedGuidePoi.value
|
&& !selectedGuidePoi.value
|
||||||
&& !isSimulatingRoute.value
|
&& !isSimulatingRoute.value
|
||||||
|
&& !(guideOutdoorState.value === 'entrance' && !is3DMode.value)
|
||||||
|
))
|
||||||
|
|
||||||
|
const showGuideFloatingActions = computed(() => (
|
||||||
|
currentTab.value === 'guide'
|
||||||
|
&& !showRoutePlanner.value
|
||||||
|
&& !showOutdoorNavPanel.value
|
||||||
|
&& !selectedGuidePoi.value
|
||||||
|
&& !isSimulatingRoute.value
|
||||||
|
&& (!showGuideHomeDock.value || !homeSearchExpanded.value)
|
||||||
))
|
))
|
||||||
|
|
||||||
const toRoutePointOption = (target: GuideRouteTarget): RoutePointOption => ({
|
const toRoutePointOption = (target: GuideRouteTarget): RoutePointOption => ({
|
||||||
@@ -617,7 +638,7 @@ const syncTopTabToUrl = (tabId: GuideTopTab) => {
|
|||||||
|
|
||||||
const url = `#/pages/index/index?tab=${tabId}`
|
const url = `#/pages/index/index?tab=${tabId}`
|
||||||
if (window.location.hash !== url) {
|
if (window.location.hash !== url) {
|
||||||
window.history.replaceState(null, '', url)
|
window.history.replaceState(window.history.state, '', url)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -780,12 +801,6 @@ const buildExplainHallItems = (
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleGuideSearchTap = () => {
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/search/index'
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleFloorRequest = ({ floorId, floorLabel }: { floorId: string; floorLabel: string }) => {
|
const handleFloorRequest = ({ floorId, floorLabel }: { floorId: string; floorLabel: string }) => {
|
||||||
requestedFloorId.value = floorId
|
requestedFloorId.value = floorId
|
||||||
requestedFloorLabel.value = floorLabel
|
requestedFloorLabel.value = floorLabel
|
||||||
@@ -1222,6 +1237,10 @@ const handleExplainQuickTap = () => {
|
|||||||
handleTabChange('explain')
|
handleTabChange('explain')
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleHomeSearchExpandedChange = (expanded: boolean) => {
|
||||||
|
homeSearchExpanded.value = expanded
|
||||||
|
}
|
||||||
|
|
||||||
const handleOutdoorNavClose = () => {
|
const handleOutdoorNavClose = () => {
|
||||||
closeOutdoorNavPanel()
|
closeOutdoorNavPanel()
|
||||||
}
|
}
|
||||||
@@ -1618,7 +1637,7 @@ const handleExplainBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 112px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
background: rgba(255, 255, 255, 0.96);
|
background: rgba(255, 255, 255, 0.96);
|
||||||
border: 1px solid #e5e6de;
|
border: 1px solid #e5e6de;
|
||||||
@@ -1777,35 +1796,45 @@ const handleExplainBack = () => {
|
|||||||
color: var(--museum-accent);
|
color: var(--museum-accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.guide-quick-actions {
|
.guide-home-dock {
|
||||||
--guide-floating-control-width: 48px;
|
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 118px;
|
left: 12px;
|
||||||
|
right: 12px;
|
||||||
|
bottom: calc(env(safe-area-inset-bottom) + 16px);
|
||||||
|
padding: 12px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: rgba(255, 255, 255, 0.96);
|
||||||
|
border: 1px solid rgba(255, 255, 255, 0.96);
|
||||||
|
border-radius: 16px;
|
||||||
|
box-shadow: 0 10px 28px rgba(36, 49, 42, 0.16);
|
||||||
|
z-index: 1003;
|
||||||
|
}
|
||||||
|
|
||||||
|
.guide-quick-actions {
|
||||||
|
position: absolute;
|
||||||
|
top: clamp(96px, 14vh, 118px);
|
||||||
right: 18px;
|
right: 18px;
|
||||||
width: var(--guide-floating-control-width);
|
width: 48px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: stretch;
|
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
z-index: 1002;
|
z-index: 1002;
|
||||||
}
|
}
|
||||||
|
|
||||||
.guide-quick-action {
|
.guide-quick-action {
|
||||||
width: 100%;
|
width: 48px;
|
||||||
height: 56px;
|
min-height: 56px;
|
||||||
min-height: 0;
|
padding: 7px 4px 6px;
|
||||||
padding: 6px 4px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 4px;
|
gap: 4px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
background: rgba(255, 255, 255, 0.95);
|
background: rgba(255, 255, 255, 0.96);
|
||||||
border: 1px solid #dde5df;
|
border: 1px solid rgba(230, 233, 224, 0.96);
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
box-shadow: 0 8px 18px rgba(110, 127, 115, 0.12);
|
box-shadow: 0 8px 22px rgba(36, 49, 42, 0.14);
|
||||||
}
|
}
|
||||||
|
|
||||||
.guide-quick-action.primary {
|
.guide-quick-action.primary {
|
||||||
@@ -1813,11 +1842,6 @@ const handleExplainBack = () => {
|
|||||||
border-color: #151713;
|
border-color: #151713;
|
||||||
}
|
}
|
||||||
|
|
||||||
.guide-quick-action.explain {
|
|
||||||
background: rgba(245, 245, 237, 0.96);
|
|
||||||
border-color: #dfe4d8;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-quick-action:active {
|
.guide-quick-action:active {
|
||||||
transform: translateY(1px);
|
transform: translateY(1px);
|
||||||
}
|
}
|
||||||
@@ -1834,10 +1858,6 @@ const handleExplainBack = () => {
|
|||||||
color: var(--museum-accent);
|
color: var(--museum-accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.guide-quick-action.explain .guide-quick-icon {
|
|
||||||
color: #151713;
|
|
||||||
}
|
|
||||||
|
|
||||||
.guide-quick-icon-floor {
|
.guide-quick-icon-floor {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 3px;
|
left: 3px;
|
||||||
@@ -1910,7 +1930,7 @@ const handleExplainBack = () => {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 16px;
|
line-height: 16px;
|
||||||
font-weight: 600;
|
font-weight: 700;
|
||||||
color: #151713;
|
color: #151713;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
@@ -1951,7 +1971,7 @@ const handleExplainBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 112px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
min-height: 54px;
|
min-height: 54px;
|
||||||
padding: 10px 10px 10px 14px;
|
padding: 10px 10px 10px 14px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -2053,7 +2073,7 @@ const handleExplainBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 216px);
|
bottom: calc(env(safe-area-inset-bottom) + 128px);
|
||||||
height: 84px;
|
height: 84px;
|
||||||
padding: 16px 10px 8px;
|
padding: 16px 10px 8px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -2191,7 +2211,7 @@ const handleExplainBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 216px);
|
bottom: calc(env(safe-area-inset-bottom) + 128px);
|
||||||
z-index: 1003;
|
z-index: 1003;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -2199,7 +2219,7 @@ const handleExplainBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 112px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
height: 94px;
|
height: 94px;
|
||||||
padding: 16px 16px 10px;
|
padding: 16px 16px 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -2255,7 +2275,7 @@ const handleExplainBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 116px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
height: 158px;
|
height: 158px;
|
||||||
padding: 18px 16px 14px;
|
padding: 18px 16px 14px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|||||||
@@ -3,7 +3,6 @@
|
|||||||
active-tab="guide"
|
active-tab="guide"
|
||||||
variant="overlay"
|
variant="overlay"
|
||||||
:show-top-tabs="false"
|
:show-top-tabs="false"
|
||||||
show-bottom-nav
|
|
||||||
show-back
|
show-back
|
||||||
:show-cancel="isManualLocationPanelOpen"
|
:show-cancel="isManualLocationPanelOpen"
|
||||||
@tab-change="handleTopTabChange"
|
@tab-change="handleTopTabChange"
|
||||||
@@ -846,7 +845,7 @@ const handlePageBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 16px;
|
left: 16px;
|
||||||
right: 16px;
|
right: 16px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 116px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
min-height: 170px;
|
min-height: 170px;
|
||||||
padding: 22px 20px 20px;
|
padding: 22px 20px 20px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -863,7 +862,7 @@ const handlePageBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 16px;
|
left: 16px;
|
||||||
right: 16px;
|
right: 16px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 116px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
min-height: 156px;
|
min-height: 156px;
|
||||||
padding: 24px 18px 16px;
|
padding: 24px 18px 16px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -897,7 +896,7 @@ const handlePageBack = () => {
|
|||||||
.indoor-guide-peek {
|
.indoor-guide-peek {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 50%;
|
left: 50%;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 104px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
width: 132px;
|
width: 132px;
|
||||||
height: 38px;
|
height: 38px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -1135,7 +1134,7 @@ const handlePageBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 116px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
height: 196px;
|
height: 196px;
|
||||||
padding: 21px 20px 14px;
|
padding: 21px 20px 14px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@@ -1275,7 +1274,7 @@ const handlePageBack = () => {
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
left: 12px;
|
left: 12px;
|
||||||
right: 12px;
|
right: 12px;
|
||||||
bottom: calc(env(safe-area-inset-bottom) + 116px);
|
bottom: calc(env(safe-area-inset-bottom) + 24px);
|
||||||
height: 158px;
|
height: 158px;
|
||||||
padding: 18px 16px 14px;
|
padding: 18px 16px 14px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -29,6 +29,20 @@ export interface TencentSearchResult {
|
|||||||
data: TencentPoiResult[]
|
data: TencentPoiResult[]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const FALLBACK_MUSEUM_ENTRANCE: TencentPoiResult = {
|
||||||
|
id: 'fallback-shenzhen-natural-museum-entrance',
|
||||||
|
title: '深圳自然博物馆主入口',
|
||||||
|
address: '深圳市坪山区燕子湖片区',
|
||||||
|
category: '博物馆;出入口',
|
||||||
|
lat: 22.692363,
|
||||||
|
lng: 114.363487,
|
||||||
|
location: {
|
||||||
|
lat: 22.692363,
|
||||||
|
lng: 114.363487
|
||||||
|
},
|
||||||
|
distance: 0
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 路线规划起点/终点坐标
|
* 路线规划起点/终点坐标
|
||||||
*/
|
*/
|
||||||
@@ -402,7 +416,7 @@ export function searchPoi(
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
fail: (err) => {
|
fail: (err) => {
|
||||||
console.error('腾讯地图 POI 搜索失败:', err)
|
console.info('腾讯地图 POI 搜索暂不可用,已准备使用降级数据:', err)
|
||||||
resolve({
|
resolve({
|
||||||
status: -1,
|
status: -1,
|
||||||
message: '网络请求失败',
|
message: '网络请求失败',
|
||||||
@@ -423,8 +437,7 @@ export async function searchMuseumEntrance(): Promise<TencentPoiResult | null> {
|
|||||||
const museumResult = await searchPoi('深圳自然博物馆', '深圳市', 1, 5)
|
const museumResult = await searchPoi('深圳自然博物馆', '深圳市', 1, 5)
|
||||||
|
|
||||||
if (museumResult.status !== 0 || museumResult.data.length === 0) {
|
if (museumResult.status !== 0 || museumResult.data.length === 0) {
|
||||||
console.warn('未找到深圳自然博物馆')
|
return FALLBACK_MUSEUM_ENTRANCE
|
||||||
return null
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const museum = museumResult.data[0]
|
const museum = museumResult.data[0]
|
||||||
|
|||||||
Reference in New Issue
Block a user