feat: 组件轮询逻辑优化

js/dashboard.js

@@ -25,12 +25,14 @@ var Controls = {}
 var Common = {}
 var time = 5000
 
-let requestDataPool = [] // 各个组件实时刷新的请求数据，放到一个集合里，原来的多个组件请求合并成一个请求发送
-let dataPoolRequestingFlag = false // requestDataPool请求中标志，正在请求时不进行下一波轮询，前一波请求完成才执行下一波
+let requestLoop_timer = null // 轮询定时器
+let requestLoop_dataPool = [] // 各个组件实时刷新的请求数据，放到一个集合里，原来的多个组件请求合并成一个请求发送
+let requestLoop_stopFlag = false // requestLoop_dataPool请求中标志，正在请求时不进行下一波轮询，前一波请求完成才执行下一波
+let requestLoop_time = 5000 // 轮询间隔时间
+let requestLoop_groupSliceNum = 10 // 请求池requestLoop_dataPool分组，每组多少个
 
 // 添加定时器
 var timer1 = null
-var timer8 = null
 var app = {
   msg: function (message, style) {
     var css = {
@@ -292,7 +294,9 @@ function nodeCLick(e, treeId, treeNode, type) {
     $('#right-wrap').css('background-image', '')
     // 清除定时器
     clearInterval(timer1)
+    clearInterval(requestLoop_timer)
     timer1 = null
+    requestLoop_timer = null
     let postData = {
       appId,
       panelId: treeNode.id,
@@ -843,8 +847,10 @@ function initCanvas() {
     LineChartDataFun('tool')
   }, 20)
   clearInterval(timer1)
-  // setTimer()
-  refreshDataLoop()
+  setTimer()
+  // 开始轮询
+  clearInterval(requestLoop_timer)
+  startRequestLoop(requestLoop_time)
 
 
   // wrap.style.background = Common.BackColor
@@ -856,7 +862,7 @@ function setTimer() {
       if (item.ControlType === 'staticimage' || item.ControlType === 'image') {
         renderImage(index)
       }
-      if (item.ControlType === 'datatextblock' && S == 1) {
+      if (item.ControlType === 'datatextblock') {
         renderDataText(index)
       }
       if (item.ControlType === 'dynamictext') {
@@ -913,42 +919,74 @@ function setTimer() {
 }
 
 // 轮询数据，用新逻辑，合并各组件的请求数据，做合并请求，例如，300个组件，分成6个请求，每个请求包含50个组件的数据
-function refreshDataLoop() {
-  requestDataPool = handleControlListInArray()
-  let dataPoolList = sliceRequestDataPool(10)
-  timer1 = setInterval(async ()=> {
-    if(dataPoolRequestingFlag) {
+function startRequestLoop() {
+  console.log('requestLoop_dataPool', requestLoop_dataPool)
+  requestLoop_dataPool = collectRequestLoopData()
+  console.log('Controls.dataPoolMap', Controls.dataPoolMap)
+  let dataPoolList = sliceRequestLoopData(requestLoop_groupSliceNum)
+  requestLoop_timer = setInterval(async () => {
+    if (requestLoop_stopFlag) {
       return
     }
     for (let i = 0, len = dataPoolList.length; i < len; i++) {
-      dataPoolRequestingFlag = true // 进入循环即表示已经开始请求
-      await sendDataPoolRequest(dataPoolList[i], i, len)
+      requestLoop_stopFlag = true // 进入循环即表示已经开始请求
+      await sendRequestLoopData(dataPoolList[i], i, len)
     }
-  }, time)
+  }, requestLoop_time)
 }
 
-// 发起requestDataPool的合并请求
-function sendDataPoolRequest(list, i, len) {
+// 发起requestLoop_dataPool的合并请求
+function sendRequestLoopData(list, i, len) {
   return new Promise((resolve, reject) => {
     request.post(`/bi/${appId}/variables/real-time/data/mergeReq`, list)
     .then(res => {
-      if(i === len -1) {
-        dataPoolRequestingFlag = false
+      if (i === len - 1) {
+          requestLoop_stopFlag = false
+      }
+      if(res.data.data && Object.prototype.toString.call(res.data.data) === '[object Object]') {
+        Object.keys(res.data.data).forEach(key => {
+          renderRequestLoopData(Controls.dataPoolMap[key])
+        })
       }
       resolve(res)
     })
     .catch(err => {
-      if(i === len -1) {
-        dataPoolRequestingFlag = false
+      if (i === len -1) {
+        requestLoop_stopFlag = false
       }
       reject(err)
     })
   })
 }
 
+// 对轮询获得的数据进行渲染
+function renderRequestLoopData(data) {
+  console.log(98741, Object.prototype.toString.call(data))
+  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':
+      renderDatatextblock(obj)
+      break
+  }
+}
+
+function renderDatatextblock(obj) {
+  
+}
+
 // 整合所有组件的请求数据，放到一个数组里
-function handleControlListInArray() {
+function collectRequestLoopData() {
   let resList = []
+  Controls.dataPoolMap = {}
   Controls.ControlList.forEach((item, index) => {   
     switch(item.ControlType) {
       case 'datatextblock': // 数值显示
@@ -962,13 +1000,14 @@ function handleControlListInArray() {
             variableCode: item.CheckData.name
           }
         })
+        Controls.dataPoolMap[`${index}-${item.CheckData.name}`] = item
         break
       case 'commonlamp': // 矩形状态灯
       case 'image': // 动态图片
       case 'dynamictext': // 动态文本
       case 'ellipselamp': // 圆形状态灯
         item.DataList.forEach((dlItem, dlIndex) => {
-          if(dlItem.variable !== '选择' && dlItem.CheckData) {
+          if (dlItem.variable !== '选择' && dlItem.CheckData) {
             resList.push({
               urlType: 'status',
               assemblyKey: `${index}-${dlIndex}-${dlItem.CheckData.name}`,
@@ -978,7 +1017,8 @@ function handleControlListInArray() {
                 variableCode: dlItem.CheckData.name
               }
             })
-          }
+            Controls.dataPoolMap[`${index}-${dlIndex}-${dlItem.CheckData.name}`] = item
+          }          
         })
         break
       case 'piechart':
@@ -999,6 +1039,7 @@ function handleControlListInArray() {
                 assemblyKey: `${index}-${item.Name}`,
                 pieChartOrPanel
               })
+              Controls.dataPoolMap[`${index}-${item.Name}`] = pieItem
             }
           }
         })
@@ -1017,6 +1058,7 @@ function handleControlListInArray() {
                   variableCode: VariableCheckDataObj.name
                 }]
               })
+              Controls.dataPoolMap[`${index}-${item.Name}`] = dashItem
             }
           }
         })
@@ -1047,6 +1089,7 @@ function handleControlListInArray() {
                   variableCode: vc.name
                 }
               })
