feat: 添加空状态组件,优化数据为空时的展示效果

This commit is contained in:
2026-01-09 01:18:46 +07:00
parent 08186fa752
commit e7970a84fa
4 changed files with 85 additions and 72 deletions

View File

@@ -1,6 +1,7 @@
<script lang='ts' setup>
import type { RwaData } from "@/api/types";
import CryptocurrencyColorNuls from "~icons/cryptocurrency-color/nuls";
import ui from "@/ui";
defineProps<{
data: RwaData[];
@@ -38,6 +39,10 @@ function gotoTradeRwa(id: string) {
</ion-col>
</ion-row>
</ion-grid>
<template v-if="data.length === 0">
<ui-empty />
</template>
<template v-else>
<div v-for="item in data" :key="item.id" @click="gotoTradeRwa(item.id)">
<ion-grid>
<ion-row class="ion-align-items-center my-5">
@@ -79,6 +84,7 @@ function gotoTradeRwa(id: string) {
</ion-row>
</ion-grid>
</div>
</template>
</div>
</template>

View File

@@ -58,11 +58,9 @@ onMounted(() => {
<ion-spinner />
</div>
<div v-else-if="holdingsData.length === 0" class="flex flex-col justify-center items-center h-64">
<div class="text-text-500">
{{ t('holdings.empty') }}
</div>
</div>
<template v-else-if="holdingsData.length === 0">
<ui-empty />
</template>
<div v-else class="space-y-3">
<div

View File

@@ -32,6 +32,10 @@ function gotoTokenized(id: string) {
</ion-col>
</ion-row>
</ion-grid>
<template v-if="data.length === 0">
<ui-empty />
</template>
<template v-else>
<div v-for="item in data" :key="item.id" @click="gotoTokenized(item.id)">
<ion-grid>
<ion-row class="ion-align-items-center my-5">
@@ -67,6 +71,7 @@ function gotoTokenized(id: string) {
</ion-row>
</ion-grid>
</div>
</template>
</div>
</template>

View File

@@ -21,7 +21,11 @@ function openNewsDetail(item: NewData) {
动态新闻
</div>
<div class="space-y-3">
<template v-if="data?.data.length === 0">
<ui-empty />
</template>
<div v-else class="space-y-3">
<div
v-for="item in data?.data"
:key="item.id"