This commit is contained in:
张成
2025-11-14 22:21:54 +08:00
parent d6349d14e8
commit 6b560da897
9 changed files with 81 additions and 29 deletions

View File

@@ -1,7 +1,7 @@
export default defineAppConfig({
pages: [
"pages/main/index", // 主容器页面合并三个tab
"home_pages/index", //中转页
"pages/main/index", // 主容器页面合并三个tab
"login_pages/index/index",
"login_pages/verification/index",
"login_pages/terms/index",

View File

@@ -28,8 +28,8 @@ const GeneralNavbar: React.FC<GeneralNavbarProps> = ({
onBack,
className = ''
}) => {
const { statusNavbarHeightInfo } = useGlobalState()
const { statusBarHeight, navBarHeight } = statusNavbarHeightInfo
const { statusNavbarHeightInfo } = useGlobalState() || {}
const { statusBarHeight = 0, navBarHeight = 44, totalHeight = 98 } = statusNavbarHeightInfo || {}
const handleBack = () => {
if (onBack) {
@@ -80,12 +80,12 @@ const GeneralNavbar: React.FC<GeneralNavbarProps> = ({
<View
className={`${styles.customNavbar} ${className}`}
style={{
height: `${navBarHeight}px`,
height: `${totalHeight}px`,
paddingTop: `${statusBarHeight}px`,
backgroundColor
backgroundColor: backgroundColor || '#FAFAFA'
}}
>
<View className={styles.navbarContent}>
<View className={styles.navbarContent} style={{ height: `${navBarHeight}px` }}>
<View className={styles.leftSection}>
{renderLeftContent()}
</View>

View File

@@ -187,3 +187,29 @@
transform: translateY(0);
pointer-events: auto;
}
// 标题导航样式(用于"我的"页面等)
.titleNavContainer {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
.titleNavContent {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 0 16px;
.titleNavText {
font-family: "PingFang SC";
font-weight: 600;
font-size: 18px;
line-height: 1.4;
color: #333333;
text-align: center;
}
}
}

View File

@@ -13,10 +13,12 @@ import { CityPicker as PopupPicker } from "@/components/Picker";
interface IProps {
config?: {
showInput: boolean;
showInput?: boolean;
inputLeftIcon?: string;
iconPath?: string;
leftIconClick?: () => void;
title?: string; // 显示标题(用于"我的"页面等)
showTitle?: boolean; // 是否显示标题模式
};
onCityPickerVisibleChange?: (visible: boolean) => void; // 城市选择器显示/隐藏回调
onScrollToTop?: () => void; // 滚动到顶部回调
@@ -52,7 +54,7 @@ function CityPicker(props) {
const ListHeader = (props: IProps) => {
const { config, onCityPickerVisibleChange, onScrollToTop } = props;
const { showInput = false, inputLeftIcon, leftIconClick } = config || {};
const { showInput = false, inputLeftIcon, leftIconClick, title, showTitle = false } = config || {};
const { getLocationLoading, statusNavbarHeightInfo } = useGlobalState();
const { gamesNum, searchValue, cities, area, updateArea, getMatchesData, fetchGetGamesCount, refreshBothLists } = useListState();
const { navBarHeight } = statusNavbarHeightInfo;
@@ -139,12 +141,22 @@ const ListHeader = (props: IProps) => {
return (
<CustomNavbar backgroundColor="#fafafa">
<View className="listNavWrapper">
{/* 标题模式(用于"我的"页面等) */}
{showTitle && (
<View className="titleNavContainer" style={navbarStyle}>
<View className="titleNavContent">
<Text className="titleNavText">{title || "我的"}</Text>
</View>
</View>
)}
{/* 首页logo 导航*/}
<View
className={`listNavContainer toggleElement firstElement hidden
${!showInput ? "visible" : ""}`}
style={navbarStyle}
>
{!showTitle && (
<View
className={`listNavContainer toggleElement firstElement hidden
${!showInput ? "visible" : ""}`}
style={navbarStyle}
>
<View className="listNavContentWrapper">
{/* logo */}
<Image
@@ -167,13 +179,16 @@ const ListHeader = (props: IProps) => {
</View>
</View>
</View>
)}
{/* 搜索导航 */}
<View
className={`inputCustomerNavbarContainer toggleElement secondElement hidden ${
showInput && "visible"
} ${showInput ? "inputCustomerNavbarShowInput" : ""}`}
style={navbarStyle}
>
{!showTitle && (
<View
className={`inputCustomerNavbarContainer toggleElement secondElement hidden ${
showInput && "visible"
} ${showInput ? "inputCustomerNavbarShowInput" : ""}`}
style={navbarStyle}
>
<View className="navContent">
{/* logo */}
<Image
@@ -198,8 +213,9 @@ const ListHeader = (props: IProps) => {
</View>
</View>
</View>
)}
</View>
{cityPopupVisible && (
{cityPopupVisible && !showTitle && (
<CityPicker
visible={cityPopupVisible}
setVisible={setCityPopupVisible}

View File

@@ -1,5 +1,5 @@
.home_page {
width: 100%;
height: 100vh;
background-color: #FAFAFA;
// background-color: #FAFAFA;
}

View File

@@ -118,6 +118,7 @@
justify-content: flex-end;
padding: 0 20px;
background: none !important;
}
// 品牌区域

View File

@@ -4,6 +4,7 @@ import { EmptyState } from "@/components";
import noticeService from "@/services/noticeService";
import { formatRelativeTime } from "@/utils/timeUtils";
import Taro from "@tarojs/taro";
import { useGlobalState } from "@/store/global";
import "@/other_pages/message/index.scss";
interface MessageItem {
@@ -22,6 +23,9 @@ interface MessageItem {
type MessageCategory = "comment" | "follow";
const MessagePageContent = () => {
const { statusNavbarHeightInfo } = useGlobalState() || {};
const { totalHeight = 98 } = statusNavbarHeightInfo || {};
const [activeTab, setActiveTab] = useState<MessageCategory | null>(null);
const [messageList, setMessageList] = useState<MessageItem[]>([]);
const [loading, setLoading] = useState(false);
@@ -116,7 +120,7 @@ const MessagePageContent = () => {
};
return (
<View className="message-container">
<View className="message-container" style={{ paddingTop: `${totalHeight}px` }}>
<View className="category-tabs">
<View
className={`tab-item ${activeTab === "comment" ? "active" : ""}`}

View File

@@ -10,9 +10,13 @@ import { NTRPTestEntryCard } from "@/components";
import { EvaluateScene } from "@/store/evaluateStore";
import { useUserInfo } from "@/store/userStore";
import { usePickerOption } from "@/store/pickerOptionsStore";
import { useGlobalState } from "@/store/global";
const MyselfPageContent: React.FC = () => {
const pickerOption = usePickerOption();
const { statusNavbarHeightInfo } = useGlobalState() || {};
const { totalHeight = 98 } = statusNavbarHeightInfo || {};
const instance = (Taro as any).getCurrentInstance();
const user_id = instance.router?.params?.userid || "";
const is_current_user = !user_id;
@@ -132,7 +136,7 @@ const MyselfPageContent: React.FC = () => {
return (
<View className="myself_page">
<View className="main_content">
<View className="main_content" style={{ paddingTop: `${totalHeight}px` }}>
<View className="user_info_section">
<UserInfoCard
editable={is_current_user}

View File

@@ -4,7 +4,7 @@ import Taro from "@tarojs/taro";
import { check_login_status } from "@/services/loginService";
import { useUserActions } from "@/store/userStore";
import GuideBar from "@/components/GuideBar";
import { withAuth, BackNavbar, GeneralNavbar } from "@/components";
import { withAuth, BackNavbar } from "@/components";
import CustomerNavBar from "@/container/listCustomNavbar";
import ListPageContent from "./components/ListPageContent";
import MessagePageContent from "./components/MessagePageContent";
@@ -132,12 +132,13 @@ const MainPage: React.FC = () => {
<BackNavbar title="消息" />
);
} else if (currentTab === "personal") {
// 我的页:使用 GeneralNavbar(参考原始实现)
// 我的页:使用 CustomerNavBar 显示标题
return (
<GeneralNavbar
title="我的"
showBack={false}
showLeft={false}
<CustomerNavBar
config={{
showTitle: true,
title: "我的",
}}
/>
);
}