feat: 充值页静态开发

src/pages.json

@@ -174,6 +174,15 @@
         "navigationBarTitleText": "VIP Membership",
         "navigationBarBackgroundColor": "#FFFFFF"
       }
+    },
+    {
+      "path": "pages/wallet/recharge",
+      "type": "page",
+      "layout": "default",
+      "style": {
+        "navigationBarTitleText": "Recharge",
+        "navigationBarBackgroundColor": "#fff"
+      }
     }
   ],
   "subPackages": []

src/pages/productDetail/checkOut.vue

@@ -158,7 +158,7 @@ function handleDialogConfirm() {
 
   if (icon === 'warning') {
     // 余额不足，跳转到充值页面
-    uni.showToast({ title: 'Redirecting to recharge...', icon: 'none' })
+    uni.navigateTo({ url: '/pages/wallet/recharge' })
   }
   else if (icon === 'success') {
     // 支付成功，跳转到订单页面

src/pages/wallet/recharge.vue

@@ -0,0 +1,61 @@
+<route lang="json5" type="page">
+{
+  layout: 'default',
+  style: {
+    navigationBarTitleText: 'Recharge',
+    navigationBarBackgroundColor: '#fff',
+  },
+}
+</route>
+
+<script lang="ts" setup>
+defineOptions({
+  name: 'Recharge', // 充值
+})
+const selectId = ref(1)
+</script>
+
+<template>
+  <z-paging>
+    <view class="px-24rpx">
+      <view class="py-30rpx text-center text-28rpx text-#595959">
+        Recharge Highest Discount <text class="text-[var(--wot-color-theme)]">
+          5%
+        </text>
+      </view>
+      <view class="grid grid-cols-2 gap-20rpx">
+        <view
+          v-for="i in 6"
+          :key="i"
+          class="border-1 border-transparent rounded-12rpx border-dashed bg-[rgba(var(--wot-color-theme-rgb),0.1)] py-24rpx text-center"
+          :style="{
+            borderColor: i === selectId ? 'var(--wot-color-theme)' : '',
+            backgroundColor: i === selectId ? 'rgba(var(--wot-color-theme-rgb),0.25)' : '',
+          }"
+        >
+          <view class="mb-8rpx text-40rpx text-[var(--wot-color-theme)] font-bold">
+            5,000
+          </view>
+          <view class="text-20rpx">
+            Get <text class="text-[var(--wot-color-theme)]">
+              ৳5,250, 5%
+            </text> Discount
+          </view>
+        </view>
+      </view>
+    </view>
+    <template #bottom>
+      <view class="bg-white/60 px-28rpx py-30rpx backdrop-blur-20">
+        <wd-button block>
+          Submit
+        </wd-button>
+      </view>
+    </template>
+  </z-paging>
+</template>
+
+<style lang="scss" scoped>
+.space-y-24rpx > * + * {
+  margin-top: 24rpx;
+}
+</style>