|
@@ -2,7 +2,48 @@ |
|
|
<!-- 风机运行情况 --> |
|
|
<!-- 风机运行情况 --> |
|
|
<Container usage="Table"> |
|
|
<Container usage="Table"> |
|
|
<SubContainer title="风机运行情况" icon="docs" padding="17px"> |
|
|
<SubContainer title="风机运行情况" icon="docs" padding="17px"> |
|
|
风机运行情况 |
|
|
|
|
|
|
|
|
<div class="tables flex" style="height: 100%"> |
|
|
|
|
|
<table class="table-1 flex-1"> |
|
|
|
|
|
<thead> |
|
|
|
|
|
<tr style="font-size: 8px; background: #044a84; opacity: 19%"> |
|
|
|
|
|
<th>序号</th> |
|
|
|
|
|
<th>设备名称</th> |
|
|
|
|
|
<th>运行频率</th> |
|
|
|
|
|
<th>设备状态</th> |
|
|
|
|
|
</tr> |
|
|
|
|
|
</thead> |
|
|
|
|
|
<tbody> |
|
|
|
|
|
<tr |
|
|
|
|
|
v-for="(row, index) in tableData1" |
|
|
|
|
|
:key="index" |
|
|
|
|
|
style="font-size: 7px; background: #0b5499; opacity: 35%" |
|
|
|
|
|
> |
|
|
|
|
|
<td v-for="(d, idx) in row" :key="idx">{{ d }}</td> |
|
|
|
|
|
</tr> |
|
|
|
|
|
</tbody> |
|
|
|
|
|
</table> |
|
|
|
|
|
|
|
|
|
|
|
<div class="vertical-line"></div> |
|
|
|
|
|
<table class="table-2 flex-1"> |
|
|
|
|
|
<thead> |
|
|
|
|
|
<tr style="font-size: 8px; background: #044a84; opacity: 19%"> |
|
|
|
|
|
<th>序号</th> |
|
|
|
|
|
<th>设备名称</th> |
|
|
|
|
|
<th>运行频率</th> |
|
|
|
|
|
<th>设备状态</th> |
|
|
|
|
|
</tr> |
|
|
|
|
|
</thead> |
|
|
|
|
|
<tbody> |
|
|
|
|
|
<tr |
|
|
|
|
|
v-for="(row, index) in tableData1" |
|
|
|
|
|
:key="index" |
|
|
|
|
|
style="font-size: 7px; background: #0b5499; opacity: 35%" |
|
|
|
|
|
> |
|
|
|
|
|
<td v-for="(d, idx) in row" :key="idx">{{ d }}</td> |
|
|
|
|
|
</tr> |
|
|
|
|
|
</tbody> |
|
|
|
|
|
</table> |
|
|
|
|
|
</div> |
|
|
</SubContainer> |
|
|
</SubContainer> |
|
|
</Container> |
|
|
</Container> |
|
|
</template> |
|
|
</template> |
|
@@ -16,11 +57,51 @@ export default { |
|
|
props: {}, |
|
|
props: {}, |
|
|
components: { Container, SubContainer }, |
|
|
components: { Container, SubContainer }, |
|
|
data() { |
|
|
data() { |
|
|
return {}; |
|
|
|
|
|
|
|
|
return { |
|
|
|
|
|
tableHead: ["序号", "设备名称", "运行频率", "设备状态"], |
|
|
|
|
|
tableData1: [ |
|
|
|
|
|
// { |
|
|
|
|
|
// id: 1, |
|
|
|
|
|
// name: '风机1', |
|
|
|
|
|
// sequence: '稳运行', |
|
|
|
|
|
// status: '正常', // or 0 |
|
|
|
|
|
// } |
|
|
|
|
|
[1, "风机1", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[2, "风机2", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[3, "风机3", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[4, "风机4", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[5, "风机5", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[6, "风机6", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[7, "风机7", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[8, "风机8", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[9, "风机9", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[10, "风机10", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[11, "风机11", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[12, "风机12", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
[13, "风机13", "未运行", "正常" /**or 0,1*/], |
|
|
|
|
|
], |
|
|
|
|
|
}; |
|
|
}, |
|
|
}, |
|
|
}; |
|
|
}; |
|
|
</script> |
|
|
</script> |
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
<style scoped lang="scss"> |
|
|
@import "../../assets/styles/functions"; |
|
|
@import "../../assets/styles/functions"; |
|
|
|
|
|
|
|
|
|
|
|
.flex-1 { |
|
|
|
|
|
flex: 1; |
|
|
|
|
|
// background: #eee; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.vertical-line { |
|
|
|
|
|
margin: 0 3px; |
|
|
|
|
|
width: 3px; |
|
|
|
|
|
background: radial-gradient( |
|
|
|
|
|
ellipse at center, |
|
|
|
|
|
#6fe2ff, |
|
|
|
|
|
#52cbef80, |
|
|
|
|
|
transparent, |
|
|
|
|
|
transparent |
|
|
|
|
|
); |
|
|
|
|
|
} |
|
|
</style> |
|
|
</style> |