Merge branch 'master' of http://git.cc-lotus.info/ball-court/ball-applet

pages/schAdmin/coachstat/list.js

@@ -1,72 +1,197 @@
 const app = getApp()
-
+import * as echarts from '../../../commpents/ec-canvas/echarts'
 Page({
-    data: {
-        frameStyle: { useTop: true, name: '教练统计', leftArrow: true, useBar: false },
-    },
-    // 返回
-    back(e) {
-        wx.navigateBack({ delta: 1 })
+  data: {
+    frameStyle: { useTop: true, name: '教练统计', leftArrow: true, useBar: false },
+    // 选中
+    tabs: {
+      active: '0',
+      menu: [
+        { title: '教练出勤率', active: '0' },
+        { title: '教练收入情况', active: '1' },
+      ]
     },
-    /**
-     * 生命周期函数--监听页面加载
-     */
-    onLoad: function (options) { },
-    // 监听用户是否登录
-    watchLogin: async function () {
-        const that = this;
-        wx.getStorage({
-            key: 'user',
-            success: async res => {
+    coachList: [],
 
-            },
-            fail: async res => {
-                // wx.redirectTo({ url: '/pages/index/index' })
-            }
-        })
-    },
+  },
+  // 返回
+  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 })
+        }
+      },
+      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
+          }
+        ]
+      };
+    }
 
-    /**
-     * 生命周期函数--监听页面初次渲染完成
-     */
-    onReady: function () { },
-    /**
-     * 生命周期函数--监听页面显示
-     */
-    onShow: function () {
-        const that = this;
-        // 监听用户是否登录
-        that.watchLogin();
-    },
-    /**
-     * 页面上拉触底事件的处理函数
-     */
-    /**
-     * 生命周期函数--监听页面隐藏
-     */
-    onHide: function () {
+    chart.setOption(option, true);
+    return chart;
+  },
+  /**
+ * 生命周期函数--监听页面初次渲染完成
+ */
+  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) {
 
-    },
-})
+  },
+})

pages/schAdmin/coachstat/list.json

@@ -1,6 +1,8 @@
 {
-    "component": true,
-    "usingComponents": {
-      "mobile-main": "/commpents/mobile-frame/index"
-    }
-  } 
+  "component": true,
+  "usingComponents": {
+    "mobile-main": "/commpents/mobile-frame/index",
+    "ec-canvas": "/commpents/ec-canvas/ec-canvas",
+    "s-tab": "/commpents/tabs/index"
+  }
+}

pages/schAdmin/coachstat/list.less

@@ -0,0 +1,58 @@
+.main {
+  background-color: var(--mainColor);
+  height: var(--twoHeight);
+
+  .top {
+    margin: 0 10vw;
+  }
+
+
+  .two {
+    position: relative;
+    flex-grow: 1;
+
+    .a {
+      height: 83vh;
+
+      .one {
+        flex-grow: 1;
+        position: relative;
+        height: 81vh;
+
+        ec-canvas {
+          width: 100%;
+          height: 100%;
+        }
+
+        .container {
+          position: absolute;
+          top: 0;
+          bottom: 0;
+          left: 0;
+          right: 0;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: space-between;
+          box-sizing: border-box;
+        }
+      }
+    }
+  }
+
+
+
+}
+
+.scroll-view {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+
+  .list-scroll-view {
+    display: flex;
+    flex-direction: column;
+  }
+}

pages/schAdmin/coachstat/list.wxml

@@ -1,5 +1,45 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:back="back">
-    <view slot="info" class="container main">
-        1
+  <view slot="info" class="container main">
+    <view class="one">
+      <s-tab tabs="{{tabs}}" bind:tabsChange="tabsChange"></s-tab>
+      <view class="top">
+        <picker mode="selector" bindchange="coachChange" name="coach_id" value="{{form.coach_id}}" range="{{coachList}}" range-key="coach_id_name">
+          <view class="picker">{{form.zhcoach||'请选择教练'}}</view>
+        </picker>
+      </view>
     </view>
+    <view class="two">
+      <view wx:if="{{tabs.active=='0'}}" class="a">
+        <scroll-view scroll-y="true" class="scroll-view">
+          <view class="list-scroll-view">
+            <view class="one">
+              <scroll-view scroll-y="true" class="scroll-view">
+                <view class="list-scroll-view">
+
+                  <view class="container">
+                    <ec-canvas id="mychart-dom-pie" canvas-id="mychart-pie" ec="{{ ec }}"></ec-canvas>
+                  </view>
+                </view>
+              </scroll-view>
+            </view>
+          </view>
+        </scroll-view>
+      </view>
+      <view wx:elif="{{tabs.active=='1'}}" class="a">
+        <scroll-view scroll-y="true" class="scroll-view">
+          <view class="list-scroll-view">
+            <view class="one">
+              <scroll-view scroll-y="true" class="scroll-view">
+                <view class="list-scroll-view">
+                  <view class="container">
+                    <ec-canvas id="mychart-dom-pie" canvas-id="mychart-pie" ec="{{ ec }}"></ec-canvas>
+                  </view>
+                </view>
+              </scroll-view>
+            </view>
+          </view>
+        </scroll-view>
+      </view>
+    </view>
+  </view>
 </mobile-main>

