This commit is contained in:
@@ -114,20 +114,32 @@
|
||||
v-if="showGuideFloatingActions"
|
||||
class="guide-quick-actions"
|
||||
>
|
||||
<view class="guide-quick-action primary" @tap="handleMoreRouteGuide">
|
||||
<view
|
||||
class="guide-quick-action"
|
||||
:class="{ active: is3DMode }"
|
||||
@tap="handleMoreRouteGuide"
|
||||
>
|
||||
<view class="guide-quick-icon indoor">
|
||||
<view class="guide-quick-icon-floor top"></view>
|
||||
<view class="guide-quick-icon-floor bottom"></view>
|
||||
</view>
|
||||
<text class="guide-quick-action-text primary">馆内</text>
|
||||
<text class="guide-quick-action-text">馆内</text>
|
||||
</view>
|
||||
<view class="guide-quick-action" @tap="handleMoreOutdoorNav">
|
||||
<view
|
||||
class="guide-quick-action"
|
||||
:class="{ active: guideOutdoorState === 'entrance' && !is3DMode }"
|
||||
@tap="handleMoreOutdoorNav"
|
||||
>
|
||||
<view class="guide-quick-icon arrival">
|
||||
<view class="guide-quick-pin"></view>
|
||||
</view>
|
||||
<text class="guide-quick-action-text">来馆</text>
|
||||
</view>
|
||||
<view class="guide-quick-action" @tap="handleExplainQuickTap">
|
||||
<view
|
||||
class="guide-quick-action"
|
||||
:class="{ active: isExplainQuickActionActive }"
|
||||
@tap="handleExplainQuickTap"
|
||||
>
|
||||
<view class="guide-quick-icon explain">
|
||||
<view class="guide-quick-explain-wave top"></view>
|
||||
<view class="guide-quick-explain-wave middle"></view>
|
||||
@@ -637,6 +649,8 @@ const showGuideFloatingActions = computed(() => (
|
||||
&& (!showGuideHomeDock.value || !homeSearchExpanded.value)
|
||||
))
|
||||
|
||||
const isExplainQuickActionActive = computed(() => currentTab.value === 'explain')
|
||||
|
||||
const toRoutePointOption = (target: GuideRouteTarget): RoutePointOption => ({
|
||||
poiId: target.poiId,
|
||||
name: target.name,
|
||||
@@ -1319,7 +1333,24 @@ const closeOutdoorNavPanel = () => {
|
||||
clearOutdoorNavState()
|
||||
}
|
||||
|
||||
const showOutdoorEntrancePreview = () => {
|
||||
showOutdoorNavPanel.value = false
|
||||
showRoutePlanner.value = false
|
||||
selectedGuidePoi.value = null
|
||||
isPoiCardCollapsed.value = false
|
||||
isSimulatingRoute.value = false
|
||||
clearRoutePreviewState()
|
||||
clearOutdoorNavState()
|
||||
is3DMode.value = false
|
||||
guideOutdoorState.value = 'entrance'
|
||||
}
|
||||
|
||||
const handleMoreOutdoorNav = () => {
|
||||
if (!isOutdoorGuidePanelEnabled) {
|
||||
showOutdoorEntrancePreview()
|
||||
return
|
||||
}
|
||||
|
||||
openOutdoorNavPanel()
|
||||
}
|
||||
|
||||
@@ -2040,7 +2071,7 @@ const handleExplainBack = () => {
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.guide-quick-action.primary {
|
||||
.guide-quick-action.active {
|
||||
background: var(--museum-accent);
|
||||
border-color: var(--museum-accent);
|
||||
}
|
||||
@@ -2057,7 +2088,7 @@ const handleExplainBack = () => {
|
||||
color: #151713;
|
||||
}
|
||||
|
||||
.guide-quick-action.primary .guide-quick-icon {
|
||||
.guide-quick-action.active .guide-quick-icon {
|
||||
color: #0a0b08;
|
||||
}
|
||||
|
||||
@@ -2139,10 +2170,23 @@ const handleExplainBack = () => {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.guide-quick-action-text.primary {
|
||||
.guide-quick-action.active .guide-quick-action-text {
|
||||
color: #0a0b08;
|
||||
}
|
||||
|
||||
.guide-quick-action.active .guide-quick-pin::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: -7px;
|
||||
top: -7px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: 1.5px solid currentColor;
|
||||
border-radius: 50%;
|
||||
opacity: 0;
|
||||
animation: entrance-pin-pulse 1.6s ease-out infinite;
|
||||
}
|
||||
|
||||
.route-sim-top-pill {
|
||||
position: absolute;
|
||||
top: 126px;
|
||||
@@ -2232,6 +2276,8 @@ const handleExplainBack = () => {
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
border: 1px solid #e5e6de;
|
||||
border-radius: 12px;
|
||||
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
|
||||
animation: entrance-tip-in 0.34s ease-out both;
|
||||
z-index: 45;
|
||||
}
|
||||
|
||||
@@ -2486,6 +2532,7 @@ const handleExplainBack = () => {
|
||||
border: 1px solid #ffffff;
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
|
||||
animation: entrance-card-in 0.42s cubic-bezier(0.2, 0.82, 0.2, 1) both;
|
||||
z-index: 45;
|
||||
}
|
||||
|
||||
@@ -2547,4 +2594,41 @@ const handleExplainBack = () => {
|
||||
color: var(--museum-accent);
|
||||
}
|
||||
|
||||
@keyframes entrance-tip-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translate3d(-10px, 8px, 0) scale(0.96);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translate3d(0, 0, 0) scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes entrance-card-in {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translate3d(0, 28px, 0);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes entrance-pin-pulse {
|
||||
0% {
|
||||
opacity: 0.42;
|
||||
transform: scale(0.68);
|
||||
}
|
||||
|
||||
72%,
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: scale(1.36);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user