|
@@ -1,197 +1,202 @@
|
|
|
const app = getApp()
|
|
|
import * as echarts from '../../../commpents/ec-canvas/echarts'
|
|
|
Page({
|
|
|
- data: {
|
|
|
- frameStyle: { useTop: true, name: '教练统计', leftArrow: true, useBar: false },
|
|
|
- // 选中
|
|
|
- tabs: {
|
|
|
- active: '0',
|
|
|
- menu: [
|
|
|
- { title: '教练出勤率', active: '0' },
|
|
|
- { title: '教练收入情况', active: '1' },
|
|
|
- ]
|
|
|
+ data: {
|
|
|
+ frameStyle: { useTop: true, name: '教练统计', leftArrow: true, useBar: false },
|
|
|
+ // 选中
|
|
|
+ tabs: {
|
|
|
+ active: '0',
|
|
|
+ menu: [
|
|
|
+ { title: '教练出勤率', active: '0' },
|
|
|
+ { title: '教练收入情况', active: '1' },
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ coachList: [],
|
|
|
+ percentage: [],
|
|
|
+ date: [],
|
|
|
+ money: [],
|
|
|
},
|
|
|
- coachList: [],
|
|
|
-
|
|
|
- },
|
|
|
- // 返回
|
|
|
- back(e) {
|
|
|
- wx.navigateBack({ delta: 1 })
|
|
|
- },
|
|
|
- // 选项卡选择
|
|
|
- tabsChange: function (e) {
|
|
|
- const that = this;
|
|
|
- let data = e.detail;
|
|
|
- that.setData({ 'tabs.active': data.active })
|
|
|
- },
|
|
|
- // 选择教练
|
|
|
- coachChange: function (e) {
|
|
|
- const that = this;
|
|
|
- let data = that.data.coachList[e.detail.value];
|
|
|
- if (data) {
|
|
|
- that.setData({ 'form.coach_id': data.coach_id });
|
|
|
- that.setData({ 'form.zhcoach': data.coach_id_name });
|
|
|
- }
|
|
|
- },
|
|
|
- /**
|
|
|
- * 生命周期函数--监听页面加载
|
|
|
- */
|
|
|
- onLoad: function (options) {
|
|
|
- },
|
|
|
- // 监听用户是否登录
|
|
|
- watchLogin: async function () {
|
|
|
- const that = this;
|
|
|
- wx.getStorage({
|
|
|
- key: 'user',
|
|
|
- success: async res => {
|
|
|
- that.setData({ ec: { onInit: that.initChart } })
|
|
|
- that.data.date = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
|
|
|
- that.data.percentage = [18, 36, 65, 30, 78, 40, 33, 99, 80, 67, 55, 79];
|
|
|
- that.data.money = [11218, 5316, 6165, 8810, 3178, 5140, 2133, 6199, 4180, 6167, 7115, 1719];
|
|
|
- // 教练
|
|
|
- const abb = await app.$get(`/rcs`, { school_id: res.data.info.id });
|
|
|
- if (abb.errcode == '0' && abb.total > 0) {
|
|
|
- that.setData({ coachList: abb.data })
|
|
|
+ // 返回
|
|
|
+ back(e) {
|
|
|
+ wx.navigateBack({ delta: 1 })
|
|
|
+ },
|
|
|
+ // 选项卡选择
|
|
|
+ tabsChange: function (e) {
|
|
|
+ const that = this;
|
|
|
+ let data = e.detail;
|
|
|
+ that.setData({ 'tabs.active': data.active })
|
|
|
+ },
|
|
|
+ // 选择教练
|
|
|
+ coachChange: function (e) {
|
|
|
+ const that = this;
|
|
|
+ let data = that.data.coachList[e.detail.value];
|
|
|
+ if (data) {
|
|
|
+ that.setData({ 'form.coach_id': data.coach_id });
|
|
|
+ that.setData({ 'form.zhcoach': data.coach_id_name });
|
|
|
}
|
|
|
- },
|
|
|
- fail: async res => {
|
|
|
- wx.redirectTo({ url: '/pages/index/index' })
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 折线图
|
|
|
- initChart(canvas, width, height, dpr) {
|
|
|
- let that = this;
|
|
|
- var date = that.data.date;
|
|
|
- var percentage = that.data.percentage;
|
|
|
- var money = that.data.money;
|
|
|
- const chart = echarts.init(canvas, null, {
|
|
|
- width: width,
|
|
|
- height: height,
|
|
|
- devicePixelRatio: dpr
|
|
|
- });
|
|
|
- canvas.setChart(chart);
|
|
|
- if (that.data.tabs.active == 0) {
|
|
|
- var option = {
|
|
|
- grid: {
|
|
|
- left: 20,
|
|
|
- right: 20,
|
|
|
- bottom: 145,
|
|
|
- top: 60,
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- tooltip: {
|
|
|
- show: true,
|
|
|
- trigger: 'axis',
|
|
|
- formatter: '{b}:{c}%' // 格式化数值百分比输出
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- type: 'category',
|
|
|
- boundaryGap: false,
|
|
|
- data: date,
|
|
|
- // 设置x轴线的属性
|
|
|
- //使x轴文字显示全
|
|
|
- axisLabel: { show: true, interval: 0, },
|
|
|
- },
|
|
|
- yAxis: {
|
|
|
- x: 'center',
|
|
|
- type: 'value',
|
|
|
- splitLine: {
|
|
|
- lineStyle: { type: 'dashed' }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- type: 'line',
|
|
|
- smooth: true,
|
|
|
- data: percentage
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- } else {
|
|
|
- var option = {
|
|
|
- grid: {
|
|
|
- left: 20,
|
|
|
- right: 20,
|
|
|
- bottom: 145,
|
|
|
- top: 60,
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- tooltip: {
|
|
|
- show: true,
|
|
|
- trigger: 'axis',
|
|
|
- // trigger: 'item',
|
|
|
- formatter: '{b}:{c}元' // 格式化数值百分比输出
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- type: 'category',
|
|
|
- boundaryGap: false,
|
|
|
- data: date,
|
|
|
- // 设置x轴线的属性
|
|
|
- //使x轴文字显示全
|
|
|
- axisLabel: { show: true, interval: 0, },
|
|
|
- },
|
|
|
- yAxis: {
|
|
|
- x: 'center',
|
|
|
- type: 'value',
|
|
|
- splitLine: {
|
|
|
- lineStyle: { type: 'dashed' }
|
|
|
- }
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- type: 'line',
|
|
|
- smooth: true,
|
|
|
- data: money
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- }
|
|
|
-
|
|
|
- chart.setOption(option, true);
|
|
|
- return chart;
|
|
|
- },
|
|
|
- /**
|
|
|
- * 生命周期函数--监听页面初次渲染完成
|
|
|
- */
|
|
|
- onReady: function () { },
|
|
|
- /**
|
|
|
- * 生命周期函数--监听页面显示
|
|
|
- */
|
|
|
- onShow: function () {
|
|
|
- const that = this;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 生命周期函数--监听页面加载
|
|
|
+ */
|
|
|
+ onLoad: function (options) {
|
|
|
+ },
|
|
|
// 监听用户是否登录
|
|
|
- that.watchLogin();
|
|
|
- },
|
|
|
- /**
|
|
|
- * 页面上拉触底事件的处理函数
|
|
|
- */
|
|
|
- /**
|
|
|
- * 生命周期函数--监听页面隐藏
|
|
|
+ watchLogin: async function () {
|
|
|
+ const that = this;
|
|
|
+ wx.getStorage({
|
|
|
+ key: 'user',
|
|
|
+ success: async res => {
|
|
|
+ // 教练
|
|
|
+ const abb = await app.$get(`/rcs`, { school_id: res.data.info.id });
|
|
|
+ if (abb.errcode == '0' && abb.total > 0) {
|
|
|
+ that.setData({ coachList: abb.data })
|
|
|
+ }
|
|
|
+ let date = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'];
|
|
|
+ let percentage = [18, 36, 65, 30, 78, 40, 33, 99, 80, 67, 55, 79];
|
|
|
+ let money = [11218, 5316, 6165, 8810, 3178, 5140, 2133, 6199, 4180, 6167, 7115, 1719];
|
|
|
+ that.setData({ money: money })
|
|
|
+ that.setData({ date: date })
|
|
|
+ that.setData({ percentage: percentage })
|
|
|
+ that.setData({ ec: { onInit: that.initChart } })
|
|
|
+ },
|
|
|
+ fail: async res => {
|
|
|
+ wx.redirectTo({ url: '/pages/index/index' })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 折线图
|
|
|
+ initChart(canvas, width, height, dpr) {
|
|
|
+ let that = this;
|
|
|
+ var date = that.data.date;
|
|
|
+ var percentage = that.data.percentage;
|
|
|
+ var money = that.data.money;
|
|
|
+ var active = that.data.tabs.activa
|
|
|
+ const chart = echarts.init(canvas, null, {
|
|
|
+ width: width,
|
|
|
+ height: height,
|
|
|
+ devicePixelRatio: dpr
|
|
|
+ });
|
|
|
+ canvas.setChart(chart);
|
|
|
+ if (active == 0) {
|
|
|
+ var option = {
|
|
|
+ grid: {
|
|
|
+ left: 20,
|
|
|
+ right: 20,
|
|
|
+ bottom: 145,
|
|
|
+ top: 60,
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ show: true,
|
|
|
+ trigger: 'axis',
|
|
|
+ formatter: '{b}:{c}%' // 格式化数值百分比输出
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: 'category',
|
|
|
+ boundaryGap: false,
|
|
|
+ data: date,
|
|
|
+ // 设置x轴线的属性
|
|
|
+ //使x轴文字显示全
|
|
|
+ axisLabel: { show: true, interval: 0, },
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ x: 'center',
|
|
|
+ type: 'value',
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: { type: 'dashed' }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ type: 'line',
|
|
|
+ smooth: true,
|
|
|
+ data: percentage
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ var option = {
|
|
|
+ grid: {
|
|
|
+ left: 20,
|
|
|
+ right: 20,
|
|
|
+ bottom: 145,
|
|
|
+ top: 60,
|
|
|
+ containLabel: true
|
|
|
+ },
|
|
|
+ tooltip: {
|
|
|
+ show: true,
|
|
|
+ trigger: 'axis',
|
|
|
+ // trigger: 'item',
|
|
|
+ formatter: '{b}:{c}元' // 格式化数值百分比输出
|
|
|
+ },
|
|
|
+ xAxis: {
|
|
|
+ type: 'category',
|
|
|
+ boundaryGap: false,
|
|
|
+ data: date,
|
|
|
+ // 设置x轴线的属性
|
|
|
+ //使x轴文字显示全
|
|
|
+ axisLabel: { show: true, interval: 0, },
|
|
|
+ },
|
|
|
+ yAxis: {
|
|
|
+ x: 'center',
|
|
|
+ type: 'value',
|
|
|
+ splitLine: {
|
|
|
+ lineStyle: { type: 'dashed' }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ series: [
|
|
|
+ {
|
|
|
+ type: 'line',
|
|
|
+ smooth: true,
|
|
|
+ data: money
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ }
|
|
|
+ chart.setOption(option, true);
|
|
|
+ return chart;
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 生命周期函数--监听页面初次渲染完成
|
|
|
*/
|
|
|
- onHide: function () {
|
|
|
+ onReady: function () { },
|
|
|
+ /**
|
|
|
+ * 生命周期函数--监听页面显示
|
|
|
+ */
|
|
|
+ onShow: function () {
|
|
|
+ const that = this;
|
|
|
+ // 监听用户是否登录
|
|
|
+ that.watchLogin();
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 页面上拉触底事件的处理函数
|
|
|
+ */
|
|
|
+ /**
|
|
|
+ * 生命周期函数--监听页面隐藏
|
|
|
+ */
|
|
|
+ onHide: function () {
|
|
|
|
|
|
- },
|
|
|
+ },
|
|
|
|
|
|
- /**
|
|
|
- * 生命周期函数--监听页面卸载
|
|
|
- */
|
|
|
- onUnload: function () {
|
|
|
+ /**
|
|
|
+ * 生命周期函数--监听页面卸载
|
|
|
+ */
|
|
|
+ onUnload: function () {
|
|
|
|
|
|
- },
|
|
|
+ },
|
|
|
|
|
|
- /**
|
|
|
- * 页面相关事件处理函数--监听用户下拉动作
|
|
|
- */
|
|
|
- onPullDownRefresh: function () {
|
|
|
+ /**
|
|
|
+ * 页面相关事件处理函数--监听用户下拉动作
|
|
|
+ */
|
|
|
+ onPullDownRefresh: function () {
|
|
|
|
|
|
- },
|
|
|
+ },
|
|
|
|
|
|
|
|
|
- /**
|
|
|
- * 用户点击右上角分享
|
|
|
- */
|
|
|
- onShareAppMessage: function (res) {
|
|
|
+ /**
|
|
|
+ * 用户点击右上角分享
|
|
|
+ */
|
|
|
+ onShareAppMessage: function (res) {
|
|
|
|
|
|
- },
|
|
|
+ },
|
|
|
})
|