<template>
  <ld-layout
    layout="side"
  >
    <template #logo>
      <ld-logo>{{ systemTitle }}</ld-logo>
    </template>
    <template #menu v-if="menus">
      <ld-menu
        :options="menus"
        :iconUrl="iconUrl"
      />
    </template>
  </ld-layout>
</template>

<script lang="ts" setup>
import { onMounted, defineProps, type PropType, computed, } from 'vue';
import { useMenuStore, type AppConfig} from '@ldesign/business-next'


const props = defineProps({
  appConfig: {
    type: Object as PropType<AppConfig>,
    default: {}
  }
})

const {$state: menuState} = useMenuStore()

const menus = computed(() => menuState.list)

const systemTitle = computed(() => props.appConfig.system_title)

const iconUrl = computed(() => props.appConfig.menu_iconurl)

onMounted(async() => {
})

</script>