修改冀北问题

src/views/pqs/harmonicMonitoring/embed/onlinerate/components/table.vue

@@ -1,216 +1,216 @@
-<template>
-    <TableHeader area datePicker ref="TableHeaderRef">
-        <template #select>
-            <el-form-item label="筛选">
-                <el-input v-model="tableStore.table.params.filterName" @keyup="searchEvent" placeholder="输入关键字筛选" />
-            </el-form-item>
-            <el-form-item label="统计类型:">
-                <el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
-                    <el-option v-for="item in classificationData" :key="item.id" :label="item.name"
-                        :value="item"></el-option>
-                </el-select>
-            </el-form-item>
-
-            <el-form-item label="电压等级:">
-                <el-select v-model="tableStore.table.params.scale" multiple collapse-tags clearable value-key="id"
-                    placeholder="请选择电压等级">
-                    <el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name"
-                        :value="item"></el-option>
-                </el-select>
-            </el-form-item>
-            <el-form-item label="终端厂家:">
-                <el-select v-model="tableStore.table.params.manufacturer" multiple collapse-tags clearable
-                    value-key="id" placeholder="请选择终端厂家">
-                    <el-option v-for="item in terminaloption" :key="item.id" :label="item.name"
-                        :value="item"></el-option>
-                </el-select>
-            </el-form-item>
-            <el-form-item label="干扰源类型:">
-                <el-select v-model="tableStore.table.params.loadType" multiple collapse-tags clearable value-key="id"
-                    placeholder="请选择干扰源类型">
-                    <el-option v-for="item in interfereoption" :key="item.id" :label="item.name"
-                        :value="item"></el-option>
-                </el-select>
-            </el-form-item>
-        </template>
-    </TableHeader>
-    <Table ref="tableRef" :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
-        :scroll-y="{ enabled: true }"  :key="num" />
-</template>
-<script setup lang="ts">
-import { ref, onMounted, provide, nextTick } from 'vue'
-import TableStore from '@/utils/tableStore'
-import Table from '@/components/table/index.vue'
-import TableHeader from '@/components/table/header/index.vue'
-import { useDictData } from '@/stores/dictData'
-import { debounce } from 'lodash-es'
-import XEUtils from 'xe-utils'
-const dictData = useDictData()
-const tableRef = ref()
-const num = ref(0)
-
-const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type'])
-const voltageleveloption = dictData.getBasicData('Dev_Voltage_Stand')
-const terminaloption = dictData.getBasicData('Dev_Manufacturers')
-const interfereoption = dictData.getBasicData('Interference_Source')
-const treeDataCopy: any = ref([])
-const treeData: any = ref([])
-const TableHeaderRef = ref()
-const tableStore = new TableStore({
-    url: '/device-boot/terminalOnlineRateData/getOnlineRateData',
-    publicHeight: 65,
-    showPage: false,
-    method: 'POST',
-    column: [
-        { field: 'name', title: '电网拓扑',     width: 350, align: 'left', treeNode: true },
-        {
-            field: 'ip',
-            title: '网络参数',
-            formatter: ({ row }: any) => {
-                return row.ip || '/'
-            }
-        },
-        {
-            field: 'dataName',
-            title: '终端名称',
-            formatter: ({ row }: any) => {
-                return row.dataName || '/'
-            }
-        },
-        {
-            field: 'manufacturer',
-            title: '厂家',
-            formatter: ({ row }: any) => {
-                return row.manufacturer || '/'
-            }
-        },
-        {
-            field: 'comFlag',
-            title: '通讯状态',
-            render: 'tag',
-            custom: {
-                0: 'danger',
-                1: 'success',
-                3: 'info'
-            },
-            replaceValue: {
-                0: '中断',
-                1: '正常',
-                3: '/'
-            }
-            // formatter: ({ row }: any) => {
-            //     return row.comFlag || '/'
-            // }
-        },
-        {
-            field: 'updateTime',
-            title: '最新数据时间',
-            formatter: ({ row }: any) => {
-                return row.updateTime || '/'
-            }
-        },
-        {
-            field: 'onlineRate',
-            title: '在线率(%)',
-            formatter: ({ row }: any) => {
-                return row.onlineRate == 3.14159 ? '暂无数据' : row.onlineRate.toFixed(2)
-            }
-        },
-        {
-            field: 'assess',
-            title: '评估',
-            render: 'tag',
-            custom: {
-                0: 'info',
-                1: 'danger',
-                2: 'warning',
-                3: 'success'
-            },
-            replaceValue: {
-                0: '暂无数据',
-                1: '不合格',
-                2: '合格',
-                3: '优秀'
-            }
-        }
-    ],
-    beforeSearchFun: () => {
-        tableStore.options.column[0].title = tableStore.table.params.statisticalType.name
-    },
-
-    loadCallback: () => {
-   
-        setTimeout(() => {
-            tableRef.value.getRef().setAllTreeExpand(true)
-        }, 1000)
-      
-        treeData.value = tree2List(tableStore.table.data, Math.random() * 1000)
-        treeDataCopy.value = JSON.parse(JSON.stringify(treeData.value))
-        tableStore.table.data = treeData.value
-        tableStore.table.params.filterName=''
-        searchEvent()
-
-    }
-})
-
-tableStore.table.params.statisticalType = classificationData.filter(item => item.name == '电网拓扑')[0]
-tableStore.table.params.monitorFlag = 2
-tableStore.table.params.powerFlag = 2
-tableStore.table.params.serverName = 'harmonicBoot'
-provide('tableStore', tableStore)
-const tree2List = (list: any, id: any) => {
-    //存储结果的数组
-    let arr: any = []
-    // 遍历 tree 数组
-    list.forEach((item: any) => {
-        item.uPid = id
-        item.uId = (Math.random() * 1000)
-        item.comFlag = item.comFlag == null ? 3 : item.comFlag
-        item.assess = item.onlineRate == 3.14159 ? 0 : item.onlineRate < 60 ? 1 : item.onlineRate < 90 ? 2 : 3
-        // 判断item是否存在children
-        if (!item.children) return arr.push(item)
-        // 函数递归，对children数组进行tree2List的转换
-        const children = tree2List(item.children, item.uId)
-        // 删除item的children属性
-        delete item.children
-        // 把item和children数组添加至结果数组
-        //..children: 意思是把children数组展开
-        arr.push(item, ...children)
-    })
-    // 返回结果数组
-    return arr
-}
-// 表格过滤
-const searchEvent = debounce(() => {
-    const filterVal = XEUtils.toValueString(tableStore.table.params.filterName).trim().toLowerCase()
-
-    if (filterVal) {
-        const options = { children: 'children' }
-        const searchProps = ['name']
-
-        const rest = XEUtils.searchTree(
-            treeDataCopy.value,
-            (item: any) => searchProps.some(key => String(item[key]).toLowerCase().indexOf(filterVal) > -1),
-            options
-        )
-        console.log("🚀 ~ searchEvent ~ rest:", rest)
-
-        tableStore.table.data = rest
-
-        // 搜索之后默认展开所有子节点
-    } else {
-        tableStore.table.data = treeDataCopy.value
-    }
-    nextTick(() => {
-        const $table = tableRef.value.getRef()
-        if ($table) {
-            $table.setAllTreeExpand(true)
-        }
-    })
-}, 500)
-onMounted(() => {
-    tableStore.index()
-})
-</script>
-
-<style scoped lang="scss"></style>
+<template>
+    <TableHeader area datePicker ref="TableHeaderRef">
+        <template #select>
+            <el-form-item label="筛选数据">
+                <el-input v-model="tableStore.table.params.filterName" @keyup="searchEvent" placeholder="输入关键字筛选" />
+            </el-form-item>
+            <el-form-item label="统计类型:">
+                <el-select v-model="tableStore.table.params.statisticalType" value-key="id" placeholder="请选择统计类型">
+                    <el-option v-for="item in classificationData" :key="item.id" :label="item.name"
+                        :value="item"></el-option>
+                </el-select>
+            </el-form-item>
+
+            <el-form-item label="电压等级:">
+                <el-select v-model="tableStore.table.params.scale" multiple collapse-tags clearable value-key="id"
+                    placeholder="请选择电压等级">
+                    <el-option v-for="item in voltageleveloption" :key="item.id" :label="item.name"
+                        :value="item"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="终端厂家:">
+                <el-select v-model="tableStore.table.params.manufacturer" multiple collapse-tags clearable
+                    value-key="id" placeholder="请选择终端厂家">
+                    <el-option v-for="item in terminaloption" :key="item.id" :label="item.name"
+                        :value="item"></el-option>
+                </el-select>
+            </el-form-item>
+            <el-form-item label="干扰源类型:">
+                <el-select v-model="tableStore.table.params.loadType" multiple collapse-tags clearable value-key="id"
+                    placeholder="请选择干扰源类型">
+                    <el-option v-for="item in interfereoption" :key="item.id" :label="item.name"
+                        :value="item"></el-option>
+                </el-select>
+            </el-form-item>
+        </template>
+    </TableHeader>
+    <Table ref="tableRef" :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
+        :scroll-y="{ enabled: true }"  :key="num" />
+</template>
+<script setup lang="ts">
+import { ref, onMounted, provide, nextTick } from 'vue'
+import TableStore from '@/utils/tableStore'
+import Table from '@/components/table/index.vue'
+import TableHeader from '@/components/table/header/index.vue'
+import { useDictData } from '@/stores/dictData'
+import { debounce } from 'lodash-es'
+import XEUtils from 'xe-utils'
+const dictData = useDictData()
+const tableRef = ref()
+const num = ref(0)
+
+const classificationData = dictData.getBasicData('Statistical_Type', ['Report_Type'])
+const voltageleveloption = dictData.getBasicData('Dev_Voltage_Stand')
+const terminaloption = dictData.getBasicData('Dev_Manufacturers')
+const interfereoption = dictData.getBasicData('Interference_Source')
+const treeDataCopy: any = ref([])
+const treeData: any = ref([])
+const TableHeaderRef = ref()
+const tableStore = new TableStore({
+    url: '/device-boot/terminalOnlineRateData/getOnlineRateData',
+    publicHeight: 65,
+    showPage: false,
+    method: 'POST',
+    column: [
+        { field: 'name', title: '电网拓扑',     width: 350, align: 'left', treeNode: true },
+        {
+            field: 'ip',
+            title: '网络参数',
+            formatter: ({ row }: any) => {
+                return row.ip || '/'
+            }
+        },
+        {
+            field: 'dataName',
+            title: '终端名称',
+            formatter: ({ row }: any) => {
+                return row.dataName || '/'
+            }
+        },
+        {
+            field: 'manufacturer',
+            title: '厂家',
+            formatter: ({ row }: any) => {
+                return row.manufacturer || '/'
+            }
+        },
+        {
+            field: 'comFlag',
+            title: '通讯状态',
+            render: 'tag',
+            custom: {
+                0: 'danger',
+                1: 'success',
+                3: 'info'
+            },
+            replaceValue: {
+                0: '中断',
+                1: '正常',
+                3: '/'
+            }
+            // formatter: ({ row }: any) => {
+            //     return row.comFlag || '/'
+            // }
+        },
+        {
+            field: 'updateTime',
+            title: '最新数据时间',
+            formatter: ({ row }: any) => {
+                return row.updateTime || '/'
+            }
+        },
+        {
+            field: 'onlineRate',
+            title: '在线率(%)',
+            formatter: ({ row }: any) => {
+                return row.onlineRate == 3.14159 ? '暂无数据' : row.onlineRate.toFixed(2)
+            }
+        },
+        {
+            field: 'assess',
+            title: '评估',
+            render: 'tag',
+            custom: {
+                0: 'info',
+                1: 'danger',
+                2: 'warning',
+                3: 'success'
+            },
+            replaceValue: {
+                0: '暂无数据',
+                1: '不合格',
+                2: '合格',
+                3: '优秀'
+            }
+        }
+    ],
+    beforeSearchFun: () => {
+        tableStore.options.column[0].title = tableStore.table.params.statisticalType.name
+    },
+
+    loadCallback: () => {
+   
+        setTimeout(() => {
+            tableRef.value.getRef().setAllTreeExpand(true)
+        }, 1000)
+      
+        treeData.value = tree2List(tableStore.table.data, Math.random() * 1000)
+        treeDataCopy.value = JSON.parse(JSON.stringify(treeData.value))
+        tableStore.table.data = treeData.value
+        tableStore.table.params.filterName=''
+        searchEvent()
+
+    }
+})
+
+tableStore.table.params.statisticalType = classificationData.filter(item => item.name == '电网拓扑')[0]
+tableStore.table.params.monitorFlag = 2
+tableStore.table.params.powerFlag = 2
+tableStore.table.params.serverName = 'harmonicBoot'
+provide('tableStore', tableStore)
+const tree2List = (list: any, id: any) => {
+    //存储结果的数组
+    let arr: any = []
+    // 遍历 tree 数组
+    list.forEach((item: any) => {
+        item.uPid = id
+        item.uId = (Math.random() * 1000)
+        item.comFlag = item.comFlag == null ? 3 : item.comFlag
+        item.assess = item.onlineRate == 3.14159 ? 0 : item.onlineRate < 60 ? 1 : item.onlineRate < 90 ? 2 : 3
+        // 判断item是否存在children
+        if (!item.children) return arr.push(item)
+        // 函数递归，对children数组进行tree2List的转换
+        const children = tree2List(item.children, item.uId)
+        // 删除item的children属性
+        delete item.children
+        // 把item和children数组添加至结果数组
+        //..children: 意思是把children数组展开
+        arr.push(item, ...children)
+    })
+    // 返回结果数组
+    return arr
+}
+// 表格过滤
+const searchEvent = debounce(() => {
+    const filterVal = XEUtils.toValueString(tableStore.table.params.filterName).trim().toLowerCase()
+
+    if (filterVal) {
+        const options = { children: 'children' }
+        const searchProps = ['name']
+
+        const rest = XEUtils.searchTree(
+            treeDataCopy.value,
+            (item: any) => searchProps.some(key => String(item[key]).toLowerCase().indexOf(filterVal) > -1),
+            options
+        )
+        console.log("🚀 ~ searchEvent ~ rest:", rest)
+
+        tableStore.table.data = rest
+
+        // 搜索之后默认展开所有子节点
+    } else {
+        tableStore.table.data = treeDataCopy.value
+    }
+    nextTick(() => {
+        const $table = tableRef.value.getRef()
+        if ($table) {
+            $table.setAllTreeExpand(true)
+        }
+    })
+}, 500)
+onMounted(() => {
+    tableStore.index()
+})
+</script>
+
+<style scoped lang="scss"></style>

