✨ feat(navbar): 优化小程序环境下导航栏布局

- 新增平台判断工具函数，支持检测小程序和H5环境
- 为Navbar组件添加hideRightInWeapp属性，可手动控制小程序环境下右侧按钮显示
- 优化小程序环境下导航栏标题和右侧按钮位置，避免与原生胶囊按钮重叠
- 右侧按钮在小程序环境中根据菜单按钮位置动态调整，H5保持原有样式

✨ feat(utils): 添加平台检测工具函数

- 新增platform.ts文件，提供getPlatform、isWeapp和isH5工具函数
- 通过Taro.getEnv()实现跨平台环境检测，方便组件适配不同平台

mini/src/components/ui/navbar.tsx

@@ -2,6 +2,7 @@ import React from 'react'
 import { View, Text } from '@tarojs/components'
 import { cn } from '@/utils/cn'
 import Taro from '@tarojs/taro'
+import { isWeapp } from '@/utils/platform'
 
 export interface NavbarProps {
   title?: string
@@ -18,6 +19,8 @@ export interface NavbarProps {
   onClickRight?: () => void
   children?: React.ReactNode
   className?: string
+  /** 是否在小程序环境下隐藏右侧按钮（默认false，会自动避让） */
+  hideRightInWeapp?: boolean
 }
 
 const systemInfo = Taro.getSystemInfoSync()
@@ -43,6 +46,7 @@ export const Navbar: React.FC<NavbarProps> = ({
   onClickRight,
   children,
   className,
+  hideRightInWeapp,
 }) => {
   // 处理左侧点击
   const handleLeftClick = () => {
@@ -78,10 +82,34 @@ export const Navbar: React.FC<NavbarProps> = ({
 
   // 渲染右侧内容
   const renderRight = () => {
-    if (!rightText && !rightIcon) return null
+    if (!rightText && !rightIcon || (hideRightInWeapp && isWeapp())) return null
+        
+    if (isWeapp() && menuButtonInfo) {
+      // 小程序环境下，调整右侧按钮位置
+      return (
+        <View
+          className="absolute top-0 bottom-0 flex items-center z-10"
+          style={{
+            height: NAVBAR_HEIGHT,
+            right: `${menuButtonInfo.right + 10}px`,
+          }}
+          onClick={onClickRight}
+        >
+          <View className="flex items-center">
+            {rightText && (
+              <Text className={cn('mr-1 text-sm', textColor)}>{rightText}</Text>
+            )}
+            {rightIcon && (
+              <View className={cn(rightIcon, 'w-5 h-5', textColor)} />
+            )}
+          </View>
+        </View>
+      )
+    }
     
+    // H5或其他平台，保持原有样式
     return (
-      <View 
+      <View
         className="absolute right-3 top-0 bottom-0 flex items-center z-10"
         style={{ height: NAVBAR_HEIGHT }}
         onClick={onClickRight}
@@ -102,6 +130,23 @@ export const Navbar: React.FC<NavbarProps> = ({
   const renderTitle = () => {
     if (children) return children
     
+    if (isWeapp() && menuButtonInfo) {
+      // 小程序环境下，调整标题位置
+      return (
+        <View className="flex-1 flex items-center justify-center">
+          <Text
+            className={cn('text-base font-semibold truncate', textColor)}
+            style={{
+              maxWidth: `calc(100% - ${menuButtonInfo.right + 10}px - 60px - 60px)`
+            }}
+          >
+            {title}
+          </Text>
+        </View>
+      )
+    }
+    
+    // H5或其他平台，保持原有样式
     return (
       <Text className={cn('text-base font-semibold', textColor)}>
         {title}
@@ -128,7 +173,7 @@ export const Navbar: React.FC<NavbarProps> = ({
         style={navbarStyle}
       >
         {/* 导航栏内容 */}
-        <View 
+        <View
           className="relative flex items-center justify-center"
           style={{ height: NAVBAR_HEIGHT }}
         >

mini/src/utils/platform.ts

@@ -0,0 +1,16 @@
+import Taro from '@tarojs/taro'
+
+// 获取当前平台
+export const getPlatform = () => {
+  return Taro.getEnv()
+}
+
+// 是否为小程序
+export const isWeapp = (): boolean => {
+  return getPlatform() === Taro.ENV_TYPE.WEAPP
+}
+
+// 是否为H5
+export const isH5 = (): boolean => {
+  return getPlatform() === Taro.ENV_TYPE.WEB
+}