Initial commit: 网络验证平台

2026-04-27 17:22:56 +08:00
commit afe67d704e
780 changed files with 88960 additions and 0 deletions
@@ -0,0 +1,136 @@
+<script setup lang="ts">
+import { Icon } from '@iconify/vue'
+import { onMounted, ref } from 'vue'
+
+import api from '@/services/api'
+
+interface Transaction {
+  id: number
+  type: string
+  amount: number
+  description: string
+  balance: number
+  created_at: string
+}
+
+const loading = ref(true)
+const balance = ref(0)
+const transactions = ref<Transaction[]>([])
+
+onMounted(async () => {
+  try {
+    const data = await api.get<{ balance: number, transactions: Transaction[] }>('/agent/finance')
+    balance.value = data?.balance || 0
+    transactions.value = data?.transactions || []
+  }
+  catch (error) {
+    console.error('获取财务数据失败:', error)
+  }
+  finally {
+    loading.value = false
+  }
+})
+
+function formatDate(dateStr: string) {
+  return new Date(dateStr).toLocaleString('zh-CN')
+}
+
+function getTypeLabel(type: string) {
+  const map: Record<string, string> = {
+    recharge: '充值',
+    consume: '消费',
+    refund: '退款',
+  }
+  return map[type] || type
+}
+
+function getTypeClass(type: string) {
+  const map: Record<string, string> = {
+    recharge: 'text-green-500',
+    consume: 'text-red-500',
+    refund: 'text-blue-500',
+  }
+  return map[type] || ''
+}
+</script>
+
+<template>
+  <div class="space-y-6">
+    <div>
+      <h1 class="text-2xl font-bold">
+        财务管理
+      </h1>
+      <p class="text-muted-foreground">
+        查看您的账户余额和交易记录
+      </p>
+    </div>
+
+    <div class="grid gap-4 md:grid-cols-3">
+      <UiCard>
+        <UiCardHeader class="pb-2">
+          <UiCardTitle class="text-sm font-medium">
+            账户余额
+          </UiCardTitle>
+        </UiCardHeader>
+        <UiCardContent>
+          <div class="text-3xl font-bold">
+            ¥{{ balance.toFixed(2) }}
+          </div>
+        </UiCardContent>
+      </UiCard>
+    </div>
+
+    <UiCard>
+      <UiCardHeader>
+        <UiCardTitle>交易记录</UiCardTitle>
+      </UiCardHeader>
+      <UiCardContent class="p-0">
+        <div v-if="loading" class="flex items-center justify-center py-12">
+          <Icon icon="lucide:loader-2" class="size-8 animate-spin text-muted-foreground" />
+        </div>
+
+        <div v-else-if="transactions.length === 0" class="text-center py-12 text-muted-foreground">
+          <Icon icon="lucide:receipt" class="size-16 mx-auto mb-4 opacity-30" />
+          <p>暂无交易记录</p>
+        </div>
+
+        <div v-else class="divide-y">
+          <div
+            v-for="tx in transactions"
+            :key="tx.id"
+            class="flex items-center justify-between p-4 hover:bg-muted/30"
+          >
+            <div class="flex items-center gap-4">
+              <div
+                class="size-10 rounded-xl flex items-center justify-center"
+                :class="tx.type === 'recharge' ? 'bg-green-500/10' : tx.type === 'refund' ? 'bg-blue-500/10' : 'bg-red-500/10'"
+              >
+                <Icon
+                  :icon="tx.type === 'recharge' ? 'lucide:arrow-down-left' : tx.type === 'refund' ? 'lucide:rotate-ccw' : 'lucide:arrow-up-right'"
+                  :class="getTypeClass(tx.type)"
+                  class="size-5"
+                />
+              </div>
+              <div>
+                <p class="font-medium">
+                  {{ tx.description || getTypeLabel(tx.type) }}
+                </p>
+                <p class="text-xs text-muted-foreground">
+                  {{ formatDate(tx.created_at) }}
+                </p>
+              </div>
+            </div>
+            <div class="text-right">
+              <p :class="getTypeClass(tx.type)" class="font-semibold text-lg">
+                {{ tx.type === 'recharge' || tx.type === 'refund' ? '+' : '-' }}¥{{ tx.amount.toFixed(2) }}
+              </p>
+              <p class="text-xs text-muted-foreground">
+                余额: ¥{{ tx.balance.toFixed(2) }}
+              </p>
+            </div>
+          </div>
+        </div>
+      </UiCardContent>
+    </UiCard>
+  </div>
+</template>