// package/subSystem/subSystem.js import * as echarts from '../components/ec-canvas/echarts'; import { getSubSystemPatrolAbout } from "../../utils/getApiUrl"; import { Request } from "../../common"; const moment = require("../../utils/moment"); Page({ initECharts(option) { this.ecComponent.init((canvas, width, height, dpr) => { const chart = echarts.init(canvas, null, { width: width, height: height, devicePixelRatio: dpr, }); // 设置图表的配置 chart.setOption(option); // 将 ECharts 实例保存在数据中 this.chart = chart; // 返回 ECharts 实例 return chart; }); }, /** * 页面的初始数据 */ data: { ec: { // lazyLoad: true, // 延迟加载 ECharts }, date: '', show: true, currentPatrolCount: 0, //当月巡检次数 currentRepairCount: 0, //当月维修次数 level1Count: 0, //轻微 level2Count: 0, //中度 level3Count: 0, //严重 selectedDate: new Date(), // 设置默认选中的日期为当前日期 formatter(day) { return day; }, }, onDisplay() { this.setData({ show: true }); }, onClose() { this.setData({ show: false }); }, onConfirm(event) { this.setData({ show: false, date: this.formatDate(event.detail), }); }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { const {windowHeight}=wx.getSystemInfoSync() const pageHeight=windowHeight - 48 const that=this wx.showLoading({ title: '加载中' }) // const that = this; wx.setNavigationBarTitle({ title: options.key, }); //加载初始化数据 that.getSubSystemPatrolAbout(options) //初始化图表的配置项 // 其他渲染逻辑 // 创建一个 Date 对象来获取当前日期 const currentDate = new Date(); // 获取当前年份 const currentYear = currentDate.getFullYear(); // 获取当前月份(注意,月份是从 0 到 11 表示,所以需要加 1) const currentMonth = currentDate.getMonth() + 1; // 获取当前月份的第一天和最后一天 const nextMonth = new Date().getMonth() + 1; const firstDay = new Date().setDate(1); const lastDay = new Date().setMonth(nextMonth, 1) - 86400000; // 更新数据,将年份和月份传递给 WXML 页面 that.setData({ currentYear: currentYear, currentMonth: currentMonth, lastDay: lastDay, firstDay: firstDay, pageHeight:pageHeight+'px' }); wx.hideLoading() }, //过滤轻微,中度,重度的巡检个数 filterLevelCount:function(list,level){ return list?.filter(i => { const content = i?.points?.inspectContent if (content) { for (let key in content) { if (content.hasOwnProperty(key)) { const subObject = content[key]; return subObject.level===level } } } })?.length }, getSubSystemPatrolAbout: function (options) { let that = this; //当月开始时间 const STime = moment().startOf('month').format('YYYY-MM-DD') //当月结束时间 const ETime = moment().endOf('month').format('YYYY-MM-DD') //子系统关键字 let keywords = options.key // keywords = '管廊' const query = { STime, ETime, keywords } Request.get(getSubSystemPatrolAbout(query)).then(res => { if (res) { //巡查内容 that.setData({ currentRepairCount: res?.filter(i => i?.patrolRecordIssueHandles[0]?.yanshoushijian && parseInt(moment(i?.patrolRecordIssueHandles[0]?.yanshoushijian).format('YYYYMMDD')) === parseInt(moment().format('YYYYMMDD'))).length || 0, currentPatrolCount: res.length, level1Count: that.filterLevelCount(res,'轻微')||0, level2Count: that.filterLevelCount(res,'中度')||0, level3Count: that.filterLevelCount(res,'严重')||0, formatter:function(e){ res?.map(i=>{ if(moment(i.inspectionTime).format('YYYY-MM-DD')==moment(e.date).format('YYYY-MM-DD')){ if( i.patrolRecordIssueHandles.length==0){ e.bottomInfo = '.';e.className = 'greenClass' }else if( i.patrolRecordIssueHandles.length&& i?.patrolRecordIssueHandles[0]?.yanshoushijian && parseInt(moment(i?.patrolRecordIssueHandles[0]?.yanshoushijian).format('YYYYMMDD')) === parseInt(moment().format('YYYYMMDD'))){ e.bottomInfo = '.';e.className = 'yellowClass' } } }) return e } }) that.ecComponent = that.selectComponent('#mychart-dom-pie'); console.log('that.level1Count',this.data.level2Count) var option = { backgroundColor: "#ffffff", legend: { bottom: 10, left: 'center', }, series: [{ label: { normal: { fontSize: 14 } }, type: 'pie', center: ['50%', '50%'], radius: ['20%', '40%'], data:[ {name:'轻微',value:that.data.level1Count}, {name:'中度',value:that.data.level2Count}, {name:'重度',value:that.data.level3Count}] }] }; that.initECharts(option); wx.hideLoading() } else { wx.hideLoading(); } }) }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady() { }, /** * 生命周期函数--监听页面显示 */ onShow() { }, /** * 生命周期函数--监听页面隐藏 */ onHide() { }, /** * 生命周期函数--监听页面卸载 */ onUnload() { }, /** * 页面相关事件处理函数--监听用户下拉动作 */ onPullDownRefresh() { getSubSystemPatrolAbout() }, /** * 页面上拉触底事件的处理函数 */ onReachBottom() { }, /** * 用户点击右上角分享 */ onShareAppMessage() { } })