|
|
@ -1,6 +1,15 @@ |
|
|
// package/deviceBigdataGraph/lifeWarning/lifeWarning.js
|
|
|
// package/deviceBigdataGraph/lifeWarning/lifeWarning.js
|
|
|
import * as echarts from '../../components/ec-canvas/echarts'; |
|
|
import * as echarts from '../../components/ec-canvas/echarts'; |
|
|
function setOption(chart, data) { |
|
|
import { |
|
|
|
|
|
getAllPatrol, |
|
|
|
|
|
getDevices,getProjectList |
|
|
|
|
|
} from "../../../utils/getApiUrl"; |
|
|
|
|
|
import { |
|
|
|
|
|
Request |
|
|
|
|
|
} from "../../../common"; |
|
|
|
|
|
const moment = require("../../../utils/moment"); |
|
|
|
|
|
|
|
|
|
|
|
function setOption(chart, seriesData, xData) { |
|
|
const option = { |
|
|
const option = { |
|
|
grid: { |
|
|
grid: { |
|
|
top: '5%', |
|
|
top: '5%', |
|
|
@ -11,20 +20,18 @@ function setOption(chart, data) { |
|
|
}, |
|
|
}, |
|
|
xAxis: { |
|
|
xAxis: { |
|
|
type: 'category', |
|
|
type: 'category', |
|
|
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] |
|
|
data: xData |
|
|
}, |
|
|
}, |
|
|
yAxis: { |
|
|
yAxis: { |
|
|
type: 'value', |
|
|
type: 'value', |
|
|
}, |
|
|
}, |
|
|
series: [ |
|
|
series: [{ |
|
|
{ |
|
|
data: seriesData, |
|
|
data: data, |
|
|
|
|
|
type: 'line' |
|
|
type: 'line' |
|
|
}, |
|
|
}, ] |
|
|
] |
|
|
|
|
|
}; |
|
|
}; |
|
|
chart.setOption(option); |
|
|
chart.setOption(option); |
|
|
} |
|
|
} |
|
|
Page({ |
|
|
Page({ |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
@ -36,9 +43,13 @@ Page({ |
|
|
lazyLoad: true, // 将 lazyLoad 设为 true 后，需要手动初始化图表
|
|
|
lazyLoad: true, // 将 lazyLoad 设为 true 后，需要手动初始化图表
|
|
|
}, |
|
|
}, |
|
|
isLoaded: false, |
|
|
isLoaded: false, |
|
|
list: [1,2,3] |
|
|
list: [1, 2, 3], |
|
|
|
|
|
count: 0, //总设备数
|
|
|
|
|
|
guaranteedRate: 0, //过保率
|
|
|
|
|
|
warrantyPeriod: 0, //质保期
|
|
|
|
|
|
next30days: [], //未来30天过期的设备列表
|
|
|
}, |
|
|
}, |
|
|
initChart: function (data) { |
|
|
initChart: function (seriesData, xData) { |
|
|
this.ecComponent = this.selectComponent('#device-status-chart'); |
|
|
this.ecComponent = this.selectComponent('#device-status-chart'); |
|
|
this.ecComponent.init((canvas, width, height, dpr) => { |
|
|
this.ecComponent.init((canvas, width, height, dpr) => { |
|
|
const chart = echarts.init(canvas, null, { |
|
|
const chart = echarts.init(canvas, null, { |
|
|
@ -46,7 +57,7 @@ Page({ |
|
|
height: height, |
|
|
height: height, |
|
|
devicePixelRatio: dpr // new
|
|
|
devicePixelRatio: dpr // new
|
|
|
}); |
|
|
}); |
|
|
setOption(chart, data); |
|
|
setOption(chart, seriesData, xData); |
|
|
|
|
|
|
|
|
// 将图表实例绑定到 this 上，可以在其他成员函数中访问
|
|
|
// 将图表实例绑定到 this 上，可以在其他成员函数中访问
|
|
|
this.chart = chart; |
|
|
this.chart = chart; |
|
|
@ -63,13 +74,95 @@ Page({ |
|
|
* 生命周期函数--监听页面加载 |
|
|
* 生命周期函数--监听页面加载 |
|
|
*/ |
|
|
*/ |
|
|
onLoad(options) { |
|
|
onLoad(options) { |
|
|
const {windowHeight}=wx.getSystemInfoSync() |
|
|
const projectList=decodeURIComponent(options.arrayData) |
|
|
const pageHeight=windowHeight - 48 |
|
|
const complexArray = JSON.parse(projectList); |
|
|
|
|
|
const { |
|
|
|
|
|
windowHeight |
|
|
|
|
|
} = wx.getSystemInfoSync() |
|
|
|
|
|
const pageHeight = windowHeight - 48 |
|
|
|
|
|
const that = this |
|
|
|
|
|
that.setData({ |
|
|
|
|
|
pageHeight: pageHeight + 'px' |
|
|
|
|
|
}) |
|
|
|
|
|
Request.get(getDevices()).then(res => { |
|
|
|
|
|
if (res && res.length) { |
|
|
|
|
|
// 获取当前日期
|
|
|
|
|
|
const currentDate = new Date(); |
|
|
|
|
|
// 计算 30 天后的日期
|
|
|
|
|
|
const thirtyDaysLater = new Date(currentDate); |
|
|
|
|
|
thirtyDaysLater.setDate(thirtyDaysLater.getDate() + 30); |
|
|
|
|
|
// 计算半年后的日期
|
|
|
|
|
|
const sixMonthsLater = new Date(); |
|
|
|
|
|
sixMonthsLater.setMonth(sixMonthsLater.getMonth() + 6); |
|
|
|
|
|
// 初始化每个月的设备计数数组
|
|
|
|
|
|
const monthlyCounts = new Array(6).fill(0); |
|
|
|
|
|
// 创建日期范围
|
|
|
|
|
|
const dateRange = []; |
|
|
|
|
|
//30天内过期设备列表
|
|
|
|
|
|
const expiringDevices = []; |
|
|
|
|
|
for (let i = 0; i < 6; i++) { |
|
|
|
|
|
const startOfMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + i, 1); |
|
|
|
|
|
dateRange.push({ |
|
|
|
|
|
start: startOfMonth, |
|
|
|
|
|
end: new Date(startOfMonth.getFullYear(), startOfMonth.getMonth() + 1, 0) |
|
|
|
|
|
}); |
|
|
|
|
|
} |
|
|
|
|
|
// 遍历设备列表
|
|
|
|
|
|
res.forEach((device) => { |
|
|
|
|
|
const guaranteeDate = new Date(device.dateGuarantee); |
|
|
|
|
|
if (guaranteeDate >= currentDate && guaranteeDate <= thirtyDaysLater) { |
|
|
|
|
|
const pointDevices = device.pointDevices; |
|
|
|
|
|
pointDevices.forEach((pointDevice) => { |
|
|
|
|
|
const point = pointDevice.point; |
|
|
|
|
|
// 查找匹配项目
|
|
|
|
|
|
const project = complexArray.find((project) => project.id === point.projectId); |
|
|
|
|
|
if (project) { |
|
|
|
|
|
device.project = project; |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
expiringDevices.push(device); |
|
|
|
|
|
} |
|
|
|
|
|
// 检查设备的 dateGuarantee 是否在日期范围内
|
|
|
|
|
|
for (let i = 0; i < dateRange.length; i++) { |
|
|
|
|
|
if (guaranteeDate >= dateRange[i].start && guaranteeDate <= dateRange[i].end) { |
|
|
|
|
|
// 设备在当前月内到期
|
|
|
|
|
|
monthlyCounts[i]++; |
|
|
|
|
|
break; // 结束循环，不需要继续检查其他月份
|
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
const xAxisLabels = []; |
|
|
|
|
|
// 生成未来六个月的月份
|
|
|
|
|
|
for (let i = 0; i < 6; i++) { |
|
|
|
|
|
// const nextMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + i, 1);
|
|
|
|
|
|
// const year = nextMonth.getFullYear();
|
|
|
|
|
|
// const month = String(nextMonth.getMonth() + 1).padStart(2, '0'); // 月份格式化为两位数
|
|
|
|
|
|
// const label = `${year}-${month}`;
|
|
|
|
|
|
// xAxisLabels.push(label);
|
|
|
|
|
|
const nextMonth = new Date(currentDate.getFullYear(), currentDate.getMonth() + i, 1); |
|
|
|
|
|
const month = nextMonth.toLocaleDateString('en-US', { |
|
|
|
|
|
month: 'short' |
|
|
|
|
|
}); // 获取月份的缩写
|
|
|
|
|
|
xAxisLabels.push(month); |
|
|
|
|
|
} |
|
|
|
|
|
//过期的
|
|
|
|
|
|
const guaranteedRate = res.filter(item => moment(item.dateGuarantee).isBefore(moment()))?.length || 0 |
|
|
|
|
|
//没过期的
|
|
|
|
|
|
const warrantyPeriod = res.filter(item => moment(item.dateGuarantee).isAfter(moment()))?.length || 0 |
|
|
|
|
|
that.setData({ |
|
|
|
|
|
count: res.length, |
|
|
|
|
|
guaranteedRate: guaranteedRate, |
|
|
|
|
|
warrantyPeriod: warrantyPeriod, |
|
|
|
|
|
next30days:expiringDevices |
|
|
|
|
|
}) |
|
|
setTimeout(() => { |
|
|
setTimeout(() => { |
|
|
this.initChart([1,2,3,4,5,6]) |
|
|
this.initChart(monthlyCounts, xAxisLabels) |
|
|
}, 1000) |
|
|
}, 1000) |
|
|
const that = this |
|
|
} else { |
|
|
that.setData({pageHeight:pageHeight+'px'}) |
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
|
zhaobing’
1 year ago