AI故障研判-故障预警管理

riis-web/src/3dState.json

@@ -0,0 +1,44 @@
+[
+    {
+        "name": "庄周",
+        "model": "scene.glb",
+        "modelLight": true,
+        "ambientColor": "0xffffff",
+        "directColor": "0xcccccc",
+        "DirectionalLight": true,
+        "SpotLight": true,
+        "gui": false,
+        "objectX": "object.position.x - center.x",
+        "objectY": 10,
+        "objectZ": "object.position.z - center.z",
+        "defaultCameraX": "defaultCamera.position.x += size / 2",
+        "defaultCameraY": "defaultCamera.position.y += size / 4",
+        "defaultCameraZ": "defaultCamera.position.z += size / 5.2",
+        "defaultCameraPositionX":  148.31480981421555,
+        "defaultCameraPositionY": 110.21040546785065,
+        "defaultCameraPositionZ": 59.16669210959738,
+        "browsingRoam": [
+            {
+                "x": 69.5,
+                "y": 10.2,
+                "z": -6
+            },
+            {
+                "x": -80.5,
+                "y": 10.2,
+                "z": -6
+            },
+            {
+                "x": -80.5,
+                "y": 10.2,
+                "z": -66
+            },
+            {
+                "x": 69.5,
+                "y": 10.2,
+                "z": -66
+            }
+          
+        ]
+    }
+]

riis-web/src/api/equipment/index.ts

@@ -21,7 +21,10 @@ export function addMain(params:any){
   return request({
     url: '/basedata/substation-maindevice/addMainDevice' ,
     method: 'post',
-    params:params
+    data:params,
+    headers: {
+      'Content-Type': 'multipart/form-data'
+  }
   });
 }
 //修改主设备
@@ -29,7 +32,10 @@ export function editMain(params:any){
   return request({
     url: '/basedata/substation-maindevice/updateMainDevice' ,
     method: 'post',
-    params:params
+    data:params,
+    headers: {
+      'Content-Type': 'multipart/form-data'
+  }
   });
 }
 //新增部件

riis-web/src/api/pointSolution/index.ts

@@ -97,4 +97,13 @@ export function deleteAlgorithmArrange(params: any) {
         method: 'post',
         params: params,
     });
+}
+//预览方案图片
+export function viewFile(params: any) {
+    return request({
+        url: '/algorithm/algorithm-arrange/viewFile',
+        method: 'get',
+        params: params,
+        responseType: 'blob', 
+    });
 }

riis-web/src/api/question/index.ts

@@ -47,4 +47,12 @@ export function getAlgorithmLogsPage(params:any){
     method: 'get',
     params: params
   });
+}
+//获取主设备信息
+export function getMainDeviceInfo(params:any){
+  return request({
+    url: '/algorithm/algorithm-class-component/getMainDeviceInfo' ,
+    method: 'get',
+    params: params
+  });
 }

riis-web/src/components/IntelligentPoint/index.vue

@@ -56,10 +56,10 @@ import {
 } from "@/api/algorithm";
 import { fa } from 'element-plus/es/locale';
 import { ElMessage } from 'element-plus';