pages/schAdmin/coachstat/list.wxss

@@ -0,0 +1,46 @@
+.main {
+  background-color: var(--mainColor);
+  height: var(--twoHeight);
+}
+.main .top {
+  margin: 0 10vw;
+}
+.main .two {
+  position: relative;
+  flex-grow: 1;
+}
+.main .two .a {
+  height: 83vh;
+}
+.main .two .a .one {
+  flex-grow: 1;
+  position: relative;
+  height: 81vh;
+}
+.main .two .a .one ec-canvas {
+  width: 100%;
+  height: 100%;
+}
+.main .two .a .one .container {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+}
+.scroll-view {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+.scroll-view .list-scroll-view {
+  display: flex;
+  flex-direction: column;
+}

pages/schAdmin/income/list.js

@@ -1,77 +1,19 @@
 const app = getApp()
 import * as echarts from '../../../commpents/ec-canvas/echarts'
-function setOption(chart, piedata) {
-  var option = {
-    backgroundColor: "#ffffff",
-    series: [{
-      label: {
-        normal: {
-          fontSize: 14
-        }
-      },
-      type: 'pie',
-      center: ['50%', '50%'],
-      radius: ['20%', '40%'],
-      data: piedata
-    }]
-  };
-  chart.setOption(option);
-  return chart;
-}
-
 Page({
   data: {
     frameStyle: { useTop: true, name: '收入统计', leftArrow: true, useBar: false },
-    ec: {
-      //onInit: initChart
-      // 将 lazyLoad 设为 true 后，需要手动初始化图表
-      lazyLoad: true
-    }
-  },
-  initpie: function (piedata) {
-    console.log(piedata);
-    let ecComponent = this.selectComponent('#mychart-dom-pie');
-    ecComponent.init((canvas, width, height, dpr) => {
-      // 获取组件的 canvas、width、height 后的回调函数
-      // 在这里初始化图表
-      const chart = echarts.init(canvas, null, {
-        width: width,
-        height: height,
-        devicePixelRatio: dpr // new
-      });
-      //调用设定EChart报表状态的函数，并且把从后端拿到的数据传过去
-      setOption(chart, piedata);
-      // 注意这里一定要返回 chart 实例，否则会影响事件处理等
-      return chart;
-    })
+
   },
   // 返回
   back(e) {
     wx.navigateBack({ delta: 1 })
   },
+
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
-    const that = this;
-    var piedata = [{
-      value: 55,
-      name: '北京'
-    }, {
-      value: 20,
-      name: '武汉'
-    }, {
-      value: 10,
-      name: '杭州'
-    }, {
-      value: 20,
-      name: '广州'
-    }, {
-      value: 38,
-      name: '上海'
-    }];
-    that.initpie(piedata);
-
   },
   // 监听用户是否登录
   watchLogin: async function () {
@@ -79,17 +21,75 @@ Page({
     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', '12', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'];
+        that.data.money = [900, 270, 340, 400, 600, 700, 310, 300, 270, 340, 344, 300, 320, 310, 300, 270, 340, 344, 300, 500, 310, 300, 270, 340, 344, 300, 320, 310, 300, 270, 340, 344, 300, 320, 310];
       },
       fail: async res => {
-        // wx.redirectTo({ url: '/pages/index/index' })
+        wx.redirectTo({ url: '/pages/index/index' })
       }
     })
   },
+  // 柱状图
+  initChart(canvas, width, height, dpr) {
+    let that = this;
+    var date = that.data.date;
+    var money = that.data.money;
+    const chart = echarts.init(canvas, null, {
+      width: width,
+      height: height,
+      devicePixelRatio: dpr // new
+    });
+    canvas.setChart(chart);
+    var option = {
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: { type: 'shadow' },
+        confine: true
+      },
+      legend: { data: [] },
+      grid: {
+        left: 20,
+        // right: 20,
+        bottom: 15,
+        // top: 40,
+        containLabel: true
+      },
+      xAxis: [
+        {
+          type: 'value',
+          name: '金额',
+          axisLine: { lineStyle: { color: '#999' } },
+          axisLabel: { color: '#666' }
+        }
+      ],
+      yAxis: [
+        {
+          type: 'category',
+          name: '日期',
+          axisTick: { show: false },
+          data: date,
+          axisLine: { lineStyle: { color: '#999' } },
+          axisLabel: { color: '#666' }
+        }
+      ],
+      series: [
+        {
+          name: '收入',
+          type: 'bar',
+          label: { normal: { show: true, position: 'inside' } },
+          data: money,
+          itemStyle: {}
+        },
+      ],
 
+    };
+    chart.setOption(option, true);
+    return chart;
+  },
   /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
