fix: ui

pages/notifications/notifications.vue

@@ -7,7 +7,10 @@
 			</button>
 		</view>
 
-		<view v-if="notifications.length === 0 && !loading" class="empty-state">
+		<view v-if="!notificationsLoaded || (loading && notifications.length === 0)" class="loading-state">
+			<up-loading-icon text="加载中" size="30"></up-loading-icon>
+		</view>
+		<view v-else-if="notifications.length === 0" class="empty-state">
 			<image src="/static/notification.png" mode="aspectFit" class="empty-icon" />
 			<view class="empty-title">暂无通知</view>
 			<view class="empty-desc">当前没有可查看的业务通知</view>
@@ -47,6 +50,7 @@
 	const total = ref(0);
 	const unreadCount = ref(0);
 	const loading = ref(false);
+	const notificationsLoaded = ref(false);
 	const noMore = ref(false);
 
 	const formatDate = (value) => {
@@ -107,6 +111,7 @@
 			console.error('加载通知列表失败', error);
 		} finally {
 			loading.value = false;
+			notificationsLoaded.value = true;
 		}
 	};
 
@@ -165,6 +170,7 @@
 	.notification-footer { margin-top: var(--space-md); }
 	.notification-meta, .notification-time { color: var(--text-tertiary); font-size: 22rpx; }
 	.empty-state { display: flex; flex-direction: column; align-items: center; padding: 140rpx 40rpx; }
+	.loading-state { display: flex; align-items: center; justify-content: center; min-height: 400rpx; }
 	.empty-icon { width: 100rpx; height: 100rpx; opacity: 0.6; margin-bottom: 24rpx; }
 	.empty-title { color: var(--text-primary); font-size: 30rpx; font-weight: 600; }
 	.empty-desc { color: var(--text-tertiary); font-size: 24rpx; margin-top: 12rpx; }