123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101 |
- <route lang="json5" type="page">
- {
- layout: 'default',
- style: {
- navigationBarTitleText: '%wallet.recharge.title%',
- navigationBarBackgroundColor: '#fff',
- "app-plus": {
- "titleNView": {
- "buttons": [
- {
- "text": "Record",
- "fontSize": "28rpx",
- "width": "85px"
- }
- ]
- }
- }
- },
- }
- </route>
- <script lang="ts" setup>
- import { rechargeAdd, rechargeCallback, rechargeGoodsList } from '@/api/wallet'
- import { formatNumber } from '@/utils'
- import { toPage } from '@/utils/page'
- defineOptions({
- name: 'Recharge', // 充值
- })
- const selectData = ref<any>({
- id: '',
- })
- // 触发确定按钮
- onNavigationBarButtonTap((event: any) => {
- if (event.text === 'Record') {
- toPage('/pages/wallet/rechargeRecord')
- }
- })
- const dataList = ref<any[]>([])
- async function getRechargeGoodsList() {
- const res = await rechargeGoodsList()
- dataList.value = res.data
- }
- async function submit() {
- const addRes = await rechargeAdd({ goodsId: selectData.value.id })
- console.log(addRes)
- if (addRes.code === '200') {
- const callbackRes = await rechargeCallback({ data: JSON.stringify({ orderNo: addRes.data.orderNo, status: addRes.data.status }) })
- console.log(callbackRes)
- }
- }
- onShow(() => {
- getRechargeGoodsList()
- })
- </script>
- <template>
- <z-paging>
- <view class="px-24rpx">
- <view class="py-30rpx text-center text-28rpx text-#595959">
- {{ $t('wallet.recharge.highestDiscount', [Math.max(...(dataList.map(i => i.discountRate)))]) }}
- </view>
- <view class="grid grid-cols-2 gap-20rpx">
- <view
- v-for="i in dataList"
- :key="i.id"
- 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.id === selectData.id ? 'var(--wot-color-theme)' : '',
- backgroundColor: i.id === selectData.id ? 'rgba(var(--wot-color-theme-rgb),0.25)' : '',
- }"
- @click="selectData = i"
- >
- <view class="mb-8rpx text-40rpx text-[var(--wot-color-theme)] font-bold">
- {{ formatNumber(i.amount) }}
- </view>
- <view class="text-20rpx">
- {{ $t('wallet.recharge.get') }} <text class="text-[var(--wot-color-theme)]">
- ৳{{ formatNumber(i.amount + i.discount) }}, {{ i.discountRate }}%
- </text> {{ $t('wallet.recharge.discount') }}
- </view>
- </view>
- </view>
- </view>
- <template #bottom>
- <view class="bg-white/60 px-28rpx py-30rpx backdrop-blur-20">
- <wd-button block :disabled="!selectData.id" @click="submit">
- {{ $t('wallet.recharge.submit') }}
- </wd-button>
- </view>
- </template>
- </z-paging>
- </template>
- <style lang="scss" scoped>
- .space-y-24rpx > * + * {
- margin-top: 24rpx;
- }
- </style>
|