303 lines
8.1 KiB
JavaScript
303 lines
8.1 KiB
JavaScript
// pages/parent/report/report.js
|
|
const tabService = require("../../../utils/tab-serve");
|
|
import uCharts from '../../../utils/chart/u-charts';
|
|
import {
|
|
getReport,
|
|
getPhysicalFitnessReport
|
|
} from '../../../utils/serve/parent'
|
|
import { getClassRoomRecord } from '../../../utils/serve/teacher';
|
|
import { getWeekdayWithValidation } from '../../../utils/utils';
|
|
|
|
var uChartsInstance = {};
|
|
|
|
// 各指标单位映射（接口不返回单位）
|
|
const UNIT_MAP = {
|
|
'BMI': 'kg/m²',
|
|
'肺活量': 'ml',
|
|
'坐位体前屈': 'cm',
|
|
'立定跳远': 'cm',
|
|
'一分钟跳绳': '个',
|
|
'一分钟仰卧起坐': '个',
|
|
};
|
|
|
|
Page({
|
|
|
|
/**
|
|
* 页面的初始数据
|
|
*/
|
|
data: {
|
|
report: {},
|
|
list: [],
|
|
isTrainee: false,
|
|
pageIndex: 1,
|
|
hasMore: true,
|
|
roomList: [],
|
|
// 体测报告
|
|
activeTab: 0, // 0=课堂报告 1=体测报告
|
|
fitnessItems: [], // 六个指标卡片
|
|
fitnessReport: null, // 接口返回的完整体测数据
|
|
radarCWidth: 300,
|
|
radarCHeight: 300,
|
|
pixelRatio: 2,
|
|
showFitnessPopup: false, // 成绩弹窗
|
|
selectedFitnessItem: null,
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
async onLoad(options) {
|
|
if(wx.getStorageSync('roleId') && wx.getStorageSync('roleId') == 5 ){
|
|
this.setData({
|
|
isTrainee: true
|
|
}, () => {
|
|
this.getTrainClass(true)
|
|
this.fetchFitnessReport()
|
|
})
|
|
} else {
|
|
await this.getStudentReport()
|
|
}
|
|
},
|
|
|
|
async getStudentReport() {
|
|
const res = await getReport()
|
|
let list = []
|
|
res.data.categoryScoreList.forEach(e => {
|
|
list.push({
|
|
...e,
|
|
width: e.score >= 60 && e.score <= 80 ? (((e.score - 60) / 4)*5 + 25) + '%' : ((e.score - 60) / 0.4 + 2) + '%',
|
|
grade: e.score >= 90 ? 'grate' : e.score >= 80 ? 'good' : e.score >= 60 ? 'normal' : ''
|
|
})
|
|
})
|
|
|
|
res.data.width = res.data.totalScore >= 60 && res.data.totalScore <= 80 ? (((res.data.totalScore - 60) / 4)*5 + 25) + '%' : ((res.data.totalScore - 60) / 0.4 + 2) + '%',
|
|
res.data.grade = res.data.totalScore >= 90 ? 'grate' : res.data.totalScore >= 80 ? 'good' : res.data.totalScore >= 60 ? 'normal' : ''
|
|
res.data.totalScore = res.data.totalScore.toFixed(0)
|
|
res.data.bodyFunction = res.data.bodyFunction.toFixed(0)
|
|
res.data.bodyQuality = res.data.bodyQuality.toFixed(0)
|
|
res.data.bodyShape = res.data.bodyShape.toFixed(0)
|
|
this.setData({
|
|
report: res.data,
|
|
list
|
|
})
|
|
},
|
|
|
|
// 切换体测/课堂 Tab
|
|
switchTab(e) {
|
|
const tab = Number(e.currentTarget.dataset.tab)
|
|
if (tab === this.data.activeTab) return
|
|
this.setData({ activeTab: tab }, () => {
|
|
if (tab === 1) {
|
|
// 切到体测报告时绘制雷达图
|
|
this.drawRadarChart(this)
|
|
}
|
|
})
|
|
},
|
|
|
|
// 获取体测报告数据
|
|
async fetchFitnessReport() {
|
|
try {
|
|
const res = await getPhysicalFitnessReport()
|
|
const list = (res.data && res.data.categoryScoreList) || []
|
|
const fitnessItems = list.map(item => ({
|
|
...item,
|
|
unit: UNIT_MAP[item.name] || '',
|
|
}))
|
|
this.setData({
|
|
fitnessReport: list,
|
|
fitnessItems,
|
|
})
|
|
} catch (e) {
|
|
this.setData({ fitnessItems: [] })
|
|
}
|
|
},
|
|
|
|
// 绘制六边形雷达图
|
|
drawRadarChart(that) {
|
|
const list = that.data.fitnessReport || []
|
|
const categories = list.map(i => i.name)
|
|
const prevData = list.map(i => i.prevScore || 0) // 上次成绩
|
|
const currentData = list.map(i => i.lastScore || 0) // 本次成绩
|
|
|
|
const query = wx.createSelectorQuery().in(that)
|
|
query.select('#radarCanvas').fields({ node: true, size: true }).exec(res => {
|
|
if (!res[0]) return
|
|
const canvas = res[0].node
|
|
const ctx = canvas.getContext('2d')
|
|
canvas.width = (res[0].width + 20) * that.data.pixelRatio
|
|
canvas.height = (res[0].height + 20) * that.data.pixelRatio
|
|
uChartsInstance['radarCanvas'] = new uCharts({
|
|
type: 'radar',
|
|
context: ctx,
|
|
width: that.data.radarCWidth * that.data.pixelRatio,
|
|
height: that.data.radarCHeight * that.data.pixelRatio,
|
|
categories,
|
|
series: [
|
|
{ name: '上次成绩', data: prevData, color: '#4A90E2' },
|
|
{ name: '本次成绩', data: currentData, color: '#E74C3C' },
|
|
],
|
|
pixelRatio: that.data.pixelRatio,
|
|
animation: true,
|
|
background: 'rgba(0,0,0,0)',
|
|
color: ['#4A90E2', '#E74C3C'],
|
|
padding: [0, 0, 0, 10],
|
|
legend: {
|
|
show: true,
|
|
position: 'bottom',
|
|
float: 'center',
|
|
fontSize: 12,
|
|
lineHeight: 11,
|
|
margin: 5,
|
|
itemGap: 20,
|
|
},
|
|
extra: {
|
|
radar: {
|
|
gridType: 'radar',
|
|
gridColor: '#CCCCCC',
|
|
gridCount: 4,
|
|
opacity: 0.15,
|
|
gridEvenShow: true,
|
|
gridOddShow: true,
|
|
labelShow: true,
|
|
labelColor: '#333',
|
|
fontSize: 13,
|
|
labelPointShow: false,
|
|
max: 100,
|
|
},
|
|
},
|
|
})
|
|
})
|
|
},
|
|
|
|
// 点击图标：展示成绩弹窗
|
|
showFitnessScore(e) {
|
|
const item = e.currentTarget.dataset.item
|
|
this.setData({ selectedFitnessItem: item, showFitnessPopup: true })
|
|
},
|
|
|
|
// 关闭成绩弹窗
|
|
closeFitnessPopup() {
|
|
this.setData({ showFitnessPopup: false, selectedFitnessItem: null })
|
|
},
|
|
|
|
// 弹窗内"查看详情"
|
|
goFitnessDetail() {
|
|
const item = this.data.selectedFitnessItem
|
|
if (!item) return
|
|
this.setData({ showFitnessPopup: false })
|
|
wx.setStorageSync('fitnessDetailItem', item)
|
|
wx.navigateTo({
|
|
url: '/subpackage/parent/fitness-detail/fitness-detail',
|
|
})
|
|
},
|
|
|
|
//获取教练课堂记录 刷新 加载更多
|
|
async getTrainClass(refresh) {
|
|
if (!this.data.hasMore && !refresh) return //非刷新且没有
|
|
const res = await getClassRoomRecord({
|
|
pageIndex: this.data.pageIndex,
|
|
PageSize: 20,
|
|
})
|
|
let newList = res.data.datas.map(item => {
|
|
return {
|
|
...item,
|
|
time: getWeekdayWithValidation(Number(item.startingEndingTime.slice(0, 4)), Number(item.startingEndingTime.slice(5, 7)), Number(item.startingEndingTime.slice(8, 10)))
|
|
}
|
|
})
|
|
this.setData({
|
|
roomList: refresh ? newList : [...this.data.roomList, ...newList],
|
|
page: this.data.page + 1,
|
|
hasMore: res.data.total > (this.data.pageIndex) * 20,
|
|
})
|
|
},
|
|
|
|
//查看报告详情
|
|
goReportDetail(e){
|
|
wx.navigateTo({
|
|
url: '/subpackage/teacher/report-detail/report-detail?id='+e.currentTarget.id ,
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面初次渲染完成
|
|
*/
|
|
onReady() {
|
|
const windowInfo = wx.getWindowInfo()
|
|
const pixelRatio = windowInfo.pixelRatio
|
|
const radarCWidth = windowInfo.windowWidth * 0.86
|
|
const radarCHeight = windowInfo.windowWidth * 0.86
|
|
this.setData({ radarCWidth, radarCHeight, pixelRatio }, () => {
|
|
if (this.data.isTrainee && this.data.activeTab === 1) {
|
|
this.drawRadarChart(this)
|
|
}
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow() {
|
|
tabService.updateIndex(this, 2)
|
|
if(wx.getStorageSync('roleId') && wx.getStorageSync('roleId') == 5){ //学员
|
|
this.setData({
|
|
isTrainee:true
|
|
})
|
|
}
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面隐藏
|
|
*/
|
|
onHide() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面卸载
|
|
*/
|
|
onUnload() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 页面相关事件处理函数--监听用户下拉动作
|
|
*/
|
|
async onPullDownRefresh() {
|
|
if(this.data.isTrainee){
|
|
this.setData({
|
|
pageIndex:1,
|
|
hasMore:true
|
|
},async ()=>{
|
|
this.getTrainClass(true)
|
|
await this.fetchFitnessReport()
|
|
wx.stopPullDownRefresh()
|
|
wx.showToast({
|
|
title: '刷新成功',
|
|
icon: 'none'
|
|
})
|
|
})
|
|
}else{
|
|
await this.getStudentReport()
|
|
wx.stopPullDownRefresh()
|
|
wx.showToast({
|
|
title: '刷新成功!',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
* 页面上拉触底事件的处理函数
|
|
*/
|
|
onReachBottom() {
|
|
this.getTrainClass()
|
|
},
|
|
|
|
/**
|
|
* 用户点击右上角分享
|
|
*/
|
|
onShareAppMessage() {
|
|
|
|
}
|
|
}) |