feat:多支付以及货币符号显示

src/views/billing/packagehistories/index.vue

@@ -7,6 +7,7 @@ import { useRouter } from 'vue-router';
 import { fetchPackageHistory } from '@/service/api/auth';
 import { useWindowSize } from '@vueuse/core';
 import { useTable, useTableOperate } from '@/hooks/common/table';
+import { getPaymentConfig } from '@/service/api/payment';
 
 const router = useRouter();
 const handleBack = () => {
@@ -14,7 +15,18 @@ const handleBack = () => {
 };
 
 const { t } = useI18n();
+const currencySymbol = ref('¥');
 
+const fetchCurrencySymbol = async () => {
+  try {
+    const response = await getPaymentConfig();
+    if (response && response.data) {
+      currencySymbol.value = response.data.currencySymbol || '¥';
+    }
+  } catch (error) {
+    console.error('Failed to fetch currency symbol:', error);
+  }
+};
 const packageData = ref<Api.Package.PackageHistoryRecord[]>([]);
 const total = ref(0);
 
@@ -51,6 +63,7 @@ const getPackageData = async () => {
 };
 
 onMounted(() => {
+  fetchCurrencySymbol();
   getPackageData();
 });
 
@@ -75,7 +88,7 @@ const showPackageDetail = (record: Api.Package.PackageHistoryRecord) => {
       ]),
       h('div', { class: 'detail-item' }, [
         h('span', { class: 'detail-label' }, t('page.packagehistories.price') + ':'),
-        h('span', { class: 'detail-value' }, `¥${Number(record.upackage?.price || 0).toFixed(2)}`)
+        h('span', { class: 'detail-value' }, `${currencySymbol.value}${Number(record.upackage?.price || 0).toFixed(2)}`)
       ]),
       h('div', { class: 'detail-item' }, [
         h('span', { class: 'detail-label' }, t('page.packagehistories.traffic') + ':'),
@@ -168,7 +181,7 @@ const { columns, data, loading, getData, mobilePagination, searchParams } = useT
       key: 'orderAmount',
       customRender: ({ text }: { text: string }) => {
         const formattedAmount = Number(text).toFixed(2);
-        return `¥${formattedAmount}`;
+        return `${currencySymbol.value}${formattedAmount}`;
       }
     },
     {

src/views/billing/rechargehistory/index.vue

@@ -6,6 +6,7 @@ import { useI18n } from "vue-i18n";
 import { useRouter } from 'vue-router';
 import { fetchRechargeHistory } from '@/service/api/auth';
 import { useWindowSize } from '@vueuse/core';
+import { getPaymentConfig } from '@/service/api/payment';
 
 const router = useRouter();
 const handleBack = () => {
@@ -13,7 +14,18 @@ const handleBack = () => {
 };
 
 const { t } = useI18n();
+const currencySymbol = ref('¥');
 
+const fetchCurrencySymbol = async () => {
+  try {
+    const response = await getPaymentConfig();
+    if (response && response.data) {
+      currencySymbol.value = response.data.currencySymbol || '¥';
+    }
+  } catch (error) {
+    console.error('Failed to fetch currency symbol:', error);
+  }
+};
 const rechargeData = ref<Api.Recharge.RechargeRecord[]>([]);
 const total = ref(0);
 
@@ -56,7 +68,7 @@ const { columns, data, loading, getData, mobilePagination, searchParams } = useT
     key: 'orderAmount',
     customRender: ({ text }: { text: string }) => {
       const formattedAmount = Number(text).toFixed(2);
-      return `¥${formattedAmount}`;
+      return `${currencySymbol.value}${formattedAmount}`;
     }
   },
   {
@@ -85,6 +97,9 @@ const { columns, data, loading, getData, mobilePagination, searchParams } = useT
   }
 ]
 });
+onMounted(()=>{
+  fetchCurrencySymbol();
+})
 
 </script>
 

src/views/home/modules/header-banner.vue

@@ -6,9 +6,26 @@ import type { ECOption } from '@/hooks/common/echarts';
 import { useI18n } from 'vue-i18n';
 import { useAuthStore } from '@/store/modules/auth';
 import { clientAuth } from '@/service/ue/client';
