mt-fe-group/dezhou-screen
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update area

Browse Source
This commit is contained in:
lb 2023-06-06 16:58:44 +08:00
parent 95809c226d
commit 7c4903f463
1 changed files with 34 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/components/isolate-area-1/Area.vue
View File

@ -1,12 +1,20 @@
<template> <template>
<DragabbleContainer class="isolate-area-1"> <DragabbleContainer class="isolate-area-1">
<SmallBox2 <div class="data pressure">
v-for="rd in rdata" <span>压</span>
:key="rd.icon" <span>力</span>
:icon="rd.icon" <span v-for="press, index in pressure" :key="index"
:title="rd.title" :class="{ 'digit': true, 'dot': press == '.' ? true : false }">{{ press
:value="rd.value" }}</span>
></SmallBox2> <span>Pa</span>
</div>
<SmallBox2 class="data-center" v-for="rd in rdata" :key="rd.icon" :icon="rd.icon" :title="rd.title" :value="rd.value"></SmallBox2>
<div class="data runtime">
<span>运</span>
<span>行</span>
<span v-for="val, index in runtime" :key="index" class="digit">{{ val }}</span>
<span>天</span>
</div>
</DragabbleContainer> </DragabbleContainer>
</template> </template>
@ -22,6 +30,8 @@ export default {
components: { DragabbleContainer, SmallBox2 }, components: { DragabbleContainer, SmallBox2 },
data() { data() {
return { return {
pressure: '10.1'.split(''),
runtime: '0012'.split(''),
rdata: [ rdata: [
// { icon: "temp", title: "车间温度", value: "27℃" }, // { icon: "temp", title: "车间温度", value: "27℃" },
{ icon: "fire", title: "当前火向", value: "" }, { icon: "fire", title: "当前火向", value: "" },
@ -31,13 +41,13 @@ export default {
}; };
}, },
watch: { watch: {
fireDirection: function(val) { fireDirection: function (val) {
this.$set(this.rdata[0], 'value', val) this.$set(this.rdata[0], 'value', val)
}, },
fireChangeTime: function(val) { fireChangeTime: function (val) {
this.$set(this.rdata[1], 'value', val) this.$set(this.rdata[1], 'value', val)
}, },
lastFireChangeTime: function(val) { lastFireChangeTime: function (val) {
let [_, min, sec] = /(\d+)分(\d+)秒/.exec(val || '0分0秒') let [_, min, sec] = /(\d+)分(\d+)秒/.exec(val || '0分0秒')
if (timeFun) clearInterval(timeFun) if (timeFun) clearInterval(timeFun)
timeFun = setInterval(() => { timeFun = setInterval(() => {
@ -65,11 +75,23 @@ export default {
.isolate-area-1 { .isolate-area-1 {
display: flex; display: flex;
color: $main-color;
background: lightyellow;
> .small-box-2:not(:last-child) { > *:not(:last-child) {
margin: { margin: {
right: adjust(15px); right: adjust(10px);
} }
} }
> .data {
background: lightgreen;
}
// > .data-center + .data-center {
// margin: {
// left: adjust(15px);
// }
// }
} }
</style> </style>