bimwe/mini-programs
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
张成
2025-09-07 10:06:00 +08:00
parent 955f1003dd
commit 4c36986ade
11 changed files with 403 additions and 220 deletions
Download Patch File Download Diff File Expand all files Collapse all files

208
src/pages/userInfo/myself/index.tsx
View File

@@ -3,9 +3,10 @@ import { View, Text, Image, ScrollView } from '@tarojs/components';
import Taro from '@tarojs/taro';
import './index.scss';
import GuideBar from '@/components/GuideBar'
import { UserInfoCard, UserInfo, GameRecord } from '@/components/UserInfo/index'
import { UserInfoCard, UserInfo } from '@/components/UserInfo/index'
import { UserService } from '@/services/userService'
import ListContainer from '@/container/listContainer'
import { TennisMatch } from '../../../../types/list/types'
const MyselfPage: React.FC = () => {
// 获取页面参数
@@ -35,7 +36,7 @@ const MyselfPage: React.FC = () => {
});
// 球局记录状态
const [game_records, set_game_records] = useState<GameRecord[]>([]);
const [game_records, set_game_records] = useState<TennisMatch[]>([]);
const [loading, set_loading] = useState(true);
// 关注状态
@@ -44,50 +45,121 @@ const MyselfPage: React.FC = () => {
// 当前激活的标签页
const [active_tab, setActiveTab] = useState<'hosted' | 'participated'>('hosted');
// 加载用户数据
const load_user_data = async () => {
try {
set_loading(true);
// 获取用户信息（包含统计数据）
const user_data = await UserService.get_user_info(user_id);
set_user_info(user_data);
// 获取球局记录
let games_data;
if (active_tab === 'hosted') {
games_data = await UserService.get_hosted_games(user_id || '1');
} else {
games_data = await UserService.get_participated_games(user_id || '1');
}
set_game_records(games_data);
} catch (error) {
console.error('加载用户数据失败:', error);
Taro.showToast({
title: '加载失败，请重试',
icon: 'error',
duration: 2000
});
} finally {
set_loading(false);
}
};
// 页面加载时获取数据
useEffect(() => {
load_user_data();
}, [user_id]);
// 切换标签页时重新加载球局数据
useEffect(() => {
if (!loading) {
load_game_data();
}
}, [active_tab]);
// 加载球局数据
const load_game_data = async () => {
try {
let games_data;
if (active_tab === 'hosted') {
games_data = await UserService.get_hosted_games(user_id || '1');
} else {
games_data = await UserService.get_participated_games(user_id || '1');
}
set_game_records(games_data);
} catch (error) {
console.error('加载球局数据失败:', error);
}
};
// 处理关注/取消关注
const handle_follow = () => {
setIsFollowing(!is_following);
Taro.showToast({
title: is_following ? '已取消关注' : '关注成功',
icon: 'success',
duration: 1500
});
const handle_follow = async () => {
try {
const new_following_state = await UserService.toggle_follow(user_id || '1', is_following);
setIsFollowing(new_following_state);
Taro.showToast({
title: new_following_state ? '关注成功' : '已取消关注',
icon: 'success',
duration: 1500
});
} catch (error) {
console.error('关注操作失败:', error);
Taro.showToast({
title: '操作失败，请重试',
icon: 'error',
duration: 2000
});
}
};
// 处理球局详情
const handle_game_detail = (game_id: string) => {
Taro.navigateTo({
url: `/pages/game/detail/index?id=${game_id}`
});
};
// 处理球局订单
const handle_game_orders = () => {
Taro.navigateTo({
url: '/pages/game/orders/index'
url: '/pages/userInfo/orders/index'
});
};
// 处理收藏
const handle_favorites = () => {
Taro.navigateTo({
url: '/pages/game/favorites/index'
url: '/pages/userInfo/favorites/index'
});
};
return (
<View className="myself_page">
{/* 主要内容 */}
<View className='main_content'>
{/* 用户信息区域 */}
<View className="user_info_section">
<UserInfoCard user_info={user_info}
is_current_user={false}
is_following={is_following}
on_follow={handle_follow}
></UserInfoCard>
{loading ? (
<View className="loading_container">
<Text className="loading_text">加载中...</Text>
</View>
) : (
<UserInfoCard
user_info={user_info}
is_current_user={is_current_user}
is_following={is_following}
on_follow={handle_follow}
/>
)}
{/* 球局订单和收藏功能 */}
<View className="quick_actions_section">
<View className="action_card">
@@ -124,88 +196,14 @@ const MyselfPage: React.FC = () => {
{/* 球局列表 */}
<View className="game_list_section">
<View className="date_header">
<Text className="date_text">5月28日</Text>
<Text className="separator">/</Text>
<Text className="weekday_text">星期三</Text>
</View>
<ScrollView scrollY>
{/* 球局卡片 */}
<View className="game_cards">
{game_records.map((game) => (
<View
key={game.id}
className="game_card"
onClick={() => handle_game_detail(game.id)}
>
{/* 球局标题和类型 */}
<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')}
/>
</View>
</View>
{/* 球局时间 */}
<View className="game_time">
<Text className="time_text">
{game.date} {game.time} {game.duration}
</Text>
</View>
{/* 球局地点和类型 */}
<View className="game_location">
<Text className="location_text">{game.location}</Text>
<Text className="separator">·</Text>
<Text className="type_text">{game.type}</Text>
<Text className="separator">·</Text>
<Text className="distance_text">{game.distance}</Text>
</View>
{/* 球局图片 */}
<View className="game_images">
{game.images.map((image, index) => (
<Image
key={index}
className="game_image"
src={image}
/>
))}
</View>
{/* 球局信息标签 */}
<View className="game_tags">
<View className="participants_info">
<View className="avatars">
{game.participants.map((participant, index) => (
<Image
key={index}
className="participant_avatar"
src={participant.avatar}
/>
))}
</View>
<View className="participants_count">
<Text className="count_text">
报名人数 {game.current_participants}/{game.max_participants}
</Text>
</View>
</View>
<View className="game_info_tags">
<View className="info_tag">
<Text className="tag_text">{game.level_range}</Text>
</View>
<View className="info_tag">
<Text className="tag_text">{game.game_type}</Text>
</View>
</View>
</View>
</View>
))}
</View>
<ListContainer
data={game_records}
recommendList={[]}
loading={loading}
error={null}
reload={load_game_data}
/>
</ScrollView>
</View>
</View>