YD_WeChatApplet/subpackage/train/user-report/user-report.wxml

<!--subpackage/train/user-report/user-report.wxml-->
<view class="page-content">
  <mp-bar background="linear-gradient(190deg, #49a5fc 0%, #f7f7f7 800rpx, #f7f7f7 100%)" title="统计" color="#fff"></mp-bar>

  <view class="tab">
    <view class="tab-l {{tab==2? 'tab-l-no':''}}" bind:tap="changeTab" id="1">
      <view class="tab-l-content {{tab==2 ?'tab-l-content-no':''}}">
        <view class="tab-left-box box-active"></view>
        汇总统计
      </view>
    </view>
    <view class="tab-r {{tab == 2 ? 'tab-r-no' :''}}" bind:tap="changeTab" id="2">
      <view class="tab-r-content {{tab ==2? 'tab-r-content-no':''}}">
        <view class="tab-left-box box-active"></view>
        运动记录
      </view>
    </view>
  </view>

  <view class="card" wx:if="{{tab==1}}">
    <view class="tab-list">
        <view class="tab-list-item {{type=='1'?'active':''}}" bind:tap="changeTabB" id="1">日</view>
        <view class="tab-list-item {{type=='2'?'active':''}}" bind:tap="changeTabB" id="2">周</view>
        <view class="tab-list-item {{type=='3'?'active':''}}" bind:tap="changeTabB" id="3">月</view>
        <view class="tab-list-item {{type=='4'?'active':''}}" bind:tap="changeTabB" id="4">年</view>
      </view>

      <view class="chart-tab">
        <view bind:tap="changeTabC" id="1" class="chart-tab-item {{chartType==1?'chart-tab-active':''}}">时长</view>
        <view bind:tap="changeTabC" id="2" class="chart-tab-item {{chartType==2?'chart-tab-active':''}}">个数</view>
        <view bind:tap="changeTabC" id="3" class="chart-tab-item {{chartType==3?'chart-tab-active':''}}">热量</view>
      </view>
      <view class="unit">单位：{{chartType==1?'秒':chartType==2?'个':'kcal'}}</view>

      <!-- 图表 -->
      <view class="charts">
        <canvas canvas-id="mycanvas" type="2d" id="mycanvas" class="charts" bindtouchstart="touchstart" bindtouchmove="touchmove" bindtouchend="touchend" />
      </view>

  </view>

  <view class="card2" wx:if="{{tab== 1}}">
    <view class="title">
      <view class="title-before"></view>我的{{type == '1'?'日':type=='2'?'周':type==3?'月':'年'}}报
    </view>

    <view class="data">
      <view class="data-item">
        {{allData.accumulatedDuration}}
        <view class="name">累计时长</view>
      </view>
      <view class="data-item">
        {{allData.accumulatedCount}}
        <view class="name">累计次数</view>
      </view>
      <view class="data-item">
        {{allData.accumulatedConsume}}
        <view class="name">累计消耗/kcal</view>
      </view>
    </view>

    <view class="total">
      <view class="total-item">
        <view class="img-box">
          <image src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/train/all-all.png" mode="" />
        </view>
        <view class="num">
          <view class="number">{{allData.totalCount}}</view>
          {{type == '1'?'今日':type=='2'?'本周':type==3?'本月':'年度'}}总数
        </view>
      </view>

      <view class="total-item">
        <view class="img-box img-2">
          <image src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/train/once-once.png" mode="" />
        </view>
        <view class="num">
          <view class="number">{{allData.bestResult}}</view>
          单次最佳
        </view>
      </view>
    </view>
  </view>

  <view wx:if="{{tab == 2}}" class="card card3">
      <view wx:if="{{sportList.length> 0}}">
        <view class="sport" wx:for="{{sportList}}" wx:key="index">
        <view class="top">
          <view class="title">{{item.groupTaskName}}</view>
          <view class="time">{{item.createTime}}</view>
        </view>
        <view class="bottom">
          <view class="bottom-item">
            <image src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/train/jishi-icon.png" class="stat-img" />
            {{item.duration}}秒
          </view>
          <view class="bottom-item">
            <image src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/train/geshu-icon.png" class="stat-img" />
            {{item.count}}个
          </view>
          <view class="bottom-item">
            <image src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/team/kacl.png" class="stat-img" />
            消耗：{{item.consume}}kacl
          </view>
        </view>
      </view>
      </view>
      <view wx:else class="no">
      暂无运动记录，快去训练吧~</view>
  </view>
</view>