<script lang="ts" setup>
import { ref } from "vue";
import Aside from "./aside/Aside.vue";
import Content from "./content/Content.vue";
import DataHeader from "@/components/DataHeader/index.vue";
import Robot from '@/components/Robot/index.vue'

const asideRef: any = ref(null);

function setAsideItemName(text) {
  asideRef.value.setAsideItemName(text);
}
</script>

<template>
  <div style="width: 100%; ">
    <div class="header">
      <DataHeader />
    </div>
    <div class="main">
      <!-- 侧边 -->
      <Aside ref="asideRef"  />

      <!-- 内容 -->
      <Content @set-aside-item-name="setAsideItemName" />
    </div>
    <Robot />
  </div>
</template>

<style lang="less" scoped>
:deep(.wrapper){
  top:0
}
:deep(.ip_box){
 z-index: 50;
}
:deep(.header_wrap){
  margin-top: 3px !important;
  margin-left: 16px;
   margin-right: 16px;
    background: #FFFFFF;
}
.main {
  display: flex;
  flex-direction: row;
  box-sizing: border-box;
  width: 100%;
}
</style>
