This commit is contained in:
Iruka 2025-02-13 11:33:01 +08:00
parent d6407785e5
commit 0726460524
6 changed files with 394 additions and 19 deletions

10
api/iot/data_station.js Normal file
View File

@ -0,0 +1,10 @@
import request from '@/utils/request'
// 查询设备-设备单据摘要列表
export function list(query) {
return request({
url: '/iotlog/data_station/list',
method: 'get',
params: query
})
}

10
api/iot/data_valve.js Normal file
View File

@ -0,0 +1,10 @@
import request from '@/utils/request'
// 查询设备-设备单据摘要列表
export function list(query) {
return request({
url: '/iotlog/data_valve/list',
method: 'get',
params: query
})
}

View File

@ -0,0 +1,347 @@
<template>
<u-popup :show="open" mode="center" @close="close" closeable>
<view class="jz-info" style="width: 95vw;">
<view style="font-size: 16px;font-weight: 600;margin-bottom: 10px;">{{title}}</view>
<view style="width: 100%;">
<u-tabs :list="tabs" @click="tabsClick"></u-tabs>
</view>
<view style="height: 50vh;">
<canvas id="chartRef" style="zoom: 1 ;height: 100%;width: 100%;" canvas-id="mychart"
:canvas-type="canvasType" :data="dataList" :change:data="echarts.dataHandler" />
</view>
</view>
</u-popup>
</template>
<script>
import plugin from "@/plugins"
import {
timestampFormat
} from '@/utils/common.js'
import * as station from "@/api/iot/data_station.js";
import * as valve from "@/api/iot/data_valve.js";
export default {
name: "ADC",
components: {},
props: {},
data() {
return {
title: "设备曲线",
open: false,
wo: null,
tabs: [{
name: '当天',
day: 0,
},
{
name: '近两天',
day: -1,
},
{
name: '近三天',
day: -2,
},
],
item: null,
type: null,
dataList: null,
canvasType: '2d',
}
},
created() {},
mounted() {},
methods: {
/**
* 显示方法
* @param type 1基站 2阀门
* @param row
* @param data
*/
async show(row) {
this.open = true;
if (row?.deviceTypeId == 1) {
this.type = "station";
this.title = `设备曲线【${row.deviceCode}`;
} else {
this.type = "valve";
this.title = `设备曲线【${row.showName}`;
}
this.item = row;
this.getList(0);
},
tabsClick(e) {
this.getList(e.day);
},
getList(day) {
uni.showLoading({
mask: true,
icon: 'none'
})
if (this.type == "station") {
let queryParams = {
pageNum: 1,
pageSize: 9999,
deviceId: this.item.deviceId,
deviceCode: this.item.deviceCode,
reportType: "device_thing",
params: {
beginTime: this.getNowFormatDate(day),
endTime: this.getNowFormatDate(1),
}
}
station.list(queryParams).then(res => {
uni.hideLoading()
this.dataList = {
type: this.type,
data: res.rows || []
};
})
} else if (this.type == "valve") {
let queryParams = {
pageNum: 1,
pageSize: 9999,
landId: this.item.landId,
wogId: this.item.landGroupId,
woId: this.item.id,
reportType: "device_thing",
params: {
beginTime: this.getNowFormatDate(day),
endTime: this.getNowFormatDate(1),
}
}
valve.list(queryParams).then(res => {
uni.hideLoading()
this.dataList = {
type: this.type,
data: res.rows || []
};
})
}
},
close() {
this.dataList = null;
this.open = false;
this.$emit('close');
},
getNowFormatDate(_day = 0) {
let date = new Date();
date.setDate(date.getDate() + _day);
let year = date.getFullYear();
let month = date.getMonth() + 1;
if (month < 10) {
month = "0" + month;
}
let d = date.getDate();
if (d < 10) {
d = "0" + d;
}
return year + "-" + month + "-" + d + " 00:00:00";
},
}
}
</script>
<script module="echarts" lang="renderjs">
import * as echartsJS from 'echarts';
export default {
data() {
return {
_echarts: null,
}
},
created() {},
mounted() {},
methods: {
dataHandler(e) {
if (!e) {
this.dispose();
return;
}
this.setEchart(e);
},
setEchart(e) {
if (this._echarts) {
this._echarts.clear();
}
// ECharts
let _echarts = echartsJS.init(document.getElementById("chartRef"));
let xAxis = [];
let adcObj = {
battery: [],
temperature: [],
humidity: [],
motoAdc: [],
pressure1: [],
pressure2: [],
pressure3: [],
pressure4: [],
};
e.data.forEach(item => {
xAxis.push(item.reportTime);
adcObj.battery.push(item.battery || 0);
adcObj.temperature.push(item.temperature || 0);
if (e.type == "valve") {
adcObj.humidity.push(item.humidity || 0);
adcObj.motoAdc.push(item.motoAdc ? (item.motoAdc / 1000).toFixed(3) : 0);
if (item.pressure1 != null) {
adcObj.pressure1.push(item.pressure1);
}
if (item.pressure2 != null) {
adcObj.pressure2.push(item.pressure2);
}
if (item.pressure3 != null) {
adcObj.pressure3.push(item.pressure3);
}
if (item.pressure4 != null) {
adcObj.pressure4.push(item.pressure4);
}
}
});
let series = [];
let legendName = [];
for (const key in adcObj) {
if (adcObj[key].length) {
let name = "";
switch (key) {
case "battery":
name = "电量(%)";
break;
case "temperature":
name = "温度(℃)";
break;
case "humidity":
name = "湿度(%)";
break;
case "motoAdc":
name = "最大电流(A)";
break;
case "pressure1":
name = "压力1";
break;
case "pressure2":
name = "压力2";
break;
case "pressure3":
name = "压力3";
break;
case "pressure4":
name = "压力4";
break;
}
legendName.push(name);
series.push({
name: name,
type: "line",
stack: key,
data: adcObj[key],
smooth: true
});
}
}
let option = {
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow"
},
backgroundColor: "rgba(21, 45, 85, 0.6)",
textStyle: {
color: "#fff"
}
},
legend: {
data: legendName,
textStyle: {
color: "#333"
}
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: {
type: "category",
boundaryGap: false,
data: xAxis,
axisTick: {
show: true
},
axisLine: {
lineStyle: {
color: "red"
}
},
axisLabel: {
color: "#333"
}
},
yAxis: {
type: "value",
axisLabel: {
color: "#333",
fontSize: 14
},
splitLine: {
lineStyle: {
color: "#666",
type: "dashed"
}
},
axisLine: {
lineStyle: {
color: "red"
}
}
},
series
};
_echarts.setOption(option);
this._echarts = _echarts;
},
dispose() {
if (this._echarts) {
this._echarts.dispose();
}
},
}
}
</script>
<style lang="scss" scoped>
.jz-info {
padding: 15px;
view {
display: flex;
uni-text {
line-height: 48rpx;
}
uni-text:nth-child(odd) {
width: 100px;
margin-right: 10px;
color: #666;
background: #f3f3f3;
}
uni-text:nth-child(even) {
width: calc(100% - 100px);
color: #000;
word-wrap: break-word;
/* 支持旧版浏览器 */
overflow-wrap: break-word;
/* 推荐 */
white-space: normal;
/* 可选:如果需要连字符 */
hyphens: auto;
}
}
}
</style>