+ * 生命周期函数--监听页面初次渲染完成
+ */
   onReady: function () { },
   /**
    * 生命周期函数--监听页面显示
@@ -130,4 +130,4 @@ Page({
   onShareAppMessage: function (res) {
 
   },
-})
+})

pages/schAdmin/income/list.less

@@ -1,4 +1,26 @@
+.top {
+  display: flex;
+  flex-direction: row;
+
+  button {
+    margin: 0 1vw;
+  }
+}
+
 ec-canvas {
   width: 100%;
   height: 100%;
 }
+
+.container {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
+  box-sizing: border-box;
+}

pages/schAdmin/income/list.wxml

@@ -1,5 +1,11 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:back="back">
   <view slot="info" class="container main">
+    <view class="top">
+      <button type="primary" size="mini">本月</button>
+      <button type="primary" size="mini">近三月</button>
+      <button type="primary" size="mini">半年内</button>
+      <button type="primary" size="mini">一年内</button>
+    </view>
     <view class="container">
       <ec-canvas id="mychart-dom-pie" canvas-id="mychart-pie" ec="{{ ec }}"></ec-canvas>
     </view>

pages/schAdmin/income/list.wxss

@@ -1,3 +1,10 @@
+.top {
+  display: flex;
+  flex-direction: row;
+}
+.top button {
+  margin: 0 1vw;
+}
 ec-canvas {
   width: 100%;
   height: 100%;
@@ -8,10 +15,9 @@ ec-canvas {
   bottom: 0;
   left: 0;
   right: 0;
- 
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   box-sizing: border-box;
-} 
+}

pages/schAdmin/stustat/list.js

@@ -1,238 +1,70 @@
 const app = getApp()
 import * as echarts from '../../../commpents/ec-canvas/echarts'
-
-function echart(chart, leftData, rightData) {//leftData是坐标系左边y轴，rightData是右边y轴
-  var option = {
-    //网格
-    grid: {
-      bottom: 80,
-      show: true,
-      // containLabel: true
-    },
-    //图例
-    legend: {
-      data: [{
-        name: 'leftData',
-        textStyle: { //设置颜色
-          color: '#6076FF',
-          fontSize: '14',
-        }
-      },
-      {
-        name: 'rightData',
-        textStyle: {
-          color: '#FFC560',
-          fontSize: '14',
-        }
-      }
-      ],
-      x: 'left',
-      bottom: 15,
-      left: 30
-    },
-    //x轴
-    xAxis: {
-      type: 'category',
-      boundaryGap: false,
-      disableGrid: true, //绘制X网格
-      data: ['', '', '', '', '', '', '', '', ''],
-      splitLine: {
-        show: true,
-        // 改变轴线颜色
-        lineStyle: {
-          // 使用深浅的间隔色
-          color: ['#DDDDDD']
-        }
-      },
-      //去掉刻度
-      axisTick: {
-        show: false
-      },
-      //去掉x轴线
-      axisLine: {
-        show: false
-      },
-    },
-    //y轴
-    yAxis: [{
-      name: 'mph',
-      type: 'value',
-      min: 0,
-      // max: 40,
-      //y标轴名称的文字样式
-      nameTextStyle: {
-        color: '#FFC560'
-      },
-      //网格线
-      splitLine: {
-        show: true,
-        lineStyle: {
-          color: ['#DDDDDD']
-        }
-      },
-      //去掉刻度
-      axisTick: {
-        show: false
-      },
-      //去掉y轴线
-      axisLine: {
-        show: false
-      },
-    },
-    {
-      name: 'g',
-      type: 'value',
-      // max: 4,
-      min: 0,
-      nameTextStyle: {
-        color: '#6076FF'
-      },
-      //去掉刻度
-      axisTick: {
-        show: false
-      },
-      //去掉y轴线
-      axisLine: {
-        show: false
-      },
-
-    }
-    ],
-
-    series: [{
-      name: 'leftData',
-      type: 'line',
-      animation: true, //动画效果
-      symbol: 'none',
-      //折线区域
-      areaStyle: {
-        //渐变颜色
-        color: {
-          type: 'linear',
-          x: 0,
-          y: 0,
-          x2: 0,
-          y2: 1,
-          colorStops: [{
-            offset: 0,
-            color: '#6076FF' // 0% 处的颜色
-          }, {
-            offset: 1,
-            color: 'rgba(96,118,255,0.1)' // 100% 处的颜色
-          }],
-          global: false, // 缺省为 false
-        },
-      },
-      //折线宽度
-      lineStyle: {
-        width: 2
-      },
-      color: '#6076FF',
-      data: leftData // 后台传过来的动态数据
-      //设置固定的数据
-      // data: [
-      //  23, 30, 20, 23, 30, 26, 20, 25, 25
-      // ] 
-    },
-    {
-      name: 'rightData',
-      type: 'line',
-      yAxisIndex: 1,
-      animation: true,
-      symbol: 'none',
-      areaStyle: {
-        color: {
-          type: 'linear',
-          x: 0,
-          y: 0,
-          x2: 0,
-          y2: 1,
-          colorStops: [{
-            offset: 0,
-            color: '#FFC560' // 0% 处的颜色
-          }, {
-            offset: 1,
-            color: 'rgba(255, 197, 96,0.3)' // 100% 处的颜色
-          }],
-          global: false, // 缺省为 false
-        },
-      },
-      lineStyle: {
-        width: 2
-      },
-      color: '#FFC560',
-      data: rightData,//后台传过来的动态数据
-      //设置固定的数据
-      // data: [
-      //  2, 1, 0.5, 0.9, 2, 1.0, 0.6, 2, 0.5
-      // ]
-    }]
-  }
-}
-
 Page({
   data: {
     frameStyle: { useTop: true, name: '学员统计', leftArrow: true, useBar: false },
-    ec: {
-      lazyLoad: true //初始化加载
-    }
   },
   // 返回
   back(e) {
     wx.navigateBack({ delta: 1 })
   },
-  initGraph: function (leftData, rightData) {
-    let oneComponent = this.selectComponent('#mychart');
-    oneComponent.init((canvas, width, height) => {
-      const chart = echarts.init(canvas, null, {
-        width: width,
-        height: height
-      });
-      initChart(chart, leftData, rightData);
-      this.chart = chart;
-      return chart;
-    });
-  },
   /**
    * 生命周期函数--监听页面加载
    */
