分辨率改960

This commit is contained in:
2024-08-25 11:32:32 +08:00
parent a49a2ba1e9
commit fe1e44af9f
4 changed files with 82 additions and 64 deletions

View File

@@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0, minimum-scale=1.0,user-scalable=no">
<meta name="viewport" content="width=device-width, initial-scale=0.25, maximum-scale=1.0, minimum-scale=0.25, user-scalable=no, target-densitydpi=device-dpi" />
<title>天能涂板暂存库可视化看板</title>
</head>
<body class="clearfix">

View File

@@ -1,5 +1,7 @@
<template>
<div class="container">
<!-- <p>width:{{ width }}</p>
<p>height: {{ height }}</p> -->
<div class="content">
<h1>天能涂板暂存库可视化看板</h1>
<div class="login_wrap">
@@ -39,10 +41,18 @@ export default {
// index: this.$store.getters.equipId,
baseUrl: this.$store.getters.baseUrl,
setTime: this.$store.getters.setTime / 1000,
fullscreen: false
fullscreen: false,
width: '',
height: ''
}
},
methods: {
checkWH () {
setTimeout(() => {
this.width = document.body.clientWidth
this.height = document.body.clientHeight
}, 8000)
},
_config () {
if (this.setTime > 10800) {
this.$message({
@@ -58,30 +68,30 @@ export default {
}
this.$store.dispatch('setConfig', obj)
this.$router.push('/index')
let element = document.documentElement
if (this.fullscreen) {
if (document.exitFullscreen) {
document.exitFullscreen()
} else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen()
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen()
} else if (document.msExitFullscreen) {
document.msExitFullscreen()
}
} else {
if (element.requestFullscreen) {
element.requestFullscreen()
} else if (element.webkitRequestFullScreen) {
element.webkitRequestFullScreen()
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen()
} else if (element.msRequestFullscreen) {
// IE11
element.msRequestFullscreen()
}
}
this.fullscreen = !this.fullscreen
// let element = document.documentElement
// if (this.fullscreen) {
// if (document.exitFullscreen) {
// document.exitFullscreen()
// } else if (document.webkitCancelFullScreen) {
// document.webkitCancelFullScreen()
// } else if (document.mozCancelFullScreen) {
// document.mozCancelFullScreen()
// } else if (document.msExitFullscreen) {
// document.msExitFullscreen()
// }
// } else {
// if (element.requestFullscreen) {
// element.requestFullscreen()
// } else if (element.webkitRequestFullScreen) {
// element.webkitRequestFullScreen()
// } else if (element.mozRequestFullScreen) {
// element.mozRequestFullScreen()
// } else if (element.msRequestFullscreen) {
// // IE11
// element.msRequestFullscreen()
// }
// }
// this.fullscreen = !this.fullscreen
}
}
}
@@ -92,6 +102,8 @@ export default {
.container
_wh(100%, 100%)
background center / 100% 100% url('../images/bg.jpg') no-repeat
p
_font(12px, 12px ,#fff,,)
.content
position relative
z-index 1

View File

@@ -1,7 +1,7 @@
<template>
<div class="n_container">
<div class="zd-row">
<div class="zd-col-10 hwpl_wrap_1">
<div class="zd-row allHeight">
<div class="zd-col-10 allHeight hwpl_wrap_1">
<div class="zd-row jcflexstart state_wrap">
<div class="state_icon bg_col_1"></div>
<div class="state_title">满货位</div>
@@ -50,35 +50,37 @@
</div>
</div>
</div>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point2" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
<div class="hwpl_wrap_i">
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point2" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
</div>
</div>
</div>
</div>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point3" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point3" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
</div>
</div>
</div>
</div>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point4" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point4" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
</div>
</div>
</div>
</div>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point5" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
<div class="zd-row flexWrap hw_wrap">
<div class="hw_item" v-for="e in point5" :key="e.point_code">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
</div>
</div>
</div>
</div>
@@ -86,9 +88,9 @@
<div class="zd-col-1 gd_wrap">
<p class="txt">A<br>G<br>V<br><br></p>
</div>
<div class="zd-col-12 hwpl_wrap_2">
<div class="zd-row flexWrap rowReverse">
<div class="hw_item" v-for="e in point1" :key="e.point_code" :class="{'hw_item_active': e.point_status === '2'}">
<div class="zd-col-12 allHeight hwpl_wrap_2">
<div class="zd-row allHeight flexWrap rowReverse">
<div class="hw_item hw_item_2" v-for="e in point1" :key="e.point_code" :class="{'hw_item_active': e.point_status === '2'}">
<div class="hw_item_i">
<p class="zd-row jcflexcenter hw_p1">{{ e.point_code }}</p>
<p class="zd-row jcflexcenter hw_p2">{{ e.material_name }}</p>
@@ -357,7 +359,7 @@ export default {
.n_container
_wh(100%, 100%)
background center / 100% 100% url('../../../images/bg-center.png') no-repeat
padding .25rem 0 .25rem .25rem
padding 2.2% 0 2.2% 2.2%
.hwpl_wrap_1
width 4.32rem
.hwpl_wrap_2
@@ -407,18 +409,23 @@ export default {
.num_value
_font(.11rem, .1rem, #fff,,right)
font-family: 'YouSheBiaoTiHei';
.hwpl_wrap_i
_wh(100%, calc(100% - 2.015rem))
.hw_wrap
margin-bottom .5rem
height 23.4%
margin-bottom 3%
&:last-child
margin-bottom 0
.hw_item
_wh(.58rem, .545rem)
padding 0.14rem 0.01rem 0 0.01rem
margin-bottom .04rem
_wh(.58rem, 32%)
padding .5%
margin-bottom 1%
border-radius 4px
background radial-gradient(circle at 50% 100%, rgba(95, 217, 252, 50%), rgba(14, 82, 140, 50%), rgba(10, 54, 106, 50%));
border 4px solid rgba(42, 189, 251, 50%)
overflow hidden
.hw_item_2
height 4.94%
.hw_item_i
_wh(100%, 100%)
background-image linear-gradient(to bottom, transparent 11px, rgba(22, 62, 113, 20%) 1px), linear-gradient(to right, transparent 11px, rgba(22, 62, 113, 20%) 1px)
@@ -433,13 +440,12 @@ export default {
_font(.09rem, .09rem,#EFF2FF,,)
// font-family: 'YouSheBiaoTiHei'
font-family: "SourceHanSansCN-Bold";
height .09rem
margin-bottom: 0.05rem
height 50%
text-shadow: 0px 1px 1px #A0D4FF;
.hw_p2
_font(.1rem, .1rem, #EFF2FF,,center)
font-family: "SourceHanSansCN-Bold";
height 0.2rem
height 50%
.txt
_font(.2rem, .4rem, #fff,,center)
font-family: "YouSheBiaoTiHei"

View File

@@ -73,8 +73,8 @@ li {
html, body {
width: 100%;
height: 100%;
width: 3840px;
height: 2560px;
/* width: 3840px;
height: 2560px; */
}
body {