完善大屏中工单完成率饼图数据获取逻辑及代码实现

index.html

@@ -1079,12 +1079,12 @@
   <!-- 工单完成数 -->
   <script>
     var ulbox = document.getElementById("review_box");
-    var myChart = echarts.init(ulbox);
-    var weekOrderQuantity = 100   //总数
-    var weekOrderCompleted = 30   //已完成
-    var weekOrderUnfinished = 70  //未完成
+    var orderFinishRatePie = echarts.init(ulbox);
+    var allOrdersCount = 100   //总数
+    var allOrdersCompletedCount = 30   //已完成
+    var allOrdersUnfinishedCount = 70  //未完成
 
-    var option = {
+    var orderFinishRatePieOption = {
       color: ['#22c2f0', '#28f19b', '#fcfa3c', '#f44061'],
       title: {
         text: '',
@@ -1115,127 +1115,128 @@
       //   },
       //   data: ['工单完成率']
       // },
-      series: [{
-        name: '工单完成数',
-        type: 'pie',
-        clockWise: false,
-        radius: ["70%", "80%"],
-        itemStyle: {
-          normal: {
+      series: [
+        {
+          name: '工单完成数',
+          type: 'pie',
+          clockWise: false,
+          radius: ["70%", "80%"],
+          itemStyle: {
+            normal: {
+              label: {
+                show: false
+              },
+              labelLine: {
+                show: false
+              },
+              shadowBlur: 0,
+              shadowColor: '#203665'
+            }
+          },
+          hoverAnimation: false,
+          center: ['50%', '50%'],
+          data: [{
+            value: allOrdersCompletedCount,
             label: {
-              show: false
-            },
-            labelLine: {
-              show: false
+              normal: {
+                formatter: "{d}%",
+                position: 'center',
+                show: true,
+                textStyle: {
+                  fontSize: '24',
+                  fontWeight: 'normal',
+                  color: '#fff'
+                }
+              }
             },
-            shadowBlur: 0,
-            shadowColor: '#203665'
-          }
-        },
-        hoverAnimation: false,
-        center: ['50%', '50%'],
-        data: [{
-          value: weekOrderCompleted,
-          label: {
-            normal: {
-              formatter: "{d}%",
-              position: 'center',
-              show: true,
-              textStyle: {
-                fontSize: '24',
-                fontWeight: 'normal',
-                color: '#fff'
+            itemStyle: {
+              normal: {
+                color: '#2c6cc4',
+                shadowColor: '#2c6cc4',
+                shadowBlur: 0
               }
             }
+          }, {
+            value: allOrdersUnfinishedCount,
+            name: 'invisible',
+            itemStyle: {
+              normal: {
+                color: '#f2c96b'
+              },
+              emphasis: {
+                color: '#24375c'
+              }
+            }
+          }]
+        },
+        {
+          type: "gauge",
+          radius: "75%",
+          startAngle: 0,
+          endAngle: 360,
+          splitNumber: 30,
+          axisTick: {
+            show: false
           },
-          itemStyle: {
-            normal: {
-              color: '#2c6cc4',
-              shadowColor: '#2c6cc4',
-              shadowBlur: 0
+          splitLine: {
+            length: 10,
+            lineStyle: {
+              width: 1,
+              color: "#031845"
             }
-          }
-        }, {
-          value: weekOrderUnfinished,
-          name: 'invisible',
-          itemStyle: {
-            normal: {
-              color: '#f2c96b'
-            },
-            emphasis: {
-              color: '#24375c'
+          },
+          axisLabel: {
+            show: false
+          },
+          pointer: {
+            show: false
+          },
+          axisLine: {
+            lineStyle: {
+              opacity: 0
             }
-          }
-        }]
-      },
-      {
-        type: "gauge",
-        radius: "75%",
-        startAngle: 0,
-        endAngle: 360,
-        splitNumber: 30,
-        axisTick: {
-          show: false
-        },
-        splitLine: {
-          length: 10,
-          lineStyle: {
-            width: 1,
-            color: "#031845"
-          }
-        },
-        axisLabel: {
-          show: false
-        },
-        pointer: {
-          show: false
-        },
-        axisLine: {
-          lineStyle: {
-            opacity: 0
-          }
-        },
-        detail: {
-          show: false
-        },
-        data: [{
-          value: 0,
-          name: ""
-        }]
-      }, {
-        // name: '访问来源',
-        type: 'pie',
-        radius: ['50%', '60%'],
-        silent: true,
-        z: 0,
-        // zlevel: 0,
-        label: {
-          normal: {
+          },
+          detail: {
             show: false
-          }
+          },
+          data: [{
+            value: 0,
+            name: ""
+          }]
         },
-        labelLine: {
-          normal: {
-            show: true,
-            length: 0,
-            length2: 100,
-            lineStyle: {
-              type: 'solid',
-              width: 1
+        {
+          type: 'pie',
+          radius: ['50%', '60%'],
+          silent: true,
+          z: 0,
+          // zlevel: 0,
+          label: {
+            normal: {
+              show: false
+            }
+          },
+          labelLine: {
+            normal: {
+              show: true,
+              length: 0,
+              length2: 100,
+              lineStyle: {
+                type: 'solid',
+                width: 1
+              }
             }
+          },
+          data: [{
+            value: allOrdersCount,
+            name: ''
           }
-        },
-        data: [{
-          value: weekOrderQuantity,
-          name: ''
-        }
 
-        ]
-      }
+          ]
+        }
       ]
     };
-    if (option && typeof option === 'object') {
-      myChart.setOption(option);
+    if (orderFinishRatePieOption && typeof orderFinishRatePieOption === 'object') {
+      orderFinishRatePie.setOption(orderFinishRatePieOption);
     }
   </script>
   <script>
@@ -1655,6 +1656,41 @@
       });
     }
 
+    // 更新全部工单完成率
+    // api/blade-deviceAccount/deviceAccount/list?current=1&size=10
+    function updateAllOrdersFinishedRateData() {
+      $.ajax({
+        type: "GET",
+        url: "/api/blade-inspectionWorkOrder/inspectionWorkOrder/list?current=1&size=10",
+        success: function (result) {
+          console.log('AllOrdersData', result);
+          let allOrdersTotal = result.data.total;
+          let finished = 0;
+          $.ajax({
+            type: "GET",
+            url: "api/blade-inspectionWorkOrder/inspectionWorkOrder/list?taskStatus=1&current=1&size=10",
+            success: function (res) {
+              console.log('FinishedOrdersData', res);
+              let finishedTotal = res.data.total;
+              orderFinishRatePieOption.series[0].data[0].value = finishedTotal;
+              orderFinishRatePieOption.series[0].data[1].value = allOrdersTotal - finishedTotal;
+              orderFinishRatePieOption.series[2].data[0].value = allOrdersTotal;
+              orderFinishRatePie.setOption(orderFinishRatePieOption);
+            },
+            // 失败或者超时的回调函数
+            error: function (xhr, status, error) {
+              // loadDataStatus.updateEmergencyData = false
+            }
+          });
+
+        },
+        // 失败或者超时的回调函数
+        error: function (xhr, status, error) {
+          // loadDataStatus.updateEmergencyData = false
+        }
+      });
+    }
+
     const loadDataStatus = {
       uploadCompleteStatus: false,
       updateWarningData: false,
@@ -1666,6 +1702,7 @@
       updateInspectionWeekOrderData: false,
       updateRepairWeekOrderData: false,
       updateEmergencyData: false,
+      updateAllOrdersFinishedRateData: false
     }
     uploadDeviceAccountData()
 
@@ -1736,6 +1773,10 @@
       if (!loadDataStatus.updateEmergencyData) {
         updateEmergencyData()
       }
+      // updateAllOrdersFinishedRateData();
+      if (!loadDataStatus.updateAllOrdersFinishedRateData) {
+        updateAllOrdersFinishedRateData()
+      }
     }, 600000);
 
     // 更新 monthOrderNum