feat: 添加法币充值和提现功能的国际化支持，更新相关组件文本

2025-12-15 00:50:44 +07:00
parent f30fda5002
commit 3111b922fa
5 changed files with 102 additions and 27 deletions
--- a/src/views/deposit/fiat.vue
+++ b/src/views/deposit/fiat.vue
@@ -4,6 +4,8 @@ import { toastController } from "@ionic/vue";
 import { client } from "@/api";
 import { AssetCodeEnum, PaymentChannelEnum } from "@/api/enum";

+const { t } = useI18n();
+
 const form = ref<DepositFiatBody>({
  amount: "",
  assetCode: AssetCodeEnum.USDT,
@@ -32,7 +34,7 @@ async function onSubmit() {
  const { data, status } = await client.api.deposit.fiat.post(form.value);
  if (status === 200) {
    const toast = await toastController.create({
-      message: "Submission successful!",
+      message: t("recharge.fiat.submitSuccess"),
      duration: 1500,
      position: "bottom",
    });
@@ -49,13 +51,13 @@ async function onSubmit() {
        <ion-buttons slot="start">
          <ion-back-button />
        </ion-buttons>
-        <ion-title>Fiat Recharge</ion-title>
+        <ion-title>{{ t("recharge.fiat.title") }}</ion-title>
      </ion-toolbar>
    </IonHeader>
    <IonContent :fullscreen="true" class="ion-padding">
      <div class="flex flex-col gap-5">
        <ui-input-label
-          label="Recharge bank card account"
+          :label="t('recharge.fiat.bankAccount')"
          model-value="74321329321312"
          type="number"
          readonly
@@ -64,7 +66,7 @@ async function onSubmit() {

        <ion-radio-group v-model="form.assetCode">
          <ion-label class="text-sm">
-            Choose Currency
+            {{ t("recharge.fiat.chooseCurrency") }}
          </ion-label>
          <ion-item v-for="item in AssetCodeEnum" :key="item">
            <ion-radio :value="item" justify="space-between">
@@ -82,19 +84,19 @@ async function onSubmit() {
        <ui-input-label
          ref="inputInstance"
          v-model="form.amount"
-          label="Amount"
-          placeholder="Enter the amount"
+          :label="t('recharge.fiat.amount')"
+          :placeholder="t('recharge.fiat.enterAmount')"
          type="number"
          inputmode="numeric"
-          error-text="Please enter a valid amount."
+          :error-text="t('recharge.fiat.validAmountError')"
          @ion-input="validate($event.target.value as string)"
          @ion-blur="markTouched"
        />

-        <ion-note>Please make sure to enter the correct amount. After submission, the funds will be credited to your account after review in the background.</ion-note>
+        <ion-note>{{ t("recharge.fiat.note") }}</ion-note>

        <ion-button expand="block" @click="onSubmit">
-          Submit
+          {{ t("recharge.fiat.submit") }}
        </ion-button>
      </div>
    </IonContent>
--- a/src/views/user/components/recharge-channel.vue
+++ b/src/views/user/components/recharge-channel.vue
@@ -3,6 +3,7 @@ const emit = defineEmits<{
  (e: "close"): void;
 }>();

+const { t } = useI18n();
 const router = useRouter();

 async function handleFiatRecharge() {
@@ -16,9 +17,9 @@ async function handleFiatRecharge() {
    <div class="flex items-center gap-2.5">
      <i-ic-baseline-downloading class="text-2xl" />
      <ion-label class="flex-1">
-        <h2>Chain recharge</h2>
+        <h2>{{ t("recharge.channel.chainRecharge") }}</h2>
        <p class="w-[80%] text-sm">
-          Transfer crypto from on-chain wallet or exchange.
+          {{ t("recharge.channel.chainRechargeDesc") }}
        </p>
      </ion-label>
      <i-ic-round-arrow-forward-ios class="ml-auto text-text-400" />
@@ -27,9 +28,9 @@ async function handleFiatRecharge() {
    <div class="flex items-center gap-2.5" @click="handleFiatRecharge">
      <i-ic-baseline-data-saver-off class="text-2xl" />
      <ion-label class="flex-1">
-        <h2>Fiat currency</h2>
+        <h2>{{ t("recharge.channel.fiatCurrency") }}</h2>
        <p class="w-[80%] text-sm">
-          Transfer fiat currency through bank or other financial institutions.
+          {{ t("recharge.channel.fiatCurrencyDesc") }}
        </p>
      </ion-label>
      <i-ic-round-arrow-forward-ios class="ml-auto text-text-400" />
--- a/src/views/withdraw/index.vue
+++ b/src/views/withdraw/index.vue
@@ -4,6 +4,8 @@ import { toastController } from "@ionic/vue";
 import { client, safeClient } from "@/api";
 import { AssetCodeEnum, ChainEnum, WithdrawMethodEnum } from "@/api/enum";

+const { t } = useI18n();
+
 const amountInputInst = useTemplateRef<InputInstance>("amountInputInst");
 const [form, resetForm] = useResetRef<WithdrawBody>({
  assetCode: AssetCodeEnum.USDT,
@@ -51,14 +53,14 @@ async function onSubmit() {
        <ion-buttons slot="start">
          <ion-back-button />
        </ion-buttons>
-        <ion-title>Withdraw</ion-title>
+        <ion-title>{{ t("withdraw.title") }}</ion-title>
      </ion-toolbar>
    </IonHeader>
    <IonContent :fullscreen="true" class="ion-padding">
      <div class="flex flex-col gap-5">
        <ion-radio-group v-model="form.assetCode" @ion-change="handleCurrentChange">
          <ion-label class="text-sm">
-            Choose Currency
+            {{ t("withdraw.chooseCurrency") }}
          </ion-label>
          <ion-item v-for="item in AssetCodeEnum" :key="item">
            <ion-radio :value="item" justify="space-between">
@@ -69,7 +71,7 @@ async function onSubmit() {

        <ion-radio-group v-model="form.withdrawMethod">
          <ion-label class="text-sm">
-            Choose Withdraw Method
+            {{ t("withdraw.chooseMethod") }}
          </ion-label>
          <ion-item v-for="item in WithdrawMethodEnum" :key="item">
            <ion-radio :value="item" justify="space-between">
@@ -81,11 +83,11 @@ async function onSubmit() {
        <ui-input-label
          ref="amountInputInst"
          v-model="form.amount"
-          label="Amount"
-          :placeholder="`Enter the amount (Max: ${maxAmount})`"
+          :label="t('withdraw.amount')"
+          :placeholder="t('withdraw.enterAmountMax', { amount: maxAmount })"
          type="number"
          inputmode="numeric"
-          error-text="Please enter a valid amount."
+          :error-text="t('withdraw.validAmountError')"
          :max="maxAmount"
          @ion-input="validate($event.target.value as string)"
          @ion-blur="markTouched"
@@ -94,16 +96,16 @@ async function onSubmit() {
        <ui-input-label
          v-if="form.withdrawMethod === WithdrawMethodEnum.BANK"
          v-model="form.bankAccountId"
-          label="Bank Account ID"
-          placeholder="Enter the bank account ID"
+          :label="t('withdraw.bankAccountId')"
+          :placeholder="t('withdraw.enterBankAccountId')"
          type="text"
          inputmode="text"
-          error-text="Please enter a valid bank account ID."
+          :error-text="t('withdraw.validBankAccountError')"
        />
        <template v-else-if="form.withdrawMethod === WithdrawMethodEnum.CRYPTO">
          <ion-radio-group v-model="form.chain">
            <ion-label class="text-sm">
-              Choose Chain
+              {{ t("withdraw.chooseChain") }}
            </ion-label>
            <ion-item v-for="item in ChainEnum" :key="item">
              <ion-radio :value="item" justify="space-between">
@@ -113,16 +115,16 @@ async function onSubmit() {
          </ion-radio-group>
          <ui-input-label
            v-model="form.toAddress"
-            label="Crypto Address"
-            placeholder="Enter the crypto address"
+            :label="t('withdraw.cryptoAddress')"
+            :placeholder="t('withdraw.enterCryptoAddress')"
            type="text"
            inputmode="text"
-            error-text="Please enter a valid crypto address."
+            :error-text="t('withdraw.validCryptoAddressError')"
          />
        </template>

        <ion-button expand="block" @click="onSubmit">
-          Submit
+          {{ t("withdraw.submit") }}
        </ion-button>
      </div>
    </IonContent>