xzzn/emsfront
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

故障告警接口联调

Browse Source
This commit is contained in:
白菜
2025-07-01 10:45:13 +08:00
parent b8779bee61
commit 46490aebee
3 changed files with 71 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/api/ems/dzjk.js
View File

@ -75,3 +75,11 @@ export function getAmmeterDataList(siteId) {
method: 'get'
})
}
// 故障告警
export function getAlarmDetailList({siteId, deviceType, alarmLevel, alarmStartTime, alarmEndTime,todayFlag,pageSize,pageNum}) {
return request({
url: `/ems/siteAlarm/getAlarmDetailList?todayFlag=${todayFlag}&siteId=${siteId}&deviceType=${deviceType}&alarmLevel=${alarmLevel}&alarmStartTime=${alarmStartTime}&alarmEndTime=${alarmEndTime}&pageSize=${pageSize}&pageNum=${pageNum}`,
method: 'get'
})
}

3
src/store/modules/ems.js
View File

@ -8,6 +8,9 @@ const ems = {
warnOptions:{0:'正常', 1:'中断', 2:'不在线',3:'异常'},//告警状态
communicationStatusOptions:{'0':'正常','1':'通讯中断','2':'异常'},//通讯状态
workModeOptions:{'0':'正常','1':'停止'},//工作模式
alarmLevelOptions:{'A':'提示','B':'一般','C':'严重','D':'紧急'},//告警等级
alarmStatusOptions:{'0':'待处理','1':'已处理','2':'处理中'},//告警状态
deviceTypeOptions:{'TCP':'TCP','RTU':'RTU'},//设备类型
},
mutations: {
SET_ZD_LIST(state, list) {

81
src/views/ems/dzjk/gzgj/index.vue
View File

@ -1,16 +1,16 @@
<template>
<el-card shadow="always" class="common-card-container common-card-container-no-title-bg">
<el-card v-loading="loading" gshadow="always" class="common-card-container common-card-container-no-title-bg">
<!-- 搜索栏-->
<el-form :inline="true" class="select-container">
<el-form-item label="设备类型">
<el-select v-model="search.deviceType" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in deviceTypeOptions" :key="index+'deviceTypeOptions'"></el-option>
<el-option :label="value" :value="key" v-for="(value,key) in $store.state.ems.deviceTypeOptions" :key="key+'deviceTypeOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="告警等级">
<el-select v-model="search.alarmLevel" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in alarmLevelOptions" :key="index+'alarmLevelOptions'"></el-option>
<el-option :label="value" :value="key" v-for="(value,key) in $store.state.ems.alarmLevelOptions" :key="key+'alarmLevelOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="时间选择">
@ -56,14 +56,14 @@
label="告警等级"
>
<template slot-scope="scope">
<span>{{scope.row.alarmLevel}}</span>
<span>{{$store.state.ems.alarmLevelOptions[scope.row.alarmLevel]}}</span>
</template>
</el-table-column>
<el-table-column
prop="alarmContent"
min-width="400"
show-overflow-tooltip
label="告警内容">
<template slot-scope="scope">
<span>{{scope.row.alarmContent}}</span>
</template>
</el-table-column>
<el-table-column
prop="alarmStartTime"
@ -76,20 +76,37 @@
<el-table-column
label="状态">
<template slot-scope="scope">
<span :class="scope.row.status === 2 ? 'warning-status' : ''">{{scope.row.status === 2 ? '告警中' :'已结束'}}</span>
<span :class="['0','2'].includes(scope.row.status) ? 'warning-status' : ''">{{$store.state.ems.alarmStatusOptions[scope.row.status]}}</span>
</template>
</el-table-column>
</el-table>
<el-pagination
v-show="tableData.length>0"
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNum"
:page-size="pageSize"
:page-sizes="[10, 20, 30, 40]"
layout="total, sizes, prev, pager, next, jumper"
:total="totalSize"
style="margin-top:15px;text-align: center"
>
</el-pagination>
</div>
</el-card>
</template>
<script>
import {getAlarmDetailList} from'@/api/ems/dzjk'
import getQuerySiteId from "@/mixins/ems/getQuerySiteId";
export default {
name:'DzjkGzgj',
mixins:[getQuerySiteId],
data() {
return {
loading:false,
btnList:[
{name:'今日告警',id:'today'},
{name:'历史告警',id:'yesterday'},
@ -102,7 +119,6 @@ export default {
defaultDateRange:[],//默认展示的时间
dateRange:[],//alarmStartTime,alarmEndTime
activeBtn:'today',
loading:false,
search:{deviceType:'',alarmLevel:''},
deviceTypeOptions:[
{name:'类型一',id:1},
@ -113,15 +129,27 @@ export default {
{name:'等级一',id:1},
{name:'等级二',id:2},
],
tableData:[
{name:'告警一',gjdj:'等级一',gjnr:'设备一温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:1},
{name:'告警二',gjdj:'等级一',gjnr:'设备二温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:2},
{name:'告警三',gjdj:'等级一',gjnr:'设备一温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:1},
{name:'告警四',gjdj:'等级一',gjnr:'设备二温度过高',startTime:'2025/06/20 18:09:40',finishTime:'2025/06/20 20:07:01',status:2}
]
// 表格、分页
tableData:[],
pageSize:10,//分页栏当前每个数据总数
pageNum:1,//分页栏当前页数
totalSize:0,//table表格数据总数
}
},
methods:{
// 分页
handleSizeChange(val) {
this.pageSize = val;
this.$nextTick(()=>{
this.getTableData()
})
},
handleCurrentChange(val) {
this.pageNum = val
this.$nextTick(()=>{
this.getTableData()
})
},
// 搜索
onSearch(){
this.getData()
@ -132,20 +160,31 @@ export default {
this.dateRange=[]
this.getData()
},
// 获取数据
getData(){
this.loading=false
},
// 切换今日、历史告警
changeDataType(id){
if(id !== this.activeBtn){
console.log('点击了不同的菜单，更新数据')
this.activeBtn=id;
this.getData()
}
},
// 获取数据
getData(){
this.loading=true
const {deviceType,alarmLevel} = this.search
const {siteId,pageNum,pageSize,activeBtn} =this
const [alarmStartTime='',alarmEndTime='']=this.dateRange
const todayFlag = activeBtn === 'today'
getAlarmDetailList({deviceType,alarmLevel,siteId,pageSize,pageNum,alarmStartTime,alarmEndTime,todayFlag}).then(response => {
this.tableData=response?.data || [];
this.totalSize = response?.total || 0
}).finally(() => {this.loading=false})
},
init(){
this.onReset()
},
},
mounted(){
this.getData()
const now = new Date();
const lastMonth = new Date(now.getFullYear(), now.getMonth() - 1, 1);
this.defaultDateRange = [lastMonth, now];