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

添加红点修复

Browse Source
This commit is contained in:
张成
2025-11-21 14:50:42 +08:00
parent 27264011a1
commit 1c8b6163bb
17 changed files with 485 additions and 1202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
src/main_pages/components/MessagePageContent.tsx
View File

@@ -7,7 +7,7 @@ import Taro from "@tarojs/taro";
import { useGlobalState } from "@/store/global";
import { navigateTo } from "@/utils/navigation";
import { useReddotInfo, useFetchReddotInfo } from "@/store/messageStore";
import "@/other_pages/message/index.scss";
import styles from "./MessagePageContent.module.scss";
interface MessageItem {
id: string;
@@ -127,49 +127,49 @@ const MessagePageContent = () => {
};
return (
<View className="message-container" style={{ paddingTop: `${totalHeight}px` }}>
<View className="category-tabs">
<View className={styles.messageContainer} style={{ paddingTop: `${totalHeight}px` }}>
<View className={styles.categoryTabs}>
<View
className={`tab-item ${activeTab === "comment" ? "active" : ""}`}
className={`${styles.tabItem} ${activeTab === "comment" ? styles.active : ""}`}
onClick={() => handleTabClick("comment")}
>
<View className="tab-icon-wrapper">
<View className={styles.tabIconWrapper}>
<Image
className="tab-icon"
className={styles.tabIcon}
src={require('@/static/message/comment-icon.svg')}
mode="aspectFit"
/>
{(reddotInfo?.comment_unread_count || 0) > 0 && (
<View className="badge">
{(reddotInfo?.comment_unread_count || 0) > 99 ? '99+' : reddotInfo?.comment_unread_count}
<View className={styles.badge}>
{`+${(reddotInfo?.comment_unread_count || 0) > 99 ? 99 : reddotInfo?.comment_unread_count}`}
</View>
)}
</View>
<Text className="tab-text">评论和回复</Text>
<Text className={styles.tabText}>评论和回复</Text>
</View>
<View
className={`tab-item ${activeTab === "follow" ? "active" : ""}`}
className={`${styles.tabItem} ${activeTab === "follow" ? styles.active : ""}`}
onClick={() => handleTabClick("follow")}
>
<View className="tab-icon-wrapper">
<View className={styles.tabIconWrapper}>
<Image
className="tab-icon"
className={styles.tabIcon}
src={require('@/static/message/follow-icon.svg')}
mode="aspectFit"
/>
{(reddotInfo?.follow_unread_count || 0) > 0 && (
<View className="badge">
{(reddotInfo?.follow_unread_count || 0) > 99 ? '99+' : reddotInfo?.follow_unread_count}
<View className={styles.badge}>
{`+${(reddotInfo?.follow_unread_count || 0) > 99 ? 99 : reddotInfo?.follow_unread_count}`}
</View>
)}
</View>
<Text className="tab-text">新增关注</Text>
<Text className={styles.tabText}>新增关注</Text>
</View>
</View>
<ScrollView
scrollY
className="message-scroll"
className={styles.messageScroll}
scrollWithAnimation
enhanced
showScrollbar={false}
@@ -180,32 +180,32 @@ const MessagePageContent = () => {
onRefresherRefresh={handleRefresh}
>
{filteredMessages.length > 0 ? (
<View className="message-cards">
<View className={styles.messageCards}>
{filteredMessages.map((message) => (
<View className="message-card" key={message.id} onClick={() => handleViewDetail(message)}>
<View className="card-title-row">
<Text className="card-title">{message.title}</Text>
<View className={styles.messageCard} key={message.id} onClick={() => handleViewDetail(message)}>
<View className={styles.cardTitleRow}>
<Text className={styles.cardTitle}>{message.title}</Text>
</View>
<View className="card-time-row">
<Text className="card-time">{formatRelativeTime(message.create_time)}</Text>
<View className={styles.cardTimeRow}>
<Text className={styles.cardTime}>{formatRelativeTime(message.create_time)}</Text>
</View>
<View className="card-content-row">
<Text className="card-content">{message.content}</Text>
<View className={styles.cardContentRow}>
<Text className={styles.cardContent}>{message.content}</Text>
</View>
<View className="card-footer">
<View className="footer-divider"></View>
<View className="footer-action">
<Text className="action-text">查看详情</Text>
<View className="action-arrow">
<Image className="img" src={require('@/static/message/ar-right.svg')} ></Image>
<View className={styles.cardFooter}>
<View className={styles.footerDivider}></View>
<View className={styles.footerAction}>
<Text className={styles.actionText}>查看详情</Text>
<View className={styles.actionArrow}>
<Image className={styles.img} src={require('@/static/message/ar-right.svg')} ></Image>
</View>
</View>
</View>
</View>
))}
{filteredMessages.length > 0 && (
<View className="bottom-tip">
<Text className="tip-text">到底了</Text>
<View className={styles.bottomTip}>
<Text className={styles.tipText}>到底了</Text>
</View>
)}
</View>