feat: 新增空状态

pages/switch/switch.vue

@@ -1,5 +1,11 @@
 <template>
 	<view class="container">
+		<view v-if="mchList.length === 0 && !loading" class="empty-state">
+			<view class="empty-icon">📡</view>
+			<view class="empty-title">运营商列表为空</view>
+			<view class="empty-desc">当前设备暂无可切换的运营商</view>
+		</view>
+
 		<view class="card" v-for="item in mchList" :key="item.iccid">
 			<view class="flex-row-sb mt-30">
 				<view class="flex-row-g20">
@@ -41,6 +47,7 @@
 	const userStore = useUserStore();
 
 	let mchList = reactive([]);
+	let loading = ref(false);
 	let switching = ref(false);
 
 	let opratorList = reactive([
@@ -55,6 +62,7 @@
 	};
 
 	const loadCards = async () => {
+		loading.value = true;
 		try {
 			const assetData = await assetApi.getInfo(userStore.state.identifier);
 
@@ -88,6 +96,7 @@
 		} catch (e) {
 			console.error('加载卡列表失败', e);
 		}
+		loading.value = false;
 	};
 
 	const getCarrierCategory = (carrierName) => {
@@ -148,4 +157,16 @@
 			color: var(--text-inverse);
 		}
 	}
+
+	.empty-state {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 120rpx 40rpx;
+		min-height: 400rpx;
+		.empty-icon { font-size: 120rpx; margin-bottom: 30rpx; opacity: 0.6; }
+		.empty-title { font-size: 32rpx; font-weight: 600; color: var(--text-primary); margin-bottom: 16rpx; }
+		.empty-desc { font-size: 26rpx; color: var(--text-tertiary); text-align: center; }
+	}
 </style>