fix: 愈心魔方顶栏 logo 移至页面外层 nav-bar（202608278）

弃用 web-view 内 cover 层，改为 yxg-nav-bar + web-view 兄弟结构；
logo 使用包内静态图，H5 参数 nh=1&sbh=4。

Co-authored-by: Cursor <cursoragent@cursor.com>

pages.json

@@ -17,6 +17,7 @@
 				"backgroundColorTop": "#ffd1c7",
 				"mp-weixin": {
 					"navigationStyle": "custom",
+					"navigationBarTitleText": "",
 					"navigationBarBackgroundColor": "#ffd1c7",
 					"backgroundColorTop": "#ffd1c7"
 				}

pages/yxg-magic/index.vue

@@ -1,70 +1,91 @@
 <template>
 	<view class="yxg-page">
-		<web-view class="yxg-webview" :src="h5Url" />
+		<view class="yxg-nav-bar" :style="navBarStyle">
-		<cover-view class="yxg-cover" :style="coverStyle">
+			<view class="yxg-nav-row" :style="navRowStyle">
-			<cover-image class="yxg-cover-logo" :src="logoSrc" :style="logoStyle" />
+				<image
-		</cover-view>
+					class="yxg-nav-logo"
+					:style="logoStyle"
+					:src="YXG_MP_LOGO_URL"
+					mode="aspectFit"
+				/>
+			</view>
+		</view>
+		<web-view
+			class="yxg-webview"
+			:style="webviewStyle"
+			:src="h5Url"
+			@load="onWebLoad"
+			@error="onWebError"
+		/>
 	</view>
 </template>
 
 <script setup>
-import { computed, onMounted, ref } from 'vue'
+import { computed } from 'vue'
-import { YXG_H5_BASE, YXG_H5_VERSION, YXG_H5_LOGO_URL } from '@/util/yxgConfig.js'
+import { YXG_H5_BASE, YXG_H5_VERSION, YXG_MP_LOGO_URL } from '@/util/yxgConfig.js'
 
-const sys = uni.getSystemInfoSync()
+function readWindow() {
-const statusBarH = sys.statusBarHeight || 0
+	// #ifdef MP-WEIXIN
-const screenW = sys.windowWidth || 375
+	if (typeof wx !== 'undefined' && wx.getWindowInfo) {
+		return wx.getWindowInfo()
+	}
+	// #endif
+	return uni.getSystemInfoSync()
+}
+
+const win = readWindow()
+const statusBarH = win.statusBarHeight || 0
+const windowH = win.windowHeight || win.screenHeight || 667
+const screenW = win.windowWidth || win.screenWidth || 375
 let navBarH = 44
+let menuH = 32
 
 // #ifdef MP-WEIXIN
 try {
 	const menu = uni.getMenuButtonBoundingClientRect()
 	if (menu?.height) {
 		navBarH = (menu.top - statusBarH) * 2 + menu.height
+		menuH = menu.height
+	}
+} catch (e) {
+	console.warn('[yxg-magic] menuButton rect failed', e)
 }
-} catch (_) {}
 // #endif
 
 const headH = statusBarH + navBarH
-const logoW = Math.min(148, Math.floor(screenW * 0.48))
+const webviewH = windowH - headH
-const logoH = 36
+const logoH = Math.min(menuH, 30)
-const logoLeft = Math.floor((screenW - logoW) / 2)
+const logoW = Math.min(Math.round((logoH * 598) / 130), Math.floor(screenW * 0.4))
-const logoTop = statusBarH + Math.floor((navBarH - logoH) / 2)
 
-const logoSrc = ref(YXG_H5_LOGO_URL)
+const navBarStyle = `height:${headH}px;padding-top:${statusBarH}px;`
-
+const navRowStyle = `height:${navBarH}px;`
-onMounted(() => {
+const logoStyle = `width:${logoW}px;height:${logoH}px;`
-	uni.downloadFile({
+const webviewStyle = `height:${webviewH}px;`
-		url: YXG_H5_LOGO_URL,
-		success(res) {
-			if (res.statusCode === 200 && res.tempFilePath) {
-				logoSrc.value = res.tempFilePath
-			}
-		},
-	})
-})
-
-const coverStyle = {
-	position: 'fixed',
-	top: '0',
-	left: '0',
-	width: '100%',
-	height: `${headH}px`,
-	backgroundColor: '#ffd1c7',
-	zIndex: '9999',
-}
-
-const logoStyle = {
-	position: 'absolute',
-	left: `${logoLeft}px`,
-	top: `${logoTop}px`,
-	width: `${logoW}px`,
-	height: `${logoH}px`,
-}
 
 const h5Url = computed(
-	() => `${YXG_H5_BASE}?mp=1&nh=1&v=${YXG_H5_VERSION}`,
+	() =>
+		`${YXG_H5_BASE}?mp=1&nh=1&sbh=4&v=${YXG_H5_VERSION}#wechat_redirect`,
 )
