|
|
@ -1,17 +1,19 @@ |
|
|
|
// package/deviceBigdataGraph/detail/detail.js
|
|
|
|
import * as echarts from '../../components/ec-canvas/echarts'; |
|
|
|
function setOption(chart, data1,data2) { |
|
|
|
const moment = require("../../../utils/moment"); |
|
|
|
|
|
|
|
function setOption(chart, data1, data2,xdata) { |
|
|
|
const option = { |
|
|
|
legend: { |
|
|
|
data: ['设备故障率', '设备完好率'], |
|
|
|
top:'-5px' |
|
|
|
}, |
|
|
|
title:{ |
|
|
|
text:'单位%', |
|
|
|
top:'-5px', |
|
|
|
textStyle:{ |
|
|
|
fontSize:'10px', |
|
|
|
fontWeight:'normal' |
|
|
|
data:['设备故障率', '设备完好率'], |
|
|
|
top: '-5px' |
|
|
|
}, |
|
|
|
title: { |
|
|
|
text: '单位%', |
|
|
|
top: '-5px', |
|
|
|
textStyle: { |
|
|
|
fontSize: '10px', |
|
|
|
fontWeight: 'normal' |
|
|
|
} |
|
|
|
}, |
|
|
|
grid: { |
|
|
@ -23,19 +25,18 @@ function setOption(chart, data1,data2) { |
|
|
|
}, |
|
|
|
xAxis: { |
|
|
|
type: 'category', |
|
|
|
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] |
|
|
|
data:xdata |
|
|
|
}, |
|
|
|
yAxis: { |
|
|
|
type: 'value', |
|
|
|
}, |
|
|
|
series: [ |
|
|
|
{ |
|
|
|
name:'设备完好率', |
|
|
|
series: [{ |
|
|
|
name: '设备完好率', |
|
|
|
data: data1, |
|
|
|
type: 'line' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name:'设备故障率', |
|
|
|
name: '设备故障率', |
|
|
|
data: data2, |
|
|
|
type: 'line' |
|
|
|
} |
|
|
@ -57,22 +58,28 @@ Page({ |
|
|
|
lazyLoad: true, // 将 lazyLoad 设为 true 后,需要手动初始化图表
|
|
|
|
}, |
|
|
|
isLoaded: false, |
|
|
|
list: [1,2,3] |
|
|
|
list: [1, 2, 3], |
|
|
|
count: 0, //设备总数
|
|
|
|
deviceList: [], //设备列表
|
|
|
|
equipmentFailureRate: 0, //设备故障率
|
|
|
|
equipmentIntegrityRate: 0, //设备完好率
|
|
|
|
normalCount: 0, //正常数量
|
|
|
|
abnormalCount: 0, //异常数量
|
|
|
|
unknownCount: 0, //未知数量
|
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 生命周期函数--监听页面加载 |
|
|
|
*/ |
|
|
|
initChart: function (data1,data2) { |
|
|
|
initChart: function (data1, data2,xData) { |
|
|
|
this.ecComponent = this.selectComponent('#device-status-chart'); |
|
|
|
|
|
|
|
this.ecComponent.init((canvas, width, height, dpr) => { |
|
|
|
const chart = echarts.init(canvas, null, { |
|
|
|
width: width, |
|
|
|
height: height, |
|
|
|
devicePixelRatio: dpr // new
|
|
|
|
}); |
|
|
|
setOption(chart, data1,data2); |
|
|
|
setOption(chart, data1, data2,xData); |
|
|
|
|
|
|
|
// 将图表实例绑定到 this 上,可以在其他成员函数中访问
|
|
|
|
this.chart = chart; |
|
|
@ -86,11 +93,137 @@ Page({ |
|
|
|
}); |
|
|
|
}, |
|
|
|
onLoad(options) { |
|
|
|
const that = this |
|
|
|
//上次菜单传入设备列表
|
|
|
|
const complexArray = JSON.parse(decodeURIComponent(options.arrayData)); |
|
|
|
//上级菜单传入巡检记录
|
|
|
|
const patrolRecord = JSON.parse(decodeURIComponent(options.patrolRecord)) |
|
|
|
const today = moment(); |
|
|
|
// 创建一个对象来存储每个pointId的最大inspectionTime
|
|
|
|
const maxInspectionTimeByPointId = {}; |
|
|
|
const sevenDaysAgo = moment().subtract(7, 'days'); // 获取七天前的日期
|
|
|
|
// 过滤出近七天内的最新记录(同点位+同一天的最新记录)
|
|
|
|
const latestRecords = patrolRecord.filter((record) => { |
|
|
|
const inspectionDate = moment(record.inspectionTime).format('YYYY-MM-DD'); |
|
|
|
const isWithin7Days = moment(today).diff(inspectionDate, 'days') <= 7; |
|
|
|
if (!isWithin7Days) { |
|
|
|
return false; |
|
|
|
} |
|
|
|
return patrolRecord.every((r) => { |
|
|
|
if (r.pointId === record.pointId && moment(r.inspectionTime).isSame(moment(record.inspectionTime), 'day')) { |
|
|
|
return moment(r.inspectionTime).isSameOrBefore(moment(record.inspectionTime)); |
|
|
|
} |
|
|
|
return true; |
|
|
|
}); |
|
|
|
}); |
|
|
|
//调用每天的函数处理每天的正常-异常-未知的个数
|
|
|
|
const sevenDays= that.calculateDailyDeviceStatusCounts(latestRecords) |
|
|
|
// 遍历数据并更新maxInspectionTimeByPointId
|
|
|
|
patrolRecord.forEach((item) => { |
|
|
|
const {pointId,inspectionTime} = item; |
|
|
|
if (pointId in maxInspectionTimeByPointId) { |
|
|
|
if (inspectionTime > maxInspectionTimeByPointId[pointId]) { |
|
|
|
maxInspectionTimeByPointId[pointId] = inspectionTime; |
|
|
|
} |
|
|
|
} else { |
|
|
|
maxInspectionTimeByPointId[pointId] = inspectionTime; |
|
|
|
} |
|
|
|
}); |
|
|
|
// 过滤数据以获取相同pointId中inspectionTime最大的记录
|
|
|
|
const filteredData = patrolRecord.filter((item) => { |
|
|
|
const { pointId,inspectionTime} = item; |
|
|
|
const inspectionDate = moment(inspectionTime); |
|
|
|
if (inspectionDate.isBetween(sevenDaysAgo, today, null, '[]')) { |
|
|
|
return inspectionTime === maxInspectionTimeByPointId[pointId]; |
|
|
|
} |
|
|
|
return false; |
|
|
|
}); |
|
|
|
//七天内最新的数据(正常)
|
|
|
|
const statusCounts =that.classifiedStatistics(filteredData) |
|
|
|
const {unknown,normal,abnormal}=statusCounts |
|
|
|
const deviceCount=complexArray.length |
|
|
|
that.setData({ |
|
|
|
count: complexArray.length || 0, |
|
|
|
deviceList: complexArray, |
|
|
|
equipmentFailureRate:deviceCount?Math.round(((unknown+abnormal)/deviceCount)*100):0, |
|
|
|
quipmentIntegrityRate:deviceCount?Math.round((normal/deviceCount)*100):0 |
|
|
|
}) |
|
|
|
//正常数据
|
|
|
|
const data1=Object.values(sevenDays).map(item=>Number(Math.round((item.normal/complexArray.length)*100))) |
|
|
|
//故障数据
|
|
|
|
const data2=Object.values(sevenDays).map(item=>Number(Math.round((item.abnormal+item.unknown/complexArray.length)*100))) |
|
|
|
const xData=Object.keys(sevenDays) |
|
|
|
setTimeout(() => { |
|
|
|
this.initChart([1,2,3,4,5,6],[1,2,3,10,1]) |
|
|
|
that.initChart(data1,data2,xData) |
|
|
|
}, 1000) |
|
|
|
|
|
|
|
}, |
|
|
|
//分类统计设备,异常-正常-未知个数
|
|
|
|
classifiedStatistics:function(list){ |
|
|
|
let normal = 0; |
|
|
|
let abnormal = 0; |
|
|
|
let unknown = 0; |
|
|
|
list.forEach((item) => { |
|
|
|
const inspectContent = item.alarm ? (item?.points?.inspectContent || []) : []; |
|
|
|
if (inspectContent && inspectContent.length && Array.isArray(inspectContent)) { |
|
|
|
inspectContent.forEach((p) => { |
|
|
|
// 如果设备有报警
|
|
|
|
if (p.alarm) { |
|
|
|
if (item.patrolRecordIssueHandles.length) { |
|
|
|
const state = item.patrolRecordIssueHandles[0].state; |
|
|
|
if (state === 6) { |
|
|
|
// 正常
|
|
|
|
normal += 1; |
|
|
|
} else if (state === 5) { |
|
|
|
// 未知
|
|
|
|
unknown += 1; |
|
|
|
} else { |
|
|
|
// 异常
|
|
|
|
abnormal += 1; |
|
|
|
} |
|
|
|
} |
|
|
|
} else { |
|
|
|
// 正常
|
|
|
|
normal += 1; |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
return {normal,unknown,abnormal} |
|
|
|
}, |
|
|
|
//统计每天异常-正常-未知个数
|
|
|
|
calculateDailyDeviceStatusCounts:function(data) { |
|
|
|
const dateRange = [] |
|
|
|
const today = moment() |
|
|
|
for (let i = 6; i >= 0; i--) { |
|
|
|
dateRange.push(today.clone().subtract(i, 'days').format('YYYY-MM-DD')); |
|
|
|
} |
|
|
|
const dailyCounts = {}; |
|
|
|
// 初始化每一天的统计为零
|
|
|
|
dateRange.forEach((date) => { |
|
|
|
dailyCounts[date] = { |
|
|
|
normal: 0, |
|
|
|
unknown: 0, |
|
|
|
abnormal: 0 |
|
|
|
}; |
|
|
|
}); |
|
|
|
// 遍历数据,根据日期统计
|
|
|
|
data.forEach((item) => { |
|
|
|
const inspectionDate = moment(item.inspectionTime).format('YYYY-MM-DD'); |
|
|
|
if (dailyCounts[inspectionDate] !== undefined) { |
|
|
|
const status = item.patrolRecordIssueHandles.length ? item.patrolRecordIssueHandles[0].state : 6; |
|
|
|
if (status === 6) { |
|
|
|
dailyCounts[inspectionDate].normal += 1; |
|
|
|
} else if (status === 5) { |
|
|
|
dailyCounts[inspectionDate].unknown += 1; |
|
|
|
} else { |
|
|
|
dailyCounts[inspectionDate].abnormal += 1; |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
return dailyCounts; |
|
|
|
}, |
|
|
|
/** |
|
|
|
* 生命周期函数--监听页面初次渲染完成 |
|
|
|
*/ |
|
|
|