添加 个人页bar

This commit is contained in:
张成
2025-09-02 11:26:40 +08:00
parent d93efa0c3c
commit 2f7984ea2b

View File

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
import { View, Text, Image, ScrollView, Button } from '@tarojs/components';
import Taro from '@tarojs/taro';
import './index.scss';
import GuideBar from '@/components/GuideBar'
// 用户信息接口
interface UserInfo {
id: string;
@@ -47,10 +47,10 @@ const MyselfPage: React.FC = () => {
// 获取页面参数
const instance = Taro.getCurrentInstance();
const user_id = instance.router?.params?.userid;
// 判断是否为当前用户
const is_current_user = !user_id;
// 模拟用户数据
const [user_info] = useState<UserInfo>({
id: '1',
@@ -193,13 +193,13 @@ const MyselfPage: React.FC = () => {
<View className="action_buttons">
{/* 只有非当前用户才显示关注按钮 */}
{!is_current_user && (
<Button
<Button
className={`follow_button ${is_following ? 'following' : ''}`}
onClick={handle_follow}
>
<Image
className="button_icon"
src={require('../../../static/userInfo/plus.svg')}
<Image
className="button_icon"
src={require('../../../static/userInfo/plus.svg')}
/>
<Text className="button_text">
{is_following ? '已关注' : '关注'}
@@ -209,9 +209,9 @@ const MyselfPage: React.FC = () => {
{/* 只有非当前用户才显示消息按钮 */}
{!is_current_user && (
<Button className="message_button">
<Image
className="button_icon"
src={require('../../../static/userInfo/message.svg')}
<Image
className="button_icon"
src={require('../../../static/userInfo/message.svg')}
/>
</Button>
)}
@@ -234,9 +234,9 @@ const MyselfPage: React.FC = () => {
<View className="tags_bio_section">
<View className="tags_container">
<View className="tag_item">
<Image
className="tag_icon"
src={require('../../../static/userInfo/location.svg')}
<Image
className="tag_icon"
src={require('../../../static/userInfo/location.svg')}
/>
<Text className="tag_text">{user_info.location}</Text>
</View>
@@ -254,17 +254,17 @@ const MyselfPage: React.FC = () => {
<View className="quick_actions_section">
<View className="action_card">
<View className="action_content" onClick={handle_game_orders}>
<Image
className="action_icon"
src={require('../../../static/userInfo/tennis.svg')}
<Image
className="action_icon"
src={require('../../../static/userInfo/tennis.svg')}
/>
<Text className="action_text"></Text>
</View>
<View className="action_divider"></View>
<View className="action_content" onClick={handle_favorites}>
<Image
className="action_icon"
src={require('../../../static/userInfo/tennis.svg')}
<Image
className="action_icon"
src={require('../../../static/userInfo/tennis.svg')}
/>
<Text className="action_text"></Text>
</View>
@@ -291,12 +291,12 @@ const MyselfPage: React.FC = () => {
<Text className="separator">/</Text>
<Text className="weekday_text"></Text>
</View>
{/* 球局卡片 */}
<View className="game_cards">
{game_records.map((game) => (
<View
key={game.id}
<View
key={game.id}
className="game_card"
onClick={() => handle_game_detail(game.id)}
>
@@ -304,9 +304,9 @@ const MyselfPage: React.FC = () => {
<View className="game_header">
<Text className="game_title">{game.title}</Text>
<View className="game_type_icon">
<Image
className="type_icon"
src={require('../../../static/userInfo/tennis.svg')}
<Image
className="type_icon"
src={require('../../../static/userInfo/tennis.svg')}
/>
</View>
</View>
@@ -330,10 +330,10 @@ const MyselfPage: React.FC = () => {
{/* 球局图片 */}
<View className="game_images">
{game.images.map((image, index) => (
<Image
key={index}
className="game_image"
src={image}
<Image
key={index}
className="game_image"
src={image}
/>
))}
</View>
@@ -343,10 +343,10 @@ const MyselfPage: React.FC = () => {
<View className="participants_info">
<View className="avatars">
{game.participants.map((participant, index) => (
<Image
key={index}
className="participant_avatar"
src={participant.avatar}
<Image
key={index}
className="participant_avatar"
src={participant.avatar}
/>
))}
</View>
@@ -370,6 +370,7 @@ const MyselfPage: React.FC = () => {
</View>
</View>
</ScrollView>
<GuideBar currentPage='personal' />
</View>
);
};