|
|
|
@ -1,40 +1,36 @@ |
|
|
|
<template> |
|
|
|
<div v-loading="loading" |
|
|
|
style="padding: 16px;min-height: calc(100vh - 84px);display: flex; justify-content: center;align-items: center;"> |
|
|
|
<div style="padding: 16px;min-height: calc(100vh - 84px);display: flex; justify-content: center;align-items: center;"> |
|
|
|
<div class="div-box"> |
|
|
|
<div class="div-box-title"> 智能水温控制系统 </div> |
|
|
|
<div class="div-box-title"> 智能居家数据监护 </div> |
|
|
|
<div class="div-ul"> |
|
|
|
<div class="div-li"> |
|
|
|
<div> |
|
|
|
<span>当前温度：</span>{{ deviceInfo.temperature }}℃ |
|
|
|
<span>温度：</span>22.2℃ |
|
|
|
</div> |
|
|
|
<div> |
|
|
|
<span>报警器：</span> |
|
|
|
<el-switch disabled v-model="value2" active-color="#13ce66" inactive-color="#ff4949"> |
|
|
|
</el-switch> |
|
|
|
<div> <span>湿度：</span>50% |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- ON：开启 OFF：关闭 --> |
|
|
|
<div class="div-li"> |
|
|
|
<div> |
|
|
|
<span>加热器：</span> |
|
|
|
<el-switch disabled v-model="value2" active-color="#13ce66" inactive-color="#ff4949"> |
|
|
|
</el-switch> |
|
|
|
<span>CO：</span>5PPM |
|
|
|
</div> |
|
|
|
<div class="div-tips"> |
|
|
|
<span>温度阈值设定：</span>{{ deviceInfo.threshold }} <i class="el-icon-edit" |
|
|
|
style="color: rgb(64, 158, 255);margin-left: 4px;cursor: pointer;" @click="handleSettings"></i> |
|
|
|
<div> |
|
|
|
<span>预警：</span> |
|
|
|
<el-switch v-model="value2" active-color="#13ce66" inactive-color="#ff4949"> |
|
|
|
</el-switch> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="div-tips"><span>阈值设定：</span>30 <i class="el-icon-edit" |
|
|
|
style="color: rgb(64, 158, 255);margin-left: 4px;cursor: pointer;" @click="handleSettings"></i></div> |
|
|
|
</div> |
|
|
|
<!-- 添加或修改公告对话框 --> |
|
|
|
<el-dialog title="温度阈值设定" :visible.sync="open" width="780px" append-to-body> |
|
|
|
<el-dialog title="阈值设定" :visible.sync="open" width="780px" append-to-body> |
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
|
|
|
|
|
|
|
<el-form-item label="阈值" prop="threshold"> |
|
|
|
<el-input v-model="form.threshold" placeholder="请输入阈值" /> |
|
|
|
<el-form-item label="阈值" prop="noticeTitle"> |
|
|
|
<el-input v-model="form.noticeTitle" placeholder="请输入阈值" /> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<div slot="footer" class="dialog-footer"> |
|
|
|
@ -46,103 +42,45 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { queryProjectInfoByKey, deviceList, attributes, sendAttribute, sendCommand } from "@/api/school"; |
|
|
|
import { updateNotice } from "@/api/system/notice"; |
|
|
|
export default { |
|
|
|
name: "Index", |
|
|
|
data() { |
|
|
|
return { |
|
|
|
deviceId: "", // 设备id |
|
|
|
deviceInfo: { |
|
|
|
temperature: 0, // 温度 |
|
|
|
threshold: 0, // 阈值 |
|
|
|
}, |
|
|
|
open: false, |
|
|
|
value2: false, |
|
|
|
loading: false, |
|
|
|
// 表单参数 |
|
|
|
form: {}, |
|
|
|
// 表单校验 |
|
|
|
rules: { |
|
|
|
threshold: [ |
|
|
|
{ required: true, message: "阈值不能为空", trigger: "blur" } |
|
|
|
noticeTitle: [ |
|
|
|
{ required: true, message: "公告标题不能为空", trigger: "blur" } |
|
|
|
], |
|
|
|
noticeType: [ |
|
|
|
{ required: true, message: "公告类型不能为空", trigger: "change" } |
|
|
|
] |
|
|
|
}, |
|
|
|
// 版本号 |
|
|
|
version: "3.8.9", |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.getqueryProjectInfoByKey() // 根据项目key查找项目id |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 温度阈值设定弹窗 |
|
|
|
// 阈值设定弹窗 |
|
|
|
handleSettings() { |
|
|
|
this.open = true; |
|
|
|
this.form = { |
|
|
|
threshold: this.deviceInfo.threshold, |
|
|
|
noticeTitle: "30", |
|
|
|
}; |
|
|
|
// this.$message.success(''); |
|
|
|
}, |
|
|
|
|
|
|
|
// 根据项目key查找项目id |
|
|
|
getqueryProjectInfoByKey() { |
|
|
|
this.loading = true; |
|
|
|
queryProjectInfoByKey({ |
|
|
|
projectKey: "qKStHKKt" |
|
|
|
}).then(res => { |
|
|
|
this.getDeviceList(res.data.id) // 根据项目id查找设备列表 |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 根据项目id查找设备列表 |
|
|
|
getDeviceList(_id) { |
|
|
|
deviceList({ |
|
|
|
projectId: _id |
|
|
|
}).then(res => { |
|
|
|
const w2Device = res.rows.find(device => device.deviceName === "W2"); |
|
|
|
this.deviceId = w2Device.id; |
|
|
|
this.getAttributes(this.deviceId); // 根据设备id查找设备信息 |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 根据设备id查找设备信息 |
|
|
|
getAttributes(_id) { |
|
|
|
attributes({ |
|
|
|
deviceId: _id, |
|
|
|
}).then(res => { |
|
|
|
this.loading = false; |
|
|
|
// 获取温度和阈值信息，并赋值给deviceInfo |
|
|
|
let deviceAttributeRecordList = res.data.deviceAttributeRecordList |
|
|
|
let temperature = deviceAttributeRecordList.find(row => row.id === 447236074165760).attributeValue; |
|
|
|
let threshold = deviceAttributeRecordList.find(row => row.id === 447236078508288).attributeValue; |
|
|
|
// 阈值 threshold 特殊处理 |
|
|
|
if (threshold.indexOf("#") !== -1) { |
|
|
|
threshold = threshold.slice(1); // 去掉# |
|
|
|
} |
|
|
|
this.deviceInfo = { |
|
|
|
temperature: temperature, |
|
|
|
threshold: threshold, |
|
|
|
} |
|
|
|
|
|
|
|
// 根基温度值是否低于阈值，设置报警器、加热器的状态 |
|
|
|
this.value2 = false; |
|
|
|
if (temperature < threshold) { |
|
|
|
this.value2 = true; |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
/** 下发属性 */ |
|
|
|
submitForm: function () { |
|
|
|
/** 提交按钮 */ |
|
|
|
submitForm: function() { |
|
|
|
this.$refs["form"].validate(valid => { |
|
|
|
if (valid) { |
|
|
|
let param = {"Wen":`#${this.form.threshold}`} // 阈值 |
|
|
|
sendAttribute({ |
|
|
|
"attributeParams": JSON.stringify(param), // 阈值JSON字符串 |
|
|
|
"deviceId": this.deviceId // 设备id |
|
|
|
}).then(response => { |
|
|
|
this.getAttributes(this.deviceId); // 根据设备id查找设备信息 |
|
|
|
updateNotice(this.form).then(response => { |
|
|
|
this.$modal.msgSuccess("操作成功"); |
|
|
|
this.open = false; |
|
|
|
|
|
|
|
this.getList(); |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
@ -153,7 +91,6 @@ export default { |
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
.div-box { |
|
|
|
transform: scale(1.4); |
|
|
|
width: 500px; |
|
|
|
box-sizing: border-box; |
|
|
|
padding: 16px; |
|
|
|
@ -193,10 +130,6 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.div-li:last-child { |
|
|
|
margin-bottom: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.div-tips { |
|
|
|
font-size: 18px; |
|
|
|
line-height: 22px; |
|
|
|
|
lzp
4 months ago