谐波监测-区域-echarts加载优化

src/views/pqs/harmonicMonitoring/area/getIntegrityData/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="default-main online" ref="aaRef">
+    <div class="default-main online">
         <div class="online_header">
             <TableHeader date-picker ref="tableHeaderRef">
                 <template #select>
@@ -107,7 +107,7 @@
         </div>
         <div class="online_main">
             <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
-                <el-tab-pane :name="0" label="数据完整性列表">
+                <el-tab-pane :name="0" :lazy="true" label="数据完整性列表">
                     <Table
                         ref="tableRef"
                         :tree-config="{ transform: true, parentField: 'pid' }"
@@ -115,8 +115,8 @@
                         v-if="activeName == 0"
                     />
                 </el-tab-pane>
-                <el-tab-pane :name="1" label="数据完整性图表">
-                    <charts ref="chartsRef" />
+                <el-tab-pane :name="1" :lazy="true" label="数据完整性图表">
+                    <charts v-if="activeName == 1" ref="chartsRef" />
                 </el-tab-pane>
             </el-tabs>
         </div>
@@ -146,8 +146,6 @@ const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Ty
 const treeData = ref([])
 const idArr = ref([])
 const activeName = ref(0)
-const aaRef=ref()
-console.log(aaRef.value,"lllllkkkkk");
 const getTreeData = async () => {
     await getAreaDept().then(res => {
         var data = res.data
@@ -176,7 +174,7 @@ const defaultProps = ref({
     emitPath: false,
     expandTrigger: 'click' as const
 })
-const handleClick =  (tab: any, e: any) => {
+const handleClick = (tab: any, e: any) => {
     // if(activeName.value===1){
     tableStore.index()
     // }
@@ -198,15 +196,7 @@ const tableStore = new TableStore({
         },
         {
             title: '网络参数',
-            field: 'networkParam',
-            align: 'center',
-            formatter: function (row) {
-                return row.cellValue ? row.cellValue : '/'
-            }
-        },
-        {
-            title: '终端名称',
-            field: 'dataName',
+            field: 'ip',
             align: 'center',
             formatter: function (row) {
                 return row.cellValue ? row.cellValue : '/'
@@ -220,6 +210,14 @@ const tableStore = new TableStore({
                 return row.cellValue ? row.cellValue : '/'
             }
         },
+        {
+            title: '终端名称',
+            field: 'deviceName',
+            align: 'center',
+            formatter: function (row) {
+                return row.cellValue ? row.cellValue : '/'
+            }
+        },
         {
             title: '通讯状态',
             field: 'comFlag',
@@ -245,11 +243,11 @@ const tableStore = new TableStore({
             }
         },
         {
-            title: '在线率(%)',
-            field: 'onlineRate',
+            title: '完整性(%)',
+            field: 'integrityData',
             align: 'center',
             formatter: function (row) {
-                // return row.cellValue == 3.14159 ? '暂无数据' : row.cellValue.toFixed(2)
+                return row.cellValue == 3.14159 ? '暂无数据' : row.cellValue.toFixed(2)
             }
         },
         {
@@ -293,7 +291,7 @@ const tableStore = new TableStore({
         treeData = tree2List(tableStore.table.data)
         tableStore.table.data = JSON.parse(JSON.stringify(treeData))
         tableStore.table.column[0].title = formData.value.statisticalType.name
-        chartsRef.value.getTableStoreParams(tableStore.table.params)
+        chartsRef.value && chartsRef.value.getTableStoreParams(tableStore.table.params)
         setTimeout(() => {
             activeName.value == 0 && tableRef.value && tableRef.value.getRef().setAllTreeExpand(true)
         }, 0)
@@ -315,7 +313,14 @@ const tree2List = (list: any, pid?: string) => {
     // 遍历 tree 数组
     list.forEach((item: any) => {
         // item.comFlag = item.comFlag == null ? 3 : item.comFlag
-        item.valueOver == 3.14159 ? 0 : item.valueOver >= 90 ? 1 : item.valueOver && item.valueOver < 90 ? 2 : 3
+        item.valueOver =
+            item.integrityData == 3.14159
+                ? 0
+                : item.integrityData >= 90
+                ? 1
+                : item.integrityData >= 60 && item.integrityData < 90
+                ? 2
+                : 3
         item.pid = pid
         // 判断item是否存在children
         if (!item.children) return arr.push(item)