update:无报告兼容

subpackage/train/user-report/user-report.js

@@ -14,6 +14,7 @@ Page({
       type:'1',//日期类型
       chartType:'1',//y轴类型
       allData:{},
+      noChartData: false, // 图表数据是否为空
       cWidth: 330,
       cHeight: 280,
       pixelRatio: 2,
@@ -67,6 +68,11 @@ Page({
     },
 
     drawCharts(id){
+      const chartKey = this.data.chartType == 1 ? 'chartDataByDuration' : this.data.chartType == 2 ? 'chartDataByCount' : 'chartDataByConsume'
+      const chartData = this.data.allData[chartKey]
+      if (!chartData || !chartData.axisX || chartData.axisX.length === 0) {
+        return
+      }
       const query = wx.createSelectorQuery().in(this);
       query.select('#' + id).fields({ node: true, size: true }).exec(res => {
         if (res[0]) {
@@ -155,21 +161,28 @@ Page({
       console.log(res)
       if(res.data != null){
         res.data.accumulatedDuration = utils.formatTimeStr(res.data.accumulatedDuration)
+
+        // 判断图表数据是否为空
+        const chartDataByDuration = res.data.chartDataByDuration || {}
+        const chartDataByCount = res.data.chartDataByCount || {}
+        const chartDataByConsume = res.data.chartDataByConsume || {}
+        const isEmptyChartData =
+          (!chartDataByDuration.axisX || chartDataByDuration.axisX.length === 0) &&
+          (!chartDataByCount.axisX || chartDataByCount.axisX.length === 0) &&
+          (!chartDataByConsume.axisX || chartDataByConsume.axisX.length === 0)
+
         this.setData({
-          allData:res.data
+          allData:res.data,
+          noChartData: isEmptyChartData
         })
-        let ress = {
-          categories: this.data.allData[this.data.chartType == 1?'chartDataByDuration':this.data.chartType == 2? 'chartDataByCount':'chartDataByConsume'].axisX,
-          series: [
-            {
-              data: this.data.allData['chartDataByCount'].axisY
-            },
-          ]
-        };
-        this.drawCharts('mycanvas');
+
+        if (!isEmptyChartData) {
+          this.drawCharts('mycanvas');
+        }
       }else{
         this.setData({
-          noData:true
+          noData:true,
+          noChartData: true
         })
       }
     },

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

@@ -33,13 +33,19 @@
       <view class="unit">单位：{{chartType==1?'秒':chartType==2?'个':'kcal'}}</view>
 
       <!-- 图表 -->
-      <view class="charts">
+      <view class="charts" wx:if="{{!noChartData}}">
         <canvas canvas-id="mycanvas" type="2d" id="mycanvas" class="charts" bindtouchstart="touchstart" bindtouchmove="touchmove" bindtouchend="touchend" />
       </view>
 
+      <!-- 图表空状态 -->
+      <view class="charts-empty" wx:if="{{noChartData}}">
+        <image class="charts-empty-img" src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/train/no-data.png" mode="aspectFit" />
+        <view class="charts-empty-text">暂无数据</view>
+      </view>
+
   </view>
 
-  <view class="card2" wx:if="{{tab== 1}}">
+  <view class="card2" wx:if="{{tab== 1 && !noChartData}}">
     <view class="title">
       <view class="title-before"></view>我的{{type == '1'?'日':type=='2'?'周':type==3?'月':'年'}}报
     </view>
@@ -82,6 +88,14 @@
     </view>
   </view>
 
+  <!-- 汇总数据空状态 -->
+  <view class="card2" wx:if="{{tab== 1 && noChartData}}">
+    <view class="title">
+      <view class="title-before"></view>我的{{type == '1'?'日':type=='2'?'周':type==3?'月':'年'}}报
+    </view>
+    <view class="no">暂无统计数据</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">

subpackage/train/user-report/user-report.wxss

@@ -306,4 +306,28 @@
 .no{
   text-align: center;
   margin-top: 50rpx;
+  color: #999;
+  font-size: 28rpx;
+  padding: 40rpx 0;
+}
+
+/* 图表空状态 */
+.charts-empty {
+  width: 100%;
+  height: 420rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+
+.charts-empty-img {
+  width: 200rpx;
+  height: 200rpx;
+  margin-bottom: 20rpx;
+}
+
+.charts-empty-text {
+  font-size: 28rpx;
+  color: #999;
 }