diff --git a/src/layouts/admin/components/globalPopUp.vue b/src/layouts/admin/components/globalPopUp.vue
index 0b32350e..bd720671 100644
--- a/src/layouts/admin/components/globalPopUp.vue
+++ b/src/layouts/admin/components/globalPopUp.vue
@@ -1,96 +1,108 @@
-<template>
-    <div>
-        <!-- 全局暂降事件 -->
-        <el-drawer v-model="drawer" title="暂降事件" size="1050px" :before-close="handleClose">
-            <div :style="height">
-                <vxe-table
-                    v-bind="defaultAttribute"
-                    v-loading="isLoading"
-                    height="100%"
-                    ref="xTable1Ref"
-                    :data="eventList"
-                >
-                    <vxe-column type="seq" width="70px" title="序号"></vxe-column>
-                    <vxe-column field="time" width="180px" sortable title="发生时刻"></vxe-column>
-                    <vxe-column field="lineName" title="监测点"></vxe-column>
-                    <vxe-column field="powerCompany" title="变电站" width="100px"></vxe-column>
-                    <vxe-column field="powerCompany" title="供电公司" width="100px"></vxe-column>
-                    <vxe-column field="persistTime" width="120px" sortable title="持续时间(s)">
-                         <template #default="{ row }">
-                            {{ Math.floor(row.persistTime * 1000) / 1000 }}
-                        </template>
-                    </vxe-column>
-                    <vxe-column field="eventValue" width="160px" sortable title="暂降(骤升)幅值(%)">
-                        <template #default="{ row }">
-                            {{ Math.floor(row.eventValue * 10000) / 100 }}
-                        </template>
-                    </vxe-column>
-                    <vxe-column field="eventType" width="100px" title="暂降类型">
-                        <template #default="{ row }">
-                            {{ event.filter(item => item.id == row.eventType)[0]?.name || '/' }}
-                        </template>
-                    </vxe-column>
-                </vxe-table>
-            </div>
-        </el-drawer>
-    </div>
-</template>
-<script setup lang="ts">
-import { ref, reactive, onMounted } from 'vue'
-import { defaultAttribute } from '@/components/table/defaultAttribute'
-import { mainHeight } from '@/utils/layout'
-import { useDictData } from '@/stores/dictData'
-import MQTT from '@/utils/mqtt'
-const dictData = useDictData()
-const event = dictData.getBasicData('Event_Statis')
-import { useAdminInfo } from '@/stores/adminInfo'
-const adminInfo = useAdminInfo()
-const height = mainHeight(-20)
-const drawer = ref(false)
-const isLoading = ref(false)
-const eventList = ref([])
-const open = () => {
-    drawer.value = true
-}
-const handleClose = (done: any) => {
-    drawer.value = false
-    done()
-}
-const init = async () => {
-    const mqttClient = new MQTT('/sendEvent')
-    // 设置消息接收回调
-    try {
-        await mqttClient.init()
-
-        // 订阅主题
-        await mqttClient.subscribe()
-        // 设置消息接收回调
-        mqttClient.onMessage((topic, message) => {
-            const msg = JSON.parse(message.toString())
-            console.log("🚀 ~ init ~ msg:", msg)
-            if (msg.deptList.includes(adminInfo.$state.deptId)) {
-                drawer.value = true
-                isLoading.value = true
-                eventList.value.unshift(msg)
-                setTimeout(() => {
-                    isLoading.value = false
-                }, 500)
-            }
-        })
-    } catch (error) {
-        console.error('MQTT 初始化失败:', error)
-    }
-}
-onMounted(() => {
-    // startMqtt('/sendEvent', (topic, message) => {
-    //     const msg = JSON.parse(message.toString())
-    //     console.log(msg)
-    // })
-    init()
-})
-defineExpose({
-    open,
-    eventList
-})
-</script>
-<style lang="scss" scoped></style>
+<template>
+    <div>
+        <!-- 全局暂降事件 -->
+        <el-drawer v-model="drawer" title="暂降事件" size="1050px" :before-close="handleClose">
+            <div :style="height">
+                <vxe-table
+                    v-bind="defaultAttribute"
+                    v-loading="isLoading"
+                    height="100%"
+                    ref="xTable1Ref"
+                    :data="eventList.slice((pageNum - 1) * pageSize, pageNum * pageSize)"
+                >
+                    <!-- <vxe-column type="seq" width="70px" title="序号"></vxe-column> -->
+                    <vxe-column field="time" width="180px" sortable title="发生时刻"></vxe-column>
+                    <vxe-column field="lineName" title="监测点"></vxe-column>
+                    <vxe-column field="powerCompany" title="变电站" width="100px"></vxe-column>
+                    <vxe-column field="powerCompany" title="供电公司" width="100px"></vxe-column>
+                    <vxe-column field="persistTime" width="120px" sortable title="持续时间(s)">
+                        <template #default="{ row }">
+                            {{ Math.floor(row.persistTime * 1000) / 1000 }}
+                        </template>
+                    </vxe-column>
+                    <vxe-column field="eventValue" width="160px" sortable title="暂降(骤升)幅值(%)">
+                        <template #default="{ row }">
+                            {{ Math.floor(row.eventValue * 10000) / 100 }}
+                        </template>
+                    </vxe-column>
+                    <vxe-column field="eventType" width="100px" title="暂降类型">
+                        <template #default="{ row }">
+                            {{ event.filter(item => item.id == row.eventType)[0]?.name || '/' }}
+                        </template>
+                    </vxe-column>
+                </vxe-table>
+                <div class="table-pagination mt10">
+                    <el-pagination
+                        v-model:currentPage="pageNum"
+                        v-model:page-size="pageSize"
+                        :page-sizes="[10, 20, 50, 100, 200]"
+                        background
+                        layout="sizes,total, ->, prev, pager, next, jumper"
+                        :total="eventList.length"
+                    ></el-pagination>
+                </div>
+            </div>
+        </el-drawer>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive, onMounted } from 'vue'
+import { defaultAttribute } from '@/components/table/defaultAttribute'
+import { mainHeight } from '@/utils/layout'
+import { useDictData } from '@/stores/dictData'
+import MQTT from '@/utils/mqtt'
+const dictData = useDictData()
+const event = dictData.getBasicData('Event_Statis')
+import { useAdminInfo } from '@/stores/adminInfo'
+const adminInfo = useAdminInfo()
+const height = mainHeight(20)
+const drawer = ref(false)
+const isLoading = ref(false)
+const eventList = ref([])
+const pageNum = ref(1)
+const pageSize = ref(20)
+const open = () => {
+    drawer.value = true
+}
+const handleClose = (done: any) => {
+    drawer.value = false
+    done()
+}
+const init = async () => {
+    const mqttClient = new MQTT('/sendEvent')
+    // 设置消息接收回调
+    try {
+        await mqttClient.init()
+
+        // 订阅主题
+        await mqttClient.subscribe()
+        // 设置消息接收回调
+        mqttClient.onMessage((topic, message) => {
+            const msg = JSON.parse(message.toString())
+            console.log('🚀 ~ init ~ msg:', msg)
+            if (msg.deptList.includes(adminInfo.$state.deptId)) {
+                drawer.value = true
+                isLoading.value = true
+                eventList.value.unshift(msg)
+                setTimeout(() => {
+                    isLoading.value = false
+                }, 500)
+            }
+        })
+    } catch (error) {
+        console.error('MQTT 初始化失败:', error)
+    }
+}
+onMounted(() => {
+    // startMqtt('/sendEvent', (topic, message) => {
+    //     const msg = JSON.parse(message.toString())
+    //     console.log(msg)
+    // })
+    init()
+})
+defineExpose({
+    open,
+    eventList
+})
+</script>
+<style lang="scss" scoped></style>
diff --git a/src/layouts/admin/components/navMenus.vue b/src/layouts/admin/components/navMenus.vue
index a88c0f44..f26055fb 100644
--- a/src/layouts/admin/components/navMenus.vue
+++ b/src/layouts/admin/components/navMenus.vue
@@ -1,271 +1,271 @@
-<template>
-    <div class="nav-menus" :class="configStore.layout.layoutMode">
-        <el-tooltip effect="dark" content="暂降事件" placement="bottom">
-            <div @click="temporaryLandingEvent" class="nav-menu-item">
-                <Icon
-                    :color="configStore.getColorVal('headerBarTabColor')"
-                    class="nav-menu-icon"
-                    name="el-icon-BellFilled"
-                    size="18"
-                />
-                <span class="nav-menu-text" v-if="globalPopUpRef?.eventList.length != 0">
-                    {{ globalPopUpRef?.eventList.length || 0 }}
-                </span>
-            </div>
-        </el-tooltip>
-        <!-- <el-tooltip effect="dark" content="截图" placement="bottom">
-            <div @click="savePng" class="nav-menu-item">
-                <Icon
-                    :color="configStore.getColorVal('headerBarTabColor')"
-                    class="nav-menu-icon"
-                    name="el-icon-Camera"
-                    size="18"
-                />
-            </div>
-        </el-tooltip>
-        <el-tooltip effect="dark" :content="state.isFullScreen ? '缩小' : '放大'" placement="bottom">
-            <div @click="onFullScreen" class="nav-menu-item" :class="state.isFullScreen ? 'hover' : ''">
-                <Icon
-                    :color="configStore.getColorVal('headerBarTabColor')"
-                    class="nav-menu-icon"
-                    v-if="state.isFullScreen"
-                    name="fa-solid fa-compress"
-                    size="18"
-                />
-                <Icon
-                    :color="configStore.getColorVal('headerBarTabColor')"
-                    class="nav-menu-icon"
-                    v-else
-                    name="fa-solid fa-expand"
-                    size="18"
-                />
-            </div>
-        </el-tooltip> -->
-        <el-dropdown style="height: 100%" @command="handleCommand">
-            <div class="admin-info" :class="state.currentNavMenu == 'adminInfo' ? 'hover' : ''">
-                <el-avatar :size="25" fit="fill">
-                    <img src="@/assets/avatar.png" alt="" />
-                </el-avatar>
-                <div class="admin-name">{{ adminInfo.nickname }}</div>
-            </div>
-            <template #dropdown>
-                <el-dropdown-menu>
-                    <el-dropdown-item command="adminInfo">个人资料</el-dropdown-item>
-                    <el-dropdown-item command="changePwd">修改密码</el-dropdown-item>
-                    <el-dropdown-item command="layout">退出登录</el-dropdown-item>
-                </el-dropdown-menu>
-            </template>
-        </el-dropdown>
-        <!-- <div @click="configStore.setLayout('showDrawer', true)" class="nav-menu-item">
-            <Icon
-                :color="configStore.getColorVal('headerBarTabColor')"
-                class="nav-menu-icon"
-                name="fa fa-cogs"
-                size="18"
-            />
-        </div> -->
-        <Config />
-        <PopupPwd ref="popupPwd" />
-        <AdminInfo ref="popupAdminInfo" />
-        <!-- <TerminalVue /> -->
-        <!-- 全局暂降事件 -->
-        <globalPopUp ref="globalPopUpRef" />
-    </div>
-</template>
-
-<script lang="ts" setup>
-import { reactive, ref } from 'vue'
-import screenfull from 'screenfull'
-import { useConfig } from '@/stores/config'
-import { ElMessage } from 'element-plus'
-import Config from './config.vue'
-import { useAdminInfo } from '@/stores/adminInfo'
-import router from '@/router'
-import globalPopUp from './globalPopUp.vue'
-import { routePush } from '@/utils/router'
-import { fullUrl } from '@/utils/common'
-import html2canvas from 'html2canvas'
-import PopupPwd from './popup/password.vue'
-import AdminInfo from './popup/adminInfo.vue'
-import { useNavTabs } from '@/stores/navTabs'
-
-const adminInfo = useAdminInfo()
-const navTabs = useNavTabs()
-const configStore = useConfig()
-const popupPwd = ref()
-const popupAdminInfo = ref()
-const state = reactive({
-    isFullScreen: false,
-    currentNavMenu: '',
-    showLayoutDrawer: false,
-    showAdminInfoPopover: false
-})
-const globalPopUpRef = ref()
-const savePng = () => {
-    html2canvas(document.body, {
-        scale: 1,
-        useCORS: true
-    }).then(function (canvas) {
-        var link = document.createElement('a')
-        link.href = canvas.toDataURL('image/png')
-        link.download = 'screenshot.png'
-        link.click()
-    })
-}
-const onFullScreen = () => {
-    if (!screenfull.isEnabled) {
-        ElMessage.warning('layouts.Full screen is not supported')
-        return false
-    }
-    screenfull.toggle()
-    screenfull.onchange(() => {
-        state.isFullScreen = screenfull.isFullscreen
-    })
-}
-
-const handleCommand = (key: string) => {
-    console.log(key)
-    switch (key) {
-        case 'adminInfo':
-            popupAdminInfo.value.open()
-            break
-        case 'changePwd':
-            popupPwd.value.open()
-            break
-        case 'layout':
-            navTabs.closeTabs()
-            window.localStorage.clear()
-            adminInfo.reset()
-            router.push({ name: 'login' })
-            break
-        default:
-            break
-    }
-}
-const temporaryLandingEvent = () => {
-    globalPopUpRef.value.open()
-}
-</script>
-
-<style scoped lang="scss">
-.nav-menus.Default {
-    border-radius: var(--el-border-radius-base);
-    box-shadow: var(--el-box-shadow-light);
-}
-
-.nav-menus {
-    height: 60px;
-    display: flex;
-    align-items: center;
-    // height: 100%;
-    margin-left: auto;
-    background-color: v-bind('configStore.getColorVal("headerBarBackground")');
-
-    .nav-menu-item {
-        position: relative;
-        height: 100%;
-        width: 40px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-
-        .nav-menu-icon {
-            box-sizing: content-box;
-            color: v-bind('configStore.getColorVal("headerBarTabColor")');
-        }
-
-        &:hover {
-            .icon {
-                animation: twinkle 0.3s ease-in-out;
-            }
-        }
-    }
-
-    .admin-info {
-        display: flex;
-        height: 100%;
-        padding: 0 10px;
-        align-items: center;
-        cursor: pointer;
-        user-select: none;
-        color: v-bind('configStore.getColorVal("headerBarTabColor")');
-
-        &:hover {
-            color: v-bind('configStore.getColorVal("headerBarTabActiveColor")');
-        }
-    }
-
-    .admin-name {
-        padding-left: 6px;
-        white-space: nowrap;
-    }
-
-    .nav-menu-item:hover,
-    .admin-info:hover,
-    .nav-menu-item.hover,
-    .admin-info.hover {
-        background: v-bind('configStore.getColorVal("headerBarHoverBackground")');
-
-        .nav-menu-icon {
-            color: v-bind('configStore.getColorVal("headerBarTabActiveColor")') !important;
-        }
-    }
-}
-
-.dropdown-menu-box :deep(.el-dropdown-menu__item) {
-    justify-content: center;
-}
-
-.admin-info-base {
-    display: flex;
-    justify-content: center;
-    flex-wrap: wrap;
-    padding-top: 10px;
-
-    .admin-info-other {
-        display: block;
-        width: 100%;
-        text-align: center;
-        padding: 10px 0;
-
-        .admin-info-name {
-            font-size: var(--el-font-size-large);
-        }
-    }
-}
-
-.admin-info-footer {
-    padding: 10px 0;
-    margin: 0 -12px -12px -12px;
-    display: flex;
-    justify-content: space-around;
-}
-
-.pt2 {
-    padding-top: 2px;
-}
-
-@keyframes twinkle {
-    0% {
-        transform: scale(0);
-    }
-    80% {
-        transform: scale(1.2);
-    }
-    100% {
-        transform: scale(1);
-    }
-}
-.nav-menu-text {
-    position: absolute;
-    top: 13px;
-    right: 7px;
-    font-size: 12px;
-    display: inline-block;
-    background-color: #ff0000;
-    color: #fff;
-    border-radius: 5px;
-    padding: 0 3px;
-}
-</style>
+<template>
+    <div class="nav-menus" :class="configStore.layout.layoutMode">
+        <el-tooltip effect="dark" content="暂降事件" placement="bottom">
+            <div @click="temporaryLandingEvent" class="nav-menu-item">
+                <Icon
+                    :color="configStore.getColorVal('headerBarTabColor')"
+                    class="nav-menu-icon"
+                    name="el-icon-BellFilled"
+                    size="18"
+                />
+                <span class="nav-menu-text" v-if="globalPopUpRef?.eventList.length != 0">
+                    {{ (globalPopUpRef?.eventList.length>99? '99+':globalPopUpRef?.eventList.length)    || 0 }}
+                </span>
+            </div>
+        </el-tooltip>
+        <!-- <el-tooltip effect="dark" content="截图" placement="bottom">
+            <div @click="savePng" class="nav-menu-item">
+                <Icon
+                    :color="configStore.getColorVal('headerBarTabColor')"
+                    class="nav-menu-icon"
+                    name="el-icon-Camera"
+                    size="18"
+                />
+            </div>
+        </el-tooltip>
+        <el-tooltip effect="dark" :content="state.isFullScreen ? '缩小' : '放大'" placement="bottom">
+            <div @click="onFullScreen" class="nav-menu-item" :class="state.isFullScreen ? 'hover' : ''">
+                <Icon
+                    :color="configStore.getColorVal('headerBarTabColor')"
+                    class="nav-menu-icon"
+                    v-if="state.isFullScreen"
+                    name="fa-solid fa-compress"
+                    size="18"
+                />
+                <Icon
+                    :color="configStore.getColorVal('headerBarTabColor')"
+                    class="nav-menu-icon"
+                    v-else
+                    name="fa-solid fa-expand"
+                    size="18"
+                />
+            </div>
+        </el-tooltip> -->
+        <el-dropdown style="height: 100%" @command="handleCommand">
+            <div class="admin-info" :class="state.currentNavMenu == 'adminInfo' ? 'hover' : ''">
+                <el-avatar :size="25" fit="fill">
+                    <img src="@/assets/avatar.png" alt="" />
+                </el-avatar>
+                <div class="admin-name">{{ adminInfo.nickname }}</div>
+            </div>
+            <template #dropdown>
+                <el-dropdown-menu>
+                    <el-dropdown-item command="adminInfo">个人资料</el-dropdown-item>
+                    <el-dropdown-item command="changePwd">修改密码</el-dropdown-item>
+                    <el-dropdown-item command="layout">退出登录</el-dropdown-item>
+                </el-dropdown-menu>
+            </template>
+        </el-dropdown>
+        <!-- <div @click="configStore.setLayout('showDrawer', true)" class="nav-menu-item">
+            <Icon
+                :color="configStore.getColorVal('headerBarTabColor')"
+                class="nav-menu-icon"
+                name="fa fa-cogs"
+                size="18"
+            />
+        </div> -->
+        <Config />
+        <PopupPwd ref="popupPwd" />
+        <AdminInfo ref="popupAdminInfo" />
+        <!-- <TerminalVue /> -->
+        <!-- 全局暂降事件 -->
+        <globalPopUp ref="globalPopUpRef" />
+    </div>
+</template>
+
+<script lang="ts" setup>
+import { reactive, ref } from 'vue'
+import screenfull from 'screenfull'
+import { useConfig } from '@/stores/config'
+import { ElMessage } from 'element-plus'
+import Config from './config.vue'
+import { useAdminInfo } from '@/stores/adminInfo'
+import router from '@/router'
+import globalPopUp from './globalPopUp.vue'
+import { routePush } from '@/utils/router'
+import { fullUrl } from '@/utils/common'
+import html2canvas from 'html2canvas'
+import PopupPwd from './popup/password.vue'
+import AdminInfo from './popup/adminInfo.vue'
+import { useNavTabs } from '@/stores/navTabs'
+
+const adminInfo = useAdminInfo()
+const navTabs = useNavTabs()
+const configStore = useConfig()
+const popupPwd = ref()
+const popupAdminInfo = ref()
+const state = reactive({
+    isFullScreen: false,
+    currentNavMenu: '',
+    showLayoutDrawer: false,
+    showAdminInfoPopover: false
+})
+const globalPopUpRef = ref()
+const savePng = () => {
+    html2canvas(document.body, {
+        scale: 1,
+        useCORS: true
+    }).then(function (canvas) {
+        var link = document.createElement('a')
+        link.href = canvas.toDataURL('image/png')
+        link.download = 'screenshot.png'
+        link.click()
+    })
+}
+const onFullScreen = () => {
+    if (!screenfull.isEnabled) {
+        ElMessage.warning('layouts.Full screen is not supported')
+        return false
+    }
+    screenfull.toggle()
+    screenfull.onchange(() => {
+        state.isFullScreen = screenfull.isFullscreen
+    })
+}
+
+const handleCommand = (key: string) => {
+    console.log(key)
+    switch (key) {
+        case 'adminInfo':
+            popupAdminInfo.value.open()
+            break
+        case 'changePwd':
+            popupPwd.value.open()
+            break
+        case 'layout':
+            navTabs.closeTabs()
+            window.localStorage.clear()
+            adminInfo.reset()
+            router.push({ name: 'login' })
+            break
+        default:
+            break
+    }
+}
+const temporaryLandingEvent = () => {
+    globalPopUpRef.value.open()
+}
+</script>
+
+<style scoped lang="scss">
+.nav-menus.Default {
+    border-radius: var(--el-border-radius-base);
+    box-shadow: var(--el-box-shadow-light);
+}
+
+.nav-menus {
+    height: 60px;
+    display: flex;
+    align-items: center;
+    // height: 100%;
+    margin-left: auto;
+    background-color: v-bind('configStore.getColorVal("headerBarBackground")');
+
+    .nav-menu-item {
+        position: relative;
+        height: 100%;
+        width: 40px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        cursor: pointer;
+
+        .nav-menu-icon {
+            box-sizing: content-box;
+            color: v-bind('configStore.getColorVal("headerBarTabColor")');
+        }
+
+        &:hover {
+            .icon {
+                animation: twinkle 0.3s ease-in-out;
+            }
+        }
+    }
+
+    .admin-info {
+        display: flex;
+        height: 100%;
+        padding: 0 10px;
+        align-items: center;
+        cursor: pointer;
+        user-select: none;
+        color: v-bind('configStore.getColorVal("headerBarTabColor")');
+
+        &:hover {
+            color: v-bind('configStore.getColorVal("headerBarTabActiveColor")');
+        }
+    }
+
+    .admin-name {
+        padding-left: 6px;
+        white-space: nowrap;
+    }
+
+    .nav-menu-item:hover,
+    .admin-info:hover,
+    .nav-menu-item.hover,
+    .admin-info.hover {
+        background: v-bind('configStore.getColorVal("headerBarHoverBackground")');
+
+        .nav-menu-icon {
+            color: v-bind('configStore.getColorVal("headerBarTabActiveColor")') !important;
+        }
+    }
+}
+
+.dropdown-menu-box :deep(.el-dropdown-menu__item) {
+    justify-content: center;
+}
+
+.admin-info-base {
+    display: flex;
+    justify-content: center;
+    flex-wrap: wrap;
+    padding-top: 10px;
+
+    .admin-info-other {
+        display: block;
+        width: 100%;
+        text-align: center;
+        padding: 10px 0;
+
+        .admin-info-name {
+            font-size: var(--el-font-size-large);
+        }
+    }
+}
+
+.admin-info-footer {
+    padding: 10px 0;
+    margin: 0 -12px -12px -12px;
+    display: flex;
+    justify-content: space-around;
+}
+
+.pt2 {
+    padding-top: 2px;
+}
+
+@keyframes twinkle {
+    0% {
+        transform: scale(0);
+    }
+    80% {
+        transform: scale(1.2);
+    }
+    100% {
+        transform: scale(1);
+    }
+}
+.nav-menu-text {
+    position: absolute;
+    top: 13px;
+    left:  20px;
+    font-size: 12px;
+    display: inline-block;
+    background-color: #ff0000;
+    color: #fff;
+    border-radius: 5px;
+    padding: 0 3px;
+}
+</style>
diff --git a/src/views/pqs/supervise/electricalEnergy/components1/online.vue b/src/views/pqs/supervise/electricalEnergy/components1/online.vue
index 4cd91f11..59484e21 100644
--- a/src/views/pqs/supervise/electricalEnergy/components1/online.vue
+++ b/src/views/pqs/supervise/electricalEnergy/components1/online.vue
@@ -1,379 +1,379 @@
-<template>
-  <!-- <div>1 监测点信息  发起预告警单 </div> -->
-
-  <TableHeader datePicker nextFlag theCurrentTime showTimeAll ref="TableHeaderRef" showExport>
-    <template v-slot:select>
-      <el-form-item label="区域">
-        <Area ref="areaRef" v-model="tableStore.table.params.deptId" @changeValue="changeArea"/>
-      </el-form-item>
-      <el-form-item label="监测点性质">
-        <el-select v-model="tableStore.table.params.lineType" clearable placeholder="请选择监测点性质">
-          <el-option label="电网侧" value="0"/>
-          <el-option label="非电网侧" value="1"/>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="超标指标">
-        <el-select
-            v-model="tableStore.table.params.targetList"
-            clearable
-            multiple
-            collapse-tags
-            collapse-tags-tooltip
-            placeholder="请选择超标指标"
-        >
-          <el-option v-for="item in exceeded" :key="item.id" :label="item.name" :value="item.id"/>
-        </el-select>
-      </el-form-item>
-      <el-form-item label="数据类型">
-        <el-switch
-            v-model="tableStore.table.params.dataType"
-            inline-prompt
-            active-value="1"
-            inactive-value="0"
-            active-text="超标数据"
-            inactive-text="无数据"
-        />
-      </el-form-item>
-      <el-form-item label="预警阈值">
-        <!-- <el-input v-model="tableStore.table.params.alertThreshold" placeholder="请输入预警阈值" clearable></el-input> -->
-        <el-input-number
-            v-model="tableStore.table.params.alertThreshold"
-            :min="0"
-            :step="1"
-            step-strictly
-            @change="changeAlert"
-        />
-      </el-form-item>
-      <el-form-item label="告警阈值">
-        <el-input-number
-            v-model="tableStore.table.params.alarmThreshold"
-            :min="0"
-            :step="1"
-            step-strictly
-            @change="changeAlarm"
-        />
-      </el-form-item>
-      <!-- <el-form-item label="搜索">
-          <el-input
-              v-model="tableStore.table.params.searchValue"
-              placeholder="输入变电站、终端、监测点名称"
-              clearable
-          ></el-input>
-      </el-form-item> -->
-    </template>
-    <template #operation>
-      <el-button icon="el-icon-Plus" :disabled="flag != '2'" type="primary" @click="launch('发起预警单')">
-        发起预警单
-      </el-button>
-      <el-button icon="el-icon-Plus" :disabled="flag != '2'" type="primary" @click="launch('发起告警单')">
-        发起告警单
-      </el-button>
-    </template>
-  </TableHeader>
-  <Table ref="tableRef"/>
-  <!-- /告警单 -->
-  <alarmList ref="alarmListRef" @onSubmit="tableStore.index()"/>
-  <!-- 详情 -->
-  <detail ref="detailRef"/>
-</template>
-<script setup lang="ts">
-import {ref, onMounted, provide, nextTick} from 'vue'
-import TableStore from '@/utils/tableStore'
-import Area from '@/components/form/area/index.vue'
-import Table from '@/components/table/index.vue'
-import TableHeader from '@/components/table/header/index.vue'
-import {ElMessage, ElMessageBox} from 'element-plus'
-import {useDictData} from '@/stores/dictData'
-import alarmList from './form/alarmList.vue'
-import detail from './form/detail.vue'
-
-const dictData = useDictData()
-import {useRouter} from 'vue-router'
-
-const router = useRouter() // 路由对象
-//字典获取超标指标
-const exceeded = dictData.getBasicData('Steady_Statis')
-const tableRef = ref()
-const industry = dictData.getBasicData('Business_Type')
-const TableHeaderRef = ref()
-const alarmListRef = ref()
-const flagTime = ref(false)
-const detailRef = ref()
-const list: any = ref({
-  deptId: '',
-  searchBeginTime: '',
-  searchEndTime: '',
-  alertThreshold: '',
-  alarmThreshold: ''
-})
-const level: any = ref(dictData.state.area[0]?.level)
-const flag: any = ref('')
-const tableStore = new TableStore({
-  url: '/supervision-boot/onlineMonitor/list',
-  publicHeight: 65,
-  method: 'POST',
-  filename:'在线监测',
-  // isWebPaging:true,
-  column: [
-    {title: '', type: 'checkbox', width: 40},
-    {
-      title: '序号',
-
-      align: 'center',
-      width: 80,
-      formatter: (row: any) => {
-        return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
-      }
-    },
-    {field: 'dept', title: '负责单位'},
-    {field: 'substation', title: '变电站名称'},
-    {field: 'deviceName', title: '终端名称'},
-    {field: 'lineName', title: '监测点名称'},
-
-    {
-      field: 'businessType',
-      title: '监测对象类型',
-
-      formatter: (row: any) => {
-        return industry.find((item: any) => item.id == row.cellValue)?.name || '/'
-      }
-    },
-    {field: 'objectName', title: '监测对象名称'},
-    {
-      field: 'targetType',
-      title: '指标类型',
-      formatter: (row: any) => {
-        return exceeded.find((item: any) => item.id == row.cellValue)?.name || '/'
-      }
-    },
-
-    {
-      field: 'overLimitDay',
-      title: '累计超标天数',
-      formatter: (row: any) => {
-        return row.cellValue != null ? row.cellValue : '/'
-      }
-    },
-    {
-      field: 'updateTime',
-      visible: flagTime,
-      title: '最新数据时间'
-    },
-    {
-      title: '操作',
-      width: '180',
-      align: 'center',
-      render: 'buttons',
-      fixed: 'right',
-      buttons: [
-        {
-          name: 'productSetting',
-          title: '详情',
-          type: 'primary',
-          icon: 'el-icon-EditPen',
-          render: 'basicButton',
-          disabled: row => {
-            return row.targetType == 0
-          },
-          click: row => {
-            detailRef.value.open({
-              text: '详情',
-              row: row,
-              list: list.value
-            })
-          }
-        },
-        {
-          name: 'productSetting',
-          title: '查看预警单',
-          type: 'primary',
-          icon: 'el-icon-EditPen',
-          render: 'basicButton',
-          disabled: row => {
-            return row.step != 1
-          },
-          click: row => {
-            router.push({
-              name: 'supervision/supervision/manage',
-              query: {
-                type: 0,
-                t: Date.now()
-              }
-            })
-          }
-        },
-        {
-          name: 'productSetting',
-          title: '查看告警单',
-          type: 'primary',
-          icon: 'el-icon-EditPen',
-          render: 'basicButton',
-          disabled: row => {
-            return row.step != 2
-          },
-          click: row => {
-            router.push({
-              name: 'supervision/supervision/manage',
-              query: {
-                type: 1,
-                t: Date.now()
-              }
-            })
-          }
-        }
-        // {
-        //     name: 'productSetting',
-        //     title: '发起告警单',
-        //     type: 'warning',
-        //     disabled: row => {
-        //         return row.overLimitDay < tableStore.table.params.alarmThreshold
-        //     },
-        //     icon: 'el-icon-EditPen',
-        //     render: 'basicButton',
-
-        //     click: async row => {
-        //         // handleWarningAlarmFlag(row).then(res => {
-        //         //     console.log(res)
-        //         //     ElMessage.success('发起告警单成功！')
-        //         //     tableStore.index()
-        //         // })
-        //         const { value } = await ElMessageBox.prompt('', '整改意见', {
-        //             confirmButtonText: '确定',
-        //             cancelButtonText: '取消',
-
-        //             inputType: 'textarea',
-        //             inputPattern: /^[\s\S]*.*\S[\s\S]*$/, // 判断非空，且非空格
-        //             inputErrorMessage: '请输入整改意见'
-        //         })
-        //         handleWarningAlarmFlag({ ...row, reformAdvice: value }).then(res => {
-        //             ElMessage.success('发起告警单成功！')
-        //             tableStore.index()
-        //         })
-        //     }
-        // },
-        // {
-        //     name: 'edit',
-        //     title: '发起预警单',
-        //     type: 'primary',
-        //     icon: 'el-icon-Open',
-        //     disabled: row => {
-        //         return row.overLimitDay >= tableStore.table.params.alarmThreshold
-        //     },
-        //     render: 'basicButton',
-
-        //     click: async row => {
-        //         // handleWarningAlarmFlag(row).then(res => {
-        //         //     console.log(res)
-        //         //     ElMessage.success('发起预警单成功！')
-        //         //     tableStore.index()
-        //         // })
-        //         const { value } = await ElMessageBox.prompt('', '整改意见', {
-        //             confirmButtonText: '确定',
-        //             cancelButtonText: '取消',
-
-        //             inputType: 'textarea',
-        //             inputPattern: /^[\s\S]*.*\S[\s\S]*$/, // 判断非空，且非空格
-        //             inputErrorMessage: '请输入整改意见'
-        //         })
-        //         handleWarningAlarmFlag({ ...row, reformAdvice: value }).then(res => {
-        //             ElMessage.success('发起预警单成功！')
-        //             tableStore.index()
-        //         })
-        //     }
-        // }
-      ]
-    }
-  ],
-  beforeSearchFun: () => {
-    tableStore.table.params.currentPage = tableStore.table.params.pageNum
-    list.value.deptId = tableStore.table.params.deptId
-
-    list.value.searchBeginTime = tableStore.table.params.searchBeginTime
-    list.value.searchEndTime = tableStore.table.params.searchEndTime
-    if (tableStore.table.params.alertThreshold != '') {
-      list.value.alertThreshold = tableStore.table.params.alertThreshold
-    }
-    list.value.lineType = tableStore.table.params.lineType
-    list.value.alarmThreshold = tableStore.table.params.alarmThreshold
-    flag.value = level.value
-    flagTime.value = tableStore.table.params.dataType == 0 ? true : false
-  },
-  loadCallback: () => {
-    // tableStore.table.data = [
-    //     {
-    //         orgName: '张家口',
-    //         subName: '110kV马头山风电场',
-    //         lineName: '111口头线',
-    //         voltageScale: '110kV',
-    //         overDay: '20',
-    //         overDays: '10'
-    //     },
-    //     {
-    //         orgName: '张家口',
-    //         subName: '110kV韩家庄风电场',
-    //         lineName: '111缘韩一线',
-    //         voltageScale: '110kV',
-    //         overDay: '20',
-    //         overDays: '16'
-    //     }
-    // ]
-  }
-})
-tableStore.table.params.alertThreshold = 5
-tableStore.table.params.alarmThreshold = 5
-tableStore.table.params.targetList = exceeded.filter(item => item.code == 'Total_Indicator')[0].id
-    ? [exceeded.filter(item => item.code == 'Total_Indicator')[0].id]
-    : []
-tableStore.table.params.lineType = ''
-tableStore.table.params.dataType = '1'
-tableStore.table.params.deptId = dictData.state.area[0].id
-provide('tableStore', tableStore)
-onMounted(() => {
-  // TableHeaderRef.value.setDatePicker([{label: '月', value: 3}])
-
-  tableStore.index()
-  setTimeout(() => {
-    TableHeaderRef.value.showSelectChange()
-  }, 10)
-})
-
-const changeAlert = e => {
-  if (e == null) {
-    tableStore.table.params.alertThreshold = 5
-  } else {
-    if (e > tableStore.table.params.alarmThreshold) {
-      ElMessage.warning('预警阈值不能大于报警阈值')
-      tableStore.table.params.alertThreshold = 5
-    }
-  }
-}
-const changeAlarm = e => {
-  if (e == null) {
-    tableStore.table.params.alarmThreshold = 5
-  } else {
-    if (e < tableStore.table.params.alertThreshold) {
-      ElMessage.warning('报警阈值不能小于预警阈值')
-      tableStore.table.params.alarmThreshold = 5
-    }
-  }
-}
-// 发起预警单
-const launch = (title: string) => {
-  if (tableStore.table.selection.length == 0) {
-    ElMessage.warning('请选择一条数据')
-    return
-  }
-
-  alarmListRef.value.open({
-    text: title,
-    form: list.value,
-    row: tableStore.table.selection
-  })
-  console.log('🚀 ~ launch ~ list.value:', list.value)
-}
-const changeArea = e => {
-  level.value = e.data.level
-}
-</script>
-
-<style scoped lang="scss"></style>
+<template>
+  <!-- <div>1 监测点信息  发起预告警单 </div> -->
+
+  <TableHeader datePicker nextFlag theCurrentTime  ref="TableHeaderRef" showExport>
+    <template v-slot:select>
+      <el-form-item label="区域">
+        <Area ref="areaRef" v-model="tableStore.table.params.deptId" @changeValue="changeArea"/>
+      </el-form-item>
+      <el-form-item label="监测点性质">
+        <el-select v-model="tableStore.table.params.lineType" clearable placeholder="请选择监测点性质">
+          <el-option label="电网侧" value="0"/>
+          <el-option label="非电网侧" value="1"/>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="超标指标">
+        <el-select
+            v-model="tableStore.table.params.targetList"
+            clearable
+            multiple
+            collapse-tags
+            collapse-tags-tooltip
+            placeholder="请选择超标指标"
+        >
+          <el-option v-for="item in exceeded" :key="item.id" :label="item.name" :value="item.id"/>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="数据类型">
+        <el-switch
+            v-model="tableStore.table.params.dataType"
+            inline-prompt
+            active-value="1"
+            inactive-value="0"
+            active-text="超标数据"
+            inactive-text="无数据"
+        />
+      </el-form-item>
+      <el-form-item label="预警阈值">
+        <!-- <el-input v-model="tableStore.table.params.alertThreshold" placeholder="请输入预警阈值" clearable></el-input> -->
+        <el-input-number
+            v-model="tableStore.table.params.alertThreshold"
+            :min="0"
+            :step="1"
+            step-strictly
+            @change="changeAlert"
+        />
+      </el-form-item>
+      <el-form-item label="告警阈值">
+        <el-input-number
+            v-model="tableStore.table.params.alarmThreshold"
+            :min="0"
+            :step="1"
+            step-strictly
+            @change="changeAlarm"
+        />
+      </el-form-item>
+      <!-- <el-form-item label="搜索">
+          <el-input
+              v-model="tableStore.table.params.searchValue"
+              placeholder="输入变电站、终端、监测点名称"
+              clearable
+          ></el-input>
+      </el-form-item> -->
+    </template>
+    <template #operation>
+      <el-button icon="el-icon-Plus" :disabled="flag != '2'" type="primary" @click="launch('发起预警单')">
+        发起预警单
+      </el-button>
+      <el-button icon="el-icon-Plus" :disabled="flag != '2'" type="primary" @click="launch('发起告警单')">
+        发起告警单
+      </el-button>
+    </template>
+  </TableHeader>
+  <Table ref="tableRef"/>
+  <!-- /告警单 -->
+  <alarmList ref="alarmListRef" @onSubmit="tableStore.index()"/>
+  <!-- 详情 -->
+  <detail ref="detailRef"/>
+</template>
+<script setup lang="ts">
+import {ref, onMounted, provide, nextTick} from 'vue'
+import TableStore from '@/utils/tableStore'
+import Area from '@/components/form/area/index.vue'
+import Table from '@/components/table/index.vue'
+import TableHeader from '@/components/table/header/index.vue'
+import {ElMessage, ElMessageBox} from 'element-plus'
+import {useDictData} from '@/stores/dictData'
+import alarmList from './form/alarmList.vue'
+import detail from './form/detail.vue'
+
+const dictData = useDictData()
+import {useRouter} from 'vue-router'
+
+const router = useRouter() // 路由对象
+//字典获取超标指标
+const exceeded = dictData.getBasicData('Steady_Statis')
+const tableRef = ref()
+const industry = dictData.getBasicData('Business_Type')
+const TableHeaderRef = ref()
+const alarmListRef = ref()
+const flagTime = ref(false)
+const detailRef = ref()
+const list: any = ref({
+  deptId: '',
+  searchBeginTime: '',
+  searchEndTime: '',
+  alertThreshold: '',
+  alarmThreshold: ''
+})
+const level: any = ref(dictData.state.area[0]?.level)
+const flag: any = ref('')
+const tableStore = new TableStore({
+  url: '/supervision-boot/onlineMonitor/list',
+  publicHeight: 65,
+  method: 'POST',
+  filename:'在线监测',
+  // isWebPaging:true,
+  column: [
+    {title: '', type: 'checkbox', width: 40},
+    {
+      title: '序号',
+
+      align: 'center',
+      width: 80,
+      formatter: (row: any) => {
+        return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
+      }
+    },
+    {field: 'dept', title: '负责单位'},
+    {field: 'substation', title: '变电站名称'},
+    {field: 'deviceName', title: '终端名称'},
+    {field: 'lineName', title: '监测点名称'},
+
+    {
+      field: 'businessType',
+      title: '监测对象类型',
+
+      formatter: (row: any) => {
+        return industry.find((item: any) => item.id == row.cellValue)?.name || '/'
+      }
+    },
+    {field: 'objectName', title: '监测对象名称'},
+    {
+      field: 'targetType',
+      title: '指标类型',
+      formatter: (row: any) => {
+        return exceeded.find((item: any) => item.id == row.cellValue)?.name || '/'
+      }
+    },
+
+    {
+      field: 'overLimitDay',
+      title: '累计超标天数',
+      formatter: (row: any) => {
+        return row.cellValue != null ? row.cellValue : '/'
+      }
+    },
+    {
+      field: 'updateTime',
+      visible: flagTime,
+      title: '最新数据时间'
+    },
+    {
+      title: '操作',
+      width: '180',
+      align: 'center',
+      render: 'buttons',
+      fixed: 'right',
+      buttons: [
+        {
+          name: 'productSetting',
+          title: '详情',
+          type: 'primary',
+          icon: 'el-icon-EditPen',
+          render: 'basicButton',
+          disabled: row => {
+            return row.targetType == 0
+          },
+          click: row => {
+            detailRef.value.open({
+              text: '详情',
+              row: row,
+              list: list.value
+            })
+          }
+        },
+        {
+          name: 'productSetting',
+          title: '查看预警单',
+          type: 'primary',
+          icon: 'el-icon-EditPen',
+          render: 'basicButton',
+          disabled: row => {
+            return row.step != 1
+          },
+          click: row => {
+            router.push({
+              name: 'supervision/supervision/manage',
+              query: {
+                type: 0,
+                t: Date.now()
+              }
+            })
+          }
+        },
+        {
+          name: 'productSetting',
+          title: '查看告警单',
+          type: 'primary',
+          icon: 'el-icon-EditPen',
+          render: 'basicButton',
+          disabled: row => {
+            return row.step != 2
+          },
+          click: row => {
+            router.push({
+              name: 'supervision/supervision/manage',
+              query: {
+                type: 1,
+                t: Date.now()
+              }
+            })
+          }
+        }
+        // {
+        //     name: 'productSetting',
+        //     title: '发起告警单',
+        //     type: 'warning',
+        //     disabled: row => {
+        //         return row.overLimitDay < tableStore.table.params.alarmThreshold
+        //     },
+        //     icon: 'el-icon-EditPen',
+        //     render: 'basicButton',
+
+        //     click: async row => {
+        //         // handleWarningAlarmFlag(row).then(res => {
+        //         //     console.log(res)
+        //         //     ElMessage.success('发起告警单成功！')
+        //         //     tableStore.index()
+        //         // })
+        //         const { value } = await ElMessageBox.prompt('', '整改意见', {
+        //             confirmButtonText: '确定',
+        //             cancelButtonText: '取消',
+
+        //             inputType: 'textarea',
+        //             inputPattern: /^[\s\S]*.*\S[\s\S]*$/, // 判断非空，且非空格
+        //             inputErrorMessage: '请输入整改意见'
+        //         })
+        //         handleWarningAlarmFlag({ ...row, reformAdvice: value }).then(res => {
+        //             ElMessage.success('发起告警单成功！')
+        //             tableStore.index()
+        //         })
+        //     }
+        // },
+        // {
+        //     name: 'edit',
+        //     title: '发起预警单',
+        //     type: 'primary',
+        //     icon: 'el-icon-Open',
+        //     disabled: row => {
+        //         return row.overLimitDay >= tableStore.table.params.alarmThreshold
+        //     },
+        //     render: 'basicButton',
+
+        //     click: async row => {
+        //         // handleWarningAlarmFlag(row).then(res => {
+        //         //     console.log(res)
+        //         //     ElMessage.success('发起预警单成功！')
+        //         //     tableStore.index()
+        //         // })
+        //         const { value } = await ElMessageBox.prompt('', '整改意见', {
+        //             confirmButtonText: '确定',
+        //             cancelButtonText: '取消',
+
+        //             inputType: 'textarea',
+        //             inputPattern: /^[\s\S]*.*\S[\s\S]*$/, // 判断非空，且非空格
+        //             inputErrorMessage: '请输入整改意见'
+        //         })
+        //         handleWarningAlarmFlag({ ...row, reformAdvice: value }).then(res => {
+        //             ElMessage.success('发起预警单成功！')
+        //             tableStore.index()
+        //         })
+        //     }
+        // }
+      ]
+    }
+  ],
+  beforeSearchFun: () => {
+    tableStore.table.params.currentPage = tableStore.table.params.pageNum
+    list.value.deptId = tableStore.table.params.deptId
+
+    list.value.searchBeginTime = tableStore.table.params.searchBeginTime
+    list.value.searchEndTime = tableStore.table.params.searchEndTime
+    if (tableStore.table.params.alertThreshold != '') {
+      list.value.alertThreshold = tableStore.table.params.alertThreshold
+    }
+    list.value.lineType = tableStore.table.params.lineType
+    list.value.alarmThreshold = tableStore.table.params.alarmThreshold
+    flag.value = level.value
+    flagTime.value = tableStore.table.params.dataType == 0 ? true : false
+  },
+  loadCallback: () => {
+    // tableStore.table.data = [
+    //     {
+    //         orgName: '张家口',
+    //         subName: '110kV马头山风电场',
+    //         lineName: '111口头线',
+    //         voltageScale: '110kV',
+    //         overDay: '20',
+    //         overDays: '10'
+    //     },
+    //     {
+    //         orgName: '张家口',
+    //         subName: '110kV韩家庄风电场',
+    //         lineName: '111缘韩一线',
+    //         voltageScale: '110kV',
+    //         overDay: '20',
+    //         overDays: '16'
+    //     }
+    // ]
+  }
+})
+tableStore.table.params.alertThreshold = 5
+tableStore.table.params.alarmThreshold = 5
+tableStore.table.params.targetList = exceeded.filter(item => item.code == 'Total_Indicator')[0].id
+    ? [exceeded.filter(item => item.code == 'Total_Indicator')[0].id]
+    : []
+tableStore.table.params.lineType = ''
+tableStore.table.params.dataType = '1'
+tableStore.table.params.deptId = dictData.state.area[0].id
+provide('tableStore', tableStore)
+onMounted(() => {
+  // TableHeaderRef.value.setDatePicker([{label: '月', value: 3}])
+
+  tableStore.index()
+  setTimeout(() => {
+    TableHeaderRef.value.showSelectChange()
+  }, 10)
+})
+
+const changeAlert = e => {
+  if (e == null) {
+    tableStore.table.params.alertThreshold = 5
+  } else {
+    if (e > tableStore.table.params.alarmThreshold) {
+      ElMessage.warning('预警阈值不能大于报警阈值')
+      tableStore.table.params.alertThreshold = 5
+    }
+  }
+}
+const changeAlarm = e => {
+  if (e == null) {
+    tableStore.table.params.alarmThreshold = 5
+  } else {
+    if (e < tableStore.table.params.alertThreshold) {
+      ElMessage.warning('报警阈值不能小于预警阈值')
+      tableStore.table.params.alarmThreshold = 5
+    }
+  }
+}
+// 发起预警单
+const launch = (title: string) => {
+  if (tableStore.table.selection.length == 0) {
+    ElMessage.warning('请选择一条数据')
+    return
+  }
+
+  alarmListRef.value.open({
+    text: title,
+    form: list.value,
+    row: tableStore.table.selection
+  })
+  console.log('🚀 ~ launch ~ list.value:', list.value)
+}
+const changeArea = e => {
+  level.value = e.data.level
+}
+</script>
+
+<style scoped lang="scss"></style>