修复首页来馆按钮联动动效

src/components/navigation/GuideMapShell.vue

@@ -38,7 +38,7 @@
         </view>
         <!-- #endif -->
       </template>
-      <view v-else class="outdoor-map-bg" :class="`variant-${props.outdoorVariant}`">
+      <view v-else class="outdoor-map-bg">
         <TencentMap
           class="outdoor-map"
           :active-floor="activeFloor"
@@ -793,33 +793,6 @@ defineExpose({
   background: #f6f8f5;
 }
 
-.outdoor-map-bg.variant-entrance {
-  animation: outdoor-entrance-focus 0.38s ease-out both;
-}
-
-.outdoor-map-bg.variant-entrance::after {
-  content: '';
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-  background:
-    radial-gradient(circle at 52% 60%, rgba(224, 225, 0, 0.16), rgba(224, 225, 0, 0) 32%),
-    linear-gradient(180deg, rgba(0, 0, 0, 0) 48%, rgba(0, 0, 0, 0.1) 100%);
-  z-index: 1;
-}
-
-@keyframes outdoor-entrance-focus {
-  from {
-    opacity: 0.72;
-    transform: scale(1.018);
-  }
-
-  to {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
 .indoor-platform-fallback {
   position: absolute;
   inset: 0;

src/pages/index/index.vue

@@ -116,7 +116,7 @@
       >
         <view
           class="guide-quick-action"
-          :class="{ active: is3DMode }"
+          :class="{ active: guideQuickActiveAction === 'indoor' }"
           @tap="handleMoreRouteGuide"
         >
           <view class="guide-quick-icon indoor">
@@ -127,7 +127,7 @@
         </view>
         <view
           class="guide-quick-action"
-          :class="{ active: guideOutdoorState === 'entrance' && !is3DMode }"
+          :class="{ active: guideQuickActiveAction === 'arrival' }"
           @tap="handleMoreOutdoorNav"
         >
           <view class="guide-quick-icon arrival">
@@ -137,7 +137,7 @@
         </view>
         <view
           class="guide-quick-action"
-          :class="{ active: isExplainQuickActionActive }"
+          :class="{ active: guideQuickActiveAction === 'explain' }"
           @tap="handleExplainQuickTap"
         >
           <view class="guide-quick-icon explain">
@@ -649,7 +649,10 @@ const showGuideFloatingActions = computed(() => (
   && (!showGuideHomeDock.value || !homeSearchExpanded.value)
 ))
 
-const isExplainQuickActionActive = computed(() => currentTab.value === 'explain')
+const guideQuickActiveAction = computed<'indoor' | 'arrival' | 'explain'>(() => {
+  if (currentTab.value === 'explain') return 'explain'
+  return is3DMode.value ? 'indoor' : 'arrival'
+})
 
 const toRoutePointOption = (target: GuideRouteTarget): RoutePointOption => ({
   poiId: target.poiId,
@@ -1333,24 +1336,7 @@ 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()
 }
 
@@ -2069,15 +2055,22 @@ const handleExplainBack = () => {
   border-radius: 8px;
   box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
   backdrop-filter: blur(10px);
+  transition:
+    background 0.18s ease,
+    border-color 0.18s ease,
+    box-shadow 0.18s ease,
+    transform 0.16s ease;
 }
 
 .guide-quick-action.active {
   background: var(--museum-accent);
   border-color: var(--museum-accent);
+  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.24), 0 0 0 1px rgba(224, 225, 0, 0.35);
+  animation: guide-quick-active-in 0.22s ease-out both;
 }
 
 .guide-quick-action:active {
-  transform: translateY(1px);
+  transform: translateY(1px) scale(0.98);
 }
 
 .guide-quick-icon {
@@ -2174,17 +2167,14 @@ const handleExplainBack = () => {
   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;
+@keyframes guide-quick-active-in {
+  from {
+    transform: scale(0.96);
+  }
+
+  to {
+    transform: scale(1);
+  }
 }
 
 .route-sim-top-pill {
@@ -2276,8 +2266,6 @@ 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;
 }
 
@@ -2532,7 +2520,6 @@ 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;
 }
 
@@ -2594,41 +2581,4 @@ 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>