View File

@ -15,6 +15,7 @@
"dependencies": {
"axios": "0.28.1",
"dayjs": "^1.11.13",
"echarts": "^5.6.0",
"jsencrypt": "^3.3.2",
"leaflet": "^1.9.4",
"mqtt": "^3.0.0"

View File

@ -129,7 +129,7 @@
</view>
</u-col>
<u-col span="4" style="align-items: center;">
<view class="fixed">
<view class="fixed" @click="openDialog('chart',item)">
<custom-signal :online="dc.dataObj[item.deviceCode]?.online"
:isp="dc.dataObj[item.deviceCode]?.isp"
:value="dc.dataObj[item.deviceCode]?.rssi" />
@ -253,7 +253,8 @@
</u-row>
</view>
<view class="control" v-if="dc.dataObj[child.dataKey]">
<view class="icon iconfont icon-tubiao"></view>
<view class="icon iconfont icon-tubiao"
@click="openDialog('chart',child)" />
<u-row v-if="child.device.deviceTypeKey == 'valve'">
<u-col span="3" style="margin-top: -10px;">
<u-button :disabled="child.device.disable?.open1"
@ -543,6 +544,8 @@
<custom-angle-slider ref="refAngleSlider" mode="bottom" @close="" @confirm="swiperConfirm" />
<!-- ADC -->
<custom-index-adc ref="adcRef" />
<!-- ADC -->
<custom-index-chart ref="adcChartRef" />
<!-- 墒情 -->
<custom-index-mp ref="mpRef" />
@ -683,18 +686,18 @@
//
async openDialog(key, row = null) {
switch (key) {
// case "chart": //线
// this.$refs.adcChartRef.show(row);
// break;
// case "wo":
// this.$refs.woRemarkRef.show(row);
// break;
// case "wh": //
// this.$refs.wateringHistoryRef.show(this.land, row);
// break;
// case "log": //
// this.$refs.deviceLogRef.show(this.land, row);
// break;
case "chart": //线
this.$refs.adcChartRef.show(row);
break;
// case "wo":
// this.$refs.woRemarkRef.show(row);
// break;
// case "wh": //
// this.$refs.wateringHistoryRef.show(this.land, row);
// break;
// case "log": //
// this.$refs.deviceLogRef.show(this.land, row);
// break;
case "mp": //
this.$refs.mpRef.show(this.ijs.land);
break;

View File

@ -47,7 +47,7 @@ export default {
if (res.confirm) {
resolve(res.confirm)
}
if(res.cancel){
if (res.cancel) {
reject(res.cancel);
}
}
@ -68,10 +68,14 @@ export default {
},
// 打开遮罩层
loading(text) {
uni.showLoading({
title: text,
icon: 'none'
})
let obj = {};
if (text) {
obj = {
title: text,
icon: 'none'
}
}
uni.showLoading(obj)
},
// 关闭遮罩层
closeLoading() {