feat: 新增空状态
All checks were successful
构建并部署前端到生产环境 / build-and-deploy (push) Successful in 47s

This commit is contained in:
sexygoat
2026-04-14 17:02:16 +08:00
parent eb81a5cb21
commit 3f792d642a
4 changed files with 52 additions and 7 deletions

View File

@@ -43,7 +43,9 @@
/* ios */
"ios" : {},
/* SDK */
"sdkConfigs" : {}
"sdkConfigs" : {
"payment" : {}
}
}
},
/* */

View File

@@ -1,5 +1,11 @@
<template>
<view class="container">
<view v-if="list.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 list" :key="item.iccid">
<view class="flex-row-g20">
<view class="logo">
@@ -38,6 +44,7 @@
const userStore = useUserStore();
let list = reactive([]);
let loading = ref(false);
let showIccidModal = ref(false);
let currentModalIccid = ref('');
let currentCard = ref(null);
@@ -54,6 +61,7 @@
};
const loadCards = async () => {
loading.value = true;
try {
const assetData = await assetApi.getInfo(userStore.state.identifier);
@@ -81,6 +89,7 @@
} catch (e) {
console.error('加载卡列表失败', e);
}
loading.value = false;
};
const getCarrierCategory = (carrierName) => {
@@ -223,4 +232,16 @@
border-radius: var(--radius-small);
cursor: pointer;
}
.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>

View File

@@ -508,13 +508,14 @@
.balance-label { font-size: 24rpx; opacity: 0.75; }
.recharge-btn-wrapper {
.btn-recharge {
background: rgba(255, 255, 255, 0.25);
border: 1rpx solid rgba(255, 255, 255, 0.5);
color: #fff;
font-size: 24rpx;
padding: 8rpx 24rpx;
background: #fff;
border: none;
color: var(--primary);
font-size: 26rpx;
padding: 12rpx 32rpx;
border-radius: 40rpx;
font-weight: 500;
font-weight: 600;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15);
&::after { border: none; }
}
}

View File

@@ -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>