// pages/wateranalysis/wateranalysis.js import * as echarts from '../../components/ec-canvas/echarts.js'; import { barChartOptions, lineChartOptions } from '../../utils/chart.js'; let moment = require('../../utils/moment.js'); const app = getApp(); Page({ /** * 页面的初始数据 */ data: { currentYear: moment().year(), waterInfo: {}, ec: { lazyLoad: true, }, }, // 初始化echart图表 initChart({ id, type, data, color, configs }) { const { legend = [], xAxis = [], series = [] } = data; const setOption = () => { if (type == 'bar') { this[id].setOption(barChartOptions({ legend, xAxis, series }, color, configs), true); } else { this[id].setOption(lineChartOptions({ legend, xAxis, series }, color), true); } } if (this[id]) { setOption(); return } this.selectComponent(`#${id}`).init((canvas, width, height) => { this[id] = echarts.init(canvas, null, { width: width, height: height }); canvas.setChart(this[id]); setOption(); return this[id]; }); }, /** * 生命周期函数--监听页面加载 */ getWaterAnalysis() { wx.showLoading({ title: '加载中', mask: true }); app.$http.get('/statistics/getUseWaterAnalyze').then(({ status, msg, data: { list = [], averageUseVolume = 0, maxUseWater = 0, minUseWater = 0, totalUseVolume = 0 } }) => { if (status === 0) { this.setData({ waterInfo: { list, averageUseVolume, maxUseWater, minUseWater, totalUseVolume } }) list = list.sort(function(a, b) { return a.date - b.date }) const legend = ['用水量'], xAxis = [], series = [ [] ]; if (list.length) { this.setData({ list: list }) list.forEach(v => { let date = v.date.toString(); date = date.substr(4, 2); xAxis.push(date); series[0].push(v.useVolume) }) const option = { id: 'weekChart', type: 'bar', data: { legend, series, xAxis }, color: ['#FFF'], configs: { barWidth: 16 } } this.initChart(option); } } wx.hideLoading(); }).catch(() => { wx.hideLoading(); }) }, onLoad: function(options) { this.getWaterAnalysis(); }, })