feat: 添加资产记录和资金、交易账户视图;更新钱包状态管理和路由配置

This commit is contained in:
2026-01-06 16:01:01 +07:00
parent 3d4babea93
commit 9747f300ac
13 changed files with 325 additions and 58 deletions

View File

@@ -4,59 +4,58 @@ import SolarRoundTransferHorizontalBoldDuotone from "~icons/solar/round-transfer
import { getCryptoIcon } from "@/config/crypto";
const walletStore = useWalletStore();
const { fundingBalances, totalAssetValue } = storeToRefs(walletStore);
const { balances, totalAssetValue } = storeToRefs(walletStore);
</script>
<template>
<div>
<div class="text-md font-semibold my-4">
资产分布
</div>
<div class="text-md font-semibold my-4">
资产分布
</div>
<div class="grid grid-cols-2 gap-4">
<div class="asset-card">
<div class="text-xs text-text-400 font-semibold flex items-center gap-1">
<SolarDollarMinimalisticBoldDuotone />
资金账户
</div>
<div class="font-bold">
${{ totalAssetValue.fundingValueUsd }}
</div>
<div class="grid grid-cols-2 gap-4">
<div class="asset-card" @click="$router.push('/wallet/funding')">
<div class="text-xs text-text-400 font-semibold flex items-center gap-1">
<SolarDollarMinimalisticBoldDuotone />
资金账户
</div>
<div class="asset-card">
<div class="text-xs text-text-400 font-semibold flex items-center gap-1">
<SolarRoundTransferHorizontalBoldDuotone />
交易账户
</div>
<div class="font-bold">
${{ totalAssetValue.tradingValueUsd }}
</div>
<div class="font-bold">
${{ totalAssetValue.fundingValueUsd }}
</div>
</div>
<div class="text-md font-semibold my-4">
资产
<div class="asset-card" @click="$router.push('/wallet/trading')">
<div class="text-xs text-text-400 font-semibold flex items-center gap-1">
<SolarRoundTransferHorizontalBoldDuotone />
交易账户
</div>
<div class="font-bold">
${{ totalAssetValue.tradingValueUsd }}
</div>
</div>
</div>
<ion-list lines="none" class="space-y-5 mt-2!">
<ion-item v-for="asset, i in fundingBalances" :key="i" class="">
<div class="flex items-center space-x-3 flex-1">
<component :is="getCryptoIcon(asset.assetCode)" class="w-8 h-8" />
<div class="space-y-1">
<div class="font-medium text-md">
{{ asset.assetCode }}
</div>
<div class="text-xs text-text-700 font-bold">
Total: ${{ asset.total }}
</div>
<div class="text-md font-semibold my-4">
资产
</div>
<ion-list lines="none" class="space-y-5 mt-2!">
<ion-item v-for="asset, i in balances" :key="i" @click="$router.push(`/asset_record/${asset.assetCode}`)">
<div class="flex items-center space-x-3 flex-1">
<Icon :icon="asset.asset.iconUrl || ''" class="w-8 h-8" />
<div class="space-y-1">
<div class="font-medium text-md">
{{ asset.assetCode }}
</div>
<div class="text-xs text-text-700 font-bold">
Total: ${{ asset.total }}
</div>
</div>
<div class="w-fit font-bold">
${{ Number(asset.available) }}
</div>
</ion-item>
</ion-list>
</div>
</div>
<div class="w-fit font-bold">
${{ Number(asset.available) }}
</div>
</ion-item>
</ion-list>
</template>
<style lang='css' scoped>

View File

@@ -16,11 +16,6 @@ const totalAsset = computed(() => Number(totalAssetValue.value.totalValueUsd).to
function onCloseModal() {
rechargeInstance.value?.$el.dismiss(null, "confirm");
}
onMounted(() => {
walletStore.syncFundingBalances();
walletStore.syncTradingBalances();
});
</script>
<template>