802 lines
25 KiB
JavaScript
802 lines
25 KiB
JavaScript
|
||
let util = require('../../../../../utils/util')
|
||
let apiArr = require('../../../../../api/water_filter')
|
||
import * as echarts from '../../../../../component/ec-canvas/echarts';
|
||
|
||
// packages/master/deviceInfo/index.js
|
||
Page({
|
||
|
||
/**
|
||
* 页面的初始数据
|
||
*/
|
||
data: {
|
||
id: "",
|
||
currentDevice: "",
|
||
imagePath: "",
|
||
ec: {
|
||
onInit: initChart
|
||
},
|
||
|
||
appointment_time: "",
|
||
show: false,
|
||
show2: false,
|
||
show3: false,
|
||
show4: false,
|
||
show5: false,
|
||
show6: false,
|
||
remarks1: "", //拆机备注
|
||
remainingDays: "",//到期日期
|
||
surplusFlow: "",//剩余流量
|
||
remaining_days: "",//转时长
|
||
surplus_flow: "",//转流量
|
||
minDate: new Date().getTime(),
|
||
formatter(type, value) {
|
||
if (type === 'year') {
|
||
return `${value}年`;
|
||
}
|
||
if (type === 'month') {
|
||
return `${value}月`;
|
||
}
|
||
if (type === 'day') {
|
||
return `${value}日`;
|
||
}
|
||
return value;
|
||
},
|
||
},
|
||
onInput(event) {
|
||
let that = this
|
||
const date = new Date(event.detail); // 获取选中的 Date 对象
|
||
const year = date.getFullYear(); // 获取年份
|
||
const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始，所以需要+1
|
||
const day = String(date.getDate()).padStart(2, '0');
|
||
const hours = String(date.getHours()).padStart(2, '0'); // 小时补零
|
||
const minutes = String(date.getMinutes()).padStart(2, '0'); // 分钟补零
|
||
const time = `${year}-${month}-${day} ${hours}:${minutes}`;
|
||
that.setData({
|
||
appointment_time: time,
|
||
show: false
|
||
})
|
||
|
||
that.cancelActivation()
|
||
},
|
||
onClose() {
|
||
let that = this
|
||
that.setData({
|
||
show: false
|
||
})
|
||
},
|
||
formatPercentage(value) {
|
||
return Math.max(0, Number((value || 0).toFixed(0)));
|
||
},
|
||
getInfo() {
|
||
let that = this
|
||
console.log(that, 'ssss');
|
||
util.postUrl(apiArr.deviceInfo, {
|
||
device_id: that.data.id
|
||
}, res => {
|
||
res.remainDay = Math.max(0, that.getDaysBetweenDates2(res.expiration_duration)) //剩余天数
|
||
if (res.expiration_duration) {
|
||
res.difDay = Math.max(0, that.getDaysBetweenDates(res.install_time)) //服务天数，确保不小于0
|
||
} else {
|
||
const installDate = new Date(res.install_time)
|
||
const expireDate = new Date(res.expiration_duration)
|
||
res.difDay = Math.max(0, Math.floor((expireDate - installDate) / (1000 * 60 * 60 * 24))) //确保不小于0
|
||
}
|
||
|
||
if (res.device_part) {
|
||
res.device_part.forEach(item => {
|
||
item.difDay = that.getDaysBetweenDates(item.start_time)
|
||
const remainingDays = Math.max(0, (item.available_days || 0) - (item.difDay || 0));
|
||
|
||
item.percentageDay = that.formatPercentage(
|
||
(remainingDays / (item.available_days || 1)) * 100
|
||
);
|
||
item.percentageCapacity = that.formatPercentage(
|
||
(1 - (item.threshold_volume || 0) / (item.available_volume || 1)) * 100
|
||
);
|
||
})
|
||
|
||
const first = res.device_part.findIndex(item =>
|
||
item.parts_name.indexOf("PP棉滤芯") !== -1
|
||
);
|
||
if (first !== -1) {
|
||
const [removed] = res.device_part.splice(first, 1); // 移除该对象
|
||
res.device_part.unshift(removed); // 插入到首位
|
||
}
|
||
const Second = res.device_part.findIndex(item =>
|
||
item.parts_name.indexOf("PP+CB") !== -1
|
||
);
|
||
if (Second !== -1) {
|
||
const [removed] = res.device_part.splice(Second, 1); // 移除该对象
|
||
res.device_part.splice(1, 0, removed); // 插入到第二位
|
||
}
|
||
const Third = res.device_part.findIndex(item =>
|
||
item.parts_name.indexOf("RO") !== -1
|
||
);
|
||
if (Third !== -1) {
|
||
const [removed] = res.device_part.splice(Third, 1); // 移除该对象
|
||
res.device_part.splice(2, 0, removed); // 插入到第二位
|
||
}
|
||
const Fourth = res.device_part.findIndex(item =>
|
||
item.parts_name.indexOf("后置活性炭") !== -1
|
||
);
|
||
if (Fourth !== -1) {
|
||
const [removed] = res.device_part.splice(Fourth, 1); // 移除该对象
|
||
res.device_part.splice(3, 0, removed); // 插入到第二位
|
||
}
|
||
}
|
||
res.today = Number(res.today).toFixed(2)
|
||
res.yesterday = Number(res.yesterday).toFixed(2)
|
||
|
||
that.setData({
|
||
currentDevice: res
|
||
})
|
||
let Xarr = [];
|
||
let Yarr = [];
|
||
res.device_net.forEach(item => {
|
||
Xarr.push(item.create_time.slice(11, 16))
|
||
Yarr.push((item.cumulative_filtration_flow).toFixed(1))
|
||
})
|
||
that.updateChart({
|
||
xAxis: Xarr,
|
||
series: Yarr
|
||
})
|
||
that.getDeriveInfo()
|
||
setTimeout(() => {
|
||
const ecComponent = that.selectComponent("#mychart-dom-bar")
|
||
// 将 canvas 内容转换为临时图片文件
|
||
ecComponent.canvasToTempFilePath({
|
||
// canvasId: 'mychart-dom-bar',
|
||
success: (result) => {
|
||
that.base64({
|
||
url: result.tempFilePath,
|
||
type: 'png',
|
||
}).then((res) => {
|
||
that.setData({
|
||
imagePath: res
|
||
})
|
||
})
|
||
},
|
||
fail: (err) => {
|
||
console.error('转换失败:', err);
|
||
}
|
||
});
|
||
}, 2000)
|
||
|
||
})
|
||
},
|
||
replay(e) {
|
||
wx.showLoading({
|
||
title: '重置中...',
|
||
})
|
||
util.postUrl4(apiArr.resetFilter, {
|
||
part_id: e.currentTarget.dataset.item.id,
|
||
device_id: e.currentTarget.dataset.item.device_id,
|
||
}, res => {
|
||
wx.hideLoading()
|
||
console.log(res);
|
||
if (res.msg == '操作成功') {
|
||
wx.showToast({
|
||
title: '重置成功！',
|
||
icon: "none"
|
||
})
|
||
that.getfilterList()
|
||
} else {
|
||
wx.showToast({
|
||
title: res.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
})
|
||
},
|
||
|
||
|
||
//查询设备实时信息
|
||
getDeriveInfo() {
|
||
let that = this
|
||
util.postUrl4(apiArr.boardInfo, {
|
||
device_id: that.data.currentDevice.device_id
|
||
}, res => {
|
||
console.log(res);
|
||
})
|
||
},
|
||
///////////////////////////////////////////////新增/////////////////////////////////////////////////////////////////////////
|
||
onClose2() {
|
||
this.setData({
|
||
show2: false,
|
||
show3: false,
|
||
show4: false,
|
||
show5: false,
|
||
show6: false,
|
||
})
|
||
},
|
||
// 拆机
|
||
uninstall() {
|
||
let that = this
|
||
wx.showModal({
|
||
title: '提示',
|
||
content: '请确保设备通电开机状态，该操作将取消设备激活状态',
|
||
complete: (res) => {
|
||
if (res.cancel) {
|
||
|
||
}
|
||
|
||
if (res.confirm) {
|
||
that.setData({
|
||
show2: true
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
remarksIpt1(e) {
|
||
console.log(e);
|
||
let that = this
|
||
that.setData({
|
||
remarks1: e.detail.value
|
||
})
|
||
},
|
||
createUninstall() {
|
||
wx.showLoading({
|
||
title: '加载中...',
|
||
mask: true
|
||
})
|
||
let that = this
|
||
util.postUrl(apiArr.createUninstallOrder, {
|
||
device_id: that.data.currentDevice.device_id,
|
||
info_id:wx.getStorageSync('info_id'),
|
||
remark: that.data.remarks1
|
||
}, res => {
|
||
console.log(res);
|
||
wx.hideLoading()
|
||
wx.showToast({
|
||
title: '拆机工单创建完成',
|
||
icon: "none"
|
||
})
|
||
|
||
setTimeout(() => {
|
||
wx.navigateTo({
|
||
url: '/packages/master/order/index?type=3',
|
||
})
|
||
}, 1500)
|
||
})
|
||
},
|
||
// 激活
|
||
active() {
|
||
wx.showLoading({
|
||
title: '加载中...',
|
||
mask: true
|
||
})
|
||
let that = this
|
||
util.postUrl4(apiArr.deviceActive, {
|
||
device_id: that.data.currentDevice.device_id
|
||
}, res => {
|
||
console.log(res);
|
||
wx.showToast({
|
||
title: res.msg,
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
wx.hideLoading()
|
||
|
||
return
|
||
if (res.statusCode == 200) {
|
||
wx.showToast({
|
||
title: '激活成功',
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
|
||
} else {
|
||
wx.showToast({
|
||
title: res.data.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
wx.hideLoading()
|
||
})
|
||
},
|
||
|
||
|
||
isPureNumber(value) {
|
||
return /^\d+(\.\d+)?$/.test(value);
|
||
},
|
||
//时长充值
|
||
recharge1() {
|
||
let that = this
|
||
that.setData({
|
||
show4: true
|
||
})
|
||
},
|
||
deviceDeactivation() {
|
||
let that = this
|
||
if (!that.isPureNumber(that.data.remainingDays)) {
|
||
return wx.showToast({
|
||
title: '请输入正确到期日期',
|
||
icon: "none"
|
||
})
|
||
}
|
||
wx.showModal({
|
||
title: '提示',
|
||
content: '确定要充值时长吗？请在设备通电开机的状态下进行操作',
|
||
complete: (res) => {
|
||
if (res.cancel) {
|
||
|
||
}
|
||
|
||
if (res.confirm) {
|
||
wx.showLoading({
|
||
title: '加载中...',
|
||
mask: true
|
||
})
|
||
util.postUrl4(apiArr.deviceDeactivation, {
|
||
device_id: that.data.currentDevice.device_id,
|
||
remainingDays: that.data.remainingDays
|
||
}, res => {
|
||
wx.hideLoading()
|
||
if (res.data.code == 200) {
|
||
wx.showToast({
|
||
title: '充值成功',
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
} else {
|
||
wx.showToast({
|
||
title: res.data.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
that.setData({
|
||
show4: false,
|
||
remainingDays: ""
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
changeRemainingDay(e) {
|
||
console.log(e);
|
||
let that = this
|
||
that.setData({
|
||
remainingDays: e.detail.value
|
||
})
|
||
},
|
||
//流量充值
|
||
recharge2() {
|
||
let that = this
|
||
that.setData({
|
||
show3: true
|
||
})
|
||
},
|
||
changeSurplusFlow(e) {
|
||
let that = this
|
||
that.setData({
|
||
surplusFlow: e.detail.value
|
||
})
|
||
},
|
||
deviceDataForce() {
|
||
let that = this
|
||
if (!that.isPureNumber(that.data.surplusFlow)) {
|
||
return wx.showToast({
|
||
title: '请输入正确数额',
|
||
icon: "none"
|
||
})
|
||
}
|
||
wx.showModal({
|
||
title: '提示',
|
||
content: '确定要充值流量吗？请在设备通电开机的状态下进行操作',
|
||
complete: (res) => {
|
||
if (res.cancel) {
|
||
|
||
}
|
||
|
||
if (res.confirm) {
|
||
util.postUrl4(apiArr.deviceDataForce, {
|
||
device_id: that.data.currentDevice.device_id,
|
||
surplusFlow: that.data.surplusFlow
|
||
}, res => {
|
||
if (res.data.code == 200) {
|
||
wx.showToast({
|
||
title: '充值成功',
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
} else {
|
||
wx.showToast({
|
||
title: res.data.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
that.setData({
|
||
show3: false,
|
||
surplusFlow: ""
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
//转时长
|
||
timeSet() {
|
||
let that = this
|
||
that.setData({
|
||
show5: true
|
||
})
|
||
},
|
||
changeRemainingDay2(e) {
|
||
console.log(e);
|
||
let that = this
|
||
that.setData({
|
||
remaining_days: e.detail.value
|
||
})
|
||
},
|
||
modeToTime() {
|
||
let that = this
|
||
if (!that.data.remaining_days) {
|
||
return wx.showToast({
|
||
title: '请输入到期日期',
|
||
})
|
||
}
|
||
wx.showModal({
|
||
title: '提示',
|
||
content: '确定要将设备转时长吗？请在设备通电开机的状态下进行操作',
|
||
complete: (res) => {
|
||
if (res.cancel) {
|
||
}
|
||
if (res.confirm) {
|
||
util.postUrl4(apiArr.deviceToTime, {
|
||
device_id: that.data.currentDevice.device_id,
|
||
remaining_days: that.data.remaining_days
|
||
}, res => {
|
||
if (res.data.code == 200) {
|
||
wx.showToast({
|
||
title: '充值成功',
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
} else {
|
||
wx.showToast({
|
||
title: res.data.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
that.setData({
|
||
show5: false,
|
||
remaining_days: ""
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
// 转流量
|
||
timeSet2() {
|
||
let that = this
|
||
that.setData({
|
||
show6: true
|
||
})
|
||
},
|
||
changeRemainingDay3(e) {
|
||
console.log(e);
|
||
let that = this
|
||
that.setData({
|
||
surplus_flow: e.detail.value
|
||
})
|
||
},
|
||
modeToFlowRate() {
|
||
let that = this
|
||
if (!that.data.surplus_flow) {
|
||
return wx.showToast({
|
||
title: '请输入数额',
|
||
})
|
||
}
|
||
wx.showModal({
|
||
title: '提示',
|
||
content: '确定要设备转流量吗？请在设备通电开机的状态下进行操作',
|
||
complete: (res) => {
|
||
if (res.cancel) {
|
||
}
|
||
if (res.confirm) {
|
||
util.postUrl4(apiArr.deviceToTraffic, {
|
||
device_id: that.data.currentDevice.device_id,
|
||
surplus_flow: that.data.surplus_flow
|
||
}, res => {
|
||
if (res.data.code == 200) {
|
||
wx.showToast({
|
||
title: '充值成功',
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
} else {
|
||
wx.showToast({
|
||
title: res.data.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
that.setData({
|
||
show6: false,
|
||
surplus_flow: ""
|
||
})
|
||
})
|
||
}
|
||
}
|
||
})
|
||
|
||
|
||
},
|
||
// 转零售
|
||
retailSet() {
|
||
let that = this
|
||
wx.showModal({
|
||
title: '提示',
|
||
content: '是否确认设置为零售模式？此操作请在设备通电开机的状态下进行操作',
|
||
complete: (res) => {
|
||
if (res.cancel) {
|
||
|
||
}
|
||
|
||
if (res.confirm) {
|
||
util.postUrl4(apiArr.deviceToRetail, {
|
||
device_id: that.data.currentDevice.device_id
|
||
}, res => {
|
||
if (res.data.code == 200) {
|
||
wx.showToast({
|
||
title: '设置成功',
|
||
icon: "none"
|
||
})
|
||
that.getInfo()
|
||
} else {
|
||
wx.showToast({
|
||
title: res.data.msg,
|
||
icon: "none"
|
||
})
|
||
}
|
||
})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
///////////////////////////////////////////////新增/////////////////////////////////////////////////////////////////////////
|
||
//开关机
|
||
openOff() {
|
||
let that = this
|
||
let onOff = ''
|
||
|
||
if (that.data.currentDevice.sevice_status == 1) {
|
||
onOff = 2
|
||
} else if (that.data.currentDevice.sevice_status == 2) {
|
||
onOff = 1
|
||
}
|
||
|
||
wx.showLoading({
|
||
title: '操作中...',
|
||
mask: true
|
||
})
|
||
|
||
util.postUrl(apiArr.openOff, {
|
||
deviceId: that.data.currentDevice.device_id,
|
||
onOff
|
||
}, res => {
|
||
wx.hideLoading()
|
||
console.log(res);
|
||
if (res.msg == '操作成功') {
|
||
if (res.data.params.sevice_status.value == '00') {
|
||
wx.hideLoading()
|
||
wx.showToast({
|
||
title: '关机成功！',
|
||
icon: "none"
|
||
})
|
||
that.setData({
|
||
"currentDevice.sevice_status": 2
|
||
})
|
||
console.log('关机');
|
||
} else if (res.data.params.sevice_status.value == '10') {
|
||
wx.hideLoading()
|
||
wx.showToast({
|
||
title: '开机成功！',
|
||
icon: "none"
|
||
})
|
||
that.setData({
|
||
"currentDevice.sevice_status": 1
|
||
})
|
||
console.log('开机');
|
||
}
|
||
}
|
||
})
|
||
},
|
||
|
||
updateChart(data) {
|
||
const ecComponent = this.selectComponent("#mychart-dom-bar");
|
||
if (!ecComponent) return;
|
||
|
||
this.setData({
|
||
chartData: data
|
||
});
|
||
|
||
ecComponent.init((canvas, width, height, dpr) => {
|
||
const chart = initChart(canvas, width, height, dpr);
|
||
chart.setOption({
|
||
grid: {
|
||
left: '3%', // 左边距
|
||
right: '4%', // 右边距
|
||
bottom: '3%', // 底部边距
|
||
containLabel: true // 确保标签包含在内
|
||
},
|
||
xAxis: {
|
||
data: data.xAxis
|
||
},
|
||
series: [{
|
||
data: data.series,
|
||
label: { // 添加这个label配置
|
||
show: true, // 开启显示
|
||
position: 'top', // 位置在柱子上方
|
||
color: '#333', // 文字颜色
|
||
// fontSize: 8 // 文字大小
|
||
}
|
||
}]
|
||
});
|
||
return chart;
|
||
});
|
||
},
|
||
|
||
base64({ url, type }) {
|
||
return new Promise((resolve, reject) => {
|
||
wx.getFileSystemManager().readFile({
|
||
filePath: url, //选择图片返回的相对路径
|
||
encoding: 'base64', //编码格式
|
||
success: res => {
|
||
resolve('data:image/' + type.toLocaleLowerCase() + ';base64,' + res.data)
|
||
},
|
||
fail: res => reject(res.errMsg)
|
||
})
|
||
})
|
||
},
|
||
convertCanvasToImage() {
|
||
wx.canvasToTempFilePath({
|
||
canvasId: 'myChart',
|
||
success: (res) => {
|
||
console.log(res.tempFilePath);
|
||
this.setData({
|
||
imagePath: res.tempFilePath
|
||
});
|
||
},
|
||
fail: (err) => {
|
||
console.error('Canvas to image failed:', err);
|
||
}
|
||
});
|
||
},
|
||
getDaysBetweenDates(inputDate) {
|
||
const currentDate = new Date();
|
||
// 将传入的日期字符串转换为日期对象
|
||
const targetDate = new Date(inputDate);
|
||
// 计算两个日期之间的时间差（以毫秒为单位）
|
||
const timeDifference = currentDate - targetDate;
|
||
// 将时间差转换为天数
|
||
const daysDifference = Math.floor(timeDifference / (1000 * 60 * 60 * 24));
|
||
// 返回天数
|
||
return daysDifference;
|
||
},
|
||
getDaysBetweenDates2(targetDate) {
|
||
// 获取当前日期（不含时间）
|
||
const today = new Date();
|
||
today.setHours(0, 0, 0, 0); // 时间归零，避免时间差影响
|
||
// 解析目标日期（格式：YYYY-MM-DD）
|
||
const target = new Date(targetDate);
|
||
target.setHours(0, 0, 0, 0);
|
||
// 计算毫秒差并转换为天数
|
||
const timeDiff = target - today;
|
||
const daysRemaining = Math.ceil(timeDiff / (1000 * 60 * 60 * 24));
|
||
return daysRemaining;
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面加载
|
||
*/
|
||
onLoad(options) {
|
||
let that = this
|
||
that.setData({
|
||
id: options.device_id
|
||
})
|
||
that.getInfo()
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面初次渲染完成
|
||
*/
|
||
onReady() {
|
||
let that = this
|
||
setTimeout(() => {
|
||
this.convertCanvasToImage()
|
||
}, 5000)
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面显示
|
||
*/
|
||
onShow() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面隐藏
|
||
*/
|
||
onHide() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 生命周期函数--监听页面卸载
|
||
*/
|
||
onUnload() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 页面相关事件处理函数--监听用户下拉动作
|
||
*/
|
||
onPullDownRefresh() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 页面上拉触底事件的处理函数
|
||
*/
|
||
onReachBottom() {
|
||
|
||
},
|
||
|
||
/**
|
||
* 用户点击右上角分享
|
||
*/
|
||
onShareAppMessage() {
|
||
|
||
}
|
||
})
|
||
|
||
function initChart(canvas, width, height, dpr) {
|
||
const chart = echarts.init(canvas, null, {
|
||
width: width,
|
||
height: height,
|
||
devicePixelRatio: dpr // 将此选项设置为 2，可以在高分辨率屏幕上绘制更清晰的图表
|
||
});
|
||
canvas.setChart(chart);
|
||
const option = {
|
||
xAxis: {
|
||
type: 'category',
|
||
// data: ['16:41', '22:41', '04:41', '10:41', '16:41'],
|
||
data: []
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
// data: ['0ml', '560ml']
|
||
min: 0,
|
||
axisLabel: {
|
||
formatter: '{value}ml'
|
||
}
|
||
},
|
||
series: [{
|
||
// data: [150, 230, 224, 218, 135, 147, 345],
|
||
data: [],
|
||
type: 'bar',
|
||
barWidth: 15,
|
||
itemStyle: { //柱状颜色和圆角
|
||
color: {
|
||
x: 0,
|
||
y: 1,
|
||
colorStops: [{
|
||
offset: 0,
|
||
color: '#FFBBAC',
|
||
}, {
|
||
offset: 1,
|
||
color: '#338BFF'
|
||
}]
|
||
},
|
||
barBorderRadius: [5, 5, 0, 0], // （顺时针左上，右上，右下，左下）
|
||
},
|
||
}]
|
||
};
|
||
chart.setOption(option);
|
||
return chart;
|
||
} |