Web端添加治理模块状态展示界面、模块事件展示、主动询问模块状态功能

src/api/cs-device-boot/EquipmentDelivery.ts

@@ -121,8 +121,24 @@ export function getById(data?: any) {
 //测试项日志修改
 export function updateRecordData(data?: any) {
     return createAxios({
-        url: 'cs-device-boot/wlRecord/updateRecordData',
+        url: '/cs-device-boot/wlRecord/updateRecordData',
         method: 'POST',
         data
     })
 }
+//模块数据
+export function allModelData(data?: any) {
+    return createAxios({
+        url: '/cs-harmonic-boot/data/allModelData',
+        method: 'POST',
+        data
+    })
+}
+//刷新状态
+export function getModuleState(data?: any) {
+    return createAxios({
+        url: '/cs-harmonic-boot/data/getModuleState',
+        method: 'POST',
+        params: data
+    })
+}

src/components/echarts/MyEchart.vue

@@ -51,13 +51,7 @@ const initChart = () => {
         },
         tooltip: {
             trigger: 'axis',
-            axisPointer: {
+
-                type: 'shadow',
-                label: {
-                    color: '#fff',
-                    fontSize: 16
-                }
-            },
             textStyle: {
                 color: '#fff',
                 fontStyle: 'normal',
@@ -66,7 +60,7 @@ const initChart = () => {
             },
             backgroundColor: 'rgba(0,0,0,0.55)',
             borderWidth: 0,
-            confine: true,
+            // confine: true,
             ...(props.options?.tooltip || null)
         },
         toolbox: {
@@ -109,6 +103,7 @@ const initChart = () => {
                 type: 'inside',
                 height: 13,
                 start: 0,
+                
                 bottom: '20px',
                 end: 100
             },
@@ -117,7 +112,7 @@ const initChart = () => {
                 height: 13,
                 bottom: '20px',
                 end: 100
-            },
+            }
             // {
             //     show: true,
             //     yAxisIndex: 0,

src/components/form/datePicker/index.vue

@@ -417,7 +417,7 @@ const setTime = (flag = 0, e = 0) => {
 
     let data = ''
 
-    if ((dd < 4 || dd == 0) && interval.value != 4 && !props.theCurrentTime) {
+    if ((dd < 2 || dd == 0) && interval.value != 4 && !props.theCurrentTime) {
         data = window.XEUtils.toDateString(new Date().getTime() - (e + dd) * 3600 * 1000 * 24, 'yyyy-MM-dd')
     } else {
         data = window.XEUtils.toDateString(new Date().getTime() - e * 3600 * 1000 * 24, 'yyyy-MM-dd')

src/components/tree/govern/pointTree.vue

@@ -12,11 +12,9 @@ import { useDictData } from '@/stores/dictData'
 // const props = defineProps(['template'])
 interface Props {
     template?: boolean
-
 }
 const props = withDefaults(defineProps<Props>(), {
-    template: false,
+    template: false
-
 })
 defineOptions({
     name: 'govern/deviceTree'
@@ -29,29 +27,25 @@ const dictData = useDictData()
 const treRef = ref()
 const width = ref('')
 
-
-
-
-
-
 const info = () => {
-    getLineTree().then(res => {
+    tree.value = []
     let arr1: any[] = []
     let arr2: any[] = []
+    getLineTree().then(res => {
         //治理设备
         res.data.map((item: any) => {
             if (item.name == '治理设备') {
                 item.children.forEach((item: any) => {
                     item.icon = 'el-icon-HomeFilled'
-                    item.level=1
+                    item.level = 1
                     item.color = config.getColorVal('elementUiPrimary')
                     item.children.forEach((item2: any) => {
                         item2.icon = 'el-icon-List'
-                        item2.level=1
+                        item2.level = 1
                         item2.color = config.getColorVal('elementUiPrimary')
                         item2.children.forEach((item3: any) => {
                             item3.icon = 'el-icon-Platform'
-                            item3.level=1
+                            item3.level = 1
                             item3.color =
                                 item3.comFlag === 2 ? config.getColorVal('elementUiPrimary') : '#e26257 !important'
                             item3.children.forEach((item4: any) => {
@@ -71,13 +65,15 @@ const info = () => {
                     item.color = item.comFlag === 2 ? config.getColorVal('elementUiPrimary') : '#e26257 !important'
                     item.children.forEach((item2: any) => {
                         item2.icon = 'el-icon-Platform'
-                        item2.color = item2.comFlag === 2 ? config.getColorVal('elementUiPrimary') : '#e26257 !important'
+                        item2.color =
+                            item2.comFlag === 2 ? config.getColorVal('elementUiPrimary') : '#e26257 !important'
                         arr2.push(item2)
                     })
                 })
             }
         })
         tree.value = res.data
+
         nextTick(() => {
             if (arr1.length) {
                 //初始化选中
@@ -98,7 +94,6 @@ const info = () => {
             //     })
             // }
             else {
-
                 emit('init', arr2[0])
             }
         })
@@ -108,17 +103,16 @@ const changePointType = (val: any, obj: any) => {
     emit('pointTypeChange', val, obj)
 }
 if (props.template) {
-    getTemplateByDept({ id: dictData.state.area[0].id }).then((res: any) => {
+    getTemplateByDept({ id: dictData.state.area[0].id })
+        .then((res: any) => {
             emit('Policy', res.data)
             info()
-
+        })
-    }).catch(err => {
+        .catch(err => {
             info()
         })
 } else {
     info()
 }
-onMounted(() => {
+onMounted(() => {})
-
-})
 </script>

src/components/tree/point.vue

@@ -1,9 +1,16 @@
 <!-- 设备监控使用折叠面板渲染多个tree -->
 <template>
     <div :style="{ width: menuCollapse ? '40px' : props.width }" style="display: flex; overflow: hidden">
-        <Icon v-show="menuCollapse" @click="onMenuCollapse" :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
+        <Icon
-            :class="menuCollapse ? 'unfold' : ''" size="18" class="fold ml10 mt20 menu-collapse" style="cursor: pointer"
+            v-show="menuCollapse"
-            v-if="route.path != '/admin/govern/reportCore/statistics/index'" />
+            @click="onMenuCollapse"
+            :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
+            :class="menuCollapse ? 'unfold' : ''"
+            size="18"
+            class="fold ml10 mt20 menu-collapse"
+            style="cursor: pointer"
+            v-if="route.path != '/admin/govern/reportCore/statistics/index'"
+        />
         <div class="cn-tree" :style="{ opacity: menuCollapse ? 0 : 1, display: menuCollapse ? 'none' : '' }">
             <div style="display: flex; align-items: center" class="mb10">
                 <el-input maxlength="32" show-word-limit v-model.trim="filterText" placeholder="请输入内容" clearable>
@@ -11,22 +18,43 @@
                         <Icon name="el-icon-Search" style="font-size: 16px" />
                     </template>
                 </el-input>
-                <Icon @click="onMenuCollapse" :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
+                <Icon
-                    :class="menuCollapse ? 'unfold' : ''" size="18" class="fold ml10 menu-collapse"
+                    @click="onMenuCollapse"
+                    :name="menuCollapse ? 'el-icon-Expand' : 'el-icon-Fold'"
+                    :class="menuCollapse ? 'unfold' : ''"
+                    size="18"
+                    class="fold ml10 menu-collapse"
                     style="cursor: pointer"
-                    v-if="props.canExpand && route.path != '/admin/govern/reportCore/statistics/index'" />
+                    v-if="props.canExpand && route.path != '/admin/govern/reportCore/statistics/index'"
+                />
             </div>
-            <el-collapse :accordion="true" v-model.trim="activeName" style="flex: 1; height: 100%"
+            <el-collapse
-                @change="changeDevice">
+                :accordion="true"
+                v-model.trim="activeName"
+                style="flex: 1; height: 100%"
+                @change="changeDevice"
+            >
                 <el-collapse-item title="治理设备" name="0" v-if="zlDeviceData.length != 0">
                     <el-tree
                         :style="{ height: bxsDeviceData.length != 0 ? 'calc(100vh - 300px)' : 'calc(100vh - 238px)' }"
-                        ref="treeRef1" :props="defaultProps" highlight-current :filter-node-method="filterNode"
+                        ref="treeRef1"
-                        node-key="id" default-expand-all v-bind="$attrs" :data="zlDeviceData" style="overflow: auto">
+                        :props="defaultProps"
+                        highlight-current
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        default-expand-all
+                        v-bind="$attrs"
+                        :data="zlDeviceData"
+                        style="overflow: auto"
+                    >
                         <template #default="{ node, data }">
                             <span class="custom-tree-node">
-                                <Icon :name="data.icon" style="font-size: 16px" :style="{ color: data.color }"
+                                <Icon
-                                    v-if="data.icon" />
+                                    :name="data.icon"
+                                    style="font-size: 16px"
+                                    :style="{ color: data.color }"
+                                    v-if="data.icon"
+                                />
                                 <span style="margin-left: 4px">{{ node.label }}</span>
                             </span>
                         </template>
@@ -35,13 +63,24 @@
                 <el-collapse-item title="便携式设备" name="1" v-if="bxsDeviceData.length != 0">
                     <el-tree
                         :style="{ height: zlDeviceData.length != 0 ? 'calc(100vh - 280px)' : 'calc(100vh - 238px)' }"
-                        ref="treeRef2" :props="defaultProps" highlight-current default-expand-all
+                        ref="treeRef2"
-                        :filter-node-method="filterNode" node-key="id" :data="bxsDeviceData" v-bind="$attrs"
+                        :props="defaultProps"
-                        style="overflow: auto">
+                        highlight-current
+                        default-expand-all
+                        :filter-node-method="filterNode"
+                        node-key="id"
+                        :data="bxsDeviceData"
+                        v-bind="$attrs"
+                        style="overflow: auto"
+                    >
                         <template #default="{ node, data }">
                             <span class="custom-tree-node">
-                                <Icon :name="data.icon" style="font-size: 16px" :style="{ color: data.color }"
+                                <Icon
-                                    v-if="data.icon" />
+                                    :name="data.icon"
+                                    style="font-size: 16px"
+                                    :style="{ color: data.color }"
+                                    v-if="data.icon"
+                                />
                                 <span style="margin-left: 4px">{{ node.label }}</span>
                             </span>
                         </template>
@@ -97,12 +136,23 @@ watch(
                     item.children.map((vv: any) => {
                         zlDeviceData.value.push(vv)
                     })
+                    // console.log('🚀 ~ item.children.map ~  zlDeviceData.value:', zlDeviceData.value)
                 } else if (item.name == '便携式设备') {
                     item.children.map((vv: any) => {
                         bxsDeviceData.value.push(vv)
                     })
                 }
             })
+            if (zlDeviceData.value.length != 0) {
+                activeName.value = '0'
+            }
+            if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length != 0) {
+                activeName.value = '1'
+            }
+            if (!zlDeviceData.value && !bxsDeviceData.value) {
+                activeName.value = ''
+            }
+            changeDevice(activeName.value)
         }
     },
     {
@@ -162,14 +212,12 @@ const filterNode = (value: string, data: any, node: any) => {
     if (!value) return true
     // return data.name.includes(value)
     if (data.name) {
-
         return chooseNode(value, data, node)
     }
 }
 
 // 过滤父节点 / 子节点 (如果输入的参数是父节点且能匹配，则返回该节点以及其下的所有子节点；如果参数是子节点，则返回该节点的父节点。name是中文字符，enName是英文字符.
 const chooseNode = (value: string, data: any, node: any) => {
-
     if (data.name.indexOf(value) !== -1) {
         return true
     }
@@ -200,18 +248,10 @@ const treeRef1 = ref<InstanceType<typeof ElTree>>()
 const treeRef2 = ref<InstanceType<typeof ElTree>>()
 defineExpose({ treeRef1, treeRef2 })
 onMounted(() => {
-    setTimeout(() => {
+    // nextTick(() => {
-        if (zlDeviceData.value.length != 0) {
+    //     // setTimeout(() => {
-            activeName.value = '0'
+    //     // }, 500)
-        }
+    // })
-        if (zlDeviceData.value.length === 0 && bxsDeviceData.value.length != 0) {
-            activeName.value = '1'
-        }
-        if (!zlDeviceData.value && !bxsDeviceData.value) {
-            activeName.value = ''
-        }
-        changeDevice(activeName.value)
-    }, 500)
 })
 </script>
 

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

@@ -1,6 +1,10 @@
 <template>
-    <div class="default-main device-control" :style="{ height: pageHeight.height }" v-loading="loading"
+    <div
-        style="position: relative">
+        class="default-main device-control"
+        :style="{ height: pageHeight.height }"
+        v-loading="loading"
+        style="position: relative"
+    >
         <!-- @init="nodeClick" -->
         <PointTree @node-click="nodeClick" @pointTypeChange="pointTypeChange"></PointTree>
         <div class="device-control-right" v-if="deviceData">
@@ -15,23 +19,30 @@
                     <el-button v-if="deviceType == '1'" type="primary" icon="el-icon-Monitor" @click="handleaddDevice">
                         在线补召
                     </el-button> -->
-                    <el-button v-if="deviceType == '1'" type="primary" icon="el-icon-Tickets"
+                    <el-button
-                        @click="handleAnalysisList">
+                        v-if="deviceType == '1'"
+                        type="primary"
+                        icon="el-icon-Tickets"
+                        @click="handleAnalysisList"
+                    >
                         补召
                     </el-button>
                 </template>
                 <el-descriptions-item label="名称">
                     {{ devData.name || '/' }}
                 </el-descriptions-item>
-                <el-descriptions-item label="测量间隔" width="160">
+                <el-descriptions-item label="测量间隔" width="160">{{ devData.lineInterval }}分钟</el-descriptions-item>
-                    {{ devData.lineInterval }}分钟
+                <el-descriptions-item label="电压等级" width="160">{{ devData.volGrade }}kV</el-descriptions-item>
-                </el-descriptions-item>
-                <el-descriptions-item label="电压等级" width="160">
-                    {{ devData.volGrade }}kV
-                </el-descriptions-item>
                 <el-descriptions-item label="接线方式" width="160">
-                    {{ devData.conType == 0 ? '星型接线' : devData.conType == 1 ? '角型接线' : devData.conType == 2 ? 'V型接线' :
+                    {{
-                        '/' }}
+                        devData.conType == 0
+                            ? '星型接线'
+                            : devData.conType == 1
+                            ? '角型接线'
+                            : devData.conType == 2
+                            ? 'V型接线'
+                            : '/'
+                    }}
                 </el-descriptions-item>
 
                 <!-- <el-descriptions-item label="安装位置" width="160">
@@ -45,7 +56,6 @@
                     {{ devData.ctRatio || '/' }}
                 </el-descriptions-item>
 
-
                 <!-- <el-descriptions-item label="名称">
                     {{ devData.name ? devData.name : '/' }}
                 </el-descriptions-item>
@@ -67,8 +77,13 @@
                 </el-descriptions-item> -->
             </el-descriptions>
             <el-tabs v-model.trim="dataSet" type="border-card" class="device-control-box-card" @tab-click="handleClick">
-                <el-tab-pane lazy :label="item.name" :name="item.id" v-for="(item, index) in deviceData.dataSetList"
+                <el-tab-pane
-                    :key="index">
+                    lazy
+                    :label="item.name"
+                    :name="item.id"
+                    v-for="(item, index) in deviceData.dataSetList"
+                    :key="index"
+                >
                     <template #label>
                         <span class="custom-tabs-label">
                             <el-icon>
@@ -77,42 +92,59 @@
                                 <DataAnalysis v-if="item.name.includes('趋势数据')" />
                                 <Timer v-if="item.name.includes('实时数据')" />
                                 <Monitor v-if="item.name.includes('暂态事件')" />
-                                <Odometer v-if="
+                                <Odometer
+                                    v-if="
                                         item.name != 'APF模块数据' &&
                                         item.name != '历史APF模块数据' &&
                                         !item.name.includes('历史监测') &&
                                         !item.name.includes('趋势数据') &&
                                         !item.name.includes('实时数据') &&
                                         !item.name.includes('暂态事件')
-                                " />
+                                    "
-                                <Histogram v-if="
+                                />
+                                <Histogram
+                                    v-if="
                                         item.name != 'APF模块数据' &&
                                         item.name != '历史APF模块数据' &&
                                         item.name.includes('历史监测') &&
                                         !item.name.includes('趋势数据') &&
                                         !item.name.includes('实时数据') &&
                                         !item.name.includes('暂态事件')
-                                " />
+                                    "
+                                />
                             </el-icon>
                             <span>{{ item.name }}</span>
                         </span>
                     </template>
                 </el-tab-pane>
-                <TableHeader :showSearch="false" v-if="
+                <TableHeader
+                    :showSearch="false"
+                    v-if="
                         (dataSet.indexOf('_trenddata') == -1 &&
                             dataSet.indexOf('_realtimedata') == -1 &&
                             dataSet.indexOf('_event') == -1) ||
                         realTimeFlag
-                ">
+                    "
+                >
                     <template #select>
-                        <el-form-item label="日期"
+                        <el-form-item
-                            v-show="dataSet.includes('_items') || dataSet.indexOf('_history') != -1">
+                            label="日期"
+                            v-show="
+                                dataSet.includes('_items') ||
+                                dataSet.indexOf('_history') != -1 ||
+                                dataSet.indexOf('_moduleData') != -1
+                            "
+                        >
                             <DatePicker ref="datePickerRef"></DatePicker>
                         </el-form-item>
                         <el-form-item label="数据类型" v-if="!dataSet.includes('_')">
                             <el-select v-model.trim="formInline.targetType" @change="handleTargetTypeChange">
-                                <el-option v-for="item in queryList" :key="item.id" :label="item.name"
+                                <el-option
-                                    :value="item.id" />
+                                    v-for="item in queryList"
+                                    :key="item.id"
+                                    :label="item.name"
+                                    :value="item.id"
+                                />
                             </el-select>
                         </el-form-item>
 
@@ -122,58 +154,106 @@
                                 <el-option value="Primary" label="一次值"></el-option>
                                 <el-option value="Secondary" label="二次值"></el-option>
                             </el-select> -->
-                            <el-radio-group v-model.trim="formInline.dataLevel" :disabled="TrendList?.lineType != 1"
+                            <el-radio-group
-                                @change="handleClick">
+                                v-model.trim="formInline.dataLevel"
+                                v-if="!dataSet.includes('_moduleData')"
+                                :disabled="TrendList?.lineType != 1"
+                                @change="handleClick"
+                            >
                                 <el-radio-button label="一次值" value="Primary" />
                                 <el-radio-button label="二次值" value="Secondary" />
-
                             </el-radio-group>
                         </el-form-item>
 
                         <el-form-item label="谐波次数" v-show="oddAndEvenFlag && !dataSet.includes('_')">
                             <el-select v-model.trim="oddAndEven" style="min-width: 120px !important">
-                                <el-option v-for="item in oddAndEvenList" :key="item.value" :label="item.label"
+                                <el-option
-                                    :value="item.value" />
+                                    v-for="item in oddAndEvenList"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                />
                             </el-select>
                         </el-form-item>
                         <el-form-item label="数据来源" v-if="dataSet.includes('_items')">
                             <el-select v-model.trim="formInline.dataSource" placeholder="请选择数据来源" clearable>
-
+                                <el-option
-                                <el-option v-for="item in dataSourceList" :key="item.id" :label="item.name"
+                                    v-for="item in dataSourceList"
-                                    :value="item.id" />
+                                    :key="item.id"
+                                    :label="item.name"
+                                    :value="item.id"
+                                />
                             </el-select>
                         </el-form-item>
                         <el-form-item label="关键字筛选" v-if="!dataSet.includes('_')">
-                            <el-input maxlength="32" show-word-limit v-model.trim="searchValue" autocomplete="off"
+                            <el-input
-                                clearable @input="handleSearch" placeholder="请输入关键字筛选"
+                                maxlength="32"
-                                style="width: 180px !important"></el-input>
+                                show-word-limit
+                                v-model.trim="searchValue"
+                                autocomplete="off"
+                                clearable
+                                @input="handleSearch"
+                                placeholder="请输入关键字筛选"
+                                style="width: 180px !important"
+                            ></el-input>
                         </el-form-item>
                     </template>
                     <template #operation>
-                        <el-button type="primary"
+                        <el-button
+                            type="primary"
                             :icon="dataSet.indexOf('_realtimedata') != -1 ? 'el-icon-Refresh' : 'el-icon-Search'"
-                            @click="handleClick">{{ dataSet.indexOf('_realtimedata') != -1 ? '刷新' : '查询' }}</el-button>
+                            @click="handleClick"
-                        <el-button type="primary" :disabled="tableLoading" v-if="realTimeFlag" :icon="DataLine"
+                        >
-                            @click="handleTrend">
+                            {{ dataSet.indexOf('_realtimedata') != -1 ? '刷新' : '查询' }}
+                        </el-button>
+                        <el-button
+                            type="primary"
+                            v-if="dataSet.indexOf('_moduleData') != -1"
+                            :icon="Refresh"
+                            @click="refreshTheState"
+                        >
+                            刷新状态
+                        </el-button>
+                        <el-button
+                            type="primary"
+                            :disabled="tableLoading"
+                            v-if="realTimeFlag"
+                            :icon="DataLine"
+                            @click="handleTrend"
+                        >
                             谐波频谱
                         </el-button>
-                        <el-button type="primary" v-if="realTimeFlag" :icon="TrendCharts"
+                        <el-button
-                            @click="handleHarmonicSpectrum" :disabled="tableLoading">
+                            type="primary"
+                            v-if="realTimeFlag"
+                            :icon="TrendCharts"
+                            @click="handleHarmonicSpectrum"
+                            :disabled="tableLoading"
+                        >
                             实时趋势
                         </el-button>
                     </template>
                 </TableHeader>
-                <div class="data_time" :style="{
+                <div
+                    class="data_time"
+                    :style="{
                         height: realTimeFlag ? '30px' : '40px',
                         alignItems: realTimeFlag ? 'flex-end' : 'center'
-                }" v-if="dataSet.includes('_realtimedata') && mqttMessage && mqttMessage.dataTime && sonTab != 2">
+                    }"
+                    v-if="dataSet.includes('_realtimedata') && mqttMessage && mqttMessage.dataTime && sonTab != 2"
+                >
                     <p class="mb5">
                         <span v-if="trendDataTime && !realTimeFlag">数据时间：{{ trendDataTime }}</span>
                         <span v-if="realTimeFlag">数据时间：{{ mqttMessage.dataTime }}</span>
                     </p>
 
-                    <el-button v-if="!realTimeFlag && dataSet.includes('_realtimedata')" style="float: right !important"
+                    <el-button
-                        :icon="Back" @click="handleReturn" :loading="tableLoading">
+                        v-if="!realTimeFlag && dataSet.includes('_realtimedata')"
+                        style="float: right !important"
+                        :icon="Back"
+                        @click="handleReturn"
+                        :loading="tableLoading"
+                    >
                         返回
                     </el-button>
                 </div>
@@ -189,33 +269,51 @@
                 ></div> -->
                 <!-- v-loading="tableLoading" -->
                 <div :style="{ height: tableHeight }" v-loading="tableLoading" v-if="!dataSet.includes('_')">
-                    <div style="overflow: auto" :style="{ height: tableHeight }" v-if="
+                    <div
+                        style="overflow: auto"
+                        :style="{ height: tableHeight }"
+                        v-if="
                             dataSet.indexOf('_trenddata') == -1 &&
                             dataSet.indexOf('_realtimedata') == -1 &&
                             dataSet.indexOf('_event') == -1 &&
                             tableData.length != 0
-                    ">
+                        "
-                        <div class="mb5 mt5" v-if="dataSet.indexOf('_history') == -1"
+                    >
-                            style="font-weight: 800;font-size: 16px;text-align: center">
+                        <div
+                            class="mb5 mt5"
+                            v-if="dataSet.indexOf('_history') == -1"
+                            style="font-weight: 800; font-size: 16px; text-align: center"
+                        >
                             统计时间：{{ tableData[0]?.time || '' }}
                         </div>
 
-                        <nearRealTimeData ref="nearRealTimeDataRef" v-if="dataSet.indexOf('_history') == -1"
+                        <nearRealTimeData
-                            :style="{ height: tableHeightBox, overflow: 'auto' }" />
+                            ref="nearRealTimeDataRef"
-
+                            v-if="dataSet.indexOf('_history') == -1"
+                            :style="{ height: tableHeightBox, overflow: 'auto' }"
+                        />
 
                         <!-- 循环渲染的card 最新数据/历史数据显示 -->
-                        <div class="content"
+                        <div
+                            class="content"
                             v-if="tableData.length != 0 && !tableLoading && dataSet.indexOf('_history') != -1"
-                            :style="{ height: tableHeightBox }">
+                            :style="{ height: tableHeightBox }"
-
+                        >
-                            <el-card class="box-card" :class="dataSet.indexOf('_history') == -1 ? 'box-card-new' : ''"
+                            <el-card
-                                v-for="(item, index) in tableData" :key="index">
+                                class="box-card"
+                                :class="dataSet.indexOf('_history') == -1 ? 'box-card-new' : ''"
+                                v-for="(item, index) in tableData"
+                                :key="index"
+                            >
                                 <template #header>
                                     <div class="clearfix">
                                         <span style="flex: 1">{{ item.name }}</span>
-                                        <Icon name="el-icon-TrendCharts" class="ml10" @click="getDeviceDataTrend(item)"
+                                        <Icon
-                                            style="font-size: 26px; cursor: pointer; color: #fff"></Icon>
+                                            name="el-icon-TrendCharts"
+                                            class="ml10"
+                                            @click="getDeviceDataTrend(item)"
+                                            style="font-size: 26px; cursor: pointer; color: #fff"
+                                        ></Icon>
                                     </div>
                                 </template>
 
@@ -229,8 +327,12 @@
                                 </div>
                                 <div v-else-if="item.children.length" class="box-card-div">
                                     <div style="display: flex; align-items: center">
-                                        <el-tag effect="dark" type="danger" style="width: 40px; text-align: center"
+                                        <el-tag
-                                            class="mr10">
+                                            effect="dark"
+                                            type="danger"
+                                            style="width: 40px; text-align: center"
+                                            class="mr10"
+                                        >
                                             MAX
                                         </el-tag>
                                         {{
@@ -241,8 +343,12 @@
                                         }}
                                     </div>
                                     <div style="display: flex; align-items: center">
-                                        <el-tag effect="dark" type="success" style="width: 40px; text-align: center"
+                                        <el-tag
-                                            class="mr10">
+                                            effect="dark"
+                                            type="success"
+                                            style="width: 40px; text-align: center"
+                                            class="mr10"
+                                        >
                                             AVG
                                         </el-tag>
                                         {{
@@ -253,8 +359,12 @@
                                         }}
                                     </div>
                                     <div style="display: flex; align-items: center">
-                                        <el-tag effect="dark" type="warning" style="width: 40px; text-align: center"
+                                        <el-tag
-                                            class="mr10">
+                                            effect="dark"
+                                            type="warning"
+                                            style="width: 40px; text-align: center"
+                                            class="mr10"
+                                        >
                                             MIN
                                         </el-tag>
                                         {{
@@ -350,15 +460,20 @@
                     <Trend ref="trendRef" :TrendList="TrendList"></Trend>
                 </div>
                 <!-- 实时数据 -->
-                <div :style="`height: calc(100vh - (${sonTab == 1 ? '378px' : sonTab == 2 ? '340px' : '425px'}))`"
+                <div
-                    v-if="dataSet.indexOf('_realtimedata') != -1" v-loading="tableLoading">
+                    :style="`height: calc(100vh - (${sonTab == 1 ? '378px' : sonTab == 2 ? '340px' : '425px'}))`"
+                    v-if="dataSet.indexOf('_realtimedata') != -1"
+                    v-loading="tableLoading"
+                >
                     <!-- <div class="view_top_btn" v-if="realTimeFlag">
                         <el-button type="primary"  :icon="Platform" @click="handleRecordWaves">
                             实时录波
                         </el-button>
                     </div> -->
-                    <div class="view_top_btn"
+                    <div
-                        v-if="dataSet.includes('_realtimedata') && !realTimeFlag && mqttMessage.dataTime && sonTab == 2">
+                        class="view_top_btn"
+                        v-if="dataSet.includes('_realtimedata') && !realTimeFlag && mqttMessage.dataTime && sonTab == 2"
+                    >
                         <el-button :icon="Back" @click="handleReturn" :loading="tableLoading">返回</el-button>
                     </div>
                     <!-- 实时数据主界面组件 -->
@@ -366,23 +481,41 @@
                     <!-- 实时数据-实时录波组件 -->
                     <recordWoves v-if="!realTimeFlag && sonTab == 0"></recordWoves>
                     <!-- 实时数据-实时趋势组件 -->
-                    <realTrend v-if="!realTimeFlag && sonTab == 1" ref="realTrendRef"
+                    <realTrend
-                        @changeTrendType="changeTrendType">
+                        v-if="!realTimeFlag && sonTab == 1"
-                    </realTrend>
+                        ref="realTrendRef"
+                        @changeTrendType="changeTrendType"
+                    ></realTrend>
                     <!-- 实时数据-谐波频谱组件 -->
-                    <harmonicSpectrum v-show="!realTimeFlag && sonTab == 2" ref="harmonicSpectrumRef">
+                    <harmonicSpectrum
-                    </harmonicSpectrum>
+                        v-show="!realTimeFlag && sonTab == 2"
+                        ref="harmonicSpectrumRef"
+                    ></harmonicSpectrum>
                 </div>
                 <!-- 暂态事件 -->
-                <div style="height: calc(100vh - 340px)" v-if="dataSet.indexOf('_event') != -1"
+                <div
-                    v-loading="tableLoading">
+                    style="height: calc(100vh - 340px)"
+                    v-if="dataSet.indexOf('_event') != -1"
+                    v-loading="tableLoading"
+                >
                     <Event ref="eventRef"></Event>
                 </div>
                 <!-- 测试项记录 -->
-                <div style="height: calc(100vh - 395px)" v-if="dataSet.indexOf('_items') != -1"
+                <div
-                    v-loading="tableLoading">
+                    style="height: calc(100vh - 395px)"
+                    v-if="dataSet.indexOf('_items') != -1"
+                    v-loading="tableLoading"
+                >
                     <testItemRecords ref="testItemRecordsRef" @onSubmit="handleClick" />
                 </div>
+                <!-- 模块数据 -->
+                <div
+                    style="height: calc(100vh - 395px)"
+                    v-if="dataSet.indexOf('_moduleData') != -1"
+                    v-loading="tableLoading"
+                >
+                    <moduleData ref="moduleDataRef" @onSubmit="handleClick" />
+                </div>
                 <div v-if="!tableData" style="height: 42px"></div>
             </el-tabs>
         </div>
@@ -405,8 +538,8 @@ import {
     getHarmRealData,
     getOverLimitData,
     queryDictType,
-    getById
+    getById,
-
+    allModelData
 } from '@/api/cs-device-boot/EquipmentDelivery'
 import { deviceHisData, deviceRtData, realTimeData, getTestData } from '@/api/cs-device-boot/csGroup'
 import { ref, reactive, onMounted, onUnmounted, inject, nextTick, onBeforeUnmount } from 'vue'
@@ -421,11 +554,12 @@ import offLineDataImport from './offLineDataImport/index.vue'
 import Event from './tabs/event.vue'
 import nearRealTimeData from './nearRealTimeData.vue'
 import testItemRecords from './testItemRecords.vue'
+import moduleData from './moduleData.vue'
 import { useDictData } from '@/stores/dictData'
 import { useRouter } from 'vue-router'
 import TableHeader from '@/components/table/header/index.vue'
 import { useAdminInfo } from '@/stores/adminInfo'
-import { Histogram, TrendCharts, DataLine, DataAnalysis, Odometer, Monitor, Timer, Back } from '@element-plus/icons-vue'
+import { Histogram, TrendCharts, DataLine, DataAnalysis, Odometer, Monitor, Timer, Back ,Refresh} from '@element-plus/icons-vue'
 import analysisList from './analysisList/index.vue'
 import mqtt from 'mqtt'
 defineOptions({
@@ -439,6 +573,7 @@ const getGroupLoading = ref(false)
 const deviceData = ref<any>(null)
 const dataSet = ref('')
 const testItemRecordsRef = ref()
+const moduleDataRef = ref()
 const nearRealTimeDataRef = ref()
 const devTypeOptions = ref([])
 const devModelOptions = ref([])
@@ -464,28 +599,29 @@ const formInline = reactive({
     dataLevel: 'Secondary'
 })
 
-const dataSourceList = [{
+const dataSourceList = [
+    {
         id: '0',
         name: '补召'
-}, {
+    },
+    {
         id: '1',
         name: '在线监测'
-}]
+    }
+]
 const oddAndEvenList = [
     {
         value: '3',
-        label: '全部',
+        label: '全部'
     },
     {
         value: '1',
-        label: '奇次',
+        label: '奇次'
     },
     {
         value: '2',
-        label: '偶次',
+        label: '偶次'
-    },
+    }
-
-
 ]
 const detail = ref<any>(null)
 //是否显示实时数据默认内容
@@ -634,15 +770,14 @@ const handleSearch = () => {
     })
     if (oddAndEvenFlag.value) {
         list = list.filter((item: any) => {
-            let str = item.otherName.split("次")[0]
+            let str = item.otherName.split('次')[0]
-            queryListName[0].name == '间谐波电压含有率' ? str = str - 0.5 : ''
+            queryListName[0].name == '间谐波电压含有率' ? (str = str - 0.5) : ''
 
             if (oddAndEven.value == '1') {
                 // 奇次
                 if (str % 2 != 0) {
                     return item
                 }
-
             } else if (oddAndEven.value == '2') {
                 // 偶次
                 if (str % 2 == 0) {
@@ -651,14 +786,10 @@ const handleSearch = () => {
             } else {
                 return item
             }
-
-
         })
     }
 
-
     nearRealTimeDataRef.value?.setData(list, queryListName)
-
 }
 
 const getDeviceDataTrend = (e: any) => {
@@ -696,15 +827,11 @@ const lineId: any = ref('')
 const dataLevel: any = ref('')
 const dataSource = ref([])
 const nodeClick = async (e: anyObj) => {
-    // console.log("🚀 ~ nodeClick ~ e:", e)
-
-
     if (e == undefined || e.level == 2) {
-        return loading.value = false
+        return (loading.value = false)
     }
     searchValue.value = ''
 
-
     deviceId.value = e?.pid
     lineId.value = e?.id
     TrendList.value = e
@@ -729,7 +856,6 @@ const nodeClick = async (e: anyObj) => {
         await getDeviceData(e.level == 3 ? e.pid : e.id, 'history', e.level == 3 ? e.id : e.children[0].id)
             .then((res: any) => {
                 getById({ lineId: e.level == 3 ? e.id : e.children[0].id }).then((res: any) => {
-
                     devData.value = res.data
                 })
 
@@ -744,7 +870,6 @@ const nodeClick = async (e: anyObj) => {
                     tableData.value = []
                     loading.value = false
                 } else {
-
                     res.data.dataSetList.forEach((item: any) => {
                         //历史
                         if (item.type === 'history') {
@@ -766,6 +891,10 @@ const nodeClick = async (e: anyObj) => {
                         if (item.type === 'items') {
                             item.id = item.id + '_items'
                         }
+                        // 模块数据
+                        if (item.type === 'moduleData') {
+                            item.id = item.id + '_moduleData'
+                        }
                     })
                     res.data.dataSetList = res.data.dataSetList.filter((item: any) => item.name != '历史统计数据')
                     //便携式设备默认二次值
@@ -813,7 +942,6 @@ const connectMqtt = () => {
         password: 'njcnpqs'
     }
 
-
     mqttRef.value = mqtt.connect(url, options)
 }
 const getRealDataMqttMsg = async () => {
@@ -826,7 +954,8 @@ const getRealDataMqttMsg = async () => {
     }
     //新的实时数据
     //1.调用接口 mqtt推送数据
-    await getBasicRealData(lineId.value).then((res: any) => {
+    await getBasicRealData(lineId.value)
+        .then((res: any) => {
             if (res.code == 'A0000') {
                 ElMessage.success('装置应答成功')
                 mqttMessage.value = {}
@@ -855,7 +984,7 @@ const getRealDataMqttMsg = async () => {
                         obj = {
                             ...obj,
                             // 电压有效值
-                        vRmsA: (obj.vRmsA) / 1000,
+                            vRmsA: obj.vRmsA / 1000,
                             vRmsB: obj.vRmsB / 1000,
                             vRmsC: obj.vRmsC / 1000,
                             //基波电压幅值
@@ -884,36 +1013,36 @@ const getRealDataMqttMsg = async () => {
                         obj = {
                             ...obj,
                             // 电压有效值
-                        vRmsA: ((obj.vRmsA * obj.pt)) / 1000,
+                            vRmsA: (obj.vRmsA * obj.pt) / 1000,
-                        vRmsB: ((obj.vRmsB * obj.pt)) / 1000,
+                            vRmsB: (obj.vRmsB * obj.pt) / 1000,
-                        vRmsC: ((obj.vRmsC * obj.pt)) / 1000,
+                            vRmsC: (obj.vRmsC * obj.pt) / 1000,
                             // 电流有效值
-                        iRmsA: (obj.iRmsA * obj.ct),
+                            iRmsA: obj.iRmsA * obj.ct,
-                        iRmsB: (obj.iRmsB * obj.ct),
+                            iRmsB: obj.iRmsB * obj.ct,
-                        iRmsC: (obj.iRmsC * obj.ct),
+                            iRmsC: obj.iRmsC * obj.ct,
                             //基波电压幅值
-                        v1A: ((obj.v1A * obj.pt)) / 1000,
+                            v1A: (obj.v1A * obj.pt) / 1000,
-                        v1B: ((obj.v1B * obj.pt)) / 1000,
+                            v1B: (obj.v1B * obj.pt) / 1000,
-                        v1C: ((obj.v1C * obj.pt)) / 1000,
+                            v1C: (obj.v1C * obj.pt) / 1000,
                             //基波电流幅值
-                        i1A: (obj.i1A * obj.ct),
+                            i1A: obj.i1A * obj.ct,
-                        i1B: (obj.i1B * obj.ct),
+                            i1B: obj.i1B * obj.ct,
-                        i1C: (obj.i1C * obj.ct),
+                            i1C: obj.i1C * obj.ct,
                             //有功功率
-                        pA: ((obj.pA * obj.pt * obj.ct)) / 1000,
+                            pA: (obj.pA * obj.pt * obj.ct) / 1000,
-                        pB: ((obj.pB * obj.pt * obj.ct)) / 1000,
+                            pB: (obj.pB * obj.pt * obj.ct) / 1000,
-                        pC: ((obj.pC * obj.pt * obj.ct)) / 1000,
+                            pC: (obj.pC * obj.pt * obj.ct) / 1000,
-                        pTot: ((obj.pTot * obj.pt * obj.ct)) / 1000,
+                            pTot: (obj.pTot * obj.pt * obj.ct) / 1000,
                             //无功功率
-                        qA: ((obj.qA * obj.pt * obj.ct)) / 1000,
+                            qA: (obj.qA * obj.pt * obj.ct) / 1000,
-                        qB: ((obj.qB * obj.pt * obj.ct)) / 1000,
+                            qB: (obj.qB * obj.pt * obj.ct) / 1000,
-                        qC: ((obj.qC * obj.pt * obj.ct)) / 1000,
+                            qC: (obj.qC * obj.pt * obj.ct) / 1000,
-                        qTot: ((obj.qTot * obj.pt * obj.ct)) / 1000,
+                            qTot: (obj.qTot * obj.pt * obj.ct) / 1000,
                             //视在功率
-                        sA: ((obj.sA * obj.pt * obj.ct)) / 1000,
+                            sA: (obj.sA * obj.pt * obj.ct) / 1000,
-                        sB: ((obj.sB * obj.pt * obj.ct)) / 1000,
+                            sB: (obj.sB * obj.pt * obj.ct) / 1000,
-                        sC: ((obj.sC * obj.pt * obj.ct)) / 1000,
+                            sC: (obj.sC * obj.pt * obj.ct) / 1000,
-                        sTot: ((obj.sTot * obj.pt * obj.ct)) / 1000
+                            sTot: (obj.sTot * obj.pt * obj.ct) / 1000
                         }
                     }
                     //如果消息返回值是一次值，下拉框是二次值需要单位换算 乘以1000 并且除以pt ct
@@ -973,7 +1102,6 @@ const getRealDataMqttMsg = async () => {
                         }
                     }
 
-
                     //更新谐波频谱数据
                     // !realTimeFlag.value &&
                     //     sonTab.value == 1 &&
@@ -995,7 +1123,8 @@ const getRealDataMqttMsg = async () => {
                 ElMessage.success('装置应答失败')
                 tableLoading.value = false
             }
-    }).catch(e => {
+        })
+        .catch(e => {
             setTimeout(() => {
                 tableLoading.value = false
             }, 0)
@@ -1111,11 +1240,11 @@ const handleClick = async (tab?: any) => {
                     tableData.value = res.data
                     formInline.total = res.data.total
                     tableLoading.value = false
-                    setTimeout(() => {   //targetType
+                    setTimeout(() => {
-                        testItemRecordsRef.value?.setData(res.data,)
+                        //targetType
+                        testItemRecordsRef.value?.setData(res.data)
                     }, 500)
                     setTimeout(() => {
-
                         loading.value = false
                     }, 1500)
                 })
@@ -1126,7 +1255,36 @@ const handleClick = async (tab?: any) => {
                 })
         }, 100)
     }
-
+    //模块数据
+    if (dataSet.value.includes('_moduleData')) {
+        ;(await datePickerRef.value) && datePickerRef.value?.setInterval(5)
+        let obj = {
+            // devId: deviceId.value, //e.id
+            lineId: lineId.value, //e.pid
+            startTime: datePickerRef.value && datePickerRef.value.timeValue[0],
+            endTime: datePickerRef.value && datePickerRef.value.timeValue[1]
+        }
+        await setTimeout(() => {
+            allModelData(obj)
+                .then((res: any) => {
+                    tableData.value = res.data
+                    formInline.total = res.data.total
+                    tableLoading.value = false
+                    setTimeout(() => {
+                        //targetType
+                        moduleDataRef.value?.setData(res.data)
+                    }, 500)
+                    setTimeout(() => {
+                        loading.value = false
+                    }, 1500)
+                })
+                .catch(e => {
+                    setTimeout(() => {
+                        tableLoading.value = false
+                    }, 1500)
+                })
+        }, 0)
+    }
 
     //查询当前指标
     if (!dataSet.value.includes('_')) {
@@ -1144,15 +1302,14 @@ const handleClick = async (tab?: any) => {
                 })
                 if (oddAndEvenFlag.value) {
                     list = list.filter((item: any) => {
-                        let str = item.otherName.split("次")[0]
+                        let str = item.otherName.split('次')[0]
-                        queryListName[0].name == '间谐波电压含有率' ? str = str - 0.5 : ''
+                        queryListName[0].name == '间谐波电压含有率' ? (str = str - 0.5) : ''
 
                         if (oddAndEven.value == '1') {
                             // 奇次
                             if (str % 2 != 0) {
                                 return item
                             }
-
                         } else if (oddAndEven.value == '2') {
                             // 偶次
                             if (str % 2 == 0) {
@@ -1161,12 +1318,11 @@ const handleClick = async (tab?: any) => {
                         } else {
                             return item
                         }
-
-
                     })
                 }
 
-                setTimeout(() => {   //targetType
+                setTimeout(() => {
+                    //targetType
                     nearRealTimeDataRef.value?.setData(list, queryListName)
                     tableLoading.value = false
                 }, 500)
@@ -1193,16 +1349,22 @@ const handleClick = async (tab?: any) => {
         }
     }
 }
+// 刷新状态
+const refreshTheState = () => {
+    
+    moduleDataRef.value.getModule(deviceData.value.ndid)
+}
 //模版下载
-const handleDownLoadTemplate = () => { }
+const handleDownLoadTemplate = () => {}
 //补召日志
 const analysisListRef = ref()
 //打开补召日志
 const handleAnalysisList = () => {
-    analysisListRef.value && analysisListRef.value.open({
+    analysisListRef.value &&
+        analysisListRef.value.open({
             lineId: lineId.value,
             deviceData: deviceData.value,
-        deviceId: deviceId.value,
+            deviceId: deviceId.value
         })
 }
 //离线数据导入
@@ -1232,7 +1394,6 @@ queryByCode('Device_Type').then(res => {
     })
 })
 const handleTargetTypeChange = () => {
-
     if (queryList.value.filter((item: any) => item.id == formInline.targetType)[0].name != '基本数据') {
         oddAndEvenFlag.value = true
     } else {
@@ -1245,7 +1406,7 @@ const echoName = (value: any, arr: any[]) => {
     return value ? arr.find(item => item.value == value)?.label : '/'
 }
 
-onMounted(() => { })
+onMounted(() => {})
 onBeforeUnmount(() => {
     clearInterval(realDataTimer.value)
     clearInterval(trendTimer.value)
@@ -1314,8 +1475,6 @@ onBeforeUnmount(() => {
                     background-image: linear-gradient(var(--el-color-primary), var(--el-color-primary-light-3));
 
                     .box-card-content {
-
-
                         height: 100%;
                         display: flex;
                         flex-direction: column;
@@ -1323,12 +1482,9 @@ onBeforeUnmount(() => {
                     }
                 }
             }
-
-
         }
     }
 
-
     .box-card-div {
         display: grid;
         // grid-template-columns: repeat(3, 1fr);
@@ -1337,12 +1493,10 @@ onBeforeUnmount(() => {
 }
 
 .box-card-new {
-
     min-height: 110px !important;
 
     .el-card__body {
         overflow-y: auto;
-
     }
 }
 

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

@@ -0,0 +1,216 @@
+<template>
+    <!-- 运行 运行(中断) 运行(故障) 离线 -->
+    <div :style="height" style="overflow-y: auto">
+        <el-collapse v-model="activeNames" v-loading="loading">
+            <el-collapse-item v-for="(item, index) in list" :key="index" :name="index">
+                <template #title>
+                    <div class="header">
+                        {{ item.moduleName }}
+                        <el-tag
+                            class="ml10"
+                            :type="item.moduleState == '离线' ? 'danger' : 'success'"
+                            size="small"
+                            effect="dark"
+                        >
+                            {{ item.moduleState }}
+                        </el-tag>
+                    </div>
+                </template>
+                <div :style="echartHeight" style="min-height: 150px">
+                    <MyEchart :options="item.options" v-if="item.dataList != null" />
+                    <el-empty description="暂无数据" style="height: 130px" v-else></el-empty>
+                </div>
+            </el-collapse-item>
+        </el-collapse>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import { mainHeight } from '@/utils/layout'
+import { WarnTriangleFilled } from '@element-plus/icons-vue'
+import { getModuleState } from '@/api/cs-device-boot/EquipmentDelivery'
+import MyEchart from '@/components/echarts/MyEchart.vue'
+import { ElMessage } from 'element-plus'
+const activeNames = ref([0, 1, 2, 3])
+const list: any = ref([])
+const loading = ref(false)
+const height = ref(mainHeight(290))
+const echartHeight = ref(mainHeight(292))
+const setData = (data: any) => {
+    echartHeight.value = mainHeight(292 + data.length * 49, data.length)
+    data.forEach((item: any) => {
+        // console.log('🚀 ~ setData ~ data:', data)
+        if (item.dataList == null) return
+        item.options = {
+            title: {
+                show: false
+            },
+            tooltip: {
+                formatter: function (params: any) {
+                    var tips = params[0].data[0] + '：' + params[0].data[2] + '<br/>'
+                    if (params[0].data[3] == 1) {
+                        tips += '事件：' + params[0].data[4]
+                    }
+
+                    return tips
+                }
+            },
+            xAxis: {
+                type: 'time',
+                name: '时间',
+                //
+                axisLabel: {
+                    formatter: {
+                        day: '{MM}-{dd}',
+                        month: '{MM}',
+                        year: '{yyyy}'
+                    }
+                }
+            },
+
+            // 添加自定义图例
+            legend: {
+                show: true,
+                type: 'plain',
+                top: 0,
+                itemWidth: 14, // 图例标记宽度
+                itemHeight: 14, // 图例标记高度
+                data: [
+                    {
+                        name: '事件',
+                        icon: 'path://M0,10 L10,10 L5,0 Z', // 自定义三角形路径
+                        textStyle: {
+                            color: '#333',
+                            fontSize: 12
+                        }
+                    }
+                ],
+                itemStyle: {
+                    color: '#FFB74D' // 图例标记颜色与数据标记一致
+                }
+            },
+            toolbox: {
+                show: false
+            },
+            grid: {
+                top: '30px'
+            },
+            yAxis: {
+                max: 1,
+                data: ['运行', '中断'],
+                interval: 1,
+
+                axisLabel: {
+                    formatter: value => {
+                        // if (value === 0) {
+                        //     return `  `
+                        // }
+                        if (value === 0) {
+                            return `{lx|离线}  `
+                        }
+                        if (value === 1) {
+                            return `{yx|运行}  `
+                        }
+                    },
+                    rich: {
+                        yx: {
+                            backgroundColor: '#67c23a',
+                            color: '#fff',
+                            borderRadius: 5,
+                            padding: [1, 3],
+                            fontWeight: 600,
+                            fontSize: 12,
+                            align: 'center',
+                            textAlign: 'center',
+                            width: 35,
+                            height: 20,
+                            borderColor: '#000'
+                        },
+                        lx: {
+                            backgroundColor: '#f56c6c',
+                            color: '#fff',
+                            borderRadius: 5,
+                            padding: [1, 3],
+                            fontWeight: 600,
+                            fontSize: 12,
+                            align: 'center',
+                            textAlign: 'center',
+                            width: 35,
+                            height: 20,
+                            borderColor: '#000'
+                        }
+                    }
+                }
+            },
+
+            options: {
+                series: [
+                    {
+                        name: '事件',
+                        type: 'line',
+                        data: item.dataList.map((k: any) => [
+                            k.time,
+                            k.stateDesc == '离线' ? 0 : 1,
+                            k.stateDesc,
+                            k.dataType,
+                            k.eventName
+                        ]),
+                        step: 'end',
+                        symbol: 'none',
+
+                        // 动态显示标记
+                        markPoint: {
+                            symbol: 'triangle', // 使用三角形标记
+                            symbolSize: 10, // 标记大小
+                            symbolOffset: [0, 6], // 向上偏移，放置在线条上方
+                            data: item.dataList
+                                .filter((k: any) => k.dataType === 1)
+                                .map((k: any) => ({
+                                    name: k.stateDesc,
+                                    coord: [k.time, k.stateDesc === '离线' ? 0 : 1],
+                                    itemStyle: {
+                                        color: '#FFB74D', // 亮黄色填充
+                                        borderColor: '#FFB74D', // 边框颜色
+                                        borderWidth: 1 // 边框宽度
+                                    }
+                                }))
+                        }
+                    }
+                ]
+            }
+        }
+    })
+    list.value = data
+}
+const getModule = async (id: string) => {
+    loading.value = true
+    await getModuleState({ id: id }).then(res => {
+        res.data.forEach((item: any) => {
+            list.value.forEach((k: any) => {
+                if (k.moduleName === item.moduleName) {
+                    k.moduleState = item.moduleState
+                }
+            })
+        })
+
+        ElMessage.success('刷新成功')
+    })
+    loading.value = false
+}
+
+defineExpose({ setData, getModule })
+</script>
+<style lang="scss" scoped>
+:deep(.header) {
+    font-size: 16px;
+    font-weight: 600;
+    display: flex;
+    align-items: center;
+    .header-icon {
+        font-size: 20px;
+    }
+}
+:deep(.el-empty__image) {
+    height: 120px;
+}
+</style>

src/views/govern/manage/factory.vue

@@ -3,11 +3,21 @@
         <TableHeader>
             <template v-slot:select>
                 <el-form-item label="关键字筛选">
-                    <el-input   v-model.trim="tableStore.table.params.searchValue" style="width: 200px" clearable placeholder="请输入设备名称/网络设备ID" />
+                    <el-input
-                    
+                        v-model.trim="tableStore.table.params.searchValue"
+                        style="width: 200px"
+                        clearable
+                        placeholder="请输入设备名称/网络设备ID"
+                    />
                 </el-form-item>
-                <el-form-item label="设备类型">
+                <el-form-item label="流程状态">
-                    <!-- <el-input maxlength="32" show-word-limit v-model.trim="tableStore.table.params.searchValue" placeholder="请输入设备类型" /> -->
+                    <el-select v-model.trim="tableStore.table.params.process" clearable placeholder="请选择状态">
+                        <el-option label="功能调试" :value="2"></el-option>
+                        <el-option label="出厂调试" :value="3"></el-option>
+                        <el-option label="正式投运" :value="4"></el-option>
+                    </el-select>
+                </el-form-item>
+                <!-- <el-form-item label="设备类型">
                     <el-select
                         v-model.trim="tableStore.table.params.devType"
                         clearable
@@ -46,7 +56,7 @@
                         <el-option label="MQTT" value="MQTT"></el-option>
                         <el-option label="CLD" value="CLD"></el-option>
                     </el-select>
-                </el-form-item>
+                </el-form-item>-->
                 <!-- <el-form-item label="状态">
                     <el-select v-model.trim="tableStore.table.params.status" clearable placeholder="请选择状态">
                         <el-option label="未注册" :value="1"></el-option>
@@ -372,6 +382,7 @@ const tableStore = new TableStore({
                 已连接: '已连接'
             }
         },
+
         {
             title: '通讯状态',
             field: 'runStatus',
@@ -386,7 +397,33 @@ const tableStore = new TableStore({
                 2: '在线'
             }
         },
-
+        {
+            title: '流程状态',
+            field: 'process',
+            width: 100,
+            render: 'tag',
+            custom: {
+                2: 'warning',
+                3: 'warning',
+                4: 'success'
+            },
+            replaceValue: {
+                2: '功能调试',
+                3: '出厂调试',
+                4: '正式投运'
+            }
+            // formatter: row => {
+            //     return row.cellValue == '1'
+            //         ? '设备登记'
+            //         : row.cellValue == '2'
+            //         ? '功能调试'
+            //         : row.cellValue == '3'
+            //         ? '出厂调试'
+            //         : row.cellValue == '4'
+            //         ? '设备投运'
+            //         : row.cellValue
+            // }
+        },
         {
             title: '操作',
             align: 'center',
@@ -647,11 +684,12 @@ const tableStore = new TableStore({
 tableStore.table.params.orderBy = 'desc'
 tableStore.table.params.devType = ''
 tableStore.table.params.devModel = ''
+tableStore.table.params.process = ''
 tableStore.table.params.devAccessMethod = ''
 tableStore.table.params.status = ''
 tableStore.table.params.sortBy = ''
 tableStore.table.params.orderBy = ''
-tableStore.table.params.searchValue=''
+tableStore.table.params.searchValue = ''
 
 // 设备类型
 const devTypeChange = (e: any) => {

src/views/govern/mxgraph/graphList/index.vue

@@ -36,7 +36,7 @@
                             </div>
                         </div>
                         <img v-if="item.fileContent"  :src="item.fileContent" class="image xiaoshou" @click="imgData(item)" />
-                        <el-empty v-else description="暂无设计" />
+                        <el-empty v-else description="暂无设计"  style="height: 220px;"/>
                     </el-card>
                 </el-col>
             </el-row>