root/riwa-ionic
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 更新转账和提现组件的样式，统一背景色为淡色，优化用户界面

Browse Source
This commit is contained in:
Seven
2026-01-13 19:11:02 +07:00
parent 4a535dc871
commit 25cf78276b
2 changed files with 32 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/views/wallet/transfer.vue
View File

@@ -171,7 +171,7 @@ function getAccountTypeName(type: AccountType) {
选择币种
</ion-label>
<div
class="flex items-center justify-between bg-text-900 rounded-2xl p-4 cursor-pointer"
class="flex items-center justify-between bg-faint rounded-2xl p-4 cursor-pointer"
@click="openSelectCurrency"
>
<div class="flex items-center gap-3">
@@ -189,7 +189,7 @@ function getAccountTypeName(type: AccountType) {
<div class="relative flex flex-col gap-3">
<Field name="fromAccount">
<template #default="{ value }">
<div class="flex flex-col bg-text-900 rounded-2xl p-3">
<div class="flex flex-col bg-faint rounded-2xl p-3">
<span class="text-xs text-text-500">{{ t('transfer.from') }}</span>
<div class="pt-2">
<span class="text-base font-medium">{{ getAccountTypeName(value) }}</span>
@@ -211,7 +211,7 @@ function getAccountTypeName(type: AccountType) {
<Field name="toAccount">
<template #default="{ value }">
<div class="flex flex-col bg-text-900 rounded-2xl p-3">
<div class="flex flex-col bg-faint rounded-2xl p-3">
<span class="text-xs text-text-500">{{ t('transfer.to') }}</span>
<div class="pt-2">
<span class="text-base font-medium">{{ getAccountTypeName(value) }}</span>

44
src/views/withdraw/index.vue
View File

@@ -6,6 +6,7 @@ import { loadingController, modalController, toastController } from "@ionic/vue"
import { ErrorMessage, Field, Form } from "vee-validate";
import { client, safeClient } from "@/api";
import { AssetCodeEnum, ChainEnum, WithdrawMethodEnum } from "@/api/enum";
import { getCryptoIcon } from "@/config/crypto";
import SelectBankAccount from "./components/select-bank-account.vue";
import SelectCurrency from "./components/select-currency.vue";
import { createWithdrawSchema } from "./rules";
@@ -106,12 +107,19 @@ async function onSubmit(values: GenericObject) {
<div>
<Field name="assetCode">
<template #default="{ value }">
<ion-label class="text-sm">
{{ t("withdraw.chooseCurrency") }}
<ion-label class="block text-sm font-medium mb-2">
选择币种
</ion-label>
<ion-item button class="ion-no-border" @click="openSelectCurrency">
<ion-label>{{ value }}</ion-label>
</ion-item>
<div
class="flex items-center justify-between bg-faint rounded-2xl p-4 cursor-pointer"
@click="openSelectCurrency"
>
<div class="flex items-center gap-3">
<component :is="getCryptoIcon(value)" class="w-8 h-8" />
<span class="text-base font-medium">{{ value }}</span>
</div>
<ion-icon name="chevron-forward-outline" class="text-text-400" />
</div>
</template>
</Field>
<ErrorMessage name="assetCode" class="text-red-500 text-xs mt-1" />
@@ -139,17 +147,23 @@ async function onSubmit(values: GenericObject) {
<template #default="{ value: withdrawMethod }">
<div v-if="withdrawMethod === WithdrawMethodEnum.BANK">
<Field name="bankAccountId">
<ion-label class="text-sm">
{{ t('withdraw.bankAccountId') }}
</ion-label>
<ion-item button class="ion-no-border" @click="openSelectBankAccount">
<template v-if="currentBankAccount">
<div class="w-8 h-8 rounded-md mr-2 flex items-center justify-center text-white font-bold text-xs shadow-sm bg-[#0F5AA6]">
<span class="text-white">{{ currentBankAccount?.bankCode }}</span>
<template #default>
<ion-label class="block text-sm font-medium mb-2">
{{ t('withdraw.bankAccountId') }}
</ion-label>
<div
class="flex items-center justify-between bg-faint rounded-2xl p-4 cursor-pointer"
@click="openSelectBankAccount"
>
<div class="flex items-center gap-3">
<div class="w-8 h-8 rounded-md mr-2 flex items-center justify-center text-white font-bold text-xs shadow-sm bg-[#0F5AA6]">
<span class="text-white">{{ currentBankAccount?.bankCode }}</span>
</div>
<span class="text-base font-medium">{{ currentBankAccount?.bankName }}</span>
</div>
<ion-label>{{ currentBankAccount?.bankName }}</ion-label>
</template>
</ion-item>
<ion-icon name="chevron-forward-outline" class="text-text-400" />
</div>
</template>
</Field>
<ErrorMessage name="bankAccountId" class="text-red-500 text-xs mt-1" />
</div>