student.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. const app = getApp()
  2. import * as echarts from '../../../commpents/ec-canvas/echarts'
  3. let chart;
  4. Page({
  5. data: {
  6. frameStyle: { useTop: true, name: '学员统计', leftArrow: true, useBar: false },
  7. piedata: []
  8. },
  9. // 返回
  10. back(e) {
  11. wx.navigateBack({ delta: 1 })
  12. },
  13. /**
  14. * 生命周期函数--监听页面加载
  15. */
  16. onLoad: async function (options) {
  17. const that = this;
  18. // 监听用户是否登录
  19. await that.watchLogin();
  20. that.setData({ ec: { onInit: that.initChart } })
  21. },
  22. // 监听用户是否登录
  23. watchLogin: async function () {
  24. const that = this;
  25. wx.getStorage({
  26. key: 'user',
  27. success: async res => {
  28. const arr = await app.$get(`/statistics/schoolStudentAge`, { school_id: res.data.info.id });
  29. if (arr.errcode == '0') {
  30. that.setData({ piedata: arr.data })
  31. const option = {
  32. series: [{ data: arr.data }],
  33. }
  34. if (chart) chart.setOption(option)
  35. }
  36. },
  37. fail: async res => {
  38. wx.redirectTo({ url: '/pages/index/index' })
  39. }
  40. })
  41. },
  42. // 饼图
  43. initChart(canvas, width, height, dpr) {
  44. let that = this;
  45. var piedata = that.data.piedata;
  46. const chart = echarts.init(canvas, null, {
  47. width: width,
  48. height: height,
  49. devicePixelRatio: dpr
  50. });
  51. canvas.setChart(chart);
  52. var option = {
  53. backgroundColor: "#ffffff",
  54. legend: {
  55. orient: 'vertical',
  56. height: 40,
  57. padding: 50
  58. },
  59. series: [{
  60. label: {
  61. normal: {
  62. fontSize: 16,
  63. }
  64. },
  65. type: 'pie',
  66. center: ['50%', '50%'],
  67. radius: ['20%', '40%'],
  68. data: piedata
  69. }],
  70. tooltip: {
  71. trigger: 'item',
  72. formatter: '{b}:{c}人' + '\n\r' + '({d}%)' // 格式化数值百分比输出
  73. },
  74. };
  75. chart.setOption(option, true);
  76. return chart;
  77. },
  78. /**
  79. * 生命周期函数--监听页面初次渲染完成
  80. */
  81. onReady: function () { },
  82. /**
  83. * 生命周期函数--监听页面显示
  84. */
  85. onShow: function () {
  86. },
  87. /**
  88. * 页面上拉触底事件的处理函数
  89. */
  90. /**
  91. * 生命周期函数--监听页面隐藏
  92. */
  93. onHide: function () {
  94. },
  95. /**
  96. * 生命周期函数--监听页面卸载
  97. */
  98. onUnload: function () {
  99. },
  100. /**
  101. * 页面相关事件处理函数--监听用户下拉动作
  102. */
  103. onPullDownRefresh: function () {
  104. },
  105. /**
  106. * 用户点击右上角分享
  107. */
  108. onShareAppMessage: function (res) {
  109. },
  110. })