// pages/assessment/assessment.js const util = require('../../../utils/util') const echarts = require("../../../component/ec-canvas/echarts") const assessmentService = require("../../../service/assessmentservice") const moment = require('../../../utils/moment.min') const app = getApp() function setOption(chart, data) { var option = { // title: { // text: data.total, //主标题文本 // subtext: '注册企业', //副标题文本 // }, color: ['#8BE7B7'], grid: { containLabel: true }, tooltip: { show: true, trigger: 'axis' }, xAxis: { name: '月份', nameLocation: 'end', type: 'category', boundaryGap: false, data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'], nameTextStyle: { fontSize: 10, }, // axisTick: { // interval = '0' // } }, yAxis: { name: '得分', x: 'center', type: 'value', splitLine: { lineStyle: { type: 'dashed' } } // show: false }, grid: { x: 30, y: 30, x2: 37, y2: 60 }, series: [{ name: '评分', type: 'line', smooth: true, areaStyle: { color: { type: 'linear', x: 0.5, y: 0, x2: 0.5, y2: 1, colorStops: [{ offset: 0, color: '#28db74' // 0% 处的颜色 }, { offset: 1, color: '#dcfeea79' // 100% 处的颜色 }], opacity: 0.1, global: false // 缺省为 false } }, data: data, }] }; chart.setOption(option); } Page({ /** * 页面的初始数据 */ data: { ec: { lazyLoad: true }, //当月评分情况 text1: "测评已开始!", text2: "请尽快完成测评", text3: "去测评", deadline: "----年--月--日", score: undefined, //折线图时间选择 planYear: "2000", maxYear: "2000", //当前的评分周期 thisPeriod: '2000/1-1', //评估历史 historys: [] }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { this.setData({ navContentHeight: util.navContentHeight(), statusBarHeight: wx.getSystemInfoSync().statusBarHeight }) this._initPlanYear() }, /** * 生命周期函数--监听页面初次渲染完成 */ onReady: function () { // setTimeout(() => { // 获取折线图组件 this.ecComponent = this.selectComponent('#mychart-dom-line'); this.initChart() // }, 1000); }, /** * 生命周期函数--监听页面显示 */ onShow: function () { var that = this wx.startPullDownRefresh({ success: (res) => {}, fail: (res) => {}, complete: (res) => {}, }) }, onPullDownRefresh(){ this.getHistoryPoint() }, initChart: function () { var data = { } this.ecComponent.init((canvas, width, height, dpr) => { // 获取组件的 canvas、width、height 后的回调函数 // 在这里初始化图表 const chart = echarts.init(canvas, null, { width: width, height: height, devicePixelRatio: dpr // new }); canvas.setChart(chart); setOption(chart, data); // 将图表实例绑定到 this 上,可以在其他成员函数(如 dispose)中访问 this.chart = chart; // 注意这里一定要返回 chart 实例,否则会影响事件处理等 return chart; }); }, /** * 初始化年份 */ _initPlanYear() { var now = moment() var year = now.year() var period = `${now.year()}/${now.month()+1}-${now.month()+1}` var deadline = now.endOf('month').format("YYYY年MM月DD日") this.setData({ planYear: `${year}年`, maxYear: year, thisPeriod: period, deadline: deadline }) }, /** * 获取评估规则 */ getRule() { assessmentService.getRule(app.globalData.userInfo.extension2, { }) }, /** * 获取评估历史记录 */ getHistoryPoint() { var that = this assessmentService.getHistoryPoint(app.globalData.accessToken.userId, 1, { success(data) { //当月评分情况 let lastOne = data[0] let date = moment(lastOne.updateDate) let period = `${date.year()}/${date.month()+1}-${date.month()+1}` if (period == that.data.thisPeriod) { that.setData({ score: lastOne.totalPoint, text1: "", text2: "本次测评已完成", text3: "查看详情", hasScore: true }) } else { that.setData({ text1: "测评已开始!", text2: "请尽快完成测评", text3: "去测评", score: undefined, hasScore: false }) } //历史评分情况与折线图 let historyList = [] that.chartData = {} data.forEach(d => { //历史记录 historyList.push({ score: d.totalPoint, color: d.color, rank: d.rank, level: d.level, period: d.period, time: d.period.replace('/', '年').replace(/\-[0-9]+/, '月'), scoreId: d.tPGuid, updateTime: moment(d.updateDate).format('YYYY-MM-DD hh:mm') }) //折线图数据 let y = d.period.split('/')[0] let key = y + '年' if (!that.chartData.hasOwnProperty(key)) { that.chartData[key] = ['0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0', '0'] if (y == date.year() + '') { let m = date.month() for (let i = m; i <= 11; i++) { that.chartData[key][i] = '-' } } } let monthGap = d.period.split('/')[1] let startMonth = parseInt(monthGap.split('-')[0]) let endMonth = parseInt(monthGap.split('-')[1]) for (let i = startMonth; i <= endMonth; i++) { that.chartData[key][i-1] = d.totalPoint } }); that.setData({ historys: historyList }) setTimeout(() => { setOption(that.chart, that.chartData[that.data.planYear]); }, 500); }, complete(res) { wx.stopPullDownRefresh({ success: (res) => {}, fail: (res) => {}, complete: (res) => {}, }) } }) }, /** * 选择计划年份 */ bindYearChange(e) { let y = e.detail.value this.setData({ planYear: `${y}年`, }) setOption(this.chart, this.chartData[this.data.planYear]) }, /** * 页面跳转 */ goto: function (e) { var url = "" var index = e.currentTarget.dataset.index switch (index) { case "0": //去测评或者查看详情 if (this.data.score) { url = `/pages/m_assessment/gradereport/gradereport?period=${this.data.thisPeriod}` } else { url = `/pages/m_assessment/grade/grade?record=false` } break; case "1": //历史评估记录详情 var period = e.currentTarget.dataset.period url = `/pages/m_assessment/gradereport/gradereport?period=${period}` break; case "2": //碳排放智能估算 url = "" break; case "3": //其他专项自测 url = "" break; case "4": break; case "5": break; } if (url != "") { wx.navigateTo({ url: url }) } else { wx.showToast({ title: '功能敬请期待', duration: 1000, icon: 'none', mask: true, }) } } })