Commit 420b99ab authored by xiexingan's avatar xiexingan

提交

parent ded2be1b
<template lang="pug"> <template lang="pug">
.animation .animation
.info-title .info-title
| {{dataForm.name}} //- | {{ dataForm.name }}
el-button(icon='el-icon-close' style='float:right;' type='text' @click='closeQueryDetailVisible') | 空调
div(style='height:40px; width:100%;padding-top:10px') el-button(
div(style='width:80px; float:left; line-height:40px; padding-left:10px;') 关联监控: icon="el-icon-close",
.info-form style="float: right",
.info-title 监控点信息 type="text",
.info-form @click="closeQueryDetailVisible"
.quDetailM )
p.leftP 线路站点&nbsp;:&nbsp;&nbsp; .info-form(style="text-align: center; border-bottom: 1px solid #c0c0c0")
span {{dataForm.lineStation}} img(src="../../../assets/images/kt.jpg")
.info-form(style="border-bottom: 1px solid #c0c0c0")
.quDetailM .quDetailM
p.leftP 资源点名称&nbsp;:&nbsp;&nbsp;{{dataForm.name}} p.leftP 设备名称&nbsp;:&nbsp;&nbsp; 室内机
.quDetailM .quDetailM
p.leftP 资源点类型&nbsp;:&nbsp;&nbsp;{{dataForm.typeName}} p.leftP 设备编号&nbsp;:&nbsp;&nbsp; CDSLAKS-009
.quDetailM .quDetailM
p.leftP 资源点编码&nbsp;:&nbsp;&nbsp;{{dataForm.code}} p.leftP 设备品牌:&nbsp;:&nbsp;&nbsp;格力
.quDetailM .quDetailM
p.leftP 资源点状态&nbsp;:&nbsp;&nbsp;{{dataForm.status==1?'正常':'异常'}} p.leftP 设备型号:&nbsp;:&nbsp;&nbsp;晶弘33-1
.quDetailM .quDetailM
p.leftP 部署位置&nbsp;:&nbsp;&nbsp;{{dataForm.deployLocation}} p.leftP 安装日期:&nbsp;:&nbsp;&nbsp;2020-01-04
p.leftP 维保日期:&nbsp;:&nbsp;&nbsp;2020-01-15
.info-form
el-row
el-col(:span="8")
.switch-warp
div(:class="[state == 1 ? 'on' : '']", @click="handleSwitch(1)") 打开
div(:class="[state == 2 ? 'on' : '']", @click="handleSwitch(2)") 关闭
el-col.text-size(:span="16", flex, justify-content="start")
div(style="width: 60px") 频率设置:
el-input(size="mini", style="width: 60px", v-model="speed")
span &nbsp;转
el-button(type="primary", size="mini", style="margin-left: 10px") 设定
el-row
el-col.text-size(:span="8") 当前已
span(v-if="state == 1") 打开
span(v-else) 关闭
el-col.text-size(:span="10") 当前频率:
span(style="color: blue") 2289
span &nbsp;转/分
.info-state
span(style="font-weight: bold") 空调运行状态
div
span.type 电压:
span.value 220 V
div
span.type 电流:
span.value 4 A
div
span.type 功率因数:
span.value 0.8 kw
div
span.type 功率:
span.value 0.8 kw
div
span.type 电能:
span.value 12 kw.h
</template> </template>
<script> <script>
...@@ -32,6 +68,8 @@ export default { ...@@ -32,6 +68,8 @@ export default {
}, },
data() { data() {
return { return {
speed: '',
state: 1,
video1: 0, video1: 0,
stationId: localStorage.getItem('stationId'), stationId: localStorage.getItem('stationId'),
imgUrl: '', imgUrl: '',
...@@ -71,11 +109,58 @@ export default { ...@@ -71,11 +109,58 @@ export default {
closeQueryDetailVisible() { closeQueryDetailVisible() {
this.$emit('closeQ') this.$emit('closeQ')
},
handleSwitch(state) {
this.state = state
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.switch-warp {
width: 80px;
height: 26px;
font-size: 12px;
line-height: 25px;
overflow: hidden;
border-radius: 13px;
background: #d3d3d3;
border: 1px solid rgba(0, 0, 0, 0.03);
box-shadow: 0px 1px 0px 1px rgba(255, 255, 255, 0.25),
0px 2px 4px 0px rgba(0, 0, 0, 0.1);
div {
width: 39px;
height: 24px;
line-height: 24px;
float: left;
text-align: center;
cursor: pointer;
}
div.on {
background: #4cb527;
color: #fff;
border-radius: 13px;
border: 1px solid rgba(23, 41, 71, 0.02);
box-shadow: 0px 1px 0px 0px rgba(255, 255, 255, 0.3),
0px 2px 0px 0px rgba(255, 255, 255, 0.15);
}
}
.text-size {
font-size: 12px;
line-height: 28px;
}
.info-state {
padding: 0 10px 10px;
.type {
font-size: 14px;
margin: 5px 0 0 10px;
display: inline-block;
width: 85px;
}
.value {
color: #47b320;
}
}
.el-table__header { .el-table__header {
width: 100% !important; width: 100% !important;
} }
...@@ -286,7 +371,7 @@ export default { ...@@ -286,7 +371,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r1:before { .el-icon-wq-r1:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r2 { .el-icon-wq-r2 {
...@@ -294,7 +379,7 @@ export default { ...@@ -294,7 +379,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r2:before { .el-icon-wq-r2:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r3 { .el-icon-wq-r3 {
...@@ -302,7 +387,7 @@ export default { ...@@ -302,7 +387,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r3:before { .el-icon-wq-r3:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r5 { .el-icon-wq-r5 {
...@@ -310,7 +395,7 @@ export default { ...@@ -310,7 +395,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r5:before { .el-icon-wq-r5:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r6 { .el-icon-wq-r6 {
...@@ -318,7 +403,7 @@ export default { ...@@ -318,7 +403,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r6:before { .el-icon-wq-r6:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
...@@ -329,7 +414,7 @@ export default { ...@@ -329,7 +414,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r1b:before { .el-icon-wq-r1b:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r2b { .el-icon-wq-r2b {
...@@ -339,7 +424,7 @@ export default { ...@@ -339,7 +424,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r2b:before { .el-icon-wq-r2b:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r3b { .el-icon-wq-r3b {
...@@ -349,7 +434,7 @@ export default { ...@@ -349,7 +434,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r3b:before { .el-icon-wq-r3b:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r5b { .el-icon-wq-r5b {
...@@ -359,7 +444,7 @@ export default { ...@@ -359,7 +444,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r5b:before { .el-icon-wq-r5b:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
.el-icon-wq-r6b { .el-icon-wq-r6b {
...@@ -369,7 +454,7 @@ export default { ...@@ -369,7 +454,7 @@ export default {
background-size: 65%; background-size: 65%;
} }
.el-icon-wq-r6b:before { .el-icon-wq-r6b:before {
content: ''; content: "";
font-size: 16px; font-size: 16px;
} }
</style> </style>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment