From c2b745cfb5688c942f11596ad411838d5b39859d Mon Sep 17 00:00:00 2001 From: huangzijie130 <129676495+huangzijie130@users.noreply.github.com> Date: Wed, 24 Sep 2025 16:57:31 +0800 Subject: [PATCH] =?UTF-8?q?style(=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4):=20?= =?UTF-8?q?=E6=94=AF=E4=BB=98=E9=87=91=E5=B8=81=E9=A1=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/ExchangeGoldCoinsView.vue | 185 +++++++++++++++------------- 1 file changed, 101 insertions(+), 84 deletions(-) diff --git a/src/views/ExchangeGoldCoinsView.vue b/src/views/ExchangeGoldCoinsView.vue index 6947924..b09036f 100644 --- a/src/views/ExchangeGoldCoinsView.vue +++ b/src/views/ExchangeGoldCoinsView.vue @@ -4,45 +4,63 @@
-
-
- +
+
+
Information
+
+
Details
+ +
-
- Available salary: +
+ Available salary: Loading... - {{ availableSalary }} + {{ + availableSalary + }}
-
-

Exchange Gold Coins

- - -
-
-
🪙
-
{{ coin.amount }}
-
${{ coin.price }}
+
+
Exchange Gold Coins
+
+ +
+
+ +
{{ coin.amount }}
+
${{ coin.price }}
+
- +
+ +
@@ -53,7 +71,7 @@ import { ref, reactive, onMounted } from 'vue' import { useRouter } from 'vue-router' import MobileHeader from '../components/MobileHeader.vue' import { getBankBalance, userSalaryCheckExchange, userBankExchangeGold } from '../api/wallet.js' -import {showError, showSuccess, showWarning} from "@/utils/toast.js"; +import { showError, showSuccess, showWarning } from '@/utils/toast.js' const router = useRouter() @@ -71,7 +89,7 @@ const coinOptions = reactive([ { id: 3, amount: 100000, price: 10 }, { id: 4, amount: 500000, price: 50 }, { id: 5, amount: 1000000, price: 100 }, - { id: 6, amount: 2000000, price: 200 } + { id: 6, amount: 2000000, price: 200 }, ]) // 获取银行余额 @@ -122,14 +140,15 @@ const checkUserRole = async () => { router.back() // 对于其他严重错误，也建议退出页面 } } catch (error) { - // 处理特定错误情况 if (error.errorCode === 1083) { // NOT_OPEN_ERROR showWarning('Exchange NOT_OPEN_ERROR') } else if (error.message && error.message.includes('HTTP Error: 406')) { // 处理 406 Not Acceptable 状态码 - showError('The server cannot produce a response matching the list of acceptable values defined in the request headers') + showError( + 'The server cannot produce a response matching the list of acceptable values defined in the request headers' + ) } else { // 其他错误情况 showError('Failed to load user information') @@ -150,19 +169,25 @@ const exchangeCoins = async () => { return } - const selectedCoinData = coinOptions.find(coin => coin.id === selectedCoin.value) + const selectedCoinData = coinOptions.find((coin) => coin.id === selectedCoin.value) // 检查余额是否足够 const coinPrice = selectedCoinData.price const availableBalance = parseFloat(availableSalary.value) if (isNaN(availableBalance) || availableBalance < coinPrice) { - showError(`Insufficient balance. Your current balance is $${availableBalance.toFixed(2)}, but you need $${coinPrice} to exchange.`) + showError( + `Insufficient balance. Your current balance is $${availableBalance.toFixed( + 2 + )}, but you need $${coinPrice} to exchange.` + ) return } // 显示确认对话框 - const confirmExchange = confirm(`Do you want to exchange ${selectedCoinData.amount} coins for $${selectedCoinData.price}?`) + const confirmExchange = confirm( + `Do you want to exchange ${selectedCoinData.amount} coins for $${selectedCoinData.price}?` + ) if (confirmExchange) { try { @@ -170,18 +195,19 @@ const exchangeCoins = async () => { const response = await userBankExchangeGold({ coinId: selectedCoinData.id, amount: selectedCoinData.price, - price: selectedCoinData.price + price: selectedCoinData.price, }) if (response.status === true || response.errorCode === 0) { - showSuccess(`Successfully exchanged ${selectedCoinData.amount} coins for $${selectedCoinData.price}`) + showSuccess( + `Successfully exchanged ${selectedCoinData.amount} coins for $${selectedCoinData.price}` + ) // 刷新银行余额 await fetchBankBalance() // 重置选择 selectedCoin.value = null - } else { // 接口调用失败 const errorMessage = response.message || 'Exchange failed, please try again later.' @@ -217,6 +243,11 @@ onMounted(() => {