xiaomeng
/
wszhyWx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1

pull/110/head
孙萌 2024-02-19 18:03:38 +08:00
parent fd10372039
commit e58028d02d
2 changed files with 62 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/assets/js/charts.js
View File

@ -371,6 +371,7 @@ export function realTimeLine(id, data,pageId) {
} }
export function statusCharts(id, data) { export function statusCharts(id, data) {
var chartDom = document.getElementById(id); var chartDom = document.getElementById(id);
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
var option; var option;

115
src/views/page/realTime.vue
View File

@ -93,7 +93,7 @@
<img src="../../assets/image/status.png" alt="" /> <img src="../../assets/image/status.png" alt="" />
设备运行状态 设备运行状态
<div class="title-text" v-if="sunrise"><img src="../../assets/img/sunrise.png" alt="">日出:{{ sunrise }}</div> <div class="title-text" v-if="sunrise"><img src="../../assets/img/sunrise.png" alt="">日出:{{ sunrise }}</div>
<div class="title-text" v-if="sunset"><img src="../../assets/img/sunset.png" alt="">日落:{{ sunset }}</div> <div class="title-text" v-if="sunset"><img src="../../assets/img/sunset.png" alt="">日落:{{ sunset }}</div>
</div> </div>
<div class="flex-view border-none"> <div class="flex-view border-none">
<div class="status-view" v-for="item, index in statusList" :key="index"> <div class="status-view" v-for="item, index in statusList" :key="index">
@ -148,6 +148,7 @@
alt=""> alt="">
<img v-else src="../../assets/img/fan-off.png" alt=""> <span>5#风机</span> <img v-else src="../../assets/img/fan-off.png" alt=""> <span>5#风机</span>
</div> </div>
<div style="display: none;"></div>
</div> </div>
</div> </div>
<div v-else class="status-noTrue"> <div v-else class="status-noTrue">
@ -219,6 +220,7 @@
<img v-else src="../../assets/img/fan-off.png" alt=""> <img v-else src="../../assets/img/fan-off.png" alt="">
<span>8#补光灯</span> <span>8#补光灯</span>
</div> </div>
<div style="display: none;"></div>
</div> </div>
</div> </div>
<div v-else class="status-noTrue"> <div v-else class="status-noTrue">
@ -250,18 +252,17 @@
</div> </div>
<div class="status-true-text" v-if="item.type == 2 || item.type == 5 || item.type == 6 || item.type == 12 <div class="status-true-text" v-if="item.type == 2 || item.type == 5 || item.type == 6 || item.type == 12
|| item.type == 13 || item.type == 14 || item.type == 15|| item.type == 16"> || item.type == 13 || item.type == 14 || item.type == 15 || item.type == 16">
<div class="status-true-text-left">{{ getNumberStatus(item) }}</div> <div class="status-true-text-left">{{ getNumberStatus(item) }}</div>
<div class="status-true-text-right" <div class="status-true-text-right"
v-if="item.type == 6 || item.type == 5 || item.type == 2 || item.type == 15 || item.type == 14 || item.type == 13 || item.type == 12"> v-if="item.type == 6 || item.type == 5 || item.type == 2 || item.type == 15 || item.type == 14 || item.type == 13 || item.type == 12">
{{ item.progress }}%</div> {{ item.progress }}%</div>
</div> </div>
<div class="status-fan status-btn" v-else> <div class="status-fan status-btn" v-else>
<div class="btn" :class="item.index == 1 ? 'blue' : 'off'"> <div class="btn" :class="item.index == 1 ? 'blue' : 'off'">
<img class="light-img" :src="getIcon(item)" <img class="light-img" :src="getIcon(item)" alt="">
alt="">
<!-- <img v-else src="../../assets/img/fan-off.png" alt=""> --> <!-- <img v-else src="../../assets/img/fan-off.png" alt=""> -->
<span>{{item.index==1?'开启':'关闭'}}</span> <span>{{ item.index == 1 ? '开启' : '关闭' }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -439,7 +440,7 @@ export default {
data() { data() {
return { return {
sunrise: "00:00", sunrise: "00:00",
sunset: "00:00", sunset: "00:00",
statusList: [], statusList: [],
time: null,//右上角时间 time: null,//右上角时间
@ -667,9 +668,9 @@ export default {
height: divH, // 播放容器宽高 也可以直接设置成数字 如 1080 单位是px height: divH, // 播放容器宽高 也可以直接设置成数字 如 1080 单位是px
}) })
}, },
getIcon(item){ getIcon(item) {
var index = item.index var index = item.index
if (item.type == 3) { if (item.type == 3) {
//加温水泵 //加温水泵
if (index == 0) { if (index == 0) {
return require('../../assets/img/fan-off.png') return require('../../assets/img/fan-off.png')
@ -678,8 +679,8 @@ export default {
} else { } else {
return '' return ''
} }
} else if (item.type == 10) { } else if (item.type == 10) {
//环流风扇 //环流风扇
if (index == 0) { if (index == 0) {
return require('../../assets/img/fan-off.png') return require('../../assets/img/fan-off.png')
@ -688,7 +689,7 @@ export default {
} else { } else {
return '' return ''
} }
}else if (item.type == 4) { } else if (item.type == 4) {
//地热风机 //地热风机
if (index == 0) { if (index == 0) {
return require('../../assets/img/fan-off.png') return require('../../assets/img/fan-off.png')
@ -697,7 +698,7 @@ export default {
} else { } else {
return '' return ''
} }
}else if (item.type == 9) { } else if (item.type == 9) {
//高压微雾 //高压微雾
if (index == 0) { if (index == 0) {
return require('../../assets/img/fan-off.png') return require('../../assets/img/fan-off.png')
@ -717,7 +718,7 @@ export default {
return '' return ''
} }
} }
else if (item.type == 7) { else if (item.type == 7) {
//除雪 //除雪
if (index == 0) { if (index == 0) {
return require('../../assets/img/fan-off.png') return require('../../assets/img/fan-off.png')
@ -727,12 +728,12 @@ export default {
return '' return ''
} }
} }
}, },
getNumberStatus(item) { getNumberStatus(item) {
var index = item.index var index = item.index
if (item.type == 2 || item.type == 5 || item.type == 6 || item.type == 12 if (item.type == 2 || item.type == 5 || item.type == 6 || item.type == 12
|| item.type == 13 || item.type == 14 || item.type == 15|| item.type == 16) { || item.type == 13 || item.type == 14 || item.type == 15 || item.type == 16) {
//顶卷膜 //顶卷膜
if (index == 0) { if (index == 0) {
return '静止状态' return '静止状态'
@ -744,7 +745,7 @@ export default {
return '' return ''
} }
} }
// else if (item.type == 7) { // else if (item.type == 7) {
// //地热风机 // //地热风机
// if (index == 0) { // if (index == 0) {
// return '除雪关闭' // return '除雪关闭'
@ -789,25 +790,25 @@ export default {
} }
return num return num
}, },
//16进制转为时间 16位无符号高字节是时，低字节是分
convertToTimeMinutes(hexValue) {
// 将十进制数转换为16进制字符串
let hexString = hexValue.toString(16);
// 补零，确保结果是4位16进制数 //16进制转为时间 16位无符号高字节是时，低字节是分
while (hexString.length < 4) { convertToTimeMinutes(hexValue) {
hexString = "0" + hexString; // 将十进制数转换为16进制字符串
} let hexString = hexValue.toString(16);
return hexString; // 补零，确保结果是4位16进制数
}, while (hexString.length < 4) {
insertColonEveryTwoDigits(inputString) { hexString = "0" + hexString;
// 使用正则表达式将字符串每两位切割 }
const chunks = inputString.match(/.{1,2}/g);
return chunks.join(":"); return hexString;
// 使用join方法将切割后的数组元素用冒号连接起来 },
}, insertColonEveryTwoDigits(inputString) {
// 使用正则表达式将字符串每两位切割
const chunks = inputString.match(/.{1,2}/g);
return chunks.join(":");
// 使用join方法将切割后的数组元素用冒号连接起来
},
//countType计算类型 //countType计算类型
//0是原数据 //0是原数据
//1是原数据-400 //1是原数据-400
@ -944,7 +945,7 @@ export default {
this.api.postFsdata(data1).then(res => { this.api.postFsdata(data1).then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
var chartsData = res.data.data var chartsData = res.data.data
realTimeLine('realTime-line', chartsData,data1) realTimeLine('realTime-line', chartsData, data1)
} else { } else {
// this.$message.error(res.data.msg); // this.$message.error(res.data.msg);
} }
@ -1057,7 +1058,7 @@ export default {
this.api.getControlFsdata(data1).then(res => { this.api.getControlFsdata(data1).then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
var chartsData = res.data.data var chartsData = res.data.data
realTimeLine('realTime-line', chartsData,data1) realTimeLine('realTime-line', chartsData, data1)
} else { } else {
// this.$message.error(res.data.msg); // this.$message.error(res.data.msg);
} }
@ -1120,7 +1121,7 @@ export default {
if (res.data.code == 200) { if (res.data.code == 200) {
res.data.data.forEach((el, index) => { res.data.data.forEach((el, index) => {
var chartsData = res.data.data var chartsData = res.data.data
realTimeLine('realTime-line', chartsData,equipmentId) realTimeLine('realTime-line', chartsData, equipmentId)
}) })
} }
}) })
@ -1224,21 +1225,21 @@ export default {
} }
this.api.getControlGetState(TargetValue).then(res => { this.api.getControlGetState(TargetValue).then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
if(res.data.data["1119"]){ if (res.data.data["1119"]) {
this.sunrise = this.insertColonEveryTwoDigits( this.sunrise = this.insertColonEveryTwoDigits(
this.convertToTimeMinutes(res.data.data["1119"]) this.convertToTimeMinutes(res.data.data["1119"])
); );
}else{ } else {
this.sunrise ='' this.sunrise = ''
} }
if(res.data.data["1120"]){ if (res.data.data["1120"]) {
this.sunset = this.insertColonEveryTwoDigits( this.sunset = this.insertColonEveryTwoDigits(
this.convertToTimeMinutes(res.data.data["1120"]) this.convertToTimeMinutes(res.data.data["1120"])
); );
}else{ } else {
this.sunset ='' this.sunset = ''
} }
const statusList = [] const statusList = []
this.nowDevicestatus.forEach((el, index) => { this.nowDevicestatus.forEach((el, index) => {
if (el.id == 1) { if (el.id == 1) {
@ -1249,7 +1250,7 @@ export default {
fandata.type = 1 fandata.type = 1
fandata.name = el.name fandata.name = el.name
fandata.status = [] fandata.status = []
var num = res.data.data['1024']?res.data.data['1024']:0 var num = res.data.data['1024'] ? res.data.data['1024'] : 0
var num1 = this.padString(num.toString(2), 5) var num1 = this.padString(num.toString(2), 5)
var openListNew = [] var openListNew = []
openListNew = num1.split("") openListNew = num1.split("")
@ -1263,7 +1264,7 @@ export default {
fandata.type = 1 fandata.type = 1
fandata.name = el.name fandata.name = el.name
fandata.status = [] fandata.status = []
var num = res.data.data['1079']?res.data.data['1079']:0 var num = res.data.data['1079'] ? res.data.data['1079'] : 0
var num1 = this.padString(num.toString(2), 5) var num1 = this.padString(num.toString(2), 5)
var openListNew = [] var openListNew = []
openListNew = num1.split("") openListNew = num1.split("")
@ -1277,7 +1278,7 @@ export default {
fandata.type = 8 fandata.type = 8
fandata.name = el.name fandata.name = el.name
fandata.status = [] fandata.status = []
var num = res.data.data['1069']?res.data.data['1069']:0 var num = res.data.data['1069'] ? res.data.data['1069'] : 0
var num1 = this.padString(num.toString(2), 8) var num1 = this.padString(num.toString(2), 8)
var openListNew = [] var openListNew = []
openListNew = num1.split("") openListNew = num1.split("")
@ -1339,19 +1340,25 @@ export default {
//通风窗 //通风窗
var statusData = { name: el.name, type: 15, id: el.id, open: res.data.data[(1102 + ((el.id - 26) * 3))], progress: res.data.data[(1104 + ((el.id - 26) * 3))], index: res.data.data[(1103 + ((el.id - 26) * 3))] } var statusData = { name: el.name, type: 15, id: el.id, open: res.data.data[(1102 + ((el.id - 26) * 3))], progress: res.data.data[(1104 + ((el.id - 26) * 3))], index: res.data.data[(1103 + ((el.id - 26) * 3))] }
statusList.push(statusData) statusList.push(statusData)
} else if (el.id == 30 || el.id == 31 ) { } else if (el.id == 30 || el.id == 31) {
//内保温 //内保温
var statusData = { name: el.name, type: 16, id: el.id, open: res.data.data[(1182 + ((el.id - 30) * 3))], progress: res.data.data[(1184 + ((el.id - 30) * 3))], index: res.data.data[(1183 + ((el.id - 30) * 3))] } var statusData = { name: el.name, type: 16, id: el.id, open: res.data.data[(1182 + ((el.id - 30) * 3))], progress: res.data.data[(1184 + ((el.id - 30) * 3))], index: res.data.data[(1183 + ((el.id - 30) * 3))] }
statusList.push(statusData) statusList.push(statusData)
} }
}) })
this.statusList = statusList this.statusList = statusList
this.$forceUpdate(); this.$forceUpdate();
setTimeout(() => { setTimeout(() => {
this.statusList.forEach((el, index) => { this.statusList.forEach((el, index) => {
if (el.open != 0 && (el.type == 6 || el.type == 5 || el.type == 2 || el.type == 15 || el.type == 14 || el.type == 13 || el.type == 12)) { if (el.open != 0 && (el.type == 6 || el.type == 5 || el.type == 2 || el.type == 15 || el.type == 14 || el.type == 13 || el.type == 12)) {
setTimeout(() => {
statusCharts(`statusCharts${index}`, el.progress) statusCharts(`statusCharts${index}`, el.progress)
}, 0);
} }
}) })
}, 10); }, 10);