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

<template>

    <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>
<script setup lang='ts'>
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)
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
            }

        })


        column.value = [
            { field: 'otherName', title: '名称', width: 350 },
            { field: 'valueA', title: 'A相', },
            { field: 'valueB', title: 'B相', },
            { field: 'valueC', title: 'C相', },
            // { field: 'valueM', title: '', },
        ]
    } else {
        dataList.value = list
        flag.value=true

        flag1.value=false
        column.value = [
            { field: 'otherName', title: '谐波次数', },
            { field: 'valueA', title: 'A相', },
            { field: 'valueB', title: 'B相', },
            { field: 'valueC', title: 'C相', },
        ]
    }
    key.value += 1
}
const formatter = (row: any) => {
    return row.cellValue == null ? '/' : row.cellValue
}

defineExpose({ setData })
</script>
<style lang="scss" scoped></style>