fix:余额支付额外确认

src/components/order-confirm/orderConfirmModal.vue

@@ -2,6 +2,7 @@
 import { defineProps, defineEmits } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { AlipayOutlined, WechatOutlined, WalletOutlined } from '@ant-design/icons-vue';
+import { Modal } from 'ant-design-vue';
 
 const { t } = useI18n();
 
@@ -26,7 +27,19 @@ const orderTypeMap = {
 } as const;
 
 const handleConfirm = (paymentMethod: 'alipay' | 'wxpay' | 'balance') => {
+  if (paymentMethod === 'balance') {
+    Modal.confirm({
+      title: t('page.order.confirmPayment'),
+      content: t('page.order.balancePayConfirm'),
+      okText: t('page.order.confirm'),
+      cancelText: t('page.order.cancel'),
+      onOk: () => {
         emit('confirm', paymentMethod);
+      }
+    });
+  } else {
+    emit('confirm', paymentMethod);
+  }
 };
 
 const handleCancel = () => {
@@ -109,7 +122,7 @@ const handleCancel = () => {
 <style scoped>
 .order-info {
   padding: 20px;
-  background: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
+  background: #f8f8f8;
   border-radius: 8px;
   margin-bottom: 24px;
 }
@@ -127,12 +140,12 @@ const handleCancel = () => {
 
 .label {
   width: 84px;
-  color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
+  color: #666;
 }
 
 .value {
   flex: 1;
-  color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
+  color: #333;
 }
 
 .value.highlight {
@@ -147,7 +160,7 @@ const handleCancel = () => {
 
 .payment-methods h4 {
   margin-bottom: 16px;
-  color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
+  color: #333;
   font-size: 14px;
   font-weight: normal;
 }
@@ -171,7 +184,7 @@ const handleCancel = () => {
 
 .method-item:hover {
   border-color: #1890ff;
-  background: rgba(6, 42, 77, 0.192);
+  background: #f0f5ff;
 }
 
 .payment-icon {
@@ -190,7 +203,7 @@ const handleCancel = () => {
 .method-item.disabled {
   opacity: 0.5;
   cursor: not-allowed;
-  background: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
+  background: #f5f5f5;
 }
 
 .balance-icon {
@@ -199,7 +212,7 @@ const handleCancel = () => {
 
 .balance-info {
   font-size: 12px;
-  color: var(--text-color, var(--ant-text-color)); /* 使用主题变量 */
+  color: #666;
   margin-top: 4px;
 }
 

src/locales/langs/en-us.ts

@@ -29,6 +29,7 @@ const local: any = {
     title: 'WANFi Platform'
   },
   common: {
+    loading:'loading',
     action: 'Action',
     add: 'Add',
     addSuccess: 'Add Success',
@@ -558,6 +559,7 @@ const local: any = {
       pay:'pay now'
     },
     headerbanner:{
+      nopackage:'No package',
       packageinfo:'Package information',
       packagename:'Package name',
       price:'Price',
@@ -578,7 +580,7 @@ const local: any = {
       maxspeed:'Max',
       deviceCount: "Device",
       nolimit:'Unlimited',
-      nopackage:'No package',
+      noPackage:'No package',
       money:' yuan',
       device:' Device',
     },
@@ -718,8 +720,13 @@ const local: any = {
       availableBalance:'Balance',
       paymentSuccess:'Payment  successful',
       paymentFailed:'Payment failed',
+      confirmPayment:'Balance Pay',
+      balancePayConfirm:'Are you sure you want to pay?',
+      cancel:'Cancel',
+      confirm:'Confirm',
     },
     kyc:{
+      rejectReason:'Reject Reason：',
       drive:'Driving license',
       pass:'Passport',
       idcard:'ID card/Residence permit',

src/locales/langs/zh-cn.ts

@@ -29,6 +29,7 @@ const local:any = {
     title: 'WANFi 平台',
   },
   common: {
+    loading:'加载中',
     action: '操作',
     add: '新增',
     addSuccess: '添加成功',
@@ -719,8 +720,13 @@ const local:any = {
       availableBalance:'可用余额',
       paymentSuccess:'支付成功',
       paymentFailed:'支付失败',
+      confirmPayment:'余额支付',
+      balancePayConfirm:'确定要支付吗?',
+      cancel:'取消',
+      confirm:'确定',
     },
      kyc:{
+       rejectReason:'拒绝原因：',
        drive:'驾驶证',
        pass:'护照',
        idcard:'身份证/居住证',

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

@@ -283,7 +283,7 @@ const speedLimits = ref({
 const packageInfo = ref({
   // packageName: '',
   // price: '0.00'
-  packageName: t('page.headerbanner.noPackage'),
+  packageName: t('page.headerbanner.nopackage'),
   price: '-',
   status:3,
 });
@@ -295,7 +295,7 @@ async function mockDataUpdate() {
     if (response && typeof response === 'object' && !response.error) {
       // 更新套餐信息
       packageInfo.value = {
-        packageName: response.packageName || t('page.headerbanner.nopackage'),
+        packageName: response.packageName ? response.packageName : t('page.headerbanner.nopackage'),
         price: response.packageName ? formatBalance(response.price) : '-',// 有套餐时才格式化价格
         status: response.status !== undefined ? Number(response.status) : 3,//有套餐时才判断状态
       };
@@ -496,7 +496,7 @@ const getDeviceCount = (subTitle?: string, clientNumEnable?: boolean): string =>
           <div class="info-group">
             <div class="info-item">
               <span class="info-label">{{ t('page.headerbanner.packagename') }}</span>
-              <span class="info-value">{{ packageInfo.packageName || t('page.headerbanner.nopackage') }}</span>
+              <span class="info-value">{{ packageInfo.packageName }}</span>
             </div>
             <div class="info-item">
               <span class="info-label">{{ t('page.headerbanner.price') }}</span>