<script lang="ts" setup>
import { reactive } from 'vue';

import { Page } from '@vben/common-ui';

import DictionaryItem from './item/index.vue';
import DictionaryType from './type/index.vue';

const state = reactive<{ type: string }>({
  type: '',
});

const handelTypeChange = (code: string) => {
  state.type = code;
};
</script>

<template>
  <Page auto-content-height>
    <div class="flex h-full">
      <div class="w-1/2">
        <DictionaryType @change="handelTypeChange" />
      </div>
      <div class="ml-4 w-1/2">
        <DictionaryItem :type="state.type" />
      </div>
    </div>
  </Page>
</template>
