修改准实时数据数据页面样式

src/views/govern/device/control/nearRealTimeData.vue

@@ -1,11 +1,18 @@
 <template>
 
-    <div :style="{ height: height }">
-        <vxe-table height="auto" auto-resize :data="dataList" v-bind="defaultAttribute" :key="key">
-            <vxe-column v-for="item in column" :field="item.field" :title="item.title"
-                :formatter="formatter"></vxe-column>
+    <div>
+        <vxe-table auto-resize :data="dataList" v-bind="defaultAttribute" :key="key" :mergeCells="mergeCells" v-if="flag">
+            <vxe-column v-for="item in column" :field="item.field" :title="item.title" :formatter="formatter"
+                :width="item.width"></vxe-column>
 
         </vxe-table>
+        <vxe-table v-if="flag1" auto-resize :data="dataList1" 
+            v-bind="defaultAttribute" :key="key" :mergeCells="mergeCells">
+            <vxe-column field="otherName" title="名称" width="350"></vxe-column>
+            <vxe-column field="valueM" title="其他数据"></vxe-column>
+
+        </vxe-table>
+        <el-empty :style="height" description="暂无数据"v-if="!flag && !flag1" ></el-empty>
     </div>
 
 </template>
@@ -13,26 +20,57 @@
 import { mainHeight } from '@/utils/layout'
 import { ref, reactive } from 'vue'
 import { defaultAttribute } from '@/components/table/defaultAttribute'
+import type { VxeTablePropTypes } from 'vxe-table'
 const props = defineProps(['tableData'])
-const height = mainHeight(325).height
-const dataList = ref([])
+const height = mainHeight(325)
+const dataList: any = ref([])
 const key: any = ref(0)
 const column: any = ref([])
+const dataList1: any = ref([])
+const targetName: any = ref('')
+const  flag=ref(true)
+const  flag1=ref(true)
+
+const mergeCells: any = ref<VxeTablePropTypes.MergeCells>([
+    // { row: 0, col: 1, rowspan: 1, colspan: 3 },
+
+])
 const setData = (data: any, targetType: any) => {
+    let list = JSON.parse(JSON.stringify(data))
+    dataList1.value = []
+    dataList.value = []
+    flag.value=true
+    flag1.value=true
+    targetName.value = targetType[0].name
+    if (targetType[0].name == '基本数据') {
+        flag.value=false
+        flag1.value=false
+        list.forEach((item: any, index: number) => {
+            if (item.valueA == null && item.valueB == null && item.valueC == null) {
+                // item.valueA = item.valueM
+                // mergeCells.value.push({ row: index, col: 1, rowspan: 1, colspan: 3 })
+                dataList1.value.push(item)
+                flag1.value=true
+            } else {
+                dataList.value.push(item)
+                flag.value=true
+            }
+
+        })
 
 
-    dataList.value = JSON.parse(JSON.stringify(data))
-
-   
-    if (targetType[0].name == '基本数据' ) {
         column.value = [
-            { field: 'otherName', title: '名称', },
+            { field: 'otherName', title: '名称', width: 350 },
             { field: 'valueA', title: 'A相', },
             { field: 'valueB', title: 'B相', },
             { field: 'valueC', title: 'C相', },
-            { field: 'valueM', title: '', },
+            // { field: 'valueM', title: '', },
         ]
-    }  else {
+    } else {
+        dataList.value = list
+        flag.value=true
+
+        flag1.value=false
         column.value = [
             { field: 'otherName', title: '谐波次数', },
             { field: 'valueA', title: 'A相', },
@@ -43,7 +81,7 @@ const setData = (data: any, targetType: any) => {
     key.value += 1
 }
 const formatter = (row: any) => {
-  return row.cellValue==null? '/':row.cellValue
+    return row.cellValue == null ? '/' : row.cellValue
 }
 
 defineExpose({ setData })