fix: 二期需求

zhengyiming

2025-03-12 8525b5c780d8855eca89c46790627c00b3d83c79

 packages/components/src/views/RechargeGrid/RechargeGrid.vue

@@ -1,11 +1,14 @@
<template>
  <MainCell title="生活缴费">
    <Grid square :gutter="20" :column-num="2">
      <GridItem class="publish-circle-friend-file-grid-item" text="话费">
        <Dongdong />
    <Grid square :gutter="20" :column-num="3" class="recharge-grid-wrapper">
      <GridItem class="recharge-grid-item" text="话费" @click="emit('phoneBillRecharge')">
        <img :src="IconFreePhone" class="recharge-grid-item-icon" />
      </GridItem>
      <GridItem class="publish-circle-friend-file-grid-item" text="电费">
        <Dongdong />
      <GridItem class="recharge-grid-item" text="电费" @click="emit('electricityBillRecharge')">
        <img :src="IconFreeDian" class="recharge-grid-item-icon" />
      </GridItem>
      <GridItem class="recharge-grid-item" text="燃气" @click="emit('gasBillRecharge')">
        <img :src="IconFreeGas" class="recharge-grid-item-icon" />
      </GridItem>
    </Grid>
  </MainCell>
@@ -13,9 +16,10 @@

<script setup lang="ts">
import MainCell from '../../components/Layout/MainCell.vue';
// import Grid from '../../components/Grid/Grid.vue';
import { Grid, GridItem } from '@nutui/nutui-taro';
import { Dongdong } from '@nutui/icons-vue-taro';
import IconFreePhone from '../../assets/icon-free-phone.png';
import IconFreeDian from '../../assets/icon-free-dian.png';
import IconFreeGas from '../../assets/icon-free-gas.png';

defineOptions({
  name: 'RechargeGrid',
@@ -24,4 +28,10 @@
// type Props = {};

// const props = withDefaults(defineProps<Props>(), {});

const emit = defineEmits<{
  (e: 'phoneBillRecharge'): void;
  (e: 'electricityBillRecharge'): void;
  (e: 'gasBillRecharge'): void;
}>();
</script>