matrix-spray-web/src/app.vue

<script setup lang="ts">
// socket.init(() => {})
// 获取屏幕宽度
// import { ElMessage } from 'element-plus'
//
// const screenWidth = window.screen.width
//
// // 获取屏幕高度
// const screenHeight = window.screen.height
//
// // 获取文档区宽度
// const docWidth = document.documentElement.clientWidth
//
// // 获取文档区高度
// const docHeight = document.documentElement.clientHeight
//
// // alert(`${screenWidth}-${screenHeight}`)
// ElMessage.success(`${screenWidth}-${screenHeight}`)
// ElMessage.success(`${docWidth}-${docHeight}`)
</script>

<template>
  <router-view v-slot="{ Component }" class="main-content">
    <transition>
      <component :is="Component" />
    </transition>
  </router-view>
</template>

<style scoped lang="scss">
.main-content {
  width: 100%;
  height: 100%;
  background: url("assets/images/background.jpg") no-repeat center;
  background-size: cover;
  overflow: hidden;
}
</style>