src/views/pqs/harmonicMonitoring/embed/onlinerate/index_JB.vue

@@ -12,8 +12,8 @@
                         ></el-option>
                     </el-select>
                 </el-form-item>
-                <el-form-item label="筛选">
-                    <el-input v-model="tableStore.table.params.filterName" placeholder="输入关键字筛选" />
+                <el-form-item label="筛选数据">
+                    <el-input v-model="tableStore.table.params.searchValue" placeholder="请输入终端名称" />
                 </el-form-item>
             </template>
 
@@ -47,7 +47,7 @@
                                 <span class="divBox_title">低于90%终端数</span>
                                 <span
                                     class="divBox_num text-style"
-                                    style="color: #ff6600"
+                                    style="color: #57bc6e"
                                     @click="totalTable(90, '低于90%终端_')"
                                 >
                                     {{ monitoringPoints.abnormalNum }}
@@ -115,7 +115,7 @@
                             </span>
                             <!-- 低于90%终端数 -->
                             <span
-                                style="flex: 1; color: #ff9100"
+                                style="flex: 1; color: #388e3c"
                                 class="text text-style"
                                 @click="renderTable(o.detailList, 90, o.citName + '_低于90%终端_')"
                             >
@@ -161,10 +161,10 @@
                             </template>
                         </vxe-column>
                         <vxe-column field="cit" title="所在地市" width="110px"></vxe-column>
