135 lines
4.8 KiB
Vue
135 lines
4.8 KiB
Vue
|
<template>
|
|||
|
|
<Cn-page :loading="loading">
|
|||
|
|
<view class="detail" slot="body">
|
|||
|
|
<view class="detail-content" style="font-size: 32rpx">
|
|||
|
|
<!-- <view class="detail-content-title mb20">发生时间</view> -->
|
|||
|
|
<view>{{ detail.date }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="detail-content">
|
|||
|
|
<view class="detail-content-title mb20">终端告警列表</view>
|
|||
|
|
|
|||
|
|
<uni-collapse accordion>
|
|||
|
|
<uni-collapse-item :title="item.devName" v-for="item in list">
|
|||
|
|
<template v-slot:title>
|
|||
|
|
<view class="collapseTop">
|
|||
|
|
<view class="mb5 name"> {{ item.devName }}</view>
|
|||
|
|
<view class="mb5 frequency">
|
|||
|
|
<view class="mr20"> 告警次数: {{ item.warnCounts }} 次</view>
|
|||
|
|
<view> 通讯中断: {{ item.interruptCounts }} 次</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<view>
|
|||
|
|
<view class="mb10 ml12 frequency">
|
|||
|
|
<view>项目名称：{{ item.projectName }} </view></view
|
|||
|
|
>
|
|||
|
|
<view class="mb10 ml12 frequency">
|
|||
|
|
<view>工程名称：{{ item.engineeringName }}</view></view
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
<view class="mb10 ml12 frequency">
|
|||
|
|
<view>通讯信息：</view>
|
|||
|
|
<view style="flex: 1">
|
|||
|
|
<view v-if="item.interruptCounts == 0">通讯正常</view>
|
|||
|
|
<view v-else>通讯中断{{ item.interruptCounts }}次，具体如下所示:</view
|
|||
|
|
><view v-for="date in item.interruptDetails" class="mt15 textBox">{{
|
|||
|
|
date
|
|||
|
|
}}</view></view
|
|||
|
|
></view
|
|||
|
|
>
|
|||
|
|
<view class="mb10 ml12 frequency">
|
|||
|
|
<view>告警信息：</view>
|
|||
|
|
<view style="flex: 1">
|
|||
|
|
<view v-if="item.warnCounts == 0">暂无终端告警信息</view>
|
|||
|
|
<view v-else>终端告警{{ item.warnCounts }}次，具体如下所示:</view
|
|||
|
|
><view v-for="val in item.warnDetails" class="mt15 textBox">
|
|||
|
|
{{ val.warnEventTime + '发生' + val.warnEventDesc }}
|
|||
|
|
</view></view
|
|||
|
|
></view
|
|||
|
|
>
|
|||
|
|
</view>
|
|||
|
|
</uni-collapse-item>
|
|||
|
|
</uni-collapse>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</Cn-page>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
import { updateStatus, queryAlarmDetail } from '@/common/api/message'
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
loading: true,
|
|||
|
|
detail: {},
|
|||
|
|
limit: '',
|
|||
|
|
accordionVal: '1',
|
|||
|
|
|
|||
|
|
list: [],
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
this.loading = false
|
|||
|
|
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
|
|||
|
|
this.init()
|
|||
|
|
if (this.detail.isRead != 1) {
|
|||
|
|
updateStatus({
|
|||
|
|
eventIds: [this.detail.eventId],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
init() {
|
|||
|
|
this.loading = false
|
|||
|
|
queryAlarmDetail({
|
|||
|
|
devList: this.detail.devIds,
|
|||
|
|
time: this.detail.date,
|
|||
|
|
})
|
|||
|
|
.then((res) => {
|
|||
|
|
this.list = res.data
|
|||
|
|
this.loading = false
|
|||
|
|
})
|
|||
|
|
.catch(() => {
|
|||
|
|
this.loading = false
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<style lang="scss">
|
|||
|
|
.detail {
|
|||
|
|
padding: 20rpx 0;
|
|||
|
|
|
|||
|
|
.detail-content {
|
|||
|
|
padding: 20rpx;
|
|||
|
|
background: #fff;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
|
|||
|
|
.detail-content-title {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #111;
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.collapseTop {
|
|||
|
|
padding: 10rpx 0;
|
|||
|
|
margin-left: 15px;
|
|||
|
|
.name {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
font-weight: 700;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.frequency {
|
|||
|
|
display: flex;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
// color: #666666;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.textBox {
|
|||
|
|
border-bottom: 1px solid #eee;
|
|||
|
|
}
|
|||
|
|
</style>
|