<!-- 首页看板 -->
<script lang="ts" setup name="Dashboard">
import verificationDetail from './components/verificationDetail.vue'
import deviceDetail from './components/deviceDetail.vue'
import deviceList from './components/deviceList.vue'
import rightBox from './components/rightBox.vue'
const height = ref(document.body.clientHeight - 50 - 60 - 10)
window.addEventListener('resize', () => {
  const bodyHeight = document.body.clientHeight - 50 - 60
  height.value = bodyHeight
})
</script>

<template>
  <div class="container" :style="`height:${height}px`">
    <div class="container" :style="`height:${height}px;width:66.66%`">
      <!-- 检定详情 -->
      <verification-detail />
      <!-- 设备详情 -->
      <device-detail />
      <!-- 设备列表 -->
      <device-list />
    </div>
    <div class="container" :style="`height:${height}px;width:33.33%`">
      <right-box />
    </div>
  </div>
</template>

<style lang="scss" scoped>
.container {
  // width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  padding: 0;
  overflow: hidden;
}
</style>