hanzhengzheng/screenFront
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

机械分厂工位屏修改

Browse Source
This commit is contained in:
hzz 2024-01-30 16:44:35 +08:00
parent 311c02a669
commit 69f08cd255
2 changed files with 17 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
src/views/Mechanics/child/station/components/float.vue
View File

@ -8,70 +8,27 @@
-->
<template>
<div class="float">
<div class="floating1" id="floating">
<div :class="'floating'+(index+1)" id="floating" v-for="(item,index) in props.top_data">
<div class="roate">
<div class="roate-item1" id="roate-item">
<span class="data">{{ props.allData.data1 }}%</span>
<div :class="'roate-item'+(index+1)" id="roate-item">
<span class="data">{{ item.key }}</span>
</div>
</div>
<p class="title">{{ props.allData.title1 }}</p>
</div>
<div class="floating2" id="floating">
<div class="roate">
<div class="roate-item2" id="roate-item">
<span class="data" :style="getData2Style(props.allData.data2)">{{
props.allData.data2 === "N1"
? "工作"
: props.allData.data2 === "N2"
? "待机"
: props.allData.data2 === "N3"
? "停机"
: "未知状态"
}}
</span>
</div>
</div>
<p class="title">{{ props.allData.title2 }}</p>
</div>
<div class="floating3" id="floating">
<div class="roate">
<div class="roate-item3" id="roate-item">
<span class="data">{{ props.allData.data3 }}转</span>
</div>
</div>
<p class="title">{{ props.allData.title3 }}</p>
</div>
<div class="floating4" id="floating">
<div class="roate">
<div class="roate-item4" id="roate-item">
<span class="data">{{ props.allData.data4 }}</span>
</div>
</div>
<p class="title">{{ props.allData.title4 }}</p>
</div>
<p class="title">{{ item.val }}</p>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, getCurrentInstance, reactive, onMounted, computed } from "vue";
const props = defineProps({
allData: {
top_data: {
type: Object,
default: () => {
return {
data1: "95",
data2: "N1",
data3: "100",
data4: "下降",
title1: "稼动率",
title2: "设备状态",
title3: "钻头转速",
title4: "钻头状态",
};
return [{ key: "95", val: "稼动率" }, { key: "N1", val: "设备状态" }, { key: "100", val: "钻头转速" }, { key: "下降", val: "钻头状态" }];
},
},
}
}); // 定义props
const getData2Style = (data2Value: string) => {
switch (data2Value) {

18
src/views/Mechanics/child/station/index.vue
View File

@ -15,7 +15,7 @@
<div class="date">
<p class="date-time">{{ timeHtml }}</p>
</div>
<Float :allData="topData"></Float>
<Float :top_data="topData"></Float>
<Sum :allData="sumData"></Sum>
</div>
</div>
@ -35,16 +35,12 @@ let allData = reactive({
header: "炮塔铣床",
});
let topData = reactive({
data1: "95",
data2: "N1",
data3: "100",
data4: "下降",
title1: "稼动率",
title2: "设备状态",
title3: "钻头转速",
title4: "钻头状态",
});
let topData = reactive([
{ key: "95", val: "稼动率" },
{ key: "N1", val: "设备状态" },
{ key: "100", val: "钻头转速" },
{ key: "下降", val: "钻头状态" }
]);
let sumData = reactive({
data1: "高速",
data2: "50cm",