fix:充值界面底部显示修改
This commit is contained in:
1
src/typings/auto-imports.d.ts
vendored
1
src/typings/auto-imports.d.ts
vendored
@@ -13,6 +13,7 @@ declare global {
|
|||||||
const addThemeVarsToHtml: typeof import('../store/modules/theme/shared')['addThemeVarsToHtml']
|
const addThemeVarsToHtml: typeof import('../store/modules/theme/shared')['addThemeVarsToHtml']
|
||||||
const afterAll: typeof import('vitest')['afterAll']
|
const afterAll: typeof import('vitest')['afterAll']
|
||||||
const afterEach: typeof import('vitest')['afterEach']
|
const afterEach: typeof import('vitest')['afterEach']
|
||||||
|
const aliPayPcPay: typeof import('../service/api/payment')['aliPayPcPay']
|
||||||
const assert: typeof import('vitest')['assert']
|
const assert: typeof import('vitest')['assert']
|
||||||
const assign: typeof import('lodash-es')['assign']
|
const assign: typeof import('lodash-es')['assign']
|
||||||
const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
|
const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
|
||||||
|
|||||||
@@ -1,11 +1,11 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, computed, onMounted, onUnmounted } from 'vue';
|
import { ref, computed, onMounted, onUnmounted } from 'vue';
|
||||||
import { useBillingStore } from '@/store/modules/billing/billing';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { submitOrder } from '@/service/api/auth';
|
import { submitOrder } from '@/service/api/auth';
|
||||||
import { aliPayPcPay } from '@/service/api/payment';
|
import { aliPayPcPay } from '@/service/api/payment';
|
||||||
import { message } from 'ant-design-vue';
|
import { message } from 'ant-design-vue';
|
||||||
import type { Ref } from 'vue';
|
import type { Ref } from 'vue';
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: 'BalanceRecharge'
|
name: 'BalanceRecharge'
|
||||||
});
|
});
|
||||||
@@ -31,8 +31,6 @@ const rechargeOptions: Ref<RechargeOption[]> = ref([
|
|||||||
{ amount: 200, displayAmount: '200元', price: 200.00 },
|
{ amount: 200, displayAmount: '200元', price: 200.00 },
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const billingStore = useBillingStore();
|
|
||||||
|
|
||||||
const paymentAmount = computed(() => {
|
const paymentAmount = computed(() => {
|
||||||
if (customAmount.value !== undefined && customAmount.value !== '') {
|
if (customAmount.value !== undefined && customAmount.value !== '') {
|
||||||
return Number(customAmount.value);
|
return Number(customAmount.value);
|
||||||
@@ -72,7 +70,7 @@ const handleBlur = () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(() => {
|
||||||
document.addEventListener('click', handleClickOutside);
|
document.addEventListener('click', handleClickOutside);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -80,8 +78,6 @@ onUnmounted(() => {
|
|||||||
document.removeEventListener('click', handleClickOutside);
|
document.removeEventListener('click', handleClickOutside);
|
||||||
});
|
});
|
||||||
|
|
||||||
const balance = computed(() => billingStore.balance);
|
|
||||||
|
|
||||||
// 修改充值处理方法
|
// 修改充值处理方法
|
||||||
const handleRecharge = async () => {
|
const handleRecharge = async () => {
|
||||||
// 验证金额
|
// 验证金额
|
||||||
@@ -96,8 +92,6 @@ const handleRecharge = async () => {
|
|||||||
orderAmount: paymentAmount.value
|
orderAmount: paymentAmount.value
|
||||||
});
|
});
|
||||||
message.success('充值订单提交成功!');
|
message.success('充值订单提交成功!');
|
||||||
// 更新余额,传入充值金额
|
|
||||||
await billingStore.updateBalance(paymentAmount.value);
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
message.error('充值失败,请重试!');
|
message.error('充值失败,请重试!');
|
||||||
console.error('Failed to submit recharge order:', error);
|
console.error('Failed to submit recharge order:', error);
|
||||||
@@ -152,7 +146,7 @@ const handleAliPay = async () => {
|
|||||||
v-model:value="customAmount"
|
v-model:value="customAmount"
|
||||||
:placeholder="t('page.carddata.Customization')"
|
:placeholder="t('page.carddata.Customization')"
|
||||||
:min="1"
|
:min="1"
|
||||||
:max="999999"
|
:max="999"
|
||||||
class="w-full"
|
class="w-full"
|
||||||
@change="handleCustomAmount"
|
@change="handleCustomAmount"
|
||||||
@click.stop
|
@click.stop
|
||||||
@@ -163,12 +157,8 @@ const handleAliPay = async () => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 支付部分 -->
|
<!-- 支付按钮 -->
|
||||||
<div class="payment-section mt-8 bg-white p-4 rounded-lg border border-gray-100">
|
<div class="payment-section mt-8 bg-white p-4 rounded-lg border border-gray-100">
|
||||||
<div class="flex justify-between items-center mb-4">
|
|
||||||
<span class="text-gray-600">{{ t('page.carddata.Remainingbalance') }}:{{ balance }}元</span>
|
|
||||||
<span class="text-blue-500">{{ t('page.carddata.Theamountreceived') }}:{{ paymentAmount.toFixed(2) }}元</span>
|
|
||||||
</div>
|
|
||||||
<AButton
|
<AButton
|
||||||
type="primary"
|
type="primary"
|
||||||
size="large"
|
size="large"
|
||||||
|
|||||||
Reference in New Issue
Block a user