Commit dd0332d3 authored by 莫坚培's avatar 莫坚培

fix: 增加读写框组件渲染函数

parent 53cbc2b3
...@@ -27,7 +27,7 @@ var time = 5000 ...@@ -27,7 +27,7 @@ var time = 5000
let requestLoop_timer = null // 轮询定时器 let requestLoop_timer = null // 轮询定时器
let requestLoop_dataPool = [] // 各个组件实时刷新的请求数据,放到一个集合里,原来的多个组件请求合并成一个请求发送 let requestLoop_dataPool = [] // 各个组件实时刷新的请求数据,放到一个集合里,原来的多个组件请求合并成一个请求发送
let requestLoop_stopFlag = false // requestLoop_dataPool请求中标志,正在请求时不进行下一波轮询,前一波请求完成才执行下一波 let requestLoop_stopFlag = false // requestLoop_dataPool请求中标志,正在请求时不进行下一波轮询,前一波请求完成才执行下一波
let requestLoop_time = 5000 // 轮询间隔时间 let requestLoop_time = 2000 // 轮询间隔时间
let requestLoop_groupSliceNum = 10 // 请求池requestLoop_dataPool分组,每组多少个 let requestLoop_groupSliceNum = 10 // 请求池requestLoop_dataPool分组,每组多少个
// 添加定时器 // 添加定时器
...@@ -846,7 +846,7 @@ function initCanvas() { ...@@ -846,7 +846,7 @@ function initCanvas() {
LineChartDataFun('tool') LineChartDataFun('tool')
}, 20) }, 20)
clearInterval(timer1) clearInterval(timer1)
setTimer() // setTimer()
// 开始轮询 // 开始轮询
clearInterval(requestLoop_timer) clearInterval(requestLoop_timer)
startRequestLoop(requestLoop_time) startRequestLoop(requestLoop_time)
...@@ -919,8 +919,8 @@ function setTimer() { ...@@ -919,8 +919,8 @@ function setTimer() {
// 轮询数据,用新逻辑,合并各组件的请求数据,做合并请求,例如,300个组件,分成6个请求,每个请求包含50个组件的数据 // 轮询数据,用新逻辑,合并各组件的请求数据,做合并请求,例如,300个组件,分成6个请求,每个请求包含50个组件的数据
function startRequestLoop() { function startRequestLoop() {
console.log('requestLoop_dataPool', requestLoop_dataPool) collectRequestLoopData()
requestLoop_dataPool = collectRequestLoopData() console.log('requestLoop_dataPool', requestLoop_dataPool)
console.log('Controls.dataPoolMap', Controls.dataPoolMap) console.log('Controls.dataPoolMap', Controls.dataPoolMap)
let dataPoolList = sliceRequestLoopData(requestLoop_groupSliceNum) let dataPoolList = sliceRequestLoopData(requestLoop_groupSliceNum)
requestLoop_timer = setInterval(async () => { requestLoop_timer = setInterval(async () => {
...@@ -944,7 +944,13 @@ function sendRequestLoopData(list, i, len) { ...@@ -944,7 +944,13 @@ function sendRequestLoopData(list, i, len) {
} }
if(res.data.data && Object.prototype.toString.call(res.data.data) === '[object Object]') { if(res.data.data && Object.prototype.toString.call(res.data.data) === '[object Object]') {
Object.keys(res.data.data).forEach(key => { Object.keys(res.data.data).forEach(key => {
renderRequestLoopData(Controls.dataPoolMap[key]) let resData = res.data.data[key]
try {
resData = JSON.parse(res.data.data[key])
} catch (err) {
console.log('JSON转义出错', err)
}
renderRequestLoopData(Controls.dataPoolMap[key], JSON.parse(res.data.data[key]))
}) })
} }
resolve(res) resolve(res)
...@@ -959,145 +965,183 @@ function sendRequestLoopData(list, i, len) { ...@@ -959,145 +965,183 @@ function sendRequestLoopData(list, i, len) {
} }
// 对轮询获得的数据进行渲染 // 对轮询获得的数据进行渲染
function renderRequestLoopData(data) { function renderRequestLoopData(mData, resData) {
console.log(98741, Object.prototype.toString.call(data)) switch(mData.ControlType) {
if (Object.prototype.toString.call(data) !== '[object Object]') {
return
}
Object.keys(data).forEach(key => {
renderRequestLoopData_item(Controls.dataPoolMap[key])
})
}
// 分类渲染
function renderRequestLoopData_item(obj) {
switch(obj.ControlType) {
case 'datatextblock': case 'datatextblock':
renderDatatextblock(obj) renderDatatextblock(mData, resData)
break break
} }
} }
function renderDatatextblock(obj) { // 渲染读写框
function renderDatatextblock(mData, resData) {
let dight = mData.DecimalDigits === null ? 0 : mData.DecimalDigits
let resDataValue = resData[mData.CheckData.name]
let Data = resDataValue.toFixed(dight)
console.log('resDataValue', resDataValue)
// 给读写框赋值
$(`#datatextblock${mData.dataPoolMapIndex}`).text(resDataValue)
let flagItem = mData.DataList.find(item => {
let flag = transFlag(item.flag)
return (
(flag === '=' && Data == item.num) ||
(flag === '>=' && Data >= item.num) ||
(flag === '<=' && Data <= item.num) ||
(flag === '>' && Data > item.num) ||
(flag === '<' && Data < item.num) ||
(flag === '!=' && item.num != Data)
)
})
// 只要有一个满足条件,则渲染该条件的颜色
if (flagItem && flagItem.conCheck) {
$(`#datatextblock${mData.dataPoolMapIndex}`).css('color', flagItem.backColor)
}
} }
// 整合所有组件的请求数据,放到一个数组里 // 整合所有组件的请求数据,放到一个数组里
function collectRequestLoopData() { function collectRequestLoopData() {
let resList = [] requestLoop_dataPool = []
Controls.dataPoolMap = {} Controls.dataPoolMap = {}
Controls.ControlList.forEach((item, index) => { Controls.ControlList.forEach((item, index) => {
switch(item.ControlType) { switch(item.ControlType) {
case 'datatextblock': // 数值显示 case 'datatextblock': // 数值显示
case 'rwtextbox': // 读写框 case 'rwtextbox': // 读写框
resList.push({ handleRequestData_d_r(item, index)
urlType: 'status',
assemblyKey: `${index}-${item.CheckData.name}`,
statusDataDTO: {
deviceId: item.CheckData.equipmentId ? item.CheckData.equipmentId : item.CheckData.equipmentid,
variableId: item.CheckData.id,
variableCode: item.CheckData.name
}
})
Controls.dataPoolMap[`${index}-${item.CheckData.name}`] = item
break break
case 'commonlamp': // 矩形状态灯 case 'commonlamp': // 矩形状态灯
case 'image': // 动态图片 case 'image': // 动态图片
case 'dynamictext': // 动态文本 case 'dynamictext': // 动态文本
case 'ellipselamp': // 圆形状态灯 case 'ellipselamp': // 圆形状态灯
item.DataList.forEach((dlItem, dlIndex) => { handleRequestData_DataList(item, index)
if (dlItem.variable !== '选择' && dlItem.CheckData) {
resList.push({
urlType: 'status',
assemblyKey: `${index}-${dlIndex}-${dlItem.CheckData.name}`,
statusDataDTO: {
deviceId: dlItem.CheckData.equipmentId ? dlItem.CheckData.equipmentId : dlItem.CheckData.equipmentid,
variableId: dlItem.CheckData.id,
variableCode: dlItem.CheckData.name
}
})
Controls.dataPoolMap[`${index}-${dlIndex}-${dlItem.CheckData.name}`] = item
}
})
break break
case 'piechart': case 'piechart':
Controls.Data.PieChartItemList.forEach(pieItem => { handleRequestData_pie(item, index)
if (pieItem.name === item.Name) {
if (pieItem.defaultDataConfig.datatype === '实时数据') {
let list = pieItem.option?.Variables || []
let pieChartOrPanel = list.map(variableItem => {
let vc = variableItem.CheckData
return {
deviceId: vc.equipmentId ? vc.equipmentId : vc.equipmentid,
variableId: vc.id,
variableCode: vc.name
}
})
resList.push({
urlType: 'pieChartOrPanel',
assemblyKey: `${index}-${item.Name}`,
pieChartOrPanel
})
Controls.dataPoolMap[`${index}-${item.Name}`] = pieItem
}
}
})
break break
case 'dashboardchart': case 'dashboardchart':
Controls.Data.DashBoardChartItemList.forEach(dashItem => { handleRequestData_dashboard(item, index)
if (dashItem.name === item.Name) {
if (dashItem.defaultDataConfig.datatype === '实时数据') {
let VariableCheckDataObj = dashItem.option?.Variable?.CheckData || {}
resList.push({
urlType: 'pieChartOrPanel',
assemblyKey: `${index}-${item.Name}`,
pieChartOrPanel: [{
deviceId: VariableCheckDataObj.equipmentId ? VariableCheckDataObj.equipmentId : VariableCheckDataObj.equipmentid,
variableId: VariableCheckDataObj.id,
variableCode: VariableCheckDataObj.name
}]
})
Controls.dataPoolMap[`${index}-${item.Name}`] = dashItem
}
}
})
break break
case 'linechart': case 'linechart':
line_bar_handleRequestData('LineChartItemList') handleRequestData_line_bar('LineChartItemList', item, index)
break break
case 'barchart': case 'barchart':
line_bar_handleRequestData('BarChartItemList') handleRequestData_line_bar('BarChartItemList', item, index)
break break
default:
break
} }
// 把折线图、柱状图的请求数据推到请求池 })
function line_bar_handleRequestData(label) { }
Controls.Data[label].forEach(pieItem => {
if (pieItem.name === item.Name) { // 把有读写框、数值显示的请求数据推到请求池
if (pieItem.defaultDataConfig.datatype === '实时数据') { function handleRequestData_d_r(item, index) {
let list = pieItem.option?.Variables || [] requestLoop_dataPool.push({
list.forEach((variableItem, variableIndex) => { urlType: 'status',
let vc = variableItem.CheckData assemblyKey: `${index}-${item.CheckData.name}`,
resList.push({ statusDataDTO: {
urlType: 'limit', deviceId: item.CheckData.equipmentId ? item.CheckData.equipmentId : item.CheckData.equipmentid,
assemblyKey: `${index}-${variableIndex}-${item.Name}`, variableId: item.CheckData.id,
limitData: { variableCode: item.CheckData.name
deviceId: vc.equipmentId ? vc.equipmentId : vc.equipmentid, }
variableId: vc.id, })
variableCode: vc.name console.log(requestLoop_dataPool, 88);
} Controls.dataPoolMap[`${index}-${item.CheckData.name}`] = item
}) Controls.dataPoolMap[`${index}-${item.CheckData.name}`].dataPoolMapIndex = index
Controls.dataPoolMap[`${index}-${variableIndex}-${item.Name}`] = pieItem }
})
} // 把有DataList的组件的请求数据推到请求池
function handleRequestData_DataList(item, index) {
item.DataList.forEach((dlItem, dlIndex) => {
if (dlItem.variable !== '选择' && dlItem.CheckData) {
requestLoop_dataPool.push({
urlType: 'status',
assemblyKey: `${index}-${dlIndex}-${dlItem.CheckData.name}`,
statusDataDTO: {
deviceId: dlItem.CheckData.equipmentId ? dlItem.CheckData.equipmentId : dlItem.CheckData.equipmentid,
variableId: dlItem.CheckData.id,
variableCode: dlItem.CheckData.name
} }
}) })
Controls.dataPoolMap[`${index}-${dlIndex}-${dlItem.CheckData.name}`] = item
Controls.dataPoolMap[`${index}-${dlIndex}-${dlItem.CheckData.name}`].dataPoolMapIndex = index
}
})
}
// 把饼图的请求数据推到请求池
function handleRequestData_pie(item, index) {
Controls.Data.PieChartItemList.forEach(pieItem => {
if (pieItem.name === item.Name) {
if (pieItem.defaultDataConfig.datatype === '实时数据') {
let list = pieItem.option?.Variables || []
let pieChartOrPanel = list.map(variableItem => {
let vc = variableItem.CheckData
return {
deviceId: vc.equipmentId ? vc.equipmentId : vc.equipmentid,
variableId: vc.id,
variableCode: vc.name
}
})
requestLoop_dataPool.push({
urlType: 'pieChartOrPanel',
assemblyKey: `${index}-${item.Name}`,
pieChartOrPanel
})
Controls.dataPoolMap[`${index}-${item.Name}`] = pieItem
Controls.dataPoolMap[`${index}-${item.Name}`].ControlType = item.ControlType
Controls.dataPoolMap[`${index}-${item.Name}`].dataPoolMapIndex = index
}
}
})
}
// 把仪表盘的请求数据推到请求池
function handleRequestData_dashboard(item, index) {
Controls.Data.DashBoardChartItemList.forEach(dashItem => {
if (dashItem.name === item.Name) {
if (dashItem.defaultDataConfig.datatype === '实时数据') {
let VariableCheckDataObj = dashItem.option?.Variable?.CheckData || {}
requestLoop_dataPool.push({
urlType: 'pieChartOrPanel',
assemblyKey: `${index}-${item.Name}`,
pieChartOrPanel: [{
deviceId: VariableCheckDataObj.equipmentId ? VariableCheckDataObj.equipmentId : VariableCheckDataObj.equipmentid,
variableId: VariableCheckDataObj.id,
variableCode: VariableCheckDataObj.name
}]
})
Controls.dataPoolMap[`${index}-${item.Name}`] = dashItem
Controls.dataPoolMap[`${index}-${item.Name}`].ControlType = item.ControlType
Controls.dataPoolMap[`${index}-${item.Name}`].dataPoolMapIndex = index
}
} }
}) })
return resList
} }
// 把折线图、柱状图的请求数据推到请求池
function handleRequestData_line_bar(label, item, index) {
Controls.Data[label].forEach(pieItem => {
if (pieItem.name === item.Name) {
if (pieItem.defaultDataConfig.datatype === '实时数据') {
let list = pieItem.option?.Variables || []
list.forEach((variableItem, variableIndex) => {
let vc = variableItem.CheckData
requestLoop_dataPool.push({
urlType: 'limit',
assemblyKey: `${index}-${variableIndex}-${item.Name}`,
limitData: {
deviceId: vc.equipmentId ? vc.equipmentId : vc.equipmentid,
variableId: vc.id,
variableCode: vc.name
}
})
Controls.dataPoolMap[`${index}-${variableIndex}-${item.Name}`] = pieItem
Controls.dataPoolMap[`${index}-${variableIndex}-${item.Name}`].ControlType = item.ControlType
})
}
}
})
}
// 对requestLoop_dataPool进行分组 // 对requestLoop_dataPool进行分组
function sliceRequestLoopData(num) { function sliceRequestLoopData(num) {
let list = [] let list = []
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
* @description: 文件描述 * @description: 文件描述
* @Date: 2021-09-16 18:33:55 * @Date: 2021-09-16 18:33:55
* @LastEditors: 莫靓仔 * @LastEditors: 莫靓仔
* @LastEditTime: 2021-09-22 15:36:48 * @LastEditTime: 2021-09-23 09:52:46
*/ */
let setObj = { let setObj = {
// 厂家大佬 // 厂家大佬
...@@ -20,7 +20,7 @@ let setObj = { ...@@ -20,7 +20,7 @@ let setObj = {
} }
} }
let defaultObj = 'set1' let defaultObj = 'set2'
window.devToken = setObj[defaultObj].devToken window.devToken = setObj[defaultObj].devToken
window.devAppId = setObj[defaultObj].devAppId window.devAppId = setObj[defaultObj].devAppId
window.devTenantId = setObj[defaultObj].devTenantId window.devTenantId = setObj[defaultObj].devTenantId
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