+
+function onWebLoad(e) {
+	console.log('[yxg-magic] web-view load', e?.detail || e)
+}
+
+function onWebError(e) {
+	console.error('[yxg-magic] web-view error', e?.detail || e)
+	uni.showToast({
+		title: 'H5加载失败，请检查业务域名',
+		icon: 'none',
+		duration: 3000,
+	})
+}
+
+console.log('[yxg-magic] nav-bar + web-view', {
+	headH,
+	webviewH,
+	logoW,
+	logoH,
+})
 </script>
 
 <style>
@@ -78,10 +99,30 @@ page {
 .yxg-page {
 	width: 100%;
 	height: 100%;
+	display: flex;
+	flex-direction: column;
 	background-color: #ffd1c7;
 }
-.yxg-webview {
+
+.yxg-nav-bar {
+	flex-shrink: 0;
+	width: 100%;
+	box-sizing: border-box;
+	background-color: #ffd1c7;
+}
+
+.yxg-nav-row {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.yxg-nav-logo {
+	display: block;
+}
+
+.yxg-webview {
+	flex-shrink: 0;
 	width: 100%;
-	height: 100%;
 }
 </style>

util/yxgConfig.js

@@ -1,16 +1,16 @@
 /** 愈心魔方 H5（digital-psychology user-h5） */
-import { LOCAL_H5_HOST } from './yxgConfig.local.js'
+import { LOCAL_H5_HOST, USE_LOCAL_H5 } from './yxgConfig.local.js'
 
 const PROD_BASE = 'https://h5.yuxingu.com.cn/psy/'
-const PROD_VERSION = '202608256'
+const PROD_VERSION = '202608278'
-const PROD_LOGO_URL = 'https://miniapp.yuxingu.com.cn/yxg-mp/logo.png'
+/** 愈心魔方顶栏 logo（小程序包内 static，不请求外网） */
+export const YXG_MP_LOGO_URL = '/static/n-main/yxg-brand-logo.png'
 
 const isDev = import.meta.env.DEV
+const useLocalH5 = isDev && USE_LOCAL_H5
 
-export const YXG_H5_VERSION = isDev ? 'local' : PROD_VERSION
+export const YXG_H5_VERSION = useLocalH5 ? 'local' : PROD_VERSION
-export const YXG_H5_BASE = isDev ? `http://${LOCAL_H5_HOST}/psy/` : PROD_BASE
+export const YXG_H5_BASE = useLocalH5 ? `http://${LOCAL_H5_HOST}/psy/` : PROD_BASE
-/** cover-image 仅支持网络图/临时路径，不能用 /static */
+/** H5 内嵌场景用远程 logo（与小程序顶栏无关） */
-export const YXG_H5_LOGO_URL = isDev
+export const YXG_H5_LOGO_URL = 'https://miniapp.yuxingu.com.cn/yxg-mp/logo.png'
-	? `http://${LOCAL_H5_HOST}/psy/logo.png`
-	: PROD_LOGO_URL
 export const YXG_H5_HOME_URL = `${YXG_H5_BASE}?mp=1&v=${YXG_H5_VERSION}`

util/yxgConfig.local.js

@@ -1,5 +1,7 @@
 /**
- * 本地联调 H5（仅开发编译生效，发行仍走线上域名）
+ * 本地小程序联调 H5
- * 改成你电脑局域网 IP — 运行 digital-psychology 的 `npm run dev:mp` 会打印
+ * USE_LOCAL_H5=false → 开发编译也访问远程 https://h5.yuxingu.com.cn/psy/（默认）
+ * USE_LOCAL_H5=true  → 访问本机 Vite，LOCAL_H5_HOST 与 npm run dev:mp 打印一致
  */
+export const USE_LOCAL_H5 = false
 export const LOCAL_H5_HOST = '192.168.100.16:5173'