feat: 添加资产记录列表和空状态处理；优化收入判断逻辑

src/views/wallet/asset-record.vue

@@ -1,6 +1,7 @@
 <script lang='ts' setup>
 import type { InfiniteScrollCustomEvent, RefresherCustomEvent } from "@ionic/vue";
 import type { AssetRecordBody, AssetRecordData } from "@/api/types";
+import IconParkOutlineTransaction from "~icons/icon-park-outline/transaction";
 import { client, safeClient } from "@/api";
 
 const props = defineProps<{ code: string }>();
@@ -20,11 +21,13 @@ async function fetchData() {
   data.value.push(...(record.value?.data || []));
   isFinished.value = (record.value?.data.length || 0) < query.value.limit!;
 }
+
 function reset() {
   resetQuery();
   data.value = [];
   isFinished.value = false;
 }
+
 async function handleRefresh(event: RefresherCustomEvent) {
   reset();
   await fetchData();
@@ -32,6 +35,7 @@ async function handleRefresh(event: RefresherCustomEvent) {
     event.target.complete();
   }, 500);
 }
+
 async function handleInfinite(event: InfiniteScrollCustomEvent) {
   if (isFinished.value) {
     event.target.complete();
@@ -45,6 +49,10 @@ async function handleInfinite(event: InfiniteScrollCustomEvent) {
   }, 500);
 }
 
+function isIncome(item: AssetRecordData): boolean {
+  return Number(item.amount) > 0;
+}
+
 onBeforeMount(() => {
   fetchData();
 });
@@ -68,7 +76,63 @@ onBeforeMount(() => {
         资产记录
       </div>
 
-      {{ data }}
+      <!-- 资产记录列表 -->
+      <div v-if="data.length > 0" class="space-y-2 pb-4">
+        <div v-for="item in data" :key="item.id" class="ion-padding-horizontal">
+          <div class="bg-gray-50 rounded-lg p-4">
+            <div class="flex items-center justify-between mb-3">
+              <div class="flex items-center space-x-3">
+                <div>
+                  <div class="text-sm font-semibold">
+                    {{ item.accountType }}
+                  </div>
+                  <div class="text-xs text-text-500 mt-0.5">
+                    {{ useDateFormat(item.createdAt, 'YYYY/MM/DD HH:mm:ss') }}
+                  </div>
+                </div>
+              </div>
+              <div class="text-right">
+                <div
+                  class="text-base font-bold"
+                  :class="isIncome(item) ? 'text-success' : 'text-danger'"
+                >
+                  {{ isIncome(item) ? '+' : '' }}{{ Number(item.amount).toFixed(2) }}
+                </div>
+                <div class="text-xs text-text-500 mt-0.5">
+                  {{ code }}
+                </div>
+              </div>
+            </div>
+
+            <div class="flex items-center justify-between text-xs">
+              <div class="flex items-center space-x-6">
+                <div>
+                  <span class="text-text-500">余额</span>
+                  <span class="ml-2 font-medium">{{ Number(item.availableAfter).toFixed(2) }}</span>
+                </div>
+              </div>
+            </div>
+
+            <div class="pt-3">
+              <div class="text-xs text-text-500">
+                <span>备注：</span>
+                <span>{{ item.memo }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- 空状态 -->
+      <div v-else-if="!isFinished" class="flex items-center justify-center py-20">
+        <ion-spinner name="crescent" />
+      </div>
+      <div v-else class="flex flex-col items-center justify-center py-20 text-text-500">
+        <IconParkOutlineTransaction class="text-6xl mb-4 opacity-30" />
+        <div class="text-sm">
+          暂无资产记录
+        </div>
+      </div>
 
       <ion-infinite-scroll threshold="100px" @ion-infinite="handleInfinite">
         <ion-infinite-scroll-content