+              Controls.dataPoolMap[`${index}-${variableIndex}-${item.Name}`] = pieItem
             })
           }
         }
@@ -1056,12 +1099,12 @@ function handleControlListInArray() {
   return resList
 }
 
-// 对requestDataPool进行分组
-function sliceRequestDataPool(num) {
+// 对requestLoop_dataPool进行分组
+function sliceRequestLoopData(num) {
   let list = []
-  let groupNum = Math.ceil(requestDataPool.length / num)
+  let groupNum = Math.ceil(requestLoop_dataPool.length / num)
   for (let i = 0; i < groupNum; i++) {
-    list.push(requestDataPool.slice(i * num, (i + 1) * num))
+    list.push(requestLoop_dataPool.slice(i * num, (i + 1) * num))
   }  
   return list
 }

js/tokenSetting.js

@@ -3,12 +3,24 @@
  * @description: 文件描述
  * @Date: 2021-09-16 18:33:55
  * @LastEditors: 莫靓仔
- * @LastEditTime: 2021-09-17 10:30:21
+ * @LastEditTime: 2021-09-22 15:36:48
  */
-window.devToken = 'f35ae2b4-f88c-4cae-9428-c45216e13257'
-// window.devToken = 'cca20c8c-507b-43e0-8ca6-3571ae779698'
+let setObj = {
+    // 厂家大佬
+    set1: {
+        devToken: 'f35ae2b4-f88c-4cae-9428-c45216e13257',
+        devAppId: 'innerTestPlatformId',
+        devTenantId: 'innerTestPlatformId'
+    },
+    // test-123
+    set2: {
+        devToken: 'cca20c8c-507b-43e0-8ca6-3571ae779698',
+        devAppId: 'TEST123_o582',
+        devTenantId: 'TEST123_o582'
+    }
+}
 
-window.devAppId = 'innerTestPlatformId'
-// window.devAppId = 'TEST123_o582'
-
-window.devTenantId = 'innerTestPlatformId'
\ No newline at end of file
+let defaultObj = 'set1'
+window.devToken = setObj[defaultObj].devToken
+window.devAppId = setObj[defaultObj].devAppId
+window.devTenantId = setObj[defaultObj].devTenantId