修改样式

src/App.tsx

@@ -161,8 +161,7 @@ export default defineComponent({
             displayDirective="show"
             preset="card"
             title="VIP会员续费"
-            class="modalTitle background"
-            style={{ width: '860px' }}
+            class="modalTitle background vipWidth"
             v-model:show={showVipModal.value}
           >
             <VipPurchaseModal

src/components/VipPurchaseModal/index.module.less

@@ -30,6 +30,13 @@
     gap: 24px;
     margin-bottom: 32px;
     justify-content: center;
+
+    // 当最后一行不满时，让元素靠右对齐
+    &::after {
+      content: '';
+      flex: auto;
+      min-width: 280px;
+    }
   }
 
   .packageItem {
@@ -131,7 +138,7 @@
     :global {
       .n-button {
         height: 64px;
-        width: 38%;
+        min-width: 280px;
         font-size: 20px;
         font-weight: 600;
         border-radius: 32px;

src/components/VipPurchaseModal/index.tsx

@@ -9,7 +9,6 @@ import {
   getOrderDetail
 } from '@/api/payment';
 import { useUserStore } from '@/store/modules/users';
-import { getHttpOrigin } from '/src/helpers/utils';
 
 // API返回的套餐类型
 interface VipPackageApiItem {
@@ -176,7 +175,11 @@ export default defineComponent({
               await userStore.getInfo();
               emit('success');
               emit('close');
-            } else if (data.status === 'FAILED' || data.status === 'FAIL' || data.status === 'CLOSED') {
+            } else if (
+              data.status === 'FAILED' ||
+              data.status === 'FAIL' ||
+              data.status === 'CLOSED'
+            ) {
               stopPolling();
               paymentStatus.value = 'failed';
               window.$message.error('支付失败');
@@ -323,9 +326,6 @@ export default defineComponent({
               </div>
 
               <div class={styles.btnGroup}>
-                <NButton round size="large" onClick={() => emit('close')}>
-                  取消
-                </NButton>
                 <NButton
                   round
                   size="large"

src/styles/index.less

@@ -264,6 +264,10 @@ body > .n-drawer-container-relative {
   }
 }
 
+.vipWidth {
+  width: 1000px;
+}
+
 .modalTitleNew {
   border-radius: 12Px;
   .n-card-header {