|
|
|
@@ -0,0 +1,55 @@ |
|
|
|
<!-- |
|
|
|
filename: KilnDataBoard.vue |
|
|
|
author: liubin |
|
|
|
date: 2023-12-04 16:51:00 |
|
|
|
description: |
|
|
|
--> |
|
|
|
|
|
|
|
<template> |
|
|
|
<div |
|
|
|
class="KilnDataBoard" |
|
|
|
style=" |
|
|
|
position: absolute; |
|
|
|
top: -8px; |
|
|
|
left: -16px; |
|
|
|
width: calc(100% + 28px); |
|
|
|
height: calc(100% + 38px); |
|
|
|
background: #ccc; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
gap: 16px; |
|
|
|
"> |
|
|
|
<section class="header" style="height: 80px;">窑炉生产运行驾驶舱</section> |
|
|
|
<section |
|
|
|
class="main-body" |
|
|
|
style=" |
|
|
|
display: grid; |
|
|
|
gap: 16px; |
|
|
|
flex: 1; |
|
|
|
grid-template-columns: repeat(3, minmax(100px, 1fr)); |
|
|
|
"> |
|
|
|
<div class="main-left" style="background: #f001"></div> |
|
|
|
<div class="main-middle" style="background: #0f01;"></div> |
|
|
|
<div class="main-right" style="background: #00f1;"></div> |
|
|
|
</section> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
name: 'KilnDataBoard', |
|
|
|
components: {}, |
|
|
|
props: {}, |
|
|
|
data() { |
|
|
|
return {}; |
|
|
|
}, |
|
|
|
computed: {}, |
|
|
|
methods: {}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
.KilnDataBoard { |
|
|
|
color: red; |
|
|
|
} |
|
|
|
</style> |
