App/app-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

提交app

Browse Source
This commit is contained in:
guanj
2026-03-17 14:00:55 +08:00
parent b71200cb97
commit 00e34c168f
82 changed files with 13202 additions and 4602 deletions
Download Patch File Download Diff File Expand all files Collapse all files

231
pages/message1/comp/F47.vue Normal file
View File

@@ -0,0 +1,231 @@
<template>
<!-- ITIC -->
<view>
<l-echart v-if="status != 'loading'" ref="echartRef" @finished="initChart"></l-echart>
<uni-load-more v-else :status="status"></uni-load-more>
</view>
</template>
<script>
const echarts = require('../../../uni_modules/lime-echart/static/echarts.min')
export default {
components: {},
props: {
store: {
type: [Object],
},
},
data() {
return {
option: {
backgroundColor: '#fff',
grid: {
left: '10px',
right: '40rpx',
bottom: '40rpx',
top: '10px',
containLabel: true,
},
legend: {
data: ['分割线', '可容忍事件', '不可容忍事件'],
right: '10px',
bottom: '10px',
textStyle: {
fontSize: 10,
},
itemWidth: 10,
itemHeight: 10,
itemGap: 8,
padding: [5, 5, 5, 10],
},
yAxis: {
type: 'log',
min: '0.001',
max: '1000',
name: 's',
inverse: true,
axisLabel: {
rotate: -90,
},
splitLine: { show: false },
},
xAxis: {
type: 'value',
splitNumber: 10,
minInterval: 3,
position: 'top',
rotate: 90,
axisLabel: {
rotate: -90,
},
name: '%',
},
series: [
{
name: '分割线',
type: 'line',
data: [
[0, 0.05],
[50, 0.05],
[50, 0.2],
[70, 0.2],
[70, 0.5],
[80, 0.5],
[80, 10],
[80, 1000],
],
showSymbol: false,
tooltips: {
show: false,
},
color: '#DAA520',
},
{
name: '可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointF,
data: [],
color: 'green',
},
{
name: '不可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointFun,
data: [],
color: 'red',
},
],
},
status: 'loading',
echartRef: null,
pointF: [],
pointFun: [],
data: [],
}
},
mounted() {
// this.initChart()
// console.log('🚀 ~ props.data:', this.props.data)
},
methods: {
init() {},
async initChart() {
if (!this.$refs.echartRef) return
try {
this.echartRef = await this.$refs.echartRef.init(echarts)
this.bindChartClickEvent()
this.echartRef.setOption(this.option, true)
} catch (error) {
console.error('图表初始化失败:', error)
}
},
gongfunction() {
var standF = 0
var unstandF = 0
this.pointF = []
this.pointFun = []
var total = 0
total = this.data.length
if (total == 0) {
} else {
for (var i = 0; i < this.data.length; i++) {
var point = []
var xx = this.data[i].evtParamTm.replace(/s/g, '')
var yy = this.data[i].evtParamVVaDepth.replace(/%/g, '')
var time = this.data[i].startTime.replace('T', ' ')
point = [yy, xx, time, this.data[i]]
if (xx < 0.05) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else if (xx < 0.2) {
if (yy > 50) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else {
unstandF++
this.pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } },
})
}
} else if (xx < 0.5) {
if (yy > 70) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else {
unstandF++
this.pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } },
})
}
} else {
if (yy > 80) {
standF++
this.pointF.push({
value: point,
itemStyle: { normal: { color: 'green' } },
})
} else {
unstandF++
this.pointFun.push({
value: point,
itemStyle: { normal: { color: 'red' } },
})
}
}
}
}
this.option.series[1].data = this.pointF
this.option.series[2].data = this.pointFun
if (this.echartRef) {
this.echartRef.setOption(this.option, true)
} else {
this.initChart()
}
},
bindChartClickEvent() {
if (!this.echartRef) return
this.echartRef.on('click', (params) => {
console.log('🚀 ~ params:', params.value[3])
// 点击查看详情
let item = params.value[3]
let str = JSON.stringify(item).replace(/%/g, '百分比')
uni.navigateTo({ url: '/pages/message1/comp/transientDetails?detail=' + encodeURIComponent(str) })
})
},
},
computed: {},
watch: {
store: {
handler(val, oldVal) {
this.status = val.status
this.data = val.data
this.gongfunction()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped></style>

341
pages/message1/comp/ITIC.vue Normal file
View File

@@ -0,0 +1,341 @@
<template>
<!-- ITIC -->
<view>
<l-echart v-if="status != 'loading'" ref="echartRef" @finished="initChart"></l-echart>
<uni-load-more v-else :status="status"></uni-load-more>
</view>
</template>
<script>
const echarts = require('../../../uni_modules/lime-echart/static/echarts.min')
export default {
components: {},
props: {
store: {
type: [Object],
},
},
data() {
return {
option: {
backgroundColor: '#fff',
grid: {
left: '10px',
right: '40rpx',
bottom: '40rpx',
top: '10px',
containLabel: true,
},
legend: {
data: ['上限', '下限', '可容忍事件', '不可容忍事件'],
right: '10px',
bottom: '10px',
textStyle: {
fontSize: 10,
},
itemWidth: 10,
itemHeight: 10,
itemGap: 8,
padding: [5, 5 ,5 ,10],
},
color: ['#FF8C00', '#00BFFF', 'green', 'red'],
yAxis: {
type: 'log',
min: '0.001',
max: '1000',
name: 's',
inverse: true,
axisLabel: {
rotate: -90,
},
splitLine: { show: false },
},
xAxis: {
type: 'value',
splitNumber: 10,
minInterval: 3,
position: 'top',
rotate: 90,
axisLabel: {
rotate: 90,
},
name: '%',
},
series: [
{
name: '上限',
type: 'line',
data: [
[200, 0.001],
[140, 0.003],
[120, 0.003],
[120, 0.5],
[110, 0.5],
[110, 10],
[110, 1000],
],
showSymbol: false,
tooltips: {
show: false,
},
color: '#FF8C00',
},
{
name: '下限',
type: 'line',
data: [
[0, 0.02],
[70, 0.02],
[70, 0.5],
[80, 0.5],
[80, 10],
[90, 10],
[90, 1000],
],
showSymbol: false,
tooltips: {
show: false,
},
color: '#00BFFF',
},
{
name: '可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointI,
data: [],
color: 'green',
},
{
name: '不可容忍事件',
type: 'scatter',
symbol: 'circle',
// data: this.pointIun,
data: [],
color: 'red',
},
],
},
status: 'loading',
echartRef: null,
pointI: [],
pointIun: [],
data: [],
}
},
mounted() {
// this.initChart()
// console.log('🚀 ~ props.data:', this.props.data)
},
methods: {
init() {},
async initChart() {
if (!this.$refs.echartRef) return
try {
this.echartRef = await this.$refs.echartRef.init(echarts)
this.bindChartClickEvent()
this.echartRef.setOption(this.option, true)
} catch (error) {
console.error('图表初始化失败:', error)
}
},
// gongfunction() {
// var standI = 0
// var unstandI = 0
// this.pointI = []
// this.pointIun = []
// var total = 0
// total = this.data.length
// if (total == 0) {
// } else {
// for (var i = 0; i < this.data.length; i++) {
// var point = []
// var xx = this.data[i].evtParamTm.replace(/s/g, '')
// var yy = this.data[i].evtParamVVaDepth.replace(/%/g, '')
// var time = this.data[i].startTime.replace('T', ' ')
// point = [yy, xx, time, this.data[i]]
// if (xx <= 0.003) {
// var line = 0
// line = 230 - 30000 * xx
// if (yy > line) {
// unstandI++
// this.pointIun.push({
// value: point,
// itemStyle: { normal: { color: 'red' } },
// })
// } else {
// standI++
// this.pointI.push({
// value: point,
// itemStyle: { normal: { color: 'green' } },
// })
// }
// } else if (xx <= 0.02) {
// if (yy > 120) {
// unstandI++
// this.pointIun.push({
// value: point,
// itemStyle: { normal: { color: 'red' } },
// })
// } else {
// standI++
// this.pointI.push({
// value: point,
// itemStyle: { normal: { color: 'green' } },
// })
// }
// } else if (xx <= 0.5) {
// if (yy > 120 || yy < 70) {
// unstandI++
// this.pointIun.push({
// value: point,
// itemStyle: { normal: { color: 'red' } },
// })
// } else {
// standI++
// this.pointI.push({
// value: point,
// itemStyle: { normal: { color: 'green' } },
// })
// }
// } else if (xx <= 10) {
// if (yy > 110 || yy < 80) {
// unstandI++
// this.pointIun.push({
// value: point,
// itemStyle: { normal: { color: 'red' } },
// })
// } else {
// standI++
// this.pointI.push({
// value: point,
// itemStyle: { normal: { color: 'green' } },
// })
// }
// } else {
// if (yy > 110 || yy < 90) {
// unstandI++
// this.pointIun.push({
// value: point,
// itemStyle: { normal: { color: 'red' } },
// })
// } else {
// standI++
// this.pointI.push({
// value: point,
// itemStyle: { normal: { color: 'green' } },
// })
// }
// }
// }
// }
// this.option.series[2].data = this.pointI
// this.option.series[3].data = this.pointIun
// if (this.echartRef) {
// this.echartRef.setOption(this.option, true)
// } else {
// this.initChart()
// }
// },
gongfunction() {
// 初始化计数与数据数组
let normalCount = 0
let abnormalCount = 0
this.normalPoints = []
this.abnormalPoints = []
if (!this.data || this.data.length === 0) {
this.updateChartOption()
return
}
// 缓存长度，遍历数据
const len = this.data.length
for (let i = 0; i < len; i++) {
const item = this.data[i]
// 建议确认正则意图，/s/g 仅移除字母 s，若去空格应为 /\s/g
const xx = parseFloat(item.evtParamTm.replace(/s/g, ''))
const yy = parseFloat(item.evtParamVVaDepth.replace(/%/g, ''))
const time = item.startTime.replace('T', ' ')
const pointData = [yy, xx, time, item]
const isNormal = this.checkPointStatus(xx, yy)
const pointObj = {
value: pointData,
itemStyle: { normal: { color: isNormal ? 'green' : 'red' } },
}
if (isNormal) {
normalCount++
this.normalPoints.push(pointObj)
} else {
abnormalCount++
this.abnormalPoints.push(pointObj)
}
}
this.updateChartOption()
},
// 提取判断逻辑为独立方法
checkPointStatus(xx, yy) {
if (xx <= 0.003) {
const line = 230 - 30000 * xx
return yy <= line
} else if (xx <= 0.02) {
return yy <= 120
} else if (xx <= 0.5) {
return yy > 70 && yy < 120
} else if (xx <= 10) {
return yy > 80 && yy < 110
} else {
return yy > 90 && yy < 110
}
},
updateChartOption() {
// 建议避免硬编码 series 索引，可通过 seriesName 查找
this.option.series[2].data = this.normalPoints
this.option.series[3].data = this.abnormalPoints
if (this.echartRef) {
this.echartRef.setOption(this.option, true)
} else {
this.initChart()
}
},
bindChartClickEvent() {
if (!this.echartRef) return
this.echartRef.on('click', (params) => {
console.log('🚀 ~ params:', params.value[3])
// 点击查看详情
let item = params.value[3]
let str = JSON.stringify(item).replace(/%/g, '百分比')
uni.navigateTo({ url: '/pages/message1/comp/transientDetails?detail=' + encodeURIComponent(str) })
})
},
},
computed: {},
watch: {
store: {
handler(val, oldVal) {
this.status = val.status
this.data = val.data
this.gongfunction()
},
deep: true,
immediate: true,
},
},
}
</script>
<style lang="scss" scoped></style>

134
pages/message1/comp/alarmDetails.vue Normal file
View File

@@ -0,0 +1,134 @@
<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>

326
pages/message1/comp/preview.vue Normal file
View File

@@ -0,0 +1,326 @@
<template>
<view class="preview-container">
<!-- 右上角关闭按钮 -->
<view class="close-btn" @click="close">
<text class="close-icon">✕</text>
</view>
<!-- 下载按钮 -->
<view class="download-btn" @click="downloadImage">
<text class="download-icon">⬇️</text>
</view>
<!-- 图片预览区域，使用movable-area和movable-view实现缩放移动 -->
<movable-area class="movable-area" :style="{ width: '100vw', height: '100vh' }">
<movable-view
class="movable-view"
direction="all"
:scale="true"
:scale-min="0.5"
:scale-max="3"
:scale-value="scaleValue"
@scale="onScale"
:x="x"
:y="y"
:style="{
width: rotatedWidth + 'px',
height: rotatedHeight + 'px'
}"
>
<view
class="image-wrapper"
:style="{
width: imgWidth + 'px',
height: imgHeight + 'px',
transform: 'rotate(90deg)',
transformOrigin: 'center center'
}"
>
<image
:src="imageUrl"
class="preview-img"
mode="aspectFill"
:style="{
width: imgWidth + 'px',
height: imgHeight + 'px'
}"
@load="onImageLoad"
></image>
</view>
</movable-view>
</movable-area>
<!-- 图片信息提示 -->
<view class="scale-tip" v-if="showScaleTip">
当前缩放: {{ Math.round(scaleValue * 100) }}%
</view>
</view>
</template>
<script>
export default {
onLoad(options) {
this.imageUrl = decodeURIComponent(options.url) // 接收传递的图片URL，需要解码
},
data() {
return {
imageUrl: '',
// 缩放相关
scaleValue: 1,
x: 0,
y: 0,
// 图片原始尺寸
imgWidth: 0,
imgHeight: 0,
// 旋转后的尺寸（交换宽高）
rotatedWidth: 0,
rotatedHeight: 0,
// 提示显示控制
showScaleTip: false,
tipTimer: null,
// 屏幕尺寸
windowWidth: 0,
windowHeight: 0
}
},
mounted() {
// 获取屏幕尺寸
const systemInfo = uni.getSystemInfoSync();
this.windowWidth = systemInfo.windowWidth;
this.windowHeight = systemInfo.windowHeight;
},
methods: {
// 图片加载完成后获取尺寸
onImageLoad(e) {
const { width, height } = e.detail;
// 保存原始尺寸
this.imgWidth = width;
this.imgHeight = height;
// 旋转90度后，宽度和高度互换
this.rotatedWidth = height; // 旋转后宽度 = 原高度
this.rotatedHeight = width; // 旋转后高度 = 原宽度
// 计算初始位置居中
this.resetPosition();
console.log('图片加载:', {width, height}, '旋转后:', {rotatedWidth: this.rotatedWidth, rotatedHeight: this.rotatedHeight});
},
// 重置位置到中心
resetPosition() {
// 计算居中的偏移量
this.x = (this.windowWidth - this.rotatedWidth) / 2;
this.y = (this.windowHeight - this.rotatedHeight) / 2;
console.log('重置位置:', {x: this.x, y: this.y, windowWidth: this.windowWidth, windowHeight: this.windowHeight});
},
// 缩放事件处理
onScale(e) {
this.scaleValue = e.detail.scale;
// 显示缩放提示
this.showScaleTip = true;
if (this.tipTimer) {
clearTimeout(this.tipTimer);
}
this.tipTimer = setTimeout(() => {
this.showScaleTip = false;
}, 1500);
},
// 关闭预览
close() {
uni.navigateBack();
},
// 下载图片
downloadImage() {
uni.showLoading({
title: '下载中...'
});
// 先获取图片信息（如果是网络图片需要先下载）
uni.downloadFile({
url: this.imageUrl,
success: (res) => {
if (res.statusCode === 200) {
// 保存图片到相册
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: 'success'
});
},
fail: (err) => {
uni.hideLoading();
console.error('保存失败', err);
// 处理用户拒绝权限的情况
if (err.errMsg.includes('auth deny')) {
uni.showModal({
title: '提示',
content: '需要您授权保存图片到相册',
success: (res) => {
if (res.confirm) {
uni.openSetting({
success: (settingRes) => {
console.log('打开设置页面', settingRes);
}
});
}
}
});
} else {
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
}
});
} else {
uni.hideLoading();
uni.showToast({
title: '下载失败',
icon: 'none'
});
}
},
fail: (err) => {
uni.hideLoading();
console.error('下载失败', err);
uni.showToast({
title: '下载失败',
icon: 'none'
});
}
});
},
// 双击重置缩放和位置（可选功能）
onDoubleTap() {
this.scaleValue = 1;
this.resetPosition();
}
},
// 页面返回前清理定时器
onUnload() {
if (this.tipTimer) {
clearTimeout(this.tipTimer);
}
}
}
</script>
<style lang="scss" scoped>
.preview-container {
position: relative;
width: 100vw;
height: 100vh;
background: #000;
overflow: hidden;
}
.movable-area {
width: 100vw;
height: 100vh;
background: #000;
}
.movable-view {
display: flex;
align-items: center;
justify-content: center;
}
.image-wrapper {
display: flex;
align-items: center;
justify-content: center;
transition: transform 0.1s ease;
}
.preview-img {
display: block;
}
// 关闭按钮
.close-btn {
position: fixed;
top: 30rpx;
right: 30rpx;
width: 60rpx;
height: 60rpx;
background: rgba(0, 0, 0, 0.5);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
.close-icon {
color: #fff;
font-size: 40rpx;
line-height: 1;
}
}
// 下载按钮
.download-btn {
position: fixed;
top: 30rpx;
right: 110rpx;
width: 60rpx;
height: 60rpx;
background: rgba(0, 0, 0, 0.5);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
.download-icon {
color: #fff;
font-size: 40rpx;
line-height: 1;
}
}
// 缩放提示
.scale-tip {
position: fixed;
bottom: 100rpx;
left: 50%;
transform: translateX(-50%);
background: rgba(0, 0, 0, 0.6);
color: #fff;
padding: 10rpx 30rpx;
border-radius: 40rpx;
font-size: 28rpx;
z-index: 1000;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
animation: fadeInOut 1.5s ease;
}
@keyframes fadeInOut {
0% { opacity: 0; }
15% { opacity: 1; }
85% { opacity: 1; }
100% { opacity: 0; }
}
</style>

