优化消息列表组件,更新刷新状态提示样式,提升用户体验和可读性。
This commit is contained in:
@@ -171,20 +171,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 同步状态提示
|
||||
.refreshIndicator {
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
background: #f5f5f5;
|
||||
border-bottom: 1px solid #e8e8e8;
|
||||
|
||||
:global(.ant-spin) {
|
||||
margin-right: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
// 加载状态
|
||||
.loading {
|
||||
padding: 16px;
|
||||
@@ -192,3 +178,12 @@
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
// 刷新提示
|
||||
.refreshingTip {
|
||||
padding: 8px 15px;
|
||||
background-color: #e6f7ff;
|
||||
border-bottom: 1px solid #91d5ff;
|
||||
color: #1890ff;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@@ -526,9 +526,7 @@ const MessageList: React.FC<MessageListProps> = () => {
|
||||
<div className={styles.messageList}>
|
||||
{loading && <div className={styles.loading}>加载中...</div>}
|
||||
{refreshing && !loading && (
|
||||
<div className={styles.refreshIndicator}>
|
||||
<Spin size="small" /> 正在同步...
|
||||
</div>
|
||||
<div className={styles.refreshingTip}>正在同步消息...</div>
|
||||
)}
|
||||
|
||||
<List
|
||||
|
||||
Reference in New Issue
Block a user