修改设备显示信息

master
夜笙歌 1 year ago
parent b23ca3f0f0
commit f2ef241ade

@ -1,47 +1,46 @@
$(() => { $(() => {
tableAnimation('#chart2') tableAnimation('#chart2')
$.get(ctx + 'broad/home/deviceInfo', {}, (e) => {
let data = e.data[0]
console.log(data)
$('.bg1').html(`<p>${data.deviceFunction}</p>`)
$('.bg2').html(`<p>${data.deviceParam}</p>`)
})
$.get(ctx + 'broad/home/queryParam', {}, (e) => { $.get(ctx + 'broad/home/queryParam', {}, (e) => {
let arr = [
{ let enumArr = {
name: "一体机切刀A", '转速': 'n/s',
top: '1%', '电流': 'A',
left: '15%', '温度': '℃',
data1: '转速', '压力': 'Kpa',
data2: '电流', }
unit1: 'n/s', let data = e.data
unit2: 'A', let arrNum = Array.from(new Set([...e.data.map(e => e.order_by)]))
}, let arr = arrNum.map(e => {
{ let data1 = data.filter(val => val.order_by === e)
name: "一体机A机头", let obj = {}
top: '35%', data1.forEach((e, i) => {
left: '40%', obj.left = e.location_x + '%'
data1: '温度', obj.top = e.location_y + '%'
data2: '压力', obj.name = e.name
unit1: '℃', obj['data' + (i + 1)] = e.pointname
unit2: 'Kpa', obj['num' + (i + 1)] = e.data
}, obj['unit' + (i + 1)] = enumArr[e.pointname]
{ })
name: "一体机A", return obj
top: '45%', })
left: '71%',
data1: '转速',
data2: '电流',
unit1: 'n/s',
unit2: 'A',
},
]
arr.forEach(val => { arr.forEach(val => {
let html = ` let html = `
<div class="centerInfo" style="top: ${val.top};left:${val.left}"> <div class="centerInfo" style="top: ${val.top};left:${val.left}">
<div class="win"> <div class="win" style="display: none">
<div class="title">${val.name}</div> <div class="title">${val.name}</div>
<div class="span1">${val.data1}: ${e.data.find(res => res.name === val.name && res.pointname === val.data1)?.data || 0}${val.unit1}</div> <div class="span1">${val.data1}: ${val.num1.data || 0}${val.unit1}</div>
<div class="span2">${val.data2}: ${e.data.find(res => res.name === val.name && res.pointname === val.data2)?.data || 0}${val.unit2}</div> <div class="span2">${val.data2}: ${val.num2.data || 0}${val.unit2}</div>
</div> </div>
<div class="icon"></div> <div class="icon" onclick="show(this)"></div>
</div> </div>
` `
$("#centerInfoDiv").append(html) $("#centerInfoDiv").append(html)
@ -157,3 +156,11 @@ let chart1 = (el, data) => {
}; };
chart.setOption(option) chart.setOption(option)
} }
const show = (e) =>{
let node = $(e).prev()
node.show()
setTimeout(()=>{
node.hide()
},1000*3)
}

@ -162,15 +162,15 @@
<div class="title">基本信息</div> <div class="title">基本信息</div>
<div class="title1">设备描述:</div> <div class="title1">设备描述:</div>
<div class="bg1"> <div class="bg1">
<p>规格型号: PG -300</p> <!-- <p>规格型号: PG -300</p>-->
<p>功能描述:利用膨化闪蒸原理,使胶料通过单螺杆的挤压输由高温高压到常温常压状态,利用胶料膨化闪蒸去除胶料内部的水分。</p> <!-- <p>功能描述:利用膨化闪蒸原理,使胶料通过单螺杆的挤压输由高温高压到常温常压状态,利用胶料膨化闪蒸去除胶料内部的水分。</p>-->
</div> </div>
<div class="title2">技术参数:</div> <div class="title2">技术参数:</div>
<div class="bg2"> <div class="bg2">
<p>功率:800kw</p> <!-- <p>功率:800kw</p>-->
<p>电压:10000V</p> <!-- <p>电压:10000V</p>-->
<p>转速: 1480rpm</p> <!-- <p>转速: 1480rpm</p>-->
<p>转速: 0~276rpr</p> <!-- <p>转速: 0~276rpr</p>-->
</div> </div>
</div> </div>
</div> </div>

Loading…
Cancel
Save