-                        <vxe-column field="company" title="供电公司"></vxe-column>
-                        <vxe-column field="subStation" title="变电站"></vxe-column>
-                        <vxe-column field="manufacturer" title="终端厂家"></vxe-column>
-                        <vxe-column field="deviceName" title="终端名称"></vxe-column>
+                        <vxe-column field="company" title="供电公司" minWidth="110px"></vxe-column>
+                        <vxe-column field="subStation" title="变电站" minWidth="110px"></vxe-column>
+                        <vxe-column field="manufacturer" title="终端厂家" minWidth="110px"></vxe-column>
+                        <vxe-column field="deviceName" title="终端名称" minWidth="110px"></vxe-column>
                         <vxe-column field="ip" title="终端IP" :formatter="formatter" width="130px"></vxe-column>
                         <vxe-column field="runFlag" title="运行状态" width="90px">
                             <template #default="{ row }">
@@ -267,9 +267,15 @@ const tableStore = new TableStore({
         monitoringPoints.value.runNum = tableStore.table.data.totalNum
         monitoringPoints.value.abnormalNum = tableStore.table.data.belowNum
         monitoringPoints.value.totalOnlineRate = tableStore.table.data.totalOnlineRate - 0
-        abnormal.value = tableStore.table.data.citDetailList.filter(
-            (k: any) => k.citName != '上送国网' && k.citName != '非上送国网'
-        )
+        abnormal.value = tableStore.table.data.citDetailList.filter((k: any) => {
+            if (tableStore.table.params.statisticalType.name == '终端厂家') {
+                return k.citTotalNum != 0
+            } else {
+                return k.citName != '上送国网' && k.citName != '非上送国网'
+            }
+        })
+        console.log(123, tableStore.table.params.statisticalType.name)
+
         // 合并子集数据 并去重
         totalData.value = Array.from(
             tableStore.table.data.citDetailList
@@ -417,7 +423,8 @@ const echart = () => {
     }
 }
 tableStore.table.params.deptIndex = dictData.state.area[0].id
-tableStore.table.params.lineRunFlag = ''
+tableStore.table.params.lineRunFlag = 0
+tableStore.table.params.searchValue = ''
 
 const formatter = (row: any) => {
     return row.cellValue || '/'
@@ -478,7 +485,7 @@ tableStore.table.params.name = ''
 provide('tableStore', tableStore)
 </script>
 <style lang="scss" scoped>
-    @import '@/assets/font/iconfont.css';
+@import '@/assets/font/iconfont.css';
 .card-list {
     display: flex;
     .monitoringPoints {