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

优化省市区和占位图片

Browse Source
This commit is contained in:
Ultrame
2026-02-09 13:53:19 +08:00
parent cab90aa1cb
commit 49935dd049
11 changed files with 196 additions and 153 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/ListCard/index.tsx
View File

@@ -5,8 +5,9 @@ import img from "../../config/images";
import { ListCardProps } from "../../../types/list/types";
import { formatGameTime, calculateDuration } from "@/utils/timeUtils";
import { navigateTo } from "@/utils/navigation";
import images from '@/config/images'
import images from "@/config/images";
import "./index.scss";
import { OSS_BASE } from "@/config/api";
const ListCard: React.FC<ListCardProps> = ({
id,
@@ -45,7 +46,7 @@ const ListCard: React.FC<ListCardProps> = ({
className="image"
mode="aspectFill"
lazyLoad
defaultSource={require("@/static/emptyStatus/publish-empty-card.png")}
defaultSource={`${OSS_BASE}/front/ball/images/publish-empty-card.svg`}
/>
);
};
@@ -67,7 +68,9 @@ const ListCard: React.FC<ListCardProps> = ({
const containerWidthPx = screenWidth - 130;
// 计算固定信息宽度
const extraInfo = `${court_type ? `・${court_type}` : ''}${distance_km ? `・${distance_km}km` : ''}`;
const extraInfo = `${court_type ? `・${court_type}` : ""}${
distance_km ? `・${distance_km}km` : ""
}`;
// 估算字符宽度（基于 12px 字体）
const getTextWidth = (text: string) => {
@@ -98,7 +101,9 @@ const ListCard: React.FC<ListCardProps> = ({
let currentWidth = 0;
for (let i = 0; i < location.length; i++) {
const char = location[i];
const charWidth = /[\u4e00-\u9fa5\u3000-\u303f\uff00-\uffef]/.test(char) ? 12 : 6;
const charWidth = /[\u4e00-\u9fa5\u3000-\u303f\uff00-\uffef]/.test(char)
? 12
: 6;
if (currentWidth + charWidth > availableWidth) {
break;
}
@@ -106,7 +111,7 @@ const ListCard: React.FC<ListCardProps> = ({
maxChars++;
}
return location.slice(0, maxChars) + '...';
return location.slice(0, maxChars) + "...";
}, [location, court_type, distance_km]);
// 根据图片数量决定展示样式
@@ -220,9 +225,10 @@ const ListCard: React.FC<ListCardProps> = ({
</Text>
</View>
<View className="tag ntprTag">
<Image src={images.ICON_LIST_NTPR} className='ntprIcon' />
<Image src={images.ICON_LIST_NTPR} className="ntprIcon" />
<Text className="tag-text">
{Number(skill_level_min)?.toFixed(1)} - {Number(skill_level_max)?.toFixed(1)}
{Number(skill_level_min)?.toFixed(1)} -{" "}
{Number(skill_level_max)?.toFixed(1)}
</Text>
{/* 分割线 */}
<View className="typeLine" />
@@ -251,22 +257,16 @@ const ListCard: React.FC<ListCardProps> = ({
/>
{/* <Text className="smoothTitle">{game_type}</Text> */}
</View>
{
venue_description && (<View className="line" />)
}
{
venue_description &&
(
<View className="localAreaContainer">
<View className="localAreaTitle">场馆方:</View>
<View className="localAreaWrapper">
<Image className="localArea" src={venueImage} />
<Text className="localAreaText">{venue_description}</Text>
</View>
{venue_description && <View className="line" />}
{venue_description && (
<View className="localAreaContainer">
<View className="localAreaTitle">场馆方:</View>
<View className="localAreaWrapper">
<Image className="localArea" src={venueImage} />
<Text className="localAreaText">{venue_description}</Text>
</View>
)
}
</View>
)}
</View>
)}
</View>