+import { getPaymentConfig } from '@/service/api/payment';
 
 const { t } = useI18n();
 const authStore = useAuthStore();
+
+// 添加货币符号的响应式引用
+const currencySymbol = ref('¥');
+
+// 获取货币符号
+const fetchCurrencySymbol = async () => {
+  try {
+    const response = await getPaymentConfig();
+    if (response && response.data) {
+      currencySymbol.value = response.data.currencySymbol || '¥';
+    }
+  } catch (error) {
+    console.error('Failed to fetch currency symbol:', error);
+  }
+};
+
 defineOptions({
   name: 'HeaderBanner'
 });
@@ -307,7 +324,7 @@ async function mockDataUpdate() {
         value: numBalance,
         max: Math.max(numBalance, 100),
         displayValue:formatBalance(response.balance),
-        unit: t('page.headerbanner.money'),
+        unit: currencySymbol.value,
         subTitle: t('page.headerbanner.deviceCount') + `: ${
           response.packageName ? (
           !response.clientNumEnable
@@ -422,6 +439,8 @@ let timer: ReturnType<typeof setInterval> | null = null;
 // 初始化
 async function init() {
   // 立即执行一次数据更新
+  // 先获取货币符号
+  await fetchCurrencySymbol();
   await mockDataUpdate();
   // 设置定期执行的定时器
   timer = setInterval(mockDataUpdate, 30000);
@@ -500,7 +519,7 @@ const getDeviceCount = (subTitle?: string, clientNumEnable?: boolean): string =>
             </div>
             <div class="info-item">
               <span class="info-label">{{ t('page.headerbanner.price') }}</span>
-              <span class="info-value">{{ packageInfo.price === '-' ? '-' : '¥' + packageInfo.price }}</span>
+              <span class="info-value">{{ packageInfo.price === '-' ? '-' : currencySymbol + packageInfo.price }}</span>
             </div>
             <div class="info-item">
               <span class="info-label">{{ t('page.headerbanner.monthflowr') }}</span>
@@ -531,7 +550,7 @@ const getDeviceCount = (subTitle?: string, clientNumEnable?: boolean): string =>
           <div class="info-group">
             <div class="info-item">
               <span class="info-label">{{ t('page.headerbanner.Remainingcredit') }}</span>
-              <span class="info-value">{{ baseData[0].displayValue === '-' ? '-' : '¥' + baseData[0].displayValue }}</span>
+              <span class="info-value">{{ baseData[0].displayValue === '-' ? '-' : currencySymbol + baseData[0].displayValue }}</span>
             </div>
             <div class="info-item">
               <span class="info-label">{{ t('page.headerbanner.client') }}</span>

src/views/recharge/balancerecharge/index.vue

@@ -8,6 +8,7 @@ import { useRouterPush } from '@/hooks/common/router';
 import type { Ref } from 'vue';
 import OrderConfirmModal from '@/components/order-confirm/orderConfirmModal.vue';
 import { useAppStore } from '@/store/modules/app';
+import { getPaymentConfig } from '@/service/api/payment';
 
 defineOptions({
   name: 'BalanceRecharge'
@@ -16,7 +17,18 @@ defineOptions({
 const { t } = useI18n();
 const { routerPushByKey } = useRouterPush();
 const appStore = useAppStore();
+const currencySymbol = ref('¥');
 
+const fetchCurrencySymbol = async () => {
+  try {
+    const response = await getPaymentConfig();
+    if (response && response.data) {
+      currencySymbol.value = response.data.currencySymbol || '¥';
+    }
+  } catch (error) {
+    console.error('Failed to fetch currency symbol:', error);
+  }
+};
 interface RechargeOption {
   amount: number;
   displayAmount: string;
@@ -27,13 +39,13 @@ const customAmount = ref<string | number | undefined>(undefined);
 const selectedAmount = ref<number | null>(null);
 const isCustomMode = ref<boolean>(false);
 
-const rechargeOptions: Ref<RechargeOption[]> = ref([
-  { amount: 10, displayAmount: `${t('page.carddata.money')}10`, price: 10.00 },
-  { amount: 20, displayAmount: `${t('page.carddata.money')}20`, price: 20.00 },
-  { amount: 30, displayAmount: `${t('page.carddata.money')}30`, price: 30.00 },
-  { amount: 50, displayAmount: `${t('page.carddata.money')}50`, price: 50.00 },
-  { amount: 100, displayAmount: `${t('page.carddata.money')}100`, price: 100.00 },
-  { amount: 200, displayAmount: `${t('page.carddata.money')}200`, price: 200.00 },
+const rechargeOptions = computed(() => [
+  { amount: 10, displayAmount: `${currencySymbol.value}10`, price: 10.00 },
+  { amount: 20, displayAmount: `${currencySymbol.value}20`, price: 20.00 },
+  { amount: 30, displayAmount: `${currencySymbol.value}30`, price: 30.00 },
+  { amount: 50, displayAmount: `${currencySymbol.value}50`, price: 50.00 },
+  { amount: 100, displayAmount: `${currencySymbol.value}100`, price: 100.00 },
+  { amount: 200, displayAmount: `${currencySymbol.value}200`, price: 200.00 },
 ]);
 
 const paymentAmount = computed(() => {
@@ -76,10 +88,12 @@ const handleBlur = () => {
 };
 
 onMounted(() => {
+  fetchCurrencySymbol();
   document.addEventListener('click', handleClickOutside);
 });
 
 onUnmounted(() => {
+  fetchCurrencySymbol();
   document.removeEventListener('click', handleClickOutside);
 });
 
@@ -202,7 +216,7 @@ const handlePaymentConfirm = async (paymentMethod: 'alipay' | 'wxpay') => {
         :disabled="!paymentAmount || paymentAmount <= 0"
         @click="handleRecharge"
       >
-       <span style="color: var(--text-color, var(--ant-text-color))"> ¥{{ paymentAmount.toFixed(2) }} {{ t('page.carddata.pay') }} </span>
+       <span style="color: var(--text-color, var(--ant-text-color))"> {{ currencySymbol }}{{ paymentAmount.toFixed(2) }} {{ t('page.carddata.pay') }} </span>
       </AButton>
     </div>
 

src/views/recharge/package/index.vue

@@ -8,10 +8,23 @@ import { aliPayPcPay,aliPayWapPay, wxPayScanCode, payBalance } from '@/service/a
 import { useRouterPush } from '@/hooks/common/router';
 import { useAppStore } from '@/store/modules/app';
 import { useAuthStore} from '@/store/modules/auth';
+import { getPaymentConfig } from '@/service/api/payment';
 
 defineOptions({
   name: 'PackageSubscription'
 });
+const currencySymbol = ref('¥');
+
+const fetchCurrencySymbol = async () => {
+  try {
+    const response = await getPaymentConfig();
+    if (response && response.data) {
+      currencySymbol.value = response.data.currencySymbol || '¥';
+    }
+  } catch (error) {
+    console.error('Failed to fetch currency symbol:', error);
+  }
+};
 const { t } = useI18n();
 const authStore = useAuthStore();
 interface RateLimit {
@@ -343,6 +356,7 @@ const isPackageActive = computed(() => {
 });
 
 onMounted(async () => {
+  await fetchCurrencySymbol();
   fetchDashboardData();
   await fetchPackages();
   await fetchUserBalance();
@@ -354,7 +368,7 @@ onMounted(async () => {
     <!-- 顶部价格展示 -->
     <div class="price-header">
       <div class="price">
-        <span class="currency">¥</span>
+        <span class="currency">{{ currencySymbol }}</span>
         <span class="amount">{{ selectedPackage.price }}</span>
       </div>
       <div class="subtitle">{{ selectedPackage.packageName }}</div>
@@ -380,7 +394,7 @@ onMounted(async () => {
             {{ t('page.setmeal.highlyrecommended') }}
           </div>
           <div class="package-name">{{ option.packageName }}</div>
-          <div class="price">¥{{ option.price }}</div>
+          <div class="price">{{ currencySymbol }}{{ option.price }}</div>
           <div class="traffic">{{ option.trafficEnable ? option.trafficDisplay : t('page.setmeal.unlimit') }}</div>
           <div class="device-count">
             {{ option.clientNumEnable ? `${option.clientNum} ${t('page.setmeal.device')}` : t('page.setmeal.unlimit') }}