-import camera from '@/assets/point/1.svg'
-import voiceprint from '@/assets/point/2.svg'
-import partial from '@/assets/point/3.svg'
-import humidity from '@/assets/point/4.svg'
+import camera from '@/assets/point/camera.png'
+import voiceprint from '@/assets/point/voiceprint.png'
+import partial from '@/assets/point/partial.png'
+import humidity from '@/assets/point/humidity.png'
 const userStore = useUserStore();
 const props = defineProps({
     width: { type: Number, default: 600 },

riis-web/src/layout/components/Navbar.vue

@@ -50,8 +50,8 @@
             <div v-for="(item, index) in navlist">
               <div class="nav-son-list" v-if="item.name == '台账管理' || item.name == '配置管理' || item.name == '系统管理'"
                 @click.stop="">
-                <span @click.stop="navClick(item, index)" style="display: flex;align-items: center;justify-content: space-between;">
-                  <div  class="oldmenu">{{ item.name }}</div>
+                <span @click.stop="navClick(item, index)" class="oldmenu" style="display: flex;align-items: center;justify-content: space-between;">
+                  <div  >{{ item.name }}</div>
                   <div style="padding:5px ;">
                     <img v-if="!item.hide" src="@/assets/point/xia.png" alt="">
                     <img v-else src="@/assets/point/shang.png" alt="">

riis-web/src/views/digitalEmployees/pointSolution/index.vue

@@ -27,15 +27,16 @@ import {
     getArrangeDeviceInfo,
     createArrangeById,
     downloadArrangeReport,
-    deleteAlgorithmArrange
+    deleteAlgorithmArrange,
+    viewFile
 } from '@/api/pointSolution';
 import { Plus } from '@element-plus/icons-vue'
 import type { UploadProps } from 'element-plus'
 import { useUserStore } from '@/store/modules/user';
-import camera from '@/assets/point/1.svg'
-import voiceprint from '@/assets/point/2.svg'
-import partial from '@/assets/point/3.svg'
-import humidity from '@/assets/point/4.svg'
+import camera from '@/assets/point/camera.png'
+import voiceprint from '@/assets/point/voiceprint.png'
+import partial from '@/assets/point/partial.png'
+import humidity from '@/assets/point/humidity.png'
 import Viewfile from '@/components/Viewfile/index.vue'
 const userStore = useUserStore();
 onMounted(() => {
@@ -238,8 +239,9 @@ function editprogramme(row: any) {
     active.value = 1
     schemeform.value = row
     schemeform.value.deviceTypeList1 = row.deviceTypeList.split(',')
+   
     if (row.imageUrl) {
-        imageUrl.value = userStore.imgUrl + row.imageUrl
+        imageUrl.value = userStore.webApiBaseUrl + '/algorithm/algorithm-arrange/viewFile?type=1&id='+ row.id 
     } else {
         imageUrl.value = ''
     }
@@ -456,7 +458,7 @@ function getcoordinate(val: any) {
                 smallurl.value.push(urldata)
             })
             if (budian.value.imageUrl) {
-                pointbgurl.value = userStore.imgUrl + budian.value.imageUrl
+                pointbgurl.value = userStore.webApiBaseUrl + '/algorithm/algorithm-arrange/viewFile?type=1&id='+budian.value.id
                 getNetworkImageSize(pointbgurl.value)
                     .then(size => imgsize.value = size);
             } else {
@@ -557,7 +559,7 @@ function download() {
                 <el-table-column property="stationName" width="100px" label="变电站名称" align="center" />
                 <el-table-column property="stationType" width="80px" label="变电站类型" align="center" />
                 <el-table-column property="voltLevel" width="80px" label="电压等级" align="center" />
-                <el-table-column property="businessType" width="120px" label="业务类型" align="center">
+                <el-table-column property="businessType" width="130px" label="业务类型" align="center">
                     <template #default="scope">
                         <span>{{ currency(businessTypearr, scope.row.businessType) }}</span>
                     </template>
@@ -664,7 +666,7 @@ function download() {
                                         action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
                                         :show-file-list="false" :auto-upload="false" :on-change="handleChange"
                                         :before-upload="beforeAvatarUpload">
-                                        <img v-if="imageUrl" :src="imageUrl" style="width: 148px; height: 118px"
+                                        <img v-if="imageUrl" :src="imageUrl" style="width: 148px; height: 118px" id="previewImage"
                                             class="avatar" />
                                         <!-- <el-image v-if="imageUrl" style="width: 150px; height: 120px" :src="imageUrl" :zoom-rate="1.2"
                                             :max-scale="7" :min-scale="0.2" :preview-src-list="[imageUrl]" show-progress

riis-web/src/views/faultAnalysis/faultWarning/index.vue

@@ -0,0 +1,880 @@
+<script setup lang="ts">
+import { ref, onMounted, reactive, nextTick, computed, onBeforeUnmount } from 'vue'
+import MarkdownIt from 'markdown-it'
+import DOMPurify from 'dompurify'
+import Page from '@/components/Pagination/page.vue'
+import { ElMessageBox, ElMessage, ElTable, FormRules, ElTree } from 'element-plus'
+import { getDeviceByType } from '@/api/device'
+import Eldialog from '@/components/seccmsdialog/eldialog.vue'
+import { useUserStore } from '@/store/modules/user';
+import * as echarts from 'echarts'
+import { getAlgorithmClassTree, getAlgorithmDeviceParams, getAlgorithmDeviceCurve, getAlgorithmParamsNameList, callAlgorithmAnalyse, getAlgorithmLogsPage, getMainDeviceInfo } from '@/api/question';
+import { fa } from 'element-plus/es/locale'
+import axios from 'axios';
+import dayjs from 'dayjs'
+import JessibucaPlayer from '@/components/jessibuca/index1.vue'
+const userStore = useUserStore();//pythonUrl
+//树形控件类型定义
+interface Tree {
+    [x: string]: any;
+    label: string;
+    children?: Tree[];
+}
+const vMove = {
+    mounted(el: any) {
+        el.onmousedown = function (e: any) {
+            var init = e.clientX;
+            var parent: any = document.getElementById("silderLeft");
+            const initWidth: any = parent.offsetWidth;
+            document.onmousemove = function (e) {
+                var end = e.clientX;
+                var newWidth = end - init + initWidth;
+                parent.style.width = newWidth + "px";
+            };
+            document.onmouseup = function () {
+                document.onmousemove = document.onmouseup = null;
+            };
+        };
+    }
+}
+const EquipmentType: any = ref([])
+function getType() {
+    getDeviceByType({ dictcode: 'EquipmentType' }).then((res: any) => {
+        EquipmentType.value = res.data
+    })
+}
+function currency(list: any, itemcode: any) {
+    let dictname = ''
+    list.forEach((element: any) => {
+        if (element.itemcode == itemcode) {
+            dictname = element.dictname
+        }
+    })
+    return dictname
+}
+// 创建计算属性处理文本
+const md = new MarkdownIt()
+const processedActionData = computed(() => {
+    return md.render(DOMPurify.sanitize(actionData.value))
+})
+const defaultProps = { label: "name" };
+const treeRef = ref<InstanceType<typeof ElTree>>()
+const treeData: any = ref([])
+const treeloading = ref(false)
+onMounted(() => {
+    init()
+    getType()
+})
+onBeforeUnmount(() => {
+    axios.get(userStore.webApiMonitorUrl + '/api/play/stop/' + deviceId.value + '/' + channelId.value, {}).then((res: any) => { })
+    urls.value = ""
+})
+const algorithmClassName = ref('')
+const algorithmId = ref('')
+const componentId = ref('')
+function init() {
+    const params = {
+        algorithmClassName: algorithmClassName.value,
+        stationCode: userStore.stationCode
+    }
+    treeloading.value = true
+    getAlgorithmClassTree(params).then((res: any) => {
+        treeloading.value = false
+        if (res.data.length !== 0 && res.data !== null) {
+            treeData.value = res.data
+
+            if (res.data.length !== 0 && res.data !== null) {
+                componentId.value = res.data[0].children[0].id
+                algorithmId.value = res.data[0].children[0].parentId
+
+                nextTick(() => {
+                    treeRef.value?.setCurrentKey(componentId.value);
+                });
+                gatdata()
+                getmaindevice()
+                getecharts()
+                getfenList()
+            }
+        }
+    })
+}
+const comainName = ref('')
+function handleNodeClick(data: any, node: any) {
+    if (data.children.length != 0) {
+        node.isCurrent = false
+        nextTick(() => {
+            treeRef.value?.setCurrentKey(componentId.value);
+        })
+    } else {
+        // console.log(data)
+        componentId.value = data.id
+        algorithmId.value = data.parentId
+
+        gatdata()
+        getecharts()
+        getfenList()
+        getmaindevice()
+        canshuList.value = ''
+    }
+}
+const parameter: any = ref([])
+const mainarr: any = ref({})
+const mainloading: any = ref(false)
+function getmaindevice() {
+    mainloading.value = true
+    getMainDeviceInfo({ componentId: componentId.value }).then((res: any) => {
+        mainarr.value = res.data
+        mainloading.value = false
+        if (res.data.patroldeviceJson) {
+            onSubmit(JSON.parse(res.data.patroldeviceJson))
+        } else {
+            axios.get(userStore.webApiMonitorUrl + '/api/play/stop/' + deviceId.value + '/' + channelId.value, {}).then((res: any) => { })
+            urls.value = ""
+        }
+
+    })
+}
+function gatdata() {
+    fixloading.value = true
+    getAlgorithmDeviceParams({ algorithmId: algorithmId.value, componentId: componentId.value }).then((res: any) => {
+        parameter.value = res.data
+        fixloading.value = false
+    })
+}
+//echarts
+const eacherslist: any = ref([1, 2, 3, 4])
+function getecharts() {
+    checloading.value = true
+    getAlgorithmDeviceCurve({ algorithmId: algorithmId.value, componentId: componentId.value, type: type.value }).then((res: any) => {
+        checloading.value = false
+        eacherslist.value = res.data
+        setTimeout(() => {
+            eacherslist.value.forEach((item: any, index: any) => {
+                drawEchart(item, index)
+            })
+        }, 100);
+
+    })
+}
+function getRandomColor(): string {
+    const hue = Math.floor(Math.random() * 360); // 色相 0~359
+    const saturation = 70 + Math.floor(Math.random() * 20); // 饱和度 70~90%
+    const lightness = 50 + Math.floor(Math.random() * 10); // 亮度 50~60%
+
+    return `hsl(${hue}, ${saturation}%, ${lightness}%)`;
+}
+function drawEchart(item: any, index: any) {
+    // 生成随机颜色
+    const randomColor = getRandomColor();
+
+    let myChart = echarts.init(document.getElementById("deviceEachers" + index) as HTMLDivElement);
+    myChart.setOption({
+        tooltip: {
+            trigger: 'axis'
+        },
+        legend: {
+            data: [item.series[0].name],
+            textStyle: { color: randomColor, fontSize: 14 }
+        },
+        grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            top: '18%',
+            containLabel: true,
+            borderColor: randomColor
+        },
+        xAxis: item.xAxis,
+        yAxis: item.yAxis,
+        series: item.series.map((series: any) => ({
+            ...series,
+            itemStyle: { color: randomColor }
+        }))
+    });
+}
+//fenxi
+const checloading = ref(false)
+const fixloading = ref(false)
+const fenloading = ref(false)
+const fenList: any = ref([])
+function getfenList() {
+    fenloading.value = true
+    getAlgorithmParamsNameList({ algorithmId: algorithmId.value, componentId: componentId.value }).then((res: any) => {
+        fenList.value = res.data
+        fenloading.value = false
+    })
+
+}
+const canshuList: any = ref()
+const mapList: any = ref()
+function analysis() {
+    fenloading.value = true
+    callAlgorithmAnalyse({ id: algorithmId.value, componentId: componentId.value }).then((res: any) => {
+        fenloading.value = false
+        if (res.code == 1) {
+            actionloading.value = false
+        } else {
+            ElMessage.success('分析成功')
+            comainName.value = res.data.desc
+            mapList.value = res.data.mapList
+            canshuList.value = res.data.result.description
+            getovercanshu()
+            getaction()
+        }
+
+
+    })
+}
+function getovercanshu() {
+    mapList.value.forEach((item: any) => {
+        fenList.value.forEach((items: any) => {
+            if (item.paramId == items.id) {
+                items.paramValue = item.paramValue
+            }
+        })
+    })
+}
+//故障分析
+const fault = ref(false)
+function fenfault() {
+    fault.value = true
+    canshuList.value = ''
+    actionData.value = ''
+    gatdata()
+    analysis()
+    actionloading.value = true
+}
+//分析记录
+const record = ref(false)
+const recordData = ref([])
+const recordloading = ref(false)
+const recordtotal = ref(0)
+const detaall: any = ref([])
+const recordform = ref({
+    size: 20,
+    current: 1,
+    startDate: '',
+    endDate: ''
+})
+function gettoday() {
+    // 获取今天0点
+    let startTime = dayjs().startOf('day').format('YYYY-MM-DD HH:mm:ss')
+    // 获取当前时间
+    let endTime = dayjs().format('YYYY-MM-DD HH:mm:ss')
+    detaall.value[0] = startTime
+    detaall.value[1] = endTime
+    getrecorddata()
+}
+function analysisRecord() {
+    record.value = true
+    gettoday()
+
+
+}
+function getrecorddata() {
+    if (detaall.value) {
+        recordform.value.startDate = detaall.value[0]
+        recordform.value.endDate = detaall.value[1]
+    } else {
+        recordform.value.startDate = ''
+        recordform.value.endDate = ''
+    }
+    recordloading.value = true
+    getAlgorithmLogsPage(recordform.value).then((res: any) => {
+        if (res.code == 0) {
+            recordData.value = res.data.records
+            recordtotal.value = res.data.total
+            recordform.value.size = res.data.size
+            recordform.value.current = res.data.current
+            recordloading.value = false
+        }
+    })
+}
+//生成处理方案
+
+const actionData = ref('')
+const actionloading = ref(false)
+function getaction() {
+
+    axios.get(userStore.pythonUrl + '/application/' + userStore.application_id + '/chat/open', {
+        headers: {
+            'AUTHORIZATION': 'application-2f942bee58ee12591b4a47deebd5b71b'
+        }
+    }).then((res: any) => {
+        const object = ref(
+            {
+                message: comainName.value + canshuList.value,
+                re_chat: false,
+                stream: false,
+            }
+        )
+        axios.post(userStore.pythonUrl + '/application/chat_message/' + res.data.data, object.value, {
+            headers: {
+                'AUTHORIZATION': 'application-2f942bee58ee12591b4a47deebd5b71b'
+            }
+        }).then((res: any) => {
+            actionloading.value = false
+            actionData.value = res.data.data.content
+            // console.log(res.data)
+        })
+    })
+}
+const type = ref(1)
+function changeType(val: any) {
+    type.value = val
+    getecharts()
+}
+//控制行变色
+const tableRowClassName = ({
+    row,
+    rowIndex,
+}: {
+    row: any
+    rowIndex: number
+}) => {
+    if (rowIndex % 2 === 0) {
+        return 'warning-row'
+    } else if (rowIndex % 2 === 1) {
+        return 'success-row'
+    }
+    return ''
+}
+const deviceId = ref('')
+const channelId = ref('')
+const urls = ref('')
+const videofmp4 = ref('')
+function onSubmit(row: any) {
+    deviceId.value = row.patroldevice_code
+    channelId.value = row.patroldevice_channelcode
+    axios.get(userStore.webApiMonitorUrl + '/api/play/start/' + row.patroldevice_code + '/' + row.patroldevice_channelcode, {}).then((res: any) => {
+        if (res.data.data != undefined) {
+            urls.value = res.data.data.ws_flv
+            videofmp4.value = res.data.data.fmp4
+            presetPosition(130, row.patroldevice_pos)
+        }
+    }).catch(function (error: any) {
+    })
+
+}
+function presetPosition(cmdCode: any, presetPos: any) { // 预置位操作 ---设置、删除、调用
+
+    axios.get(userStore.webApiBaseUrl + '/basedata/substation-patroldevice/isWorkingOfPatrolDevice?stationcode=' + userStore.stationCode + "&devicecode=" + deviceId.value, {}).then((res: any) => {
+        if (res.data.data == "0") {
+            axios.post(userStore.webApiMonitorUrl + '/api/ptz/front_end_command/' + deviceId.value + '/' + channelId.value + '?cmdCode=' + cmdCode + '&parameter1=0&parameter2=' + presetPos + '&combindCode2=0', {}).then((res: any) => { })
+        }
+    })
+}
+</script>
+<template>
+    <div class="faulttemplate-box">
+        <aside id="silderLeft">
+            <div class="tree_title">
+                <img src="@/assets/navigation/ty_bq.png" alt="">
+                <div>算法分类</div>
+            </div>
+            <el-input v-model="algorithmClassName" clearable placeholder="请输入名称" @change="init"
+                style="width:100%;margin-top: 10px;" class="videomonitor-input">
+                <template #suffix>
+                    <img src="@/assets/videoimg/u2937.png" style="cursor:pointer ;" @click="init">
+                </template>
+            </el-input>
+            <el-tree v-loading="treeloading" ref="treeRef" node-key="id" :data="treeData" :highlight-current="true"
+                :props="defaultProps" :expand-on-click-node="false" @node-click="handleNodeClick"
+                style="height: calc(80vh); overflow: auto;margin-top: 10px;">
+            </el-tree>
+            <div class="moveBtn" v-move>
+                <div class="moveBtn-line"></div>
+            </div>
+        </aside>
+        <section class="silderRight1">
+            <div class="right_top" v-loading="mainloading">
+                <div class="top_right">
+                    <div class="tree_title">
+                        <img src="@/assets/navigation/ty_bq.png" alt="">
+                        <div>设置基本信息</div>
+                    </div>
+                    <div class="top_contont">
+                        <div class="top_contont_one">
+                            <div class="top_qian">设备名称</div>
+                            <div class="top_jou">{{ mainarr.mainDeviceName }}</div>
+                        </div>
+                        <div class="top_contont_one">
+                            <div class="top_qian">设备类型</div>
+                            <div class="top_jou">{{ currency(EquipmentType, mainarr.deviceType) }}</div>
+                        </div>
+                        <div class="top_contont_one">
+                            <div class="top_qian">出厂寿命</div>
+                            <div class="top_jou">{{ mainarr.factoryLifespan }}</div>
+                        </div>
+                        <div class="top_contont_one">
+                            <div class="top_qian">运行天数</div>
+                            <div class="top_jou">{{ mainarr.runTime }}</div>
+                        </div>
+                        <div class="top_contont_one">
+                            <div class="top_qian">设备区域</div>
+                            <div class="top_jou">{{ mainarr.areaName }}</div>
+                        </div>
+                    </div>
+                </div>
+                <div class="top_center">
+                    <div class="tree_title">
+                        <img src="@/assets/navigation/ty_bq.png" alt="">
+                        <div>设备三维图</div>
+                    </div>
+                    <!-- riis-web/src/assets/point/weitu.svg -->
+                    <div class="topcenter">
+                        <el-image v-if="mainarr.fileUrl" style="width: 350px; height: 200px"
+                            :src="userStore.webApiBaseUrl + '/mainDevice/' + mainarr.fileUrl" :zoom-rate="1.2"
+                            :max-scale="7" :min-scale="0.2"
+                            :preview-src-list="[userStore.webApiBaseUrl + '/mainDevice/' + mainarr.fileUrl]"
+                            show-progress :initial-index="4" fit="cover" />
+                        <div class="top_one" v-else>
+                            <img src="@/assets/point/weitu.svg" alt="">
+                            <div>暂无图片</div>
+                        </div>
+                    </div>
+                </div>
+                <div class="top_center">
+                    <div class="tree_title">
+                        <img src="@/assets/navigation/ty_bq.png" alt="">
+                        <div>实时画面</div>
+                    </div>
+                    <div class="topcenter">
+                        <JessibucaPlayer v-if="urls" :_uid="33" ref="jessibuca" :visible.sync="true" :videoUrl="urls"
+                            :videofmp4="videofmp4" height="100px" :hasAudio="true" fluent autoplay live>
+                        </JessibucaPlayer>
+                        <div class="top_one" v-else>
+                            <img src="@/assets/point/weitu.svg" alt="">
+                            <div>暂无视频</div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="right_center" v-loading="checloading"
+                :style="parameter.length > 0 ? 'height: 50vh;' : 'height: 60vh;margin-bottom:0px;'">
+                <div style="display: flex;justify-content: space-between;align-items: center;">
+                    <div class="tree_title">
+                        <img src="@/assets/navigation/ty_bq.png" alt="">
+                        <div>信号/点位折线图</div>
+                        <div class="selectdata">
+                            <div :class="type == 1 ? 'select' : ''" @click="changeType(1)">近一小时</div>
+                            <div :class="type == 2 ? 'select' : ''" @click="changeType(2)">近一天</div>
+                        </div>
+                    </div>
+                    <el-button style="margin-left: 10px;" @click="fenfault()" class="searchButton">实时故障分析</el-button>
+                    <el-button style="margin-left: 10px;" @click="analysisRecord()"
+                        class="searchButton">分析记录</el-button>
+                </div>
+
+                <el-scrollbar :height="parameter.length > 0 ? '40vh' : '48vh'">
+                    <div class="echarts_box">
+                        <div v-for="(item, index) in eacherslist" :id="'deviceEachers' + index"
+                            :style="{ width: '100%', height: '160px' }"></div>
+                    </div>
+                </el-scrollbar>
+            </div>
+            <div class="right_yop" v-loading="fixloading" v-if="parameter.length > 0">
+                <div class="tree_title">
+                    <img src="@/assets/navigation/ty_bq.png" alt="">
+                    <div>固定参数</div>
+                </div>
+                <el-scrollbar height="60px">
+                    <div class="fixed_params">
+                        <div v-for="item in parameter" class="fixed_params_item">
+                            <div>{{ item.paramName }}：<span>{{ item.paramValue }}</span></div>
+                        </div>
+                    </div>
+                </el-scrollbar>
+            </div>
+        </section>
+        <Eldialog v-model="fault" :close-on-click-modal="false" @before-close="fault = false" :title="'实时故障分析'"
+            append-to-body width="1100px" draggable>
+            <template v-slot:PopFrameContent>
+                <div class="tree_title" style="padding: 5px 0px ;">
+                    <img src="@/assets/navigation/ty_bq.png" alt="">
+                    <div>参数详情</div>
+                </div>
+                <div class="fixed_params" style="margin-bottom: 15px;">
+                    <div v-for="item in fenList" class="fixed_params_item">
+                        <div>{{ item.paramName }}：<span>{{ item.paramValue ? item.paramValue : '--' }}</span></div>
+                    </div>
+                </div>
+                <div class="tree_title" style="padding: 5px 0px ;">
+                    <img src="@/assets/navigation/ty_bq.png" alt="">
+                    <div>分析结果</div>
+                </div>
+                <div class="fixed_params right_botom" style="margin-bottom: 15px;">{{ comainName }}<span>{{
+                    canshuList ? canshuList : '--' }}</span></div>
+                <div class="tree_title" style="padding: 5px 0px ;">
+                    <img src="@/assets/navigation/ty_bq.png" alt="">
+                    <div>处理方案</div>
+                </div>
+                <div class="fixed_params_right_botom">
+                    <el-scrollbar height="400px" v-loading="actionloading" style="margin-top: 10px;">
+                        <div v-if="actionData" v-html="processedActionData"></div>
+                    </el-scrollbar>
+                </div>
+            </template>
+        </Eldialog>
+        <Eldialog v-model="record" :close-on-click-modal="false" @before-close="record = false" :title="'分析记录'"
+            append-to-body width="1600px" draggable>
+            <template v-slot:PopFrameContent>
+                <div class="cont_top_left">
+                    <div style="width: 400px;">
+                        <el-date-picker v-model="detaall" type="datetimerange" start-placeholder="开始时间"
+                            value-format="YYYY-MM-DD HH:mm:ss" end-placeholder="结束时间" @change="getrecorddata()" />
+                    </div>
+                    <el-button style="margin-left: 10px;" @click="getrecorddata()" class="searchButton">搜索</el-button>
+                </div>
+                <el-table :data="recordData" :row-class-name="tableRowClassName" class="PatrolMonitoring"
+                    v-loading="recordloading" element-loading-background="rgb(11, 40, 34)" highlight-current-row
+                    style="width: 99%;margin:auto;position: relative;margin-top: 15px; height:calc(70vh); overflow: auto "
+                    :header-cell-style="{ background: '#002b6a', color: '#B5D7FF', height: '50px' }">
+                    <el-table-column type="index" label="序号" width="40px" align="center" />
+                    <el-table-column property="stationName" width="140px" label="变电站名称" />
+                    <el-table-column property="areaName" width="120px" label="区域名称" />
+                    <el-table-column property="bayName" width="120px" label="间隔名称" />
+                    <el-table-column property="mainDeviceName" width="140px" label="主设备名称" />
+                    <el-table-column property="componentName" width="100px" label="部件名称" />
+                    <el-table-column property="paramsValue" label="参数详情" />
+                    <el-table-column property="description" width="140px" label="分析结果" />
+                    <el-table-column property="analysisTime" width="180px" label="分析时间" align="center" />
+                </el-table>
+                <div style="width:100%;display:flex;align-items:center;margin-top:10px;">
+                    <Page style="margin:0 auto ;" :total="recordtotal" v-model:size="recordform.size" :jumper="'hide'"
+                        v-model:current="recordform.current" @pagination="getrecorddata()"></Page>
+                </div>
+            </template>
+        </Eldialog>
+    </div>
+</template>
+
+<style scoped lang="scss">
+.selectdata {
+    display: flex;
+    align-items: center;
+    color: #fff;
+    font-size: 14px;
+
+    div {
+        padding: 3px 5px;
+        border: 1px solid #0099ffa2;
+        margin-left: 10px;
+        border-radius: 5px;
+        cursor: pointer;
+    }
+
+    .select {
+        background-color: #004e978a;
+        color: #0099ff;
+        border: 1px solid #0099ff;
+    }
+}
+
+.silderLeft-default {
+    :deep(.el-tree-node__label) {
+        font-size: 16px !important;
+    }
+}
+
+.faulttemplate-box {
+    height: 100%;
+    display: flex;
+    display: -webkit-flex;
+    background-color: #f2f4f900;
+    padding: 15px 15px 0px 15px;
+
+}
+
+.tree_title {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    font-size: 16px;
+    color: #fff;
+    font-weight: bold;
+
+
+    img {
+        margin-right: 10px;
+    }
+}
+
+#silderLeft {
+    width: 300px;
+    padding: 10px;
+    box-sizing: border-box;
+    // border-radius: 3px;
+    position: relative;
+    background: url(@/assets/navigation/ty_260x988.png);
+    background-size: 100% 100%;
+
+    &:hover {
+        .moveBtn {
+            opacity: 1;
+        }
+    }
+
+
+}
+
+.fixed_params_right_botom {
+    :deep(.el-scrollbar__view) {
+        color: #e6e6e6;
+        line-height: 1.8;
+        padding: 15px;
+
+        h3 {
+            color: #409EFF;
+            margin: 20px 0 10px;
+            font-size: 18px;
+            border-left: 4px solid #67C23A;
+            padding-left: 10px;
+        }
+
+        strong {
+            color: #E6A23C;
+        }
+
+        ul {
+            list-style: square inside;
+            margin: 10px 0;
+
+            li {
+                margin: 8px 0;
+            }
+        }
+
+        hr {
+            margin: 20px 0;
+            border: 0;
+            border-top: 1px solid #606266;
+        }
+    }
+}
+
+.cont_top_left {
+    display: flex;
+    align-items: center;
+}
+
+/* 拖动条 */
+.moveBtn {
+    height: 100%;
+    width: 15px;
+    padding: 0 6px;
+    opacity: 0;
+    position: absolute;
+    right: -15px;
+    top: 0;
+}
+
+.moveBtn-line {
+    width: 100%;
+    height: 100%;
+    cursor: col-resize;
+    user-select: none;
+    background-color: #60bfff;
+}
+
+.fixed_params {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    font-family: 'Arial Normal', 'Arial';
+    font-weight: 400;
+    color: #FFFFFF;
+    font-size: 14px;
+
+    .fixed_params_item {
+        margin-right: 10px;
+
+        span {
+            font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
+            font-weight: 700;
+            font-size: 18px;
+            color: #00FFFF
+        }
+    }
+}
+
+.right_botom {
+    width: 100%;
+    font-family: 'Arial Normal', 'Arial';
+    font-weight: 700;
+    font-style: normal;
+    font-size: 24px;
+    color: #FFFFFF;
+
+    span {
+        font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
+        font-weight: 700;
+        font-style: normal;
+        font-size: 24px;
+        letter-spacing: normal;
+        color: #009900;
+    }
+}
+
+.silderRight1 {
+    flex: 1;
+    width: 100%;
+    height: calc(90vh);
+    overflow: auto;
+    // border-radius: 3px;
+    box-sizing: border-box;
+    margin-left: 15px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: space-between;
+
+    .right_top {
+        width: 100%;
+        height: 260px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        // border: 1px solid red;
+        .top_right {
+            width: 780px;
+            height: 260px;
+            background: url(@/assets/navigation/0904.png);
+            background-size: 100% 100%;
+            padding: 13px;
+            box-sizing: border-box;
+
+            .top_contont {
+                width: 100%;
+                border-bottom: 1px solid #00387d;
+                border-right: 1px solid #00387d;
+                margin-top: 10px;
+
+                .top_contont_one {
+                    width: 100%;
+                    display: flex;
+                    align-items: center;
+                    font-family: 'Arial Normal', 'Arial';
+                    font-weight: 400;
+                    font-style: normal;
+                    letter-spacing: normal;
+                    font-size: 14px;
+
+                    text-align: left;
+
+                    .top_qian {
+                        padding: 10px;
+                        width: 30%;
+                        height: 40px;
+                        border-top: 1px solid #00387d;
+                        border-left: 1px solid #00387d;
+                        color: #B5D7FF;
+                        background-color: #002562;
+                    }
+
+                    .top_jou {
+                        padding: 10px;
+                        width: 70%;
+                        height: 40px;
+                        border-top: 1px solid #00387d;
+                        border-left: 1px solid #00387d;
+                        color: #fff;
+                    }
+                }
+            }
+        }
+
+        .top_center {
+            width: 380px;
+            height: 260px;
+            background: url(@/assets/navigation/sy_qxk.png);
+            background-size: 100% 100%;
+            padding: 15px;
+            box-sizing: border-box;
+
+            .topcenter {
+                margin-top: 10px;
+                width: 350px;
+                height: 200px;
+
+                // border: 1px solid red;
+                .top_one {
+                    width: 100%;
+                    height: 200px;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    justify-content: center;
+
+                    div {
+                        font-family: 'Arial Normal', 'Arial';
+                        font-weight: 400;
+                        font-style: normal;
+                        font-size: 20px;
+                        margin-top: 10px;
+                        color: #B5D7FF;
+                    }
+
+                }
+            }
+        }
+    }
+
+    .right_yop {
+        width: 100%;
+        height: 110px;
+        box-sizing: border-box;
+        padding: 15px;
+        background: url(@/assets/navigation/110tu.png);
+        background-size: 100% 100%;
+
+        // margin-bottom: 15px;
+        :deep(.el-scrollbar) {
+            height: auto !important;
+        }
+
+
+    }
+
+    .right_center {
+        width: 100%;
+        // height: calc(77vh);
+        margin: 15px 0px;
+        box-sizing: border-box;
+        padding: 15px;
+        background: url(@/assets/navigation/sw1.png);
+        background-size: 100% 100%;
+
+        :deep(.el-scrollbar) {
+            height: auto !important;
+        }
+
+        .echarts_box {
+            width: 100%;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            margin-top: 10px;
+        }
+    }
+
+    .right_bottom {
+        width: 100%;
+        height: 220px;
+        box-sizing: border-box;
+        padding: 15px;
+        background: url(@/assets/navigation/sw.png);
+        background-size: 100% 100%;
+
+
+
+
+
+        :deep(.el-scrollbar) {
+            height: 80px !important;
+        }
+    }
+
+}
+</style>