149 lines
5.0 KiB
Vue
149 lines
5.0 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.statisticsDate }}</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="detail-content">
|
|||
|
|
<view class="detail-content-title mb20">基础信息</view>
|
|||
|
|
<view class="mb5"> 监测点名称：{{ detail.lineName }}</view>
|
|||
|
|
<view class="mb5"> 设备名称：{{ detail.devName }} </view>
|
|||
|
|
<view class="mb5"> 项目名称：{{ detail.projectName }} </view>
|
|||
|
|
<view class="mb5"> 工程名称：{{ detail.engineeringName }} </view>
|
|||
|
|
<view class="mb5" style="display: flex">
|
|||
|
|
越限详情：
|
|||
|
|
<view style="flex: 1">{{ detail.overLimitDesc }}</view></view
|
|||
|
|
>
|
|||
|
|
</view>
|
|||
|
|
<view class="detail-content">
|
|||
|
|
<view class="detail-content-title mb20"
|
|||
|
|
>指标越限详情<text class="prompt">（仅显示较为严重的10次）</text></view
|
|||
|
|
>
|
|||
|
|
|
|||
|
|
<uni-collapse accordion>
|
|||
|
|
<uni-collapse-item :title="item.targetName" v-for="item in list">
|
|||
|
|
<view class="data-table">
|
|||
|
|
<view class="table-header">
|
|||
|
|
<text>时间</text>
|
|||
|
|
<text>数据类型</text>
|
|||
|
|
<text v-if="!item.harmDetailList[0].hasT">A相</text>
|
|||
|
|
<text v-if="!item.harmDetailList[0].hasT">B相</text>
|
|||
|
|
<text v-if="!item.harmDetailList[0].hasT">C相</text>
|
|||
|
|
<text v-if="item.harmDetailList[0].hasT">总相</text>
|
|||
|
|
<text>限值</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="table-row" v-for="value in item.harmDetailList">
|
|||
|
|
<text>{{ value.statisticsTime }}</text>
|
|||
|
|
<text>{{ value.valueType }}</text>
|
|||
|
|
<text v-if="!value.hasT">{{ value.dataA }}</text>
|
|||
|
|
<text v-if="!value.hasT">{{ value.dataB }}</text>
|
|||
|
|
<text v-if="!value.hasT">{{ value.dataC }}</text>
|
|||
|
|
<text v-if="value.hasT">{{ value.dataT }}</text>
|
|||
|
|
<text>{{ value.overLimitData }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</uni-collapse-item>
|
|||
|
|
</uni-collapse>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</Cn-page>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
import { updateStatus, queryHarmonicDetail } from '@/common/api/message'
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
loading: true,
|
|||
|
|
detail: {},
|
|||
|
|
list: [],
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
// console.log(options.detail)
|
|||
|
|
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
|
|||
|
|
this.init()
|
|||
|
|
if (this.detail.isRead != 1) {
|
|||
|
|
updateStatus({
|
|||
|
|
eventIds: [this.detail.eventId],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
init() {
|
|||
|
|
queryHarmonicDetail({
|
|||
|
|
lineId: this.detail.lineId,
|
|||
|
|
time: this.detail.statisticsDate,
|
|||
|
|
})
|
|||
|
|
.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;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.limit {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: end;
|
|||
|
|
width: 450rpx;
|
|||
|
|
margin-left: auto;
|
|||
|
|
}
|
|||
|
|
.prompt {
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #111;
|
|||
|
|
font-weight: 500;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.data-table {
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
background-color: #fff;
|
|||
|
|
overflow: hidden;
|
|||
|
|
.table-header,
|
|||
|
|
.table-row {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
padding: 20rpx 0rpx;
|
|||
|
|
border-bottom: 1rpx solid #eee;
|
|||
|
|
text {
|
|||
|
|
flex: 1;
|
|||
|
|
text-align: center;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
// color: #333;
|
|||
|
|
&:first-child {
|
|||
|
|
// text-align: left;
|
|||
|
|
flex: 1.2;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.table-header {
|
|||
|
|
padding: 0rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
/deep/ .uni-collapse-item__title-text{
|
|||
|
|
font-weight: 700;
|
|||
|
|
}
|
|||
|
|
</style>
|