root/financial
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 更新 '@capp/eden' 依赖至 0.0.14，优化资产中心页面钱包展示样式和信息

Browse Source
This commit is contained in:
Seven
2026-01-19 00:29:15 +07:00
parent cdb3ba864c
commit a4f939bec4
3 changed files with 187 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
pnpm-lock.yaml generated
View File

@@ -52,8 +52,8 @@ catalogs:
specifier: 8.0.0
version: 8.0.0
'@capp/eden':
specifier: http://192.168.1.2:9538/api/capp-eden-0.0.12.tgz
version: 0.0.12
specifier: http://192.168.1.2:9538/api/capp-eden-0.0.14.tgz
version: 0.0.14
'@cloudflare/workers-types':
specifier: ^4.20260113.0
version: 4.20260116.0
@@ -298,7 +298,7 @@ importers:
version: 8.0.0(@capacitor/core@8.0.0)
'@capp/eden':
specifier: 'catalog:'
version: http://192.168.1.2:9538/api/capp-eden-0.0.12.tgz(@elysiajs/eden@1.4.6(elysia@1.4.22(@sinclair/typebox@0.34.47)(exact-mirror@0.2.6(@sinclair/typebox@0.34.47))(file-type@21.3.0)(openapi-types@12.1.3)(typescript@5.9.3)))
version: http://192.168.1.2:9538/api/capp-eden-0.0.14.tgz(@elysiajs/eden@1.4.6(elysia@1.4.22(@sinclair/typebox@0.34.47)(exact-mirror@0.2.6(@sinclair/typebox@0.34.47))(file-type@21.3.0)(openapi-types@12.1.3)(typescript@5.9.3)))
'@elysiajs/eden':
specifier: 'catalog:'
version: 1.4.6(elysia@1.4.22(@sinclair/typebox@0.34.47)(exact-mirror@0.2.6(@sinclair/typebox@0.34.47))(file-type@21.3.0)(openapi-types@12.1.3)(typescript@5.9.3))
@@ -1182,9 +1182,9 @@ packages:
'@capacitor/synapse@1.0.4':
resolution: {integrity: sha512-/C1FUo8/OkKuAT4nCIu/34ny9siNHr9qtFezu4kxm6GY1wNFxrCFWjfYx5C1tUhVGz3fxBABegupkpjXvjCHrw==}
'@capp/eden@http://192.168.1.2:9538/api/capp-eden-0.0.12.tgz':
resolution: {tarball: http://192.168.1.2:9538/api/capp-eden-0.0.12.tgz}
version: 0.0.12
'@capp/eden@http://192.168.1.2:9538/api/capp-eden-0.0.14.tgz':
resolution: {tarball: http://192.168.1.2:9538/api/capp-eden-0.0.14.tgz}
version: 0.0.14
peerDependencies:
'@elysiajs/eden': ^1.4.6
@@ -6903,7 +6903,7 @@ snapshots:
'@capacitor/synapse@1.0.4': {}
'@capp/eden@http://192.168.1.2:9538/api/capp-eden-0.0.12.tgz(@elysiajs/eden@1.4.6(elysia@1.4.22(@sinclair/typebox@0.34.47)(exact-mirror@0.2.6(@sinclair/typebox@0.34.47))(file-type@21.3.0)(openapi-types@12.1.3)(typescript@5.9.3)))':
'@capp/eden@http://192.168.1.2:9538/api/capp-eden-0.0.14.tgz(@elysiajs/eden@1.4.6(elysia@1.4.22(@sinclair/typebox@0.34.47)(exact-mirror@0.2.6(@sinclair/typebox@0.34.47))(file-type@21.3.0)(openapi-types@12.1.3)(typescript@5.9.3)))':
dependencies:
'@elysiajs/eden': 1.4.6(elysia@1.4.22(@sinclair/typebox@0.34.47)(exact-mirror@0.2.6(@sinclair/typebox@0.34.47))(file-type@21.3.0)(openapi-types@12.1.3)(typescript@5.9.3))

2
pnpm-workspace.yaml
View File

@@ -18,7 +18,7 @@ catalog:
'@capacitor/keyboard': 8.0.0
'@capacitor/share': ^8.0.0
'@capacitor/status-bar': 8.0.0
'@capp/eden': http://192.168.1.2:9538/api/capp-eden-0.0.12.tgz
'@capp/eden': http://192.168.1.2:9538/api/capp-eden-0.0.14.tgz
'@cloudflare/workers-types': ^4.20260113.0
'@elysiajs/eden': ^1.4.6
'@faker-js/faker': ^10.2.0

189
src/views/asset_center/index.vue
View File

@@ -70,23 +70,52 @@ function handleAction(actionId: string) {
</div>
</div>
<empty v-if="wallets.length === 0" class="my-10" />
<div v-else class="flex flex-col gap-4">
<div v-else class="wallet-grid">
<div
v-for="wallet in wallets"
:key="wallet.id"
class="card rounded-2xl overflow-hidden shadow-sm p-5"
class="wallet-card"
>
<div class="flex items-center justify-between">
<div class="flex-1">
<div class="text-sm text-[#666] mb-1 flex items-center gap-2 font-bold">
<ion-icon :icon="cardOutline" class="text-xl text-primary" />
<!-- 卡片头部 -->
<div class="wallet-header">
<div class="wallet-icon-wrapper">
<ion-icon :icon="cardOutline" class="wallet-icon" />
</div>
<div class="wallet-title">
<div class="wallet-name">
{{ wallet.walletType.name }}
</div>
<div class="text-2xl font-bold text-[#1a1a1a]">
¥ {{ formatAmount(wallet.available) }}
<div class="wallet-code">
{{ wallet.walletType.code }}
</div>
</div>
</div>
<!-- 余额信息 -->
<div class="balance-section">
<div class="balance-label">
可用余额
</div>
<div class="balance-amount">
<span class="currency">¥</span>
<span class="amount">{{ formatAmount(wallet.available) }}</span>
</div>
</div>
<!-- 额外信息 -->
<div class="wallet-footer">
<div class="footer-item">
<span class="footer-label">冻结：</span>
<span class="footer-value">¥{{ formatAmount(wallet.frozen || 0) }}</span>
</div>
<div class="footer-item">
<span class="footer-label">总额：</span>
<span class="footer-value">¥{{ formatAmount(wallet.available || 0) }}</span>
</div>
</div>
<!-- 装饰元素 -->
<div class="card-decoration" />
</div>
</div>
</section>
@@ -101,7 +130,147 @@ function handleAction(actionId: string) {
align-items: center;
justify-content: center;
}
.card {
/* background: linear-gradient(45deg, #ffffff, #ffdbdb 100%); */
.wallet-grid {
display: flex;
flex-direction: column;
gap: 12px;
}
.wallet-card {
position: relative;
background: linear-gradient(135deg, #ffffff 0%, #fff9f9 100%);
border-radius: 12px;
padding: 14px 16px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
overflow: hidden;
transition: all 0.3s ease;
border: 1px solid rgba(196, 30, 58, 0.08);
}
.wallet-card:active {
transform: translateY(-2px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}
.wallet-header {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 12px;
}
.wallet-icon-wrapper {
width: 38px;
height: 38px;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #c41e3a 0%, #8b1a2e 100%);
border-radius: 10px;
box-shadow: 0 2px 8px rgba(196, 30, 58, 0.25);
}
.wallet-icon {
font-size: 20px;
color: white;
}
.wallet-title {
flex: 1;
}
.wallet-name {
font-size: 15px;
font-weight: 700;
color: #1a1a1a;
margin-bottom: 1px;
letter-spacing: 0.2px;
}
.wallet-code {
font-size: 11px;
color: #999;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.3px;
}
.balance-section {
margin-bottom: 10px;
padding: 10px 0;
border-top: 1px solid rgba(0, 0, 0, 0.05);
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.balance-label {
font-size: 11px;
color: #999;
margin-bottom: 4px;
font-weight: 500;
}
.balance-amount {
display: flex;
align-items: baseline;
gap: 3px;
}
.currency {
font-size: 16px;
font-weight: 700;
color: #c41e3a;
}
.amount {
font-size: 24px;
font-weight: 800;
color: #c41e3a;
letter-spacing: 0.3px;
line-height: 1;
}
.wallet-footer {
display: flex;
justify-content: space-between;
align-items: center;
}
.footer-item {
display: flex;
align-items: baseline;
gap: 4px;
}
.footer-label {
font-size: 11px;
color: #999;
font-weight: 500;
}
.footer-value {
font-size: 12px;
color: #666;
font-weight: 600;
}
.card-decoration {
position: absolute;
right: -20px;
bottom: -20px;
width: 80px;
height: 80px;
background: radial-gradient(circle, rgba(196, 30, 58, 0.05) 0%, transparent 70%);
border-radius: 50%;
pointer-events: none;
}
/* 为不同的钱包添加不同的装饰颜色 */
.wallet-card:nth-child(2) .card-decoration {
background: radial-gradient(circle, rgba(255, 140, 0, 0.05) 0%, transparent 70%);
}
.wallet-card:nth-child(3) .card-decoration {
background: radial-gradient(circle, rgba(30, 136, 229, 0.05) 0%, transparent 70%);
}
</style>