| | |
| | | <template> |
| | | <div class="body_box"> |
| | | <!-- 进线屏监控 --> |
| | | <div class="tipTitle">开关柜监控</div> |
| | | <div class="tipTitle">进线屏监控</div> |
| | | <div class="left_Box"> |
| | | |
| | | <div class="diagram-content"> |
| | |
| | | <el-form-item label="负载状态:"> |
| | | <el-input size="mini" v-model="formData.thisInfo.fzzt" style="width:160px"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="大功率整流电源:"> |
| | | <!-- <el-form-item label="大功率整流电源:"> |
| | | <el-input size="mini" v-model="formData.thisInfo.dglzldy" style="width:160px"></el-input> |
| | | </el-form-item> |
| | | </el-form-item> --> |
| | | </el-form> |
| | | </div> |
| | | <div class="content_cent"> |
| | |
| | | <div class="clear"></div> |
| | | </div> |
| | | <div class="content_bottom"> |
| | | <p class="title_into">告警情况</p> |
| | | <p class="title_into">报警情况</p> |
| | | <!-- 表单 --> |
| | | <div class="flex-page-content"> |
| | | <div class="batteryrHistoryquery" style="width: 100%;height: 100%;"> |
| | | <el-table :data="tableData" style="width: 100%" max-height="145px"> |
| | | <el-table-column prop="date" label="告警时间" width="180"></el-table-column> |
| | | <el-table-column prop="name" label="告警名称" width="180"></el-table-column> |
| | | <el-table-column prop="address" label="告警描述"></el-table-column> |
| | | <el-table-column prop="date" label="报警时间" width="180"></el-table-column> |
| | | <el-table-column prop="name" label="报警名称" width="180"></el-table-column> |
| | | <el-table-column prop="address" label="报警描述"></el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | |
| | | import * as echarts from 'echarts'; |
| | | // import ContentBox from "@/components/ContentBox"; |
| | | import gridCircuitDiagram from '@/pages/monitoring/js/gridCircuitDiagram' |
| | | // import diagramStates from '@/pages/home/topoGraphdiagram/js/diagramStates' |
| | | import diagramStates from '@/pages/monitoring/js/diagramStates' |
| | | let diagram; |
| | | export default { |
| | | chart: {}, |
| | |
| | | mounted() { |
| | | let self = this; |
| | | diagram = gridCircuitDiagram(this.$refs.static, this.$refs.flush); |
| | | diagramStates(diagram, 'run1'); |
| | | self.initEcharts(); |
| | | self.openSocket(); |
| | | }, |
| | |
| | | if(result.code == 1){ |
| | | this.isOpen = true; |
| | | // 表单赋值 |
| | | self.formData.thisInfo.cxFivePanelCurr = result.data.screenRTList[0].panelCurr + "A"; |
| | | self.formData.thisInfo.cxFivePanelCurr = result.data.screenRTList[0].panelCurr + "V/AC"; |
| | | self.echartsList[0].echartsCurr.push(result.data.screenRTList[0].panelCurr); |
| | | |
| | | self.formData.thisInfo.cxFivePanelVol = result.data.screenRTList[0].panelVol + "V"; |
| | | self.formData.thisInfo.cxFivePanelVol = result.data.screenRTList[0].panelVol + "A"; |
| | | self.echartsList[0].echartsVol.push(result.data.screenRTList[0].panelVol); |
| | | |
| | | self.formData.thisInfo.cxOnePanelVol = result.data.screenRTList[2].panelVol + "V"; |
| | | self.formData.thisInfo.cxOnePanelVol = result.data.screenRTList[2].panelVol + "A"; |
| | | self.echartsList[1].echartsCurr.push(result.data.screenRTList[2].panelCurr); |
| | | self.echartsList[1].echartsVol.push(result.data.screenRTList[2].panelVol); |
| | | |
| | | self.formData.thisInfo.cxTwoPanelVol = result.data.screenRTList[3].panelVol + "V"; |
| | | self.formData.thisInfo.cxTwoPanelVol = result.data.screenRTList[3].panelVol + "A"; |
| | | self.echartsList[2].echartsCurr.push(result.data.screenRTList[3].panelCurr); |
| | | self.echartsList[2].echartsVol.push(result.data.screenRTList[3].panelVol); |
| | | |
| | |
| | | |
| | | |
| | | |
| | | self.formData.thisInfo.volA = result.data.dcMainBoard.volA + "V"; |
| | | self.formData.thisInfo.volB = result.data.dcMainBoard.volB + "V"; |
| | | self.formData.thisInfo.volA = result.data.dcMainBoard.volA + "V/AC"; |
| | | self.formData.thisInfo.volB = result.data.dcMainBoard.volB + "V/AC"; |
| | | self.formData.thisInfo.currA = result.data.dcMainBoard.currA + "A"; |
| | | self.formData.thisInfo.currB = result.data.dcMainBoard.currB + "A"; |
| | | } |
| | |
| | | } |
| | | self.setOption(item,true); |
| | | }); |
| | | console.log(result) |
| | | }, |
| | | getTime(){ |
| | | var myDate = new Date(); //实例一个时间对象; |
| | |
| | | // 关闭websocket |
| | | if (this.isOpen) { |
| | | // 打印关闭信息 |
| | | console.log("关闭电源实时告警WebSocket"); |
| | | console.log("关闭电源实时报警WebSocket"); |
| | | this.socket.close(); |
| | | } |
| | | }, |
| | |
| | | // xAxisIndex: 0, |
| | | yAxisIndex: 0,//使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用。 |
| | | type: 'line', |
| | | symbol: 'none', |
| | | step: false, |
| | | smooth: true |
| | | },{ |
| | |
| | | // xAxisIndex: 0, |
| | | yAxisIndex: 1,//使用的 y 轴的 index,在单个图表实例中存在多个 y轴的时候有用。 |
| | | type: 'line', |
| | | symbol: 'none', |
| | | // step: false, |
| | | smooth: true |
| | | },] |