他人页

This commit is contained in:
2025-09-15 17:30:48 +08:00
parent 91636855aa
commit 7a0bc71f9f
10 changed files with 227 additions and 167 deletions

View File

@@ -58,13 +58,14 @@ const MyselfPage: React.FC = () => {
set_user_info(user_data);
// 获取球局记录
let games_data;
if (active_tab === "hosted") {
games_data = await UserService.get_hosted_games(user_id);
} else {
games_data = await UserService.get_participated_games(user_id);
}
set_game_records(games_data);
load_game_data();
// let games_data;
// if (active_tab === "hosted") {
// games_data = await UserService.get_hosted_games(user_id);
// } else {
// games_data = await UserService.get_participated_games(user_id);
// }
// set_game_records(games_data);
} catch (error) {
console.error("加载用户数据失败:", error);
Taro.showToast({
@@ -98,9 +99,9 @@ const MyselfPage: React.FC = () => {
try {
let games_data;
if (active_tab === "hosted") {
games_data = await UserService.get_hosted_games(user_id);
games_data = await UserService.get_hosted_games(user_info.id);
} else {
games_data = await UserService.get_participated_games(user_id);
games_data = await UserService.get_participated_games(user_info.id);
}
set_game_records(games_data);
} catch (error) {

View File

@@ -1,7 +1,11 @@
// 他人用户页面样式
.other_user_page {
min-height: 100vh;
background: radial-gradient(circle at 50% 0%, rgba(238, 255, 220, 1) 0%, rgba(255, 255, 255, 1) 37%);
background: radial-gradient(
circle at 50% 0%,
rgba(238, 255, 220, 1) 0%,
rgba(255, 255, 255, 1) 37%
);
position: relative;
overflow: hidden;
box-sizing: border-box;
@@ -36,7 +40,8 @@
height: 64px;
border-radius: 50%;
overflow: hidden;
box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.12), 0px 0px 1px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.12),
0px 0px 1px 0px rgba(0, 0, 0, 0.2);
.avatar {
width: 100%;
@@ -52,7 +57,7 @@
gap: 4px;
.nickname {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 20px;
line-height: 1.4em;
@@ -61,7 +66,7 @@
}
.join_date {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 400;
font-size: 14px;
line-height: 1.4em;
@@ -89,7 +94,7 @@
align-items: center;
.stat_number {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 18px;
line-height: 1.4em;
@@ -98,7 +103,7 @@
}
.stat_label {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 500;
font-size: 12px;
line-height: 1.4em;
@@ -126,7 +131,7 @@
transition: all 0.3s ease;
&.following {
background: #FFFFFF;
background: #ffffff;
color: #000000;
}
@@ -136,11 +141,11 @@
}
.button_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 14px;
line-height: 1.4em;
color: #FFFFFF;
color: #ffffff;
.following & {
color: #000000;
@@ -151,7 +156,7 @@
.message_button {
width: 40px;
height: 40px;
background: #FFFFFF;
background: #ffffff;
border: 0.5px solid rgba(0, 0, 0, 0.12);
border-radius: 999px;
display: flex;
@@ -185,7 +190,7 @@
gap: 4px;
padding: 6px 8px;
height: 20px;
background: #FFFFFF;
background: #ffffff;
border: 0.5px solid rgba(0, 0, 0, 0.16);
border-radius: 999px;
@@ -195,7 +200,7 @@
}
.tag_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 500;
font-size: 11px;
line-height: 1.8em;
@@ -206,7 +211,7 @@
}
.bio_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 400;
font-size: 14px;
line-height: 1.571em;
@@ -216,6 +221,17 @@
}
}
.game_list_container {
.game_class_text {
font-family: "PingFang SC";
font-weight: 600;
font-size: 20px;
line-height: 1.4em;
letter-spacing: 1.9%;
color: rgba(0, 0, 0, 0.85);
}
}
// 球局类型标签页
.game_tabs_section {
margin-bottom: 16px;
@@ -231,7 +247,7 @@
transition: all 0.3s ease;
.tab_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 20px;
line-height: 1.4em;
@@ -265,7 +281,7 @@
margin-bottom: 16px;
.date_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 14px;
line-height: 1.4em;
@@ -274,7 +290,7 @@
}
.separator {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 400;
font-size: 18px;
line-height: 1.4em;
@@ -283,7 +299,7 @@
}
.weekday_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 14px;
line-height: 1.4em;
@@ -300,7 +316,7 @@
padding: 0 5px 15px;
.game_card {
background: #FFFFFF;
background: #ffffff;
border: 0.5px solid rgba(0, 0, 0, 0.08);
border-radius: 20px;
padding: 0 0 12px;
@@ -321,7 +337,7 @@
padding: 12px 15px 0;
.game_title {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 600;
font-size: 16px;
line-height: 1.5em;
@@ -344,7 +360,7 @@
padding: 6px 15px 0;
.time_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 400;
font-size: 12px;
line-height: 1.5em;
@@ -362,7 +378,7 @@
.location_text,
.type_text,
.distance_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 400;
font-size: 12px;
line-height: 1.5em;
@@ -370,7 +386,7 @@
}
.separator {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 400;
font-size: 14px;
line-height: 1.3em;
@@ -392,7 +408,7 @@
width: 56.44px;
height: 56.44px;
border-radius: 9px;
border: 1.5px solid #FFFFFF;
border: 1.5px solid #ffffff;
&:nth-child(1) {
top: 4.18px;
@@ -435,12 +451,12 @@
width: 20px;
height: 20px;
border-radius: 50%;
border: 1px solid #FFFFFF;
border: 1px solid #ffffff;
}
}
.participants_count {
background: #FFFFFF;
background: #ffffff;
border: 0.5px solid rgba(0, 0, 0, 0.16);
border-radius: 999px;
padding: 6px;
@@ -450,7 +466,7 @@
justify-content: center;
.count_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 500;
font-size: 11px;
line-height: 1.8em;
@@ -465,7 +481,7 @@
gap: 4px;
.info_tag {
background: #FFFFFF;
background: #ffffff;
border: 0.5px solid rgba(0, 0, 0, 0.16);
border-radius: 999px;
padding: 6px 8px;
@@ -475,7 +491,7 @@
justify-content: center;
.tag_text {
font-family: 'PingFang SC';
font-family: "PingFang SC";
font-weight: 500;
font-size: 11px;
line-height: 1.8em;
@@ -488,4 +504,4 @@
}
}
}
}
}

View File

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
import { View, Text, ScrollView } from "@tarojs/components";
import Taro from "@tarojs/taro";
import "./index.scss";
import GuideBar from "@/components/GuideBar";
// import GuideBar from "@/components/GuideBar";
import {
UserInfoCard,
GameCard,
@@ -21,6 +21,7 @@ const OtherUserPage: React.FC = () => {
// 模拟用户数据
const [user_info, setUserInfo] = useState<UserInfo>({
id: user_id || "1",
gender:"",
nickname: "网球爱好者",
avatar: require("@/static/userInfo/default_avatar.svg"),
join_date: "2024年3月加入",
@@ -37,7 +38,7 @@ const OtherUserPage: React.FC = () => {
ntrp_level: "NTRP 3.5",
is_following: false,
ongoing_games: [],
personal_profile: '',
personal_profile: "",
});
// 模拟球局数据
@@ -48,7 +49,7 @@ const OtherUserPage: React.FC = () => {
// 当前激活的标签页
const [active_tab, setActiveTab] = useState<"hosted" | "participated">(
"hosted",
"hosted"
);
// 页面加载时获取用户信息
@@ -58,11 +59,36 @@ const OtherUserPage: React.FC = () => {
try {
// const user_data = await UserService.get_user_info(user_id);
const res = await LoginService.getUserInfoById(user_id);
setUserInfo(res.data as UserInfo);
const { data: userData } = res;
// setUserInfo({...res.data as UserInfo, avatar: data.avatar_url || require("@/static/userInfo/default_avatar.svg")});
setUserInfo({
id: userData.user_code || user_id || "",
nickname: userData.nickname || "",
avatar: userData.avatar_url || "",
join_date: userData.subscribe_time
? `${new Date(userData.subscribe_time).getFullYear()}${
new Date(userData.subscribe_time).getMonth() + 1
}月加入`
: "",
stats: {
following: userData.stats?.following_count || 0,
friends: userData.stats?.followers_count || 0,
hosted: userData.stats?.hosted_games_count || 0,
participated: userData.stats?.participated_games_count || 0,
},
personal_profile: userData.personal_profile || "",
location: userData.city + userData.district || "",
occupation: userData.occupation || "",
ntrp_level: "",
phone: userData.phone || "",
gender: userData.gender || "",
birthday: userData.birthday || "",
});
const games_data = await UserService.get_user_games(
user_id,
active_tab,
active_tab
);
setGameRecords(games_data);
} catch (error) {
@@ -83,7 +109,7 @@ const OtherUserPage: React.FC = () => {
try {
const new_follow_status = await UserService.toggle_follow(
user_info.id,
is_following,
is_following
);
setIsFollowing(new_follow_status);
Taro.showToast({