<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="rule">规则管理</a-radio>
          <a-radio value="record">匹配记录</a-radio>
        </a-radio-group>
      </template>
      <steal-rule v-if="state.module === 'rule'" />
      <steal-record v-if="state.module === 'record'" />
    </a-card>
  </div>
</template>

<script lang="ts" setup>
import { reactive } from 'vue';
import StealRule from './steal-rule.vue';
import StealRecord from './steal-record.vue';

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