-  onLoad: function (options) {
-    const that = this;
-    // let leftData=[{20}]
-    // let url = "xxxxx";
-    // let params = {
-    //   "openId": options.id,
-    // };
-    // wx.request({
-    //   url: "xxxx",
-    //   method: 'POST',
-    //   data: params,
-    //   header: header,
-    //   success: (res) => {//从后台获取的数据
-    //     that.setData({leftData: xxx,rightData: xxxx });
-    //     //给图表加上数据
-    //     that.initGraph(that.data.leftData, that.data.rightData)
-    //   }
-    // })
-
-  },
+  onLoad: function (options) { },
   // 监听用户是否登录
   watchLogin: async function () {
     const that = this;
     wx.getStorage({
       key: 'user',
       success: async res => {
-
+        that.setData({ ec: { onInit: that.initChart } })
+        that.data.piedata = [
+          { value: 55, name: '7-10岁' },
+          { value: 20, name: '10-13岁' },
+          { value: 10, name: '13-16岁' },
+          { value: 20, name: '16-18岁' },
+          { value: 38, name: '18-26岁' }];
       },
       fail: async res => {
-        // wx.redirectTo({ url: '/pages/index/index' })
+        wx.redirectTo({ url: '/pages/index/index' })
       }
     })
   },
-
+  // 折线图
+  initChart(canvas, width, height, dpr) {
+    let that = this;
+    var piedata = that.data.piedata;
+    const chart = echarts.init(canvas, null, {
+      width: width,
+      height: height,
+      devicePixelRatio: dpr
+    });
+    canvas.setChart(chart);
+    var option = {
+      backgroundColor: "#ffffff",
+      series: [{
+        label: {
+          normal: {
+            fontSize: 14,
+          }
+        },
+        type: 'pie',
+        center: ['50%', '50%'],
+        radius: ['20%', '40%'],
+        data: piedata
+      }],
+      tooltip: {
+        trigger: 'item',
+        formatter: '{b}:{c}人' + '\n\r' + '({d}%)' // 格式化数值百分比输出
+      },
+    };
+    chart.setOption(option, true);
+    return chart;
+  },
   /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
+ * 生命周期函数--监听页面初次渲染完成
+ */
   onReady: function () { },
   /**
    * 生命周期函数--监听页面显示
@@ -273,4 +105,4 @@ Page({
   onShareAppMessage: function (res) {
 
   },
-})
+})

pages/schAdmin/stustat/list.wxml

@@ -1,5 +1,5 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:back="back">
     <view slot="info" class="container main">
-        <ec-canvas id="mychart-dom-pie" canvas-id="mychart-pie" ec="{{ ec }}"></ec-canvas>
+      <ec-canvas id="myechart" canvas-id="graph" ec="{{ ec }}"></ec-canvas>
     </view>
 </mobile-main>