88 lines
3.1 KiB
Vue
88 lines
3.1 KiB
Vue
<!-- 实时数据表格 -->
|
|
<script setup>
|
|
import { ref } from "vue";
|
|
import { useWsStore } from "../store";
|
|
|
|
const store = useWsStore();
|
|
const listData = ref((store.data2.lineDetailData || Array(3).fill({})).map(
|
|
(item, index) => ({
|
|
productLine: item.productLine || "---",
|
|
mbt: item.edgingInput || "---",
|
|
mbb: item.edgingOutput || "---",
|
|
dkt: item.drillingInput || "---",
|
|
dkb: item.drillingOutput || "---",
|
|
dmt: item.coatingInput || "---",
|
|
dmb: item.coatingOutput || "---",
|
|
syt: item.silkInput || "---",
|
|
syb: item.silkOutput || "---",
|
|
ght: item.solidificationInput || "---",
|
|
ghb: item.solidificationOutput || "---",
|
|
gh1: item.temperingInput || "---",
|
|
gh2: item.temperingOutput || "---",
|
|
bzt: item.finalInput || "---",
|
|
bzb: item.finalOutput || "---",
|
|
})
|
|
));
|
|
store.$subscribe((mutation, state) => {
|
|
listData.value = (state.data2.lineDetailData || Array(3).fill({})).map(
|
|
(item, index) => ({
|
|
productLine: item.productLine || "---",
|
|
mbt: item.edgingInput || "---",
|
|
mbb: item.edgingOutput || "---",
|
|
dkt: item.drillingInput || "---",
|
|
dkb: item.drillingOutput || "---",
|
|
dmt: item.coatingInput || "---",
|
|
dmb: item.coatingOutput || "---",
|
|
syt: item.silkInput || "---",
|
|
syb: item.silkOutput || "---",
|
|
ght: item.solidificationInput || "---",
|
|
ghb: item.solidificationOutput || "---",
|
|
gh1: item.temperingInput || "---",
|
|
gh2: item.temperingOutput || "---",
|
|
bzt: item.finalInput || "---",
|
|
bzb: item.finalOutput || "---",
|
|
})
|
|
);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="realtime-table">
|
|
<el-table class="dark-table" :data="listData" :show-overflow-tooltip="true" row-class-name="dark-row"
|
|
header-row-class-name="dark-header">
|
|
<el-table-column prop="productLine" label="产线"></el-table-column>
|
|
<el-table-column prop="mbt" label="磨边上"></el-table-column>
|
|
<el-table-column prop="mbb" label="磨边下"></el-table-column>
|
|
<el-table-column prop="dkt" label="打孔上"></el-table-column>
|
|
<el-table-column prop="dkb" label="打孔下"></el-table-column>
|
|
<el-table-column prop="dmt" label="镀膜上"></el-table-column>
|
|
<el-table-column prop="dmb" label="镀膜下"></el-table-column>
|
|
<el-table-column prop="syt" label="丝印上"></el-table-column>
|
|
<el-table-column prop="syb" label="丝印下"></el-table-column>
|
|
<el-table-column prop="ght" label="固化上"></el-table-column>
|
|
<el-table-column prop="ghb" label="固化下"></el-table-column>
|
|
<el-table-column prop="gh1" label="钢化上"></el-table-column>
|
|
<el-table-column prop="gh2" label="钢化下"></el-table-column>
|
|
<el-table-column prop="bzt" label="包装上"></el-table-column>
|
|
<el-table-column prop="bzb" label="包装下"></el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.realtime-table {
|
|
/* background: #00f3; */
|
|
height: 160px;
|
|
width: 80%;
|
|
align-self: self-start;
|
|
}
|
|
|
|
.dark-table {
|
|
height: 100%;
|
|
}
|
|
|
|
.dark-table>>>.el-table__inner-wrapper::before {
|
|
background-color: transparent !important;
|
|
}
|
|
</style>
|