148
pages/message1/comp/steadyStateDetails.vue Normal file
View File

@@ -0,0 +1,148 @@
<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>

95
pages/message1/comp/transientDetails.vue Normal file
View File

@@ -0,0 +1,95 @@
<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.startTime }}</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">基础信息</view>
<view class="mb5"> 设备名称：{{ detail.equipmentName }}</view>
<view class="mb5"> 项目名称：{{ detail.projectName }} </view>
<view class="mb5"> 工程名称：{{ detail.engineeringName }} </view>
<view class="mb5"> 暂态类型：{{ detail.showName }}</view>
<view class="mb5" v-for="(item, textIndex) in detail.dataSet" :key="textIndex">
{{ item.showName + '：' + (item.value == 3.1415926 ? '-' : item.value) + (item.unit || '') }}
</view>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">瞬时波形图</view>
<image
style="width: 100%"
:src="detail.instantPics"
mode="widthFix"
v-if="detail.instantPics"
@click="previewImage(detail.instantPics)"
/>
<text v-else>暂无</text>
</view>
<view class="detail-content">
<view class="detail-content-title mb20">RMS波形图</view>
<image
style="width: 100%"
:src="detail.rmsPics"
mode="widthFix"
v-if="detail.rmsPics"
@click="previewImage(detail.rmsPics)"
/>
<text v-else>暂无</text>
</view>
</view>
</Cn-page>
</template>
<script>
import { updateStatus } from '@/common/api/message'
export default {
data() {
return {
loading: true,
detail: {},
}
},
onLoad(options) {
// console.log(options.detail)
this.detail = JSON.parse(decodeURIComponent(options.detail).replace(/百分比/g, '%'))
this.detail.rmsPics && (this.detail.rmsPics = this.$config.static + this.detail.rmsPics)
this.detail.instantPics && (this.detail.instantPics = this.$config.static + this.detail.instantPics)
this.loading = false
if (this.detail.status != 1) {
updateStatus({
eventIds: [this.detail.id],
})
}
},
methods: {
previewImage(url) {
// uni.previewImage({
// urls: [url],
// })
uni.navigateTo({
url: `/pages/message1/comp/preview?url=${encodeURIComponent(url)}`,
})
},
},
}
</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;
}
}
}
</style>