You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
53 lines
1.6 KiB
53 lines
1.6 KiB
<script lang="ts" setup>
|
|
import { useDeviceStore } from 'stores/deviceStore'
|
|
import { ref } from 'vue'
|
|
|
|
const deviceStore = useDeviceStore()
|
|
const deviceInfo = ref(deviceStore.deviceInfo)
|
|
const screenInfo = {
|
|
width: window.innerWidth, // 屏幕宽度（逻辑像素）
|
|
height: window.innerHeight, // 屏幕高度（逻辑像素）
|
|
availWidth: window.screen.availWidth, // 可用宽度（排除任务栏等）
|
|
availHeight: window.screen.availHeight, // 可用高度
|
|
pixelRatio: window.devicePixelRatio, // 设备像素比（物理像素/逻辑像素）
|
|
colorDepth: window.screen.colorDepth, // 颜色深度
|
|
}
|
|
const width = Math.floor(screenInfo.width * screenInfo.pixelRatio)
|
|
const height = Math.floor(screenInfo.height * screenInfo.pixelRatio)
|
|
const screenWidth = ref(width)
|
|
const screenHeight = ref(height)
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div class="device-ul">
|
|
<div>设备ID：{{ deviceInfo.deviceId }}</div>
|
|
</div>
|
|
<div class="device-ul">
|
|
<div>设备类型：{{ deviceInfo.deviceType }}</div>
|
|
</div>
|
|
<div class="device-ul">
|
|
<div>IP地址：{{ deviceInfo.ip }}</div>
|
|
</div>
|
|
<div class="device-ul">
|
|
<div>初始化状态：{{ deviceInfo.deviceTypeInited ? '已初始化' : '未初始化' }}</div>
|
|
</div>
|
|
<div class="device-ul">
|
|
<div>设备屏幕尺寸：{{ screenWidth }} x {{ screenHeight }}</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped>
|
|
.device-ul{
|
|
background: #F6FAFE;
|
|
height: 4rem;
|
|
display: flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
border-radius: 10px;
|
|
margin-top: 1rem;
|
|
padding-left: 2rem;
|
|
font-size: 1.5rem;
|
|
}
|
|
</style>
|