ssj_book/parents/pages/growth_track/growth_track.wxml

<!--parents//pages/growth_track/growth_track.wxml-->
<import src="../../../templates/nodata/nodata.wxml" />
<import src="../../../templates/footer/footer.wxml" />
<import src="../../../templates/loading/loading.wxml" /> 
<view class='container'>
  <template is='loading' wx:if='{{!isLoaded}}'></template> 
  <view class='wrapper' wx:else>
      <view class='li' style='padding-bottom:{{isIphoneX?"166":""}}rpx'>
          <image src='../../../assets/pai_hang_bang.png' class='li-img' bindtap='setRanking'></image>
          <view class='list' wx:if='{{themeInfoList.length == 0&&rankList.length==0&&monthList.length==0}}'>
              <view class='nodata'style='margin-top:120rpx'>
                  <image class="image-nodata"src='../../../assets/book.png'></image>
                  <view class="text-nodata">您还没有借阅过任何书呢，快去借书吧</view>
                  <view class="firstaddBooks" style='margin-top:0' bindtap='scanCtl'>扫码借书</view>
              </view>
          </view>
          <view class='li-rank' wx:if='{{rankList.length>0}}'>
              <view class='li-rank-title'>馆内排名成就</view>
              <view class='li-rank-items' wx:for='{{rankList}}' wx:key='index'>
                  <image src='../../../assets/no_one_bg.png' class='li-rank-items-bg' wx:if='{{index==0}}'></image>
                  <image src='../../../assets/no_two_bg.png' class='li-rank-items-bg' wx:if='{{index==1}}'></image>
                  <image src='../../../assets/no_three_bg.png' class='li-rank-items-bg' wx:if='{{index==2}}'></image>
                  <view class='li-rank-item'>
                      <image src='../../../assets/no_one.png' class='li-rank-item-img' wx:if='{{index==0}}'></image>
                      <image src='../../../assets/no_two.png' class='li-rank-item-img' wx:if='{{index==1}}'></image>
                      <image src='../../../assets/no_three.png' class='li-rank-item-img' wx:if='{{index==2}}'></image>
                      <view class='li-rank-item-content'>
                          <view>获得馆内月度排名第{{item.ranking}}名{{item.rankTimes}}次</view>
                          <view class='li-rank-item-month'>{{item.rankMonth}}月</view>
                      </view>
                  </view>
              </view>
          </view>
          <!-- 主题借阅分析 -->
          <view class='li-rank' wx:if='{{themeInfoList.length>0}}'>
            <view class='li-rank-title'>主题借阅分析</view>
            <view class='li-rank-canvas'>
                <view class='li-rank-canvas-text'>主题借阅量所占百分比</view>
                <ff-canvas id="pieSelect" opts="{{opts}}"></ff-canvas>
            </view>
            <view class='li-rank-biao' wx:if='{{themeSelect}}'>
              <view class='li-rank-biao-title'>{{message}}</view>
              <view class='li-rank-biao-num'>借阅量 {{pages}}本</view>
              <view class='list-item' wx:for='{{list}}' wx:key='index'>
                <view class='list-item-img'>
                  <image src='{{item.localImage?baseImgUrl+item.localImage:"../../../assets/banner1.png"}}' class='list-item-img-items'></image>
                </view>
                <view class='list-item-content'>
                    <view>{{item.title}}</view>
                    <view class='list-item-content-tips'>{{item.summary}}</view>
                </view>
              </view>
              <view class='list-item-all' data-url='parents/pages/all_books/all_books' data-paras='{{({vipId,code,message})}}' bindtap='navigateTo'>查看全部</view>
            </view>
          </view>
           <!-- 阅读偏好 -->
          <view class='li-rank' wx:if='{{themeTopList.length>0}}'>
            <view class='li-rank-title'>阅读偏好</view>
            <view class='li-balls'>
              <view class='li-balls-one' wx:if='{{themeTopList[0].themeName}}'>
                  <view style='margin-top:50rpx'>{{themeTopList[0].themeName}}</view>
                  <view>{{themeTopList[0].percentage}}%</view>
              </view>
              <view class='li-balls-two' wx:if='{{themeTopList[1].themeName}}'>
                  <view style='margin-top:40rpx'>{{themeTopList[1].themeName}}</view>
                  <view>{{themeTopList[1].percentage}}%</view>
              </view>
              <view class='li-balls-three' wx:if='{{themeTopList[4].themeName}}'>
              </view>
              <view class='li-balls-four' wx:if='{{themeTopList[2].themeName}}'>
                  <view style='margin-top:50rpx'>{{themeTopList[2].themeName}}</view>
                  <view>{{themeTopList[2].percentage}}%</view>
              </view>
              <view class='li-balls-five' wx:if='{{themeTopList[3].themeName}}'>
                  <view style='margin-top:44rpx'>{{themeTopList[3].themeName}}</view>
                  <view>{{themeTopList[3].percentage}}%</view> 
              </view>
            </view>
          </view>
           <!-- 近28天阅读量对比 -->
          <view class='li-rank' wx:if='{{monthList.length>0}}'>
            <view class='li-rank-title'>近28天阅读量对比</view>
            <!-- <canvas canvas-id='twentyEightCanvas' class='li-canvas'></canvas> -->
              <ff-canvas id="twentyEightCanvas" opts="{{opts}}"></ff-canvas>
          </view>
           <!-- 每月阅读量对比 -->
          <view class='li-rank' wx:if='{{yearList.length>0}}'>
            <view class='li-rank-title'>每月阅读量对比</view>
            <!-- <canvas canvas-id='readCanvas' class='li-canvas'></canvas> -->
            <ff-canvas id="readCanvas" opts="{{opts}}"></ff-canvas>
          </view>
      </view>
  </view>
  <template is='footer' data='{{...footerData}}'></template> 
</view>