<template>
  <div class="container">
    <Breadcrumb :items="['充值账户管理', '列表/统计']" />
    <a-card class="general-card" title="列表/统计">
      <template #extra>
        <a-radio-group v-model="state.module" type="button">
          <a-radio value="list">列表</a-radio>
          <a-radio value="summary">统计</a-radio>
        </a-radio-group>
      </template>
      <list v-if="state.module === 'list'" />
      <Summary v-if="state.module === 'summary'" />
    </a-card>
  </div>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';
import List from './list.vue';
import Summary from './summary.tsx';

const state = reactive<{
  module: 'list' | 'summary';
}>({
  module: 'list'
});
</script>
