fix: ui

pages/device-exchange/device-exchange.vue

@@ -1,6 +1,9 @@
 <template>
 	<view class="container">
-		<view v-if="!exchangeData && !loading" class="empty-state">
+		<view v-if="!exchangeLoaded || (loading && !exchangeData)" class="loading-state">
+			<up-loading-icon text="加载中" size="30"></up-loading-icon>
+		</view>
+		<view v-else-if="!exchangeData" class="empty-state">
 			<image class="empty-icon" src="/static/change-shop.png" mode="aspectFit" alt="换货"></image>
 			<view class="empty-title">暂无换货记录</view>
 			<view class="empty-desc">当前账号下暂无换货记录</view>
@@ -158,6 +161,7 @@
 
 	const exchangeData = ref(null);
 	const loading = ref(false);
+	const exchangeLoaded = ref(false);
 	const showPopup = ref(false);
 	const showAreaPicker = ref(false);
 	const areaPickerColumns = ref([]);
@@ -224,6 +228,7 @@
 			exchangeData.value = null;
 		} finally {
 			loading.value = false;
+			exchangeLoaded.value = true;
 		}
 	};
 
@@ -368,6 +373,13 @@
 
 <style lang="scss" scoped>
 	.container {
+		.loading-state {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			min-height: 500rpx;
+		}
+
 		.empty-state {
 			display: flex;
 			flex-direction: column;