From 1ba3a11308cf59c513d70fbc3608961f19a02621 Mon Sep 17 00:00:00 2001 From: zhengyiming <540361168@qq.com> Date: 星期三, 14 五月 2025 17:41:50 +0800 Subject: [PATCH] fix: ui --- packages/components/src/views/RechargeGrid/RechargeGrid.vue | 41 +++++++++++++++++++++++++++++++++++++---- 1 files changed, 37 insertions(+), 4 deletions(-) diff --git a/packages/components/src/views/RechargeGrid/RechargeGrid.vue b/packages/components/src/views/RechargeGrid/RechargeGrid.vue index 2240b76..c99dbee 100644 --- a/packages/components/src/views/RechargeGrid/RechargeGrid.vue +++ b/packages/components/src/views/RechargeGrid/RechargeGrid.vue @@ -1,21 +1,51 @@ <template> - <MainCell title="鐢熸椿缂磋垂"> - <Grid square :gutter="20" :column-num="2" class="recharge-grid-wrapper"> + <MainCell title="蹇�熺即璐�"> + <!-- <Grid square :gutter="20" :column-num="2" class="recharge-grid-wrapper"> <GridItem class="recharge-grid-item" text="璇濊垂" @click="emit('phoneBillRecharge')"> <img :src="IconFreePhone" class="recharge-grid-item-icon" /> + <div class="discountTag" v-if="lifePayPhoneRate > 0">{{ lifePayPhoneRate }}鎶�</div> </GridItem> <GridItem class="recharge-grid-item" text="鐢佃垂" @click="emit('electricityBillRecharge')"> <img :src="IconFreeDian" class="recharge-grid-item-icon" /> + <div class="discountTag" v-if="lifePayElectricRate > 0">{{ lifePayElectricRate }}鎶�</div> </GridItem> - </Grid> + <GridItem class="recharge-grid-item" text="鐕冩皵" @click="emit('gasBillRecharge')"> + <img :src="IconFreeGas" class="recharge-grid-item-icon" /> + <div class="discountTag" v-if="lifePayGasRate > 0">{{ lifePayGasRate }}鎶�</div> + </GridItem> + </Grid> --> + <div class="recharge-list-wrapper"> + <div class="recharge-list-item"> + <img :src="IconFreePhone" class="recharge-list-item-icon" /> + <div class="recharge-list-item-text">璇濊垂</div> + <NutButton type="primary" class="recharge-list-item-button">绔嬪嵆缂磋垂</NutButton> + </div> + <div class="recharge-list-item"> + <img :src="IconFreeDian" class="recharge-list-item-icon" /> + <div class="recharge-list-item-text">鐢佃垂</div> + <NutButton type="primary" class="recharge-list-item-button">绔嬪嵆缂磋垂</NutButton> + </div> + <div class="recharge-list-item"> + <img :src="IconFreeGas" class="recharge-list-item-icon" /> + <div class="recharge-list-item-text">鐕冩皵璐�</div> + <NutButton type="primary" class="recharge-list-item-button">绔嬪嵆缂磋垂</NutButton> + </div> + </div> </MainCell> </template> <script setup lang="ts"> import MainCell from '../../components/Layout/MainCell.vue'; -import { Grid, GridItem } from '@nutui/nutui-taro'; +import { Button as NutButton } from '@nutui/nutui-taro'; import IconFreePhone from '../../assets/icon-free-phone.png'; +console.log( + 'IconFreePhone: ', + IconFreePhone, + new URL('../../assets/icon-free-phone.png', import.meta.url) +); import IconFreeDian from '../../assets/icon-free-dian.png'; +import IconFreeGas from '../../assets/icon-free-gas.png'; +import { useGetRate } from '../../hooks'; defineOptions({ name: 'RechargeGrid', @@ -28,5 +58,8 @@ const emit = defineEmits<{ (e: 'phoneBillRecharge'): void; (e: 'electricityBillRecharge'): void; + (e: 'gasBillRecharge'): void; }>(); + +const { lifePayPhoneRate, lifePayElectricRate, lifePayGasRate } = useGetRate(); </script> -- Gitblit v1.9.1