<template>
  <div class="page-layout">
    <fx-header :config="config.body.header">
        <template #menu>
            <slot name="menu"></slot>
        </template>
        <template #uinfo>
            <slot name="uinfo"></slot>
        </template>
    </fx-header>
    <fx-content :config="config.body.content">
      <template #utable>
          <slot name="utable"></slot>
      </template>
    </fx-content>
  </div>
</template>
<script lang="ts">
export default {
  name: 'FxLayout'
}
</script>

<script setup lang="ts">
import FxHeader from './components/header.vue';

import FxContent from './components/content.vue';
import {ref, computed, onMounted } from 'vue'
const props = defineProps({
  config: {  // 配置项
    type: Object,
    default: {},
  },
});
const { config } = props
// import config from './config.ts';
// console.log('config', config);
// import { storeToRefs } from 'pinia';
// import { useRoute } from 'vue-router';
// import { useSettingStore, useTabsRouterStore } from '@/store';



// const route = useRoute();
// const settingStore = useSettingStore();
// const tabsRouterStore = useTabsRouterStore();
// const setting = storeToRefs(settingStore);

// const mainLayoutCls = computed(() => [
//   {
//     't-layout--with-sider': settingStore.showSidebar,
//   },
// ]);

</script>
<style lang="less">
.layout {
    display: flex;
    flex-direction: column;
}
</style>