From db4d118f9a49abb012ee1ede41d501d240f24220 Mon Sep 17 00:00:00 2001
From: jackyu66git <jackyu666@icloud.com>
Date: Tue, 25 Aug 2026 04:43:07 +0800
Subject: [PATCH] =?UTF-8?q?fix(h5):=20=E5=B0=8F=E7=A8=8B=E5=BA=8F=20nh=3D1?=
 =?UTF-8?q?=20=E6=A8=A1=E5=BC=8F=E4=BF=9D=E7=95=99=E5=AD=90=E9=A1=B5?=
 =?UTF-8?q?=E8=BF=94=E5=9B=9E=E6=8C=89=E9=92=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

原生顶栏隐藏 logo 顶栏时，非首页/我的仍显示 BackButton。

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 apps/user-h5/src/App.vue                  | 12 ++++++++++--
 apps/user-h5/src/components/AppHeader.vue | 23 ++++++++++++++++++++---
 apps/user-h5/src/styles/app.css           |  5 ++++-
 3 files changed, 34 insertions(+), 6 deletions(-)

diff --git a/apps/user-h5/src/App.vue b/apps/user-h5/src/App.vue
index b2381ad..7fad3cf 100644
--- a/apps/user-h5/src/App.vue
+++ b/apps/user-h5/src/App.vue
@@ -1,7 +1,8 @@
 <template>
   <div class="app-shell" :class="shellClass">
     <div class="app-body">
-      <AppHeader v-if="showHeader" />
+      <AppHeader v-if="showFullHeader" />
+      <AppHeader v-else-if="showMpBackBar" back-only />
       <router-view />
     </div>
     <IcpFooter class="app-footer" />
@@ -11,14 +12,21 @@
 
 <script setup lang="ts">
 import { computed } from 'vue'
+import { useRoute } from 'vue-router'
 import AppHeader from './components/AppHeader.vue'
 import IcpFooter from './components/IcpFooter.vue'
 import TabBar from './components/TabBar.vue'
 import { isMpEmbed, isMpNativeHeader } from './lib/mpEmbed'
 
+const route = useRoute()
 const mpEmbed = isMpEmbed()
 const mpNativeHeader = isMpNativeHeader()
-const showHeader = !mpNativeHeader
+const showFullHeader = computed(() => !mpNativeHeader)
+const showMpBackBar = computed(() => {
+  if (!mpEmbed || !mpNativeHeader) return false
+  const p = route.path
+  return p !== '/' && p !== '/mine'
+})
 const shellClass = computed(() => ({
   'mp-embed': mpEmbed,
   'mp-native-header': mpNativeHeader,
diff --git a/apps/user-h5/src/components/AppHeader.vue b/apps/user-h5/src/components/AppHeader.vue
index e8b5407..d2fe37a 100644
--- a/apps/user-h5/src/components/AppHeader.vue
+++ b/apps/user-h5/src/components/AppHeader.vue
@@ -1,12 +1,20 @@
 <template>
-  <header class="app-header" :class="{ 'is-embed': mpEmbed }">
+  <header
+    class="app-header"
+    :class="{ 'is-embed': mpEmbed, 'back-only': backOnly }"
+  >
     <div class="side left">
       <BackButton v-if="showBack" />
     </div>
-    <router-link to="/" class="logo-link" aria-label="愈心谷首页">
+    <router-link
+      v-if="!backOnly"
+      to="/"
+      class="logo-link"
+      aria-label="愈心谷首页"
+    >
       <BrandLogo size="header" class="logo" />
     </router-link>
-    <div class="side right" aria-hidden="true" />
+    <div v-if="!backOnly" class="side right" aria-hidden="true" />
   </header>
 </template>
 
@@ -17,8 +25,11 @@ import BackButton from './BackButton.vue'
 import BrandLogo from './BrandLogo.vue'
 import { isMpEmbed } from '../lib/mpEmbed'
 
+const props = defineProps<{ backOnly?: boolean }>()
+
 const route = useRoute()
 const mpEmbed = isMpEmbed()
+const backOnly = computed(() => props.backOnly === true)
 
 /** 首页 / 我的 为 Tab 根页不显示返回；探索可从首页进入，显示返回 */
 const showBack = computed(() => {
@@ -47,6 +58,12 @@ const showBack = computed(() => {
   padding: calc(6px + var(--yxg-safe-top)) 12px 8px;
   background: transparent;
 }
+.app-header.back-only {
+  display: block;
+  grid-template-columns: 44px;
+  padding: calc(4px + var(--yxg-page-top, 0px)) 12px 4px;
+  pointer-events: none;
+}
 .side {
   display: flex;
   align-items: center;
diff --git a/apps/user-h5/src/styles/app.css b/apps/user-h5/src/styles/app.css
index 9a6e58e..ef459aa 100644
--- a/apps/user-h5/src/styles/app.css
+++ b/apps/user-h5/src/styles/app.css
@@ -75,7 +75,10 @@ html.mp-embed.mp-native-header body{
 html.mp-embed.mp-native-header .app-shell.mp-embed::before{
   background-color:#ffd1c7;
 }
-html.mp-embed.mp-native-header .app-header{
+html.mp-embed.mp-native-header .app-header.back-only{
+  display:block;
+}
+html.mp-embed.mp-native-header .app-header:not(.back-only){
   display:none !important;
 }
 html.mp-embed.mp-native-header .app-shell .home,