<template>
  <!-- <v-scale-screen ref="screenRef" width="1920" height="1080" :boxStyle="{ background: '#101a40' }"> -->
    <div class="screen">
      <!-- 标题 -->
      <screen-header></screen-header>

      <!-- 左侧 水质设备&控制器 -->
      <screen-left></screen-left>

      <!-- 右侧 告警数据  -->
      <screen-right></screen-right>
    </div>
  <!-- </v-scale-screen> -->
</template>

<script setup>
// import VScaleScreen from 'v-scale-screen'
import ScreenHeader from "./screen/layout/header.vue"
import ScreenLeft from "./screen/layout/ScreenLeft.vue"
import ScreenRight from "./screen/layout/ScreenRight.vue"
</script>
<style lang="scss" scoped>
.screen {
  position: relative;
  width: 100%;
  height: 100%;
  background-image: url("../assets/scream/bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  color: #ffffff;
}
</style>
