229 lines
8.1 KiB
Vue
229 lines
8.1 KiB
Vue
<template>
|
||
<Cn-page :loading="loading">
|
||
<view class="content" slot="body">
|
||
<view class="content-item" v-for="(item, index) in store.data" :key="index" @click="jump(item)">
|
||
<view class="content-item-header">
|
||
<uni-badge
|
||
class="uni-badge-left-margin"
|
||
:is-dot="true"
|
||
:text="item.status == '1' ? 0 : 1"
|
||
absolute="rightTop"
|
||
size="small"
|
||
>
|
||
<view class="content-item-header-icon">
|
||
<image mode="aspectFill" :src="staticIcon" style="height: 60rpx; width: 60rpx"></image>
|
||
</view>
|
||
</uni-badge>
|
||
<view class="content-item-header-right">
|
||
<view class="content-item-header-right-title">{{ item.equipmentName }}</view>
|
||
<!-- <view class="content-item-header-right-des">{{ item.engineeringName }} {{ item.projectName }}</view> -->
|
||
<view class="content-item-header-right-des">工程名称：{{ item.engineeringName }}</view>
|
||
<view class="content-item-header-right-des">项目名称：{{ item.projectName }}</view>
|
||
<!-- <view class="content-item-header-right-des">{{ item.subTitle }}</view> -->
|
||
</view>
|
||
<view class="ml10" v-if="type === '0' || item.status != '1'">🔍</view>
|
||
</view>
|
||
<view class="content-item-footer">{{ item.subTitle }}</view>
|
||
</view>
|
||
<!-- <uni-card
|
||
:title="item.equipmentName"
|
||
:extra="item.status == '1' ? '' : '未读'"
|
||
:sub-title="item.subTitle"
|
||
thumbnail="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png"
|
||
@click="jump(item)"
|
||
v-for="(item, index) in store.data"
|
||
:key="index"
|
||
>
|
||
<view class="term-list-bottom">
|
||
<view class="term-list-bottom-item" v-for="(item2, textIndex) in item.dataSet" :key="textIndex">
|
||
{{ item2.showName + ':' + (item2.value == 3.1415926 ? '-' : item2.value) + (item2.unit || '') }}
|
||
</view>
|
||
</view>
|
||
</uni-card> -->
|
||
<Cn-empty v-if="store.empty" style="padding-top: 400rpx"></Cn-empty>
|
||
<uni-load-more
|
||
v-if="store.status == 'loading' || (store.data && store.data.length > 0)"
|
||
:status="store.status"
|
||
></uni-load-more>
|
||
</view>
|
||
</Cn-page>
|
||
</template>
|
||
|
||
<script>
|
||
import list from '@/common/js/list'
|
||
import { updateStatus } from '@/common/api/message'
|
||
|
||
export default {
|
||
mixins: [list],
|
||
data() {
|
||
return {
|
||
loading: true,
|
||
type: '',
|
||
staticIcon: '',
|
||
}
|
||
},
|
||
onLoad(o) {
|
||
this.type = '3'
|
||
this.devId = o.id
|
||
switch (this.type) {
|
||
case '0':
|
||
uni.setNavigationBarTitle({ title: '暂态事件' })
|
||
this.staticIcon = '/static/zantai2.png'
|
||
break
|
||
case '1':
|
||
uni.setNavigationBarTitle({ title: '稳态事件' })
|
||
this.staticIcon = '/static/steady2.png'
|
||
break
|
||
case '2':
|
||
uni.setNavigationBarTitle({ title: '运行事件' })
|
||
this.staticIcon = '/static/run2.png'
|
||
break
|
||
case '3':
|
||
uni.setNavigationBarTitle({ title: '设备告警' })
|
||
this.staticIcon = '/static/device_bad2.png'
|
||
break
|
||
}
|
||
this.init()
|
||
},
|
||
onNavigationBarButtonTap(e) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '确定要全部标记为已读吗？',
|
||
success: (res) => {
|
||
if (res.confirm) {
|
||
updateStatus({
|
||
type: this.type,
|
||
eventIds: [],
|
||
}).then(() => {
|
||
this.loading = true
|
||
this.store.reload()
|
||
})
|
||
}
|
||
},
|
||
})
|
||
},
|
||
methods: {
|
||
async init() {
|
||
let dictData = await this.$util.getDictData('app_event')
|
||
console.log(dictData)
|
||
this.store = this.DataSource('/cs-harmonic-boot/eventUser/queryEventpage')
|
||
this.store.params.type = this.type
|
||
this.store.params.deviceId = this.deviceId
|
||
this.store.loadedCallback = () => {
|
||
this.store.data.forEach((item) => {
|
||
if (this.type === '3') {
|
||
item.showName = '告警,告警码：' + item.code
|
||
}
|
||
if (this.type !== '0') {
|
||
item.subTitle = `于${item.startTime}发生${item.showName}`
|
||
} else {
|
||
item.subTitle =
|
||
`于${item.startTime}发生${item.showName}。` +
|
||
item.dataSet
|
||
.map((item2) => {
|
||
return (
|
||
item2.showName +
|
||
'：' +
|
||
(item2.value == 3.1415926 ? '-' : item2.value) +
|
||
(item2.unit || '')
|
||
)
|
||
})
|
||
.join('，')
|
||
}
|
||
})
|
||
this.loading = false
|
||
}
|
||
this.store.reload()
|
||
},
|
||
jump(item) {
|
||
if (this.type === '0') {
|
||
let str = JSON.stringify(item).replace(/%/g, '百分比')
|
||
uni.navigateTo({ url: '/pages/message/messageDetail?detail=' + encodeURIComponent(str) })
|
||
} else {
|
||
if (item.status != '1') {
|
||
item.status = '1'
|
||
updateStatus({
|
||
eventIds: [item.id],
|
||
})
|
||
}
|
||
}
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.content {
|
||
.content-item {
|
||
margin: 20rpx;
|
||
padding: 20rpx 20rpx;
|
||
box-shadow: rgba(0, 0, 0, 0.08) 0px 0px 6rpx 2rpx;
|
||
border-radius: 8rpx;
|
||
border: 1px solid #ebeef5;
|
||
background: #fff;
|
||
.content-item-header {
|
||
display: flex;
|
||
padding: 20rpx 0;
|
||
border-bottom: 1px solid #ebeef5;
|
||
.content-item-header-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100rpx;
|
||
height: 100rpx;
|
||
border-radius: 8rpx;
|
||
background: $uni-theme-color;
|
||
}
|
||
.content-item-header-right {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
height: 100rpx;
|
||
margin-left: 20rpx;
|
||
.content-item-header-right-title {
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
color: #111;
|
||
}
|
||
.content-item-header-right-des {
|
||
font-size: 24rpx;
|
||
color: #999;
|
||
}
|
||
}
|
||
}
|
||
.content-item-footer {
|
||
margin-top: 20rpx;
|
||
font-size: 24rpx;
|
||
color: #999;
|
||
}
|
||
}
|
||
// padding-top: 20rpx;
|
||
}
|
||
|
||
.term-list-bottom {
|
||
.term-list-bottom-item {
|
||
font-size: 28rpx;
|
||
margin-bottom: 10rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
// view:first-of-type{
|
||
// color: #111;
|
||
// }
|
||
}
|
||
|
||
.term-list-bottom-item:last-of-type {
|
||
margin-bottom: 0;
|
||
}
|
||
}
|
||
|
||
/deep/ .uni-list-item {
|
||
background-color: $uni-theme-white !important;
|
||
}
|
||
|
||
/deep/ .uni-card__header-extra-text {
|
||
color: #dd524d !important;
|
||
font-size: 20rpx;
|
||
}
|
||
</style>
|