Merge remote-tracking branch 'origin/master'
@ -7,4 +7,4 @@ VITE_APP_TITLE = '变电站远程智能巡视系统'
|
|||||||
VITE_APP_PORT = 3000
|
VITE_APP_PORT = 3000
|
||||||
VITE_APP_BASE_API = '/dev-api'
|
VITE_APP_BASE_API = '/dev-api'
|
||||||
VITE_APP_BASE_URL = 'http://192.168.1.20:18080'
|
VITE_APP_BASE_URL = 'http://192.168.1.20:18080'
|
||||||
VITE_APP_BASE_WS = 'ws://192.168.1.20:8070'
|
VITE_APP_BASE_WS = 'ws://192.168.1.20:8090'
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
window.webConfig = {
|
window.webConfig = {
|
||||||
"webApiBaseUrl": "http://192.168.1.38:8070/",
|
"webApiBaseUrl": "http://192.168.1.20:8090/",
|
||||||
"wsApiBaseUrl": "ws://192.168.1.38:8070/",
|
"wsApiBaseUrl": "ws://192.168.1.20:8090/",
|
||||||
"webApiMonitorUrl": "http://192.168.1.20:18080",
|
"webApiMonitorUrl": "http://192.168.1.20:18080",
|
||||||
"webSystemTitle":"标题"
|
"webSystemTitle":"标题"
|
||||||
}
|
}
|
24
riis-web/src/api/environmentalMonitoring/index.ts
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
import request from '@/utils/request';
|
||||||
|
// 查询环境设备
|
||||||
|
export function getWeatherLogPage(params:any){
|
||||||
|
return request({
|
||||||
|
url: '/basedata/weather-log/getWeatherLogPage' ,
|
||||||
|
method: 'get',
|
||||||
|
params:params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//分页查看主辅设备监控数据
|
||||||
|
export function getMainassistDeviceLogPage(params:any){
|
||||||
|
return request({
|
||||||
|
url: '/basedata/mainassist-device-log/getMainassistDeviceLogPage' ,
|
||||||
|
method: 'get',
|
||||||
|
params:params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
//发送数据召唤文件
|
||||||
|
export function sendDataCallFile(){
|
||||||
|
return request({
|
||||||
|
url: '/basedata/mainassist-device-log/sendDataCallFile' ,
|
||||||
|
method: 'post',
|
||||||
|
});
|
||||||
|
}
|
Before Width: | Height: | Size: 7.6 KiB After Width: | Height: | Size: 6.2 KiB |
Before Width: | Height: | Size: 8.2 KiB After Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 8.2 KiB After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 7.0 KiB After Width: | Height: | Size: 5.7 KiB |
Before Width: | Height: | Size: 7.3 KiB After Width: | Height: | Size: 5.9 KiB |
Before Width: | Height: | Size: 7.7 KiB After Width: | Height: | Size: 6.4 KiB |
BIN
riis-web/src/assets/navigation/hjjc_sj7.png
Normal file
After Width: | Height: | Size: 6.3 KiB |
BIN
riis-web/src/assets/navigation/hjjc_sj8.png
Normal file
After Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 774 B After Width: | Height: | Size: 699 B |
@ -859,3 +859,7 @@ input {
|
|||||||
.tox {
|
.tox {
|
||||||
z-index: 9999999 !important;
|
z-index: 9999999 !important;
|
||||||
}
|
}
|
||||||
|
.el-table__header-wrapper {
|
||||||
|
border-left: #0099ff 3px solid;
|
||||||
|
border-right: #0099ff 3px solid;
|
||||||
|
}
|
||||||
|
@ -0,0 +1,371 @@
|
|||||||
|
<script lang="ts">
|
||||||
|
export default {
|
||||||
|
name: "selfcheck",//系统主机自检
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { ref, onMounted, onBeforeUnmount, } from 'vue'
|
||||||
|
import Page from '@/components/Pagination/page.vue'
|
||||||
|
import { useUserStore } from '@/store/modules/user';
|
||||||
|
import { getWeatherLogList } from "@/api/home";
|
||||||
|
import { getWeatherLogPage} from "@/api/environmentalMonitoring";
|
||||||
|
import { getDeviceByType } from "@/api/device";
|
||||||
|
const userStore = useUserStore();
|
||||||
|
const tableData = ref([])
|
||||||
|
const treeloading = ref(false)
|
||||||
|
const total = ref()
|
||||||
|
//控制行变色
|
||||||
|
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 environment_params = ref({
|
||||||
|
current:1,
|
||||||
|
size:10,
|
||||||
|
startDate:'',
|
||||||
|
endDate:'',
|
||||||
|
patroldeviceName:'',
|
||||||
|
stationId:userStore.stationId,
|
||||||
|
})
|
||||||
|
const hutotal:any = ref('')
|
||||||
|
const environment_data = ref([])
|
||||||
|
// const treeloading = ref(false)
|
||||||
|
function getEnvironment() {
|
||||||
|
|
||||||
|
if(tableData.value){
|
||||||
|
environment_params.value.startDate = tableData.value[0]
|
||||||
|
environment_params.value.endDate = tableData.value[1]
|
||||||
|
}else{
|
||||||
|
environment_params.value.startDate = ''
|
||||||
|
environment_params.value.endDate = ''
|
||||||
|
}
|
||||||
|
getWeatherLogPage(environment_params.value).then((res: any) => {
|
||||||
|
environment_data.value = res.data.records
|
||||||
|
environment_params.value.size = res.data.size
|
||||||
|
environment_params.value.current = res.data.current
|
||||||
|
hutotal.value = res.data.total
|
||||||
|
})
|
||||||
|
}
|
||||||
|
function environmentReset(){
|
||||||
|
if( tableData.value){
|
||||||
|
tableData.value.length = 0
|
||||||
|
}
|
||||||
|
environment_params.value.patroldeviceName = ''
|
||||||
|
getEnvironment()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 环境WebSocket
|
||||||
|
const environment = ref()
|
||||||
|
const environmentInfo:any = ref({
|
||||||
|
temperature: "",
|
||||||
|
humidity: "",
|
||||||
|
rainfall: "",
|
||||||
|
windSpeed: "",
|
||||||
|
windDirection: "",
|
||||||
|
pressure: ""
|
||||||
|
})
|
||||||
|
const ws1 = new WebSocket(userStore.wsApiBaseUrl + '/websocket/vibe_run_data_' + userStore.userId);
|
||||||
|
function setupWebSocket() {
|
||||||
|
|
||||||
|
ws1.onopen = () => {
|
||||||
|
|
||||||
|
};
|
||||||
|
ws1.onerror = (error: any) => {
|
||||||
|
};
|
||||||
|
ws1.onmessage = (e: any) => {
|
||||||
|
|
||||||
|
if (e.data != 0) {
|
||||||
|
environment.value = JSON.parse(e.data)
|
||||||
|
if (environment.value.type == 1) {
|
||||||
|
environmentInfo.value.temperature = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 2) {
|
||||||
|
environmentInfo.value.humidity = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 3) {
|
||||||
|
environmentInfo.value.windSpeed = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 4) {
|
||||||
|
environmentInfo.value.rainfall = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 5) {
|
||||||
|
environmentInfo.value.windDirection = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 6) {
|
||||||
|
environmentInfo.value.pressure = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 7) {
|
||||||
|
environmentInfo.value.oxygen = environment.value.value
|
||||||
|
}
|
||||||
|
if (environment.value.type == 8) {
|
||||||
|
environmentInfo.value.sf6 = environment.value.value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
ws1.onclose = () => {
|
||||||
|
};
|
||||||
|
|
||||||
|
}
|
||||||
|
function getInit() {
|
||||||
|
let params = {
|
||||||
|
stationId: userStore.stationId
|
||||||
|
}
|
||||||
|
getWeatherLogList(params).then((res: any) => {
|
||||||
|
|
||||||
|
environmentInfo.value = res.data
|
||||||
|
if (!res.data.temperature ) {
|
||||||
|
environmentInfo.value.temperature = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.humidity ) {
|
||||||
|
environmentInfo.value.humidity = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.rainfall ) {
|
||||||
|
environmentInfo.value.rainfall = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.windSpeed ) {
|
||||||
|
environmentInfo.value.windSpeed = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.windDirection ) {
|
||||||
|
environmentInfo.value.windDirection = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.pressure) {
|
||||||
|
environmentInfo.value.pressure = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.oxygen) {
|
||||||
|
environmentInfo.value.oxygen = "无"
|
||||||
|
}
|
||||||
|
if (!res.data.sf6) {
|
||||||
|
environmentInfo.value.sf6 = "无"
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
onMounted(() => {
|
||||||
|
getInit()
|
||||||
|
setupWebSocket()
|
||||||
|
getEnvironment()
|
||||||
|
gettype()
|
||||||
|
});
|
||||||
|
onBeforeUnmount(() => {
|
||||||
|
if (ws1 != null) {
|
||||||
|
ws1.close()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
function currency(list: any, itemcode: any) {
|
||||||
|
let dictname = ''
|
||||||
|
list.forEach((element: any) => {
|
||||||
|
if (element.itemcode == itemcode) {
|
||||||
|
dictname = element.dictname
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return dictname
|
||||||
|
}
|
||||||
|
const EquipmentType= ref([])
|
||||||
|
function gettype(){
|
||||||
|
getDeviceByType({ dictcode: 'EnvironmentType' }).then((res: any) => {
|
||||||
|
EquipmentType.value = res.data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div class="all_box">
|
||||||
|
<div class="img_box">
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj1.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">空气温度</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.temperature }}<span class="img_unit"> ℃</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj2.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">空气湿度</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.humidity }} <span class="img_unit"> RH</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj3.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">降雨量</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.rainfall }} <span class="img_unit"> mm</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj4.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">风速</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.windSpeed }} <span class="img_unit"> 级</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj5.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">风向</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.windDirection }} </div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj6.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">气压</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.pressure }} <span class="img_unit"> hpa</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj7.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">氧气</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.oxygen }} <span class="img_unit"> %</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="img_box_one">
|
||||||
|
<div><img src="@/assets/navigation/hjjc_sj8.png" alt=""></div>
|
||||||
|
<div class="img_box_nei">
|
||||||
|
<div class="img_text1">SF6</div>
|
||||||
|
<div class="img_text2">{{ environmentInfo.sf6 }} <span class="img_unit"> %</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="environment_table">
|
||||||
|
<div class="table-title">
|
||||||
|
<div class="table_left">
|
||||||
|
<div class="screenHomepage">
|
||||||
|
<el-input v-model="environment_params.patroldeviceName" placeholder="请输入设备名称" clearable @change="getEnvironment()"
|
||||||
|
style="margin-right:15px ;width: 200px;" />
|
||||||
|
<el-date-picker class="screenHomepage" popper-class="elDatePicker" @change="getEnvironment()"
|
||||||
|
style="width: 300px; margin-right: 10px;" v-model="tableData" type="daterange"
|
||||||
|
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
|
||||||
|
value-format="YYYY-MM-DD" format="YYYY-MM-DD" />
|
||||||
|
</div>
|
||||||
|
<el-button class="searchButton" @click="getEnvironment()">搜索</el-button>
|
||||||
|
<el-button class="searchButton" @click="environmentReset()">重置</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-table :data="environment_data" :row-class-name="tableRowClassName" class="PatrolMonitoring"
|
||||||
|
v-loading="treeloading" element-loading-background="rgb(11, 40, 34)" highlight-current-row
|
||||||
|
style="width: 100%;margin:auto;position: relative;margin-top: 15px; height:calc(56vh); overflow: auto "
|
||||||
|
:header-cell-style="{ background: '#253b51', color: '#b5d7ff', height: '50px' }">
|
||||||
|
<el-table-column type="index" label="序号" width="80px" align="center" />
|
||||||
|
<el-table-column property="patroldeviceCode" label="设备编号" align="center" />
|
||||||
|
<el-table-column property="patroldeviceName" label="设备名称" align="center" />
|
||||||
|
<el-table-column property="type" label="环境 类型" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ currency(EquipmentType, scope.row.type) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column property="taskName" label="监测数值" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<div v-if="scope.row.value">{{ scope.row.value }}{{scope.row.unit}}</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column property="time" label="监测时间" align="center" />
|
||||||
|
</el-table>
|
||||||
|
<div style="width:100%;display:flex;align-items:center;margin-top:10px;">
|
||||||
|
<Page style="margin:0 auto ;" :total="hutotal" v-model:size="environment_params.size" :jumper="'hide'"
|
||||||
|
v-model:current="environment_params.current" @pagination="getEnvironment()"></Page>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.all_box {
|
||||||
|
width: 100%;
|
||||||
|
padding: 15px;
|
||||||
|
height: calc(91vh);
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.img_box {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin: 20px 0px;
|
||||||
|
|
||||||
|
.img_box_one {
|
||||||
|
width: 220px;
|
||||||
|
height: 150px;
|
||||||
|
background: url(@/assets/navigation/hjjc_sjbj.png) ;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
|
||||||
|
.img_box_nei {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
.img_text1 {
|
||||||
|
font-family: '微软雅黑';
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img_text2 {
|
||||||
|
font-family: '钉钉进步体 Bold', '钉钉进步体';
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 36px;
|
||||||
|
color: #00ffff;
|
||||||
|
|
||||||
|
.img_unit {
|
||||||
|
font-family: '钉钉进步体 Bold', '钉钉进步体';
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 18px;
|
||||||
|
color: rgba(255, 255, 255, 0.298039215686275);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.environment_table {
|
||||||
|
width: 1881px;
|
||||||
|
height: calc(69vh);
|
||||||
|
background: url(@/assets/navigation/hjjc_BK.png) ;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
margin: 0 auto;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 15px;
|
||||||
|
|
||||||
|
.table-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.table_left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.environment_table1{
|
||||||
|
height: calc(83vh);
|
||||||
|
background: url(@/assets/station_2/hjjc_9.png) no-repeat;
|
||||||
|
margin-top:20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
@ -109,7 +109,7 @@
|
|||||||
<div class="img_txt"> <img src=@/assets/navigation/ty_bq.png alt=""><span>装置状态信息</span></div>
|
<div class="img_txt"> <img src=@/assets/navigation/ty_bq.png alt=""><span>装置状态信息</span></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_box">
|
<div class="two_box">
|
||||||
<div class="two_box_all">
|
<div class="two_box_all" v-if="patrolInfo.camera">
|
||||||
<div class="two_img"><img src="@/assets/sytlechange/two-left-1.svg" alt=""></div>
|
<div class="two_img"><img src="@/assets/sytlechange/two-left-1.svg" alt=""></div>
|
||||||
<div class="two_body">
|
<div class="two_body">
|
||||||
<div class="two_text">
|
<div class="two_text">
|
||||||
@ -127,39 +127,39 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_box_all">
|
<div class="two_box_all" v-if="patrolInfo.voice">
|
||||||
<div class="two_img"><img src="@/assets/sytlechange/two-left-2.svg" alt=""></div>
|
<div class="two_img"><img src="@/assets/sytlechange/two-left-2.svg" alt=""></div>
|
||||||
<div class="two_body">
|
<div class="two_body">
|
||||||
<div class="two_text">
|
<div class="two_text">
|
||||||
<div class="two_text_one">
|
<div class="two_text_one">
|
||||||
<span class="one_one">声纹设备</span>
|
<span class="one_one">声纹设备</span>
|
||||||
<span class="one_two">50<span class="one_three">/100</span></span>
|
<span class="one_two">{{ patrolInfo.voice.online }}<span class="one_three">/{{ patrolInfo.voice.allCount }}</span></span>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_text_two">
|
<div class="two_text_two">
|
||||||
<span class="two_one">在线率:</span>
|
<span class="two_one">在线率:</span>
|
||||||
<span class="two_two">70%</span>
|
<span class="two_two">{{ patrolInfo.voice.onLineRate }}%</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_img_all">
|
<div class="two_img_all">
|
||||||
<el-progress style="width: 100%;" :percentage="50" />
|
<el-progress style="width: 100%;" :percentage="patrolInfo.voice.onLineRate" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_box_all">
|
<div class="two_box_all" v-if="patrolInfo.gateway">
|
||||||
<div class="two_img"><img src="@/assets/sytlechange/two-left-3.svg" alt=""></div>
|
<div class="two_img"><img src="@/assets/sytlechange/two-left-3.svg" alt=""></div>
|
||||||
<div class="two_body">
|
<div class="two_body">
|
||||||
<div class="two_text">
|
<div class="two_text">
|
||||||
<div class="two_text_one">
|
<div class="two_text_one">
|
||||||
<span class="one_one">网关机</span>
|
<span class="one_one">网关机</span>
|
||||||
<span class="one_two">50<span class="one_three">/100</span></span>
|
<span class="one_two">{{ patrolInfo.gateway.online }}<span class="one_three">/{{ patrolInfo.gateway.allCount }}</span></span>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_text_two">
|
<div class="two_text_two">
|
||||||
<span class="two_one">在线率:</span>
|
<span class="two_one">在线率:</span>
|
||||||
<span class="two_two">70%</span>
|
<span class="two_two">{{ patrolInfo.gateway.onLineRate }}%</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="two_img_all">
|
<div class="two_img_all">
|
||||||
<el-progress style="width: 100%;" :percentage="50" />
|
<el-progress style="width: 100%;" :percentage="patrolInfo.gateway.onLineRate" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -13,7 +13,8 @@ const userStore = useUserStore();
|
|||||||
const url = userStore.webApiBaseUrl;
|
const url = userStore.webApiBaseUrl;
|
||||||
function getInit() {
|
function getInit() {
|
||||||
let params = {
|
let params = {
|
||||||
id: props.alarminInfo.id
|
id: props.alarminInfo.id,
|
||||||
|
systemType:props.alarminInfo.systemType
|
||||||
}
|
}
|
||||||
//异常事件统计
|
//异常事件统计
|
||||||
getAlarmLogById(params).then((res: any) => {
|
getAlarmLogById(params).then((res: any) => {
|
||||||
@ -97,7 +98,7 @@ const num = ref(0)
|
|||||||
<div>
|
<div>
|
||||||
<div class="public-overlay">
|
<div class="public-overlay">
|
||||||
<div class="newexamination">
|
<div class="newexamination">
|
||||||
<div class="public-examination">
|
<div class="public-examination" :style="examinationInfo.systemType == '02'?'' : 'height: 520px;'" >
|
||||||
<img v-if="examinationInfo.checkFlag == 1" style="position:absolute;top: 0px;left: 0px;"
|
<img v-if="examinationInfo.checkFlag == 1" style="position:absolute;top: 0px;left: 0px;"
|
||||||
src="@/assets/giveanalarm/hecha.png" alt="">
|
src="@/assets/giveanalarm/hecha.png" alt="">
|
||||||
<img style="position:absolute;top: 15px;right: 20px;cursor:pointer;" src="@/assets/giveanalarm/x.png" alt=""
|
<img style="position:absolute;top: 15px;right: 20px;cursor:pointer;" src="@/assets/giveanalarm/x.png" alt=""
|
||||||
@ -108,24 +109,32 @@ const num = ref(0)
|
|||||||
<div class="public-details-title">告警信息{{ examinationInfo.status }}</div>
|
<div class="public-details-title">告警信息{{ examinationInfo.status }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div style="width:370px;height: 250px;">
|
<div :style="examinationInfo.systemType == '02'?'width:370px;height: 250px;' : 'width:370px;height: 150px;'">
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'">
|
||||||
<div class="public-details-name">点位名称:</div>
|
<div class="public-details-name">点位名称:</div>
|
||||||
<div>{{ examinationInfo.bayName }}</div>
|
<div>{{ examinationInfo.bayName }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '01'">
|
||||||
|
<div class="public-details-name">信号名称:</div>
|
||||||
|
<div>{{ examinationInfo.signalName }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'" >
|
||||||
<div class="public-details-name">设备名称:</div>
|
<div class="public-details-name">设备名称:</div>
|
||||||
<div>{{ examinationInfo.patroldeviceName }}</div>
|
<div>{{ examinationInfo.patroldeviceName }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '01'" >
|
||||||
|
<div class="public-details-name">主设备名称:</div>
|
||||||
|
<div>{{ examinationInfo.mainDeviceName }}</div>
|
||||||
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent">
|
||||||
<div class="public-details-name">部件名称:</div>
|
<div class="public-details-name">部件名称:</div>
|
||||||
<div>{{ examinationInfo.componentName }}</div>
|
<div>{{ examinationInfo.componentName }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'">
|
||||||
<div class="public-details-name">告警来源:</div>
|
<div class="public-details-name">告警来源:</div>
|
||||||
<div>{{ currency(AlarmSourceList, examinationInfo.taskAlarmType) }}</div>
|
<div>{{ currency(AlarmSourceList, examinationInfo.taskAlarmType) }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'">
|
||||||
<div class="public-details-name">告警阈值:</div>
|
<div class="public-details-name">告警阈值:</div>
|
||||||
<span style="display:block;" >
|
<span style="display:block;" >
|
||||||
<span style="display: inline-block;width: 50%;text-align: left;"><span>预警:</span><span>{{
|
<span style="display: inline-block;width: 50%;text-align: left;"><span>预警:</span><span>{{
|
||||||
@ -145,10 +154,11 @@ const num = ref(0)
|
|||||||
|
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent">
|
||||||
<div class="public-details-name">告警时间:</div>
|
<div class="public-details-name">告警时间:</div>
|
||||||
<div>{{ examinationInfo.alarmDate }}</div>
|
<div v-if="examinationInfo.systemType == '02'" >{{ examinationInfo.alarmDate }}</div>
|
||||||
|
<div v-if="examinationInfo.systemType == '01'" >{{ examinationInfo.alarmTime }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="width:290px;height: 200px;">
|
<div v-if="examinationInfo.systemType == '02'" style="width:290px;height: 200px;">
|
||||||
<div style="width:100%;height:100%; position: relative;">
|
<div style="width:100%;height:100%; position: relative;">
|
||||||
<div title="查看图片" style="position: absolute;
|
<div title="查看图片" style="position: absolute;
|
||||||
right: 5px;
|
right: 5px;
|
||||||
@ -187,10 +197,14 @@ const num = ref(0)
|
|||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent">
|
||||||
<div class="public-details-name">告警描述:</div>
|
<div class="public-details-name">告警描述:</div>
|
||||||
<div :title="examinationInfo.content" style="height:63px;width: 560px;display: -webkit-box;
|
<div v-if="examinationInfo.systemType == '02'" :title="examinationInfo.content" style="height:63px;width: 560px;display: -webkit-box;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
-webkit-line-clamp: 3;
|
-webkit-line-clamp: 3;
|
||||||
overflow: hidden;">{{ examinationInfo.content }}</div>
|
overflow: hidden;">{{ examinationInfo.content }}</div>
|
||||||
|
<div v-if="examinationInfo.systemType == '01'" :title="examinationInfo.alarmMessage" style="height:63px;width: 560px;display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
overflow: hidden;">{{ examinationInfo.alarmMessage }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style="display:flex;align-items: center;">
|
<div style="display:flex;align-items: center;">
|
||||||
|
@ -162,7 +162,7 @@ const handleChange = (value: any) => {
|
|||||||
<img src="@/assets/giveanalarm/jg_wz.png" alt="" style="width:180px ;">
|
<img src="@/assets/giveanalarm/jg_wz.png" alt="" style="width:180px ;">
|
||||||
<div style="font-size: 60px; color: red;">[{{ examinationData.length }}]</div>
|
<div style="font-size: 60px; color: red;">[{{ examinationData.length }}]</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-examination">
|
<div class="public-examination" :style="examinationInfo.systemType == '02'?'' : 'height: 560px;'">
|
||||||
<img v-if="examinationInfo.checkFlag == 1" style="position:absolute;top: 0px;left: 0px;"
|
<img v-if="examinationInfo.checkFlag == 1" style="position:absolute;top: 0px;left: 0px;"
|
||||||
src="@/assets/giveanalarm/hecha.png" alt="">
|
src="@/assets/giveanalarm/hecha.png" alt="">
|
||||||
<img style="position:absolute;top: 15px;right: 20px;cursor:pointer;" src="@/assets/giveanalarm/x.png" alt=""
|
<img style="position:absolute;top: 15px;right: 20px;cursor:pointer;" src="@/assets/giveanalarm/x.png" alt=""
|
||||||
@ -195,24 +195,32 @@ const handleChange = (value: any) => {
|
|||||||
<div class="public-details-title">告警信息{{ examinationInfo.status }}</div>
|
<div class="public-details-title">告警信息{{ examinationInfo.status }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div style="width:370px;height: 250px;">
|
<div :style="examinationInfo.systemType == '02'?'width:370px;height: 250px;' : 'width:370px;height: 150px;'">
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'">
|
||||||
<div class="public-details-name">点位名称:</div>
|
<div class="public-details-name">点位名称:</div>
|
||||||
<div>{{ examinationInfo.bayName }}</div>
|
<div>{{ examinationInfo.bayName }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '01'">
|
||||||
|
<div class="public-details-name">信号名称:</div>
|
||||||
|
<div>{{ examinationInfo.signalName }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'" >
|
||||||
<div class="public-details-name">设备名称:</div>
|
<div class="public-details-name">设备名称:</div>
|
||||||
<div>{{ examinationInfo.patroldeviceName }}</div>
|
<div>{{ examinationInfo.patroldeviceName }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '01'" >
|
||||||
|
<div class="public-details-name">主设备名称:</div>
|
||||||
|
<div>{{ examinationInfo.mainDeviceName }}</div>
|
||||||
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent">
|
||||||
<div class="public-details-name">部件名称:</div>
|
<div class="public-details-name">部件名称:</div>
|
||||||
<div>{{ examinationInfo.componentName }}</div>
|
<div>{{ examinationInfo.componentName }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'">
|
||||||
<div class="public-details-name">告警来源:</div>
|
<div class="public-details-name">告警来源:</div>
|
||||||
<div>{{ currency(AlarmSourceList, examinationInfo.taskAlarmType) }}</div>
|
<div>{{ currency(AlarmSourceList, examinationInfo.taskAlarmType) }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent" v-if="examinationInfo.systemType == '02'">
|
||||||
<div class="public-details-name">告警阈值:</div>
|
<div class="public-details-name">告警阈值:</div>
|
||||||
<span style="display:block;" >
|
<span style="display:block;" >
|
||||||
<span style="display: inline-block;width: 50%;text-align: left;"><span>预警:</span><span>{{
|
<span style="display: inline-block;width: 50%;text-align: left;"><span>预警:</span><span>{{
|
||||||
@ -233,10 +241,11 @@ const handleChange = (value: any) => {
|
|||||||
|
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent">
|
||||||
<div class="public-details-name">告警时间:</div>
|
<div class="public-details-name">告警时间:</div>
|
||||||
<div>{{ examinationInfo.alarmDate }}</div>
|
<div v-if="examinationInfo.systemType == '02'" >{{ examinationInfo.alarmDate }}</div>
|
||||||
|
<div v-if="examinationInfo.systemType == '01'" >{{ examinationInfo.alarmTime }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="width:290px;height: 200px;">
|
<div style="width:290px;height: 200px;" v-if="examinationInfo.systemType == '02'">
|
||||||
<div style="width:100%;height:100%; position: relative;">
|
<div style="width:100%;height:100%; position: relative;">
|
||||||
<div title="查看图片" style="position: absolute;
|
<div title="查看图片" style="position: absolute;
|
||||||
right: 5px;
|
right: 5px;
|
||||||
@ -274,10 +283,14 @@ const handleChange = (value: any) => {
|
|||||||
</div>
|
</div>
|
||||||
<div class="public-details-conent">
|
<div class="public-details-conent">
|
||||||
<div class="public-details-name">告警描述:</div>
|
<div class="public-details-name">告警描述:</div>
|
||||||
<div :title="examinationInfo.content" style="height:63px;width: 560px;display: -webkit-box;
|
<div v-if="examinationInfo.systemType == '02'" :title="examinationInfo.content" style="height:63px;width: 560px;display: -webkit-box;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
-webkit-line-clamp: 3;
|
-webkit-line-clamp: 3;
|
||||||
overflow: hidden;">{{ examinationInfo.content }}</div>
|
overflow: hidden;">{{ examinationInfo.content }}</div>
|
||||||
|
<div v-if="examinationInfo.systemType == '01'" :title="examinationInfo.alarmMessage" style="height:63px;width: 560px;display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 3;
|
||||||
|
overflow: hidden;">{{ examinationInfo.alarmMessage }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div style="display:flex;align-items: center;">
|
<div style="display:flex;align-items: center;">
|
||||||
<div class="public-details-line"></div>
|
<div class="public-details-line"></div>
|
||||||
|
@ -15,6 +15,7 @@ function setupWebSocket() {
|
|||||||
};
|
};
|
||||||
ws1.onmessage = (e:any) => {
|
ws1.onmessage = (e:any) => {
|
||||||
if(e.data != 0) {
|
if(e.data != 0) {
|
||||||
|
console.log(JSON.parse(e.data))
|
||||||
userStore.giveanalarmInfo = e.data
|
userStore.giveanalarmInfo = e.data
|
||||||
userStore.alarmCount = JSON.parse(e.data).alarmCount
|
userStore.alarmCount = JSON.parse(e.data).alarmCount
|
||||||
giveanalarmInfo.value = JSON.parse(e.data)
|
giveanalarmInfo.value = JSON.parse(e.data)
|
||||||
|