<script setup lang="ts">
import type { AuthorizationMenuType } from '~/types/login';

defineProps<{
  menuList: AuthorizationMenuType[];
}>();
</script>

<template>
  <template v-for="menu in menuList" :key="menu.menuId">
    <a-menu-item :key="menu.menuId" v-if="!menu.children">
      <nuxt-link :to="menu.menuUrl">{{ menu.menuName }}</nuxt-link>
    </a-menu-item>
    <a-sub-menu :key="menu.menuId" v-if="menu.children">
      <template #title>{{ menu.menuName }}</template>
      <template v-for="child in menu.children">
        <template v-if="!child.children">
          <a-menu-item :key="child.menuId">
            <nuxt-link :to="child.menuUrl">{{ child.menuName }}</nuxt-link>
          </a-menu-item>
        </template>
        <template v-if="child.children">
          <a-sub-menu :key="child.menuId">
            <template #title>{{ child.menuName }}</template>
            <layout-left-menu-item :menu-list="child.children" />
          </a-sub-menu>
        </template>
      </template>
    </a-sub-menu>
  </template>
</template>
