修改第一个文章

gerson

2025-02-18 9831a1c47f949eb46f40fa468a3b476bb2bc8c72

 src/views/PaymentPage.vue

@@ -37,7 +37,7 @@
               >
                  <div class="flex justify-between items-center">
                     <div class="flex items-center gap-3">
                        <img src="@/assets/icons/wechat-pay.svg" alt="微信支付" class="w-8 h-8" />
                        <img src="@/assets/icons/PAY-WEIXIN.png" alt="微信支付" class="w-8 h-8" />
                        <span class="font-medium">微信支付</span>
                     </div>
                     <el-radio v-model="paymentMethod" label="wechat" />
@@ -51,7 +51,7 @@
               >
                  <div class="flex justify-between items-center">
                     <div class="flex items-center gap-3">
                        <img src="@/assets/icons/alipay.svg" alt="支付宝" class="w-8 h-8" />
                        <img src="@/assets/icons/PAY-ALI.png" alt="支付宝" class="w-8 h-8" />
                        <span class="font-medium">支付宝</span>
                     </div>
                     <el-radio v-model="paymentMethod" label="alipay" />
@@ -72,11 +72,11 @@

            <!-- 支付按钮 -->
            <div class="mt-8 text-center">
               <el-button type="primary" size="large" class="w-64" @click="handlePayment">
               <!-- <el-button type="primary" size="large" class="w-64" @click="handlePayment">
                  立即支付 ¥{{ orderInfo.totalAmount }}
               </el-button>
               <div class="mt-4">
                  <el-button text @click="cancelPayment">取消支付</el-button>
               </el-button> -->
               <div class="mt-4 text-danger">
                  <el-button text type="danger" @click="cancelPayment">取消支付</el-button>
               </div>
            </div>
         </div>
@@ -88,7 +88,8 @@
import { ElMessage } from 'element-plus';
import { computed, ref } from 'vue';
import { useRouter } from 'vue-router';

import wechartQrcode from '@/assets/qrcode/qrcode-wechat.png';
import alipayQrcode from '@/assets/qrcode/qrcode-alipay.png';
const router = useRouter();
const paymentMethod = ref('');

@@ -101,7 +102,7 @@

// 根据支付方式获取对应的二维码图片
const getQRCodeImage = computed(() => {
   return paymentMethod.value === 'wechat' ? '/src/assets/qrcode/wechat-qr.svg' : '/src/assets/qrcode/alipay-qr.svg';
   return paymentMethod.value === 'wechat' ? wechartQrcode : alipayQrcode;
});

// 处理支付
@@ -120,6 +121,16 @@
   ElMessage.info('取消支付');
   router.push('/');
};

onMounted(() => {
   const savedProduct = localStorage.getItem('currentProduct');
   if (savedProduct) {
      const productData = JSON.parse(savedProduct);
      const price = productData.Price;

      orderInfo.value.totalAmount = price;
   }
});
</script>

<style scoped>