reader/pages/activity/index/index.wxml

<!--pages/activity/index/index.wxml-->
<view class="activity-index">
    <image class="activity-bg" src="http://reader-wx.ai160.com/images/reader/activity/bg.jpg" mode="scaleToFill">
    </image>
    <view class="rule" bindtap="rule">
        <image src="../../../static/activity/rule-img.png"></image>
    </view>
    <view class="strategy" bindtap="strategy">
        <image src="../../../static/activity/strategy-img.png"></image>
    </view>
    <!-- <view class="strategy" bindtap="getPrice">
    <image src="../../../static/activity/get_price.png"></image>
  </view> -->
    <view class="activity-works">
        <image class="swiper-bg" src="http://reader-wx.ai160.com/images/reader/activity/swiper-bg.png"
            mode="scaleToFill"></image>
        <text class="gradeText">{{grades}}朗读范文素材</text>
        <view class="activity-works-swiper">
            <swiper indicator-dots="true" autoplay="false" circular="true" previous-margin="66rpx" next-margin="56rpx"
                indicator-color="#BABABA" indicator-active-color="#fff">
                <block wx:for="{{activityReadData}}" wx:key="*this">
                    <swiper-item>
                        <view class="swiper-item-view" bindtap="goToReading" data-id="{{item.id}}">
                            <image src="{{item.iconImg}}" mode="scaleToFill"></image>
                        </view>
                    </swiper-item>
                </block>
            </swiper>
        </view>
    </view>
    <view class="activity-ranking">
        <view class="activity-ranking-tab">
            <!-- <image class="tab-bg" src="../../../static/activity/tab-bg.png" mode="scaleToFill"></image> -->
            <image class="select-bg {{selectInd === 0 ? 'left' : 'right'}}" src="{{selectBg[selectInd]}}"
                mode="scaleToFill"></image>
            <text class="left {{selectInd === 0 && 'select'}}" data-index="0" bindtap="tabSelect">人气榜 TOP100</text>
            <text class="right {{selectInd === 1 && 'select'}}" data-index="1" bindtap="tabSelect">我的参赛作品</text>
        </view>
        <view class="activity-ranking-container" style="background: #fff;" hidden="{{selectInd === 1}}">
            <view class="activity-ranking-title">
                <text>排名</text>
                <text class="midTitle">昵称</text>
                <text>人气值</text>
            </view>
            <view class="scroll-view" style="{{myHotAmountData.activityJoinUser ? 'margin-bottom: 150rpx;' : ''}}">
                <view class="scroll-view-item" wx:for="{{hotAmountTopData}}" wx:for-index="index" wx:key="*this">
                    <image wx:if="{{sortImg[index]}}" class="ranking-number-img" src="{{sortImg[index]}}"></image>
                    <text wx:else class="ranking-number">{{index + 1}}</text>
                    <view class="ranking-message">
                        <view class="reanking-message-head">
                            <image class="haed-url" bindtap="headTap" src="{{item.user.avatar}}"
                                data-uid="{{item.user.uid}}"></image>
                            <image class="follow-url" src="{{item.isFans ? '' : '../../../static/activity/follow.png'}}"
                                bindtap="{{!item.isFans && 'follow'}}" data-uid="{{item.user.uid}}"
                                data-fans="{{item.isFans}}"></image>
                        </view>
                        <view class="reanking-message-name">
                            <text>{{item.user.nickName}}</text>
                            <view class="operation">
                                <view class="forward">
                                    <image src="../../../static/activity/forward1.png"></image>
                                    {{item.activityJoinUser.shareAmount}}
                                </view>
                                <view class="like">
                                    <image src="../../../static/activity/like1.png"></image>
                                    {{item.activityJoinUser.likeAmount}}
                                </view>
                                <view class="comment">
                                    <image src="../../../static/activity/comment1.png"></image>
                                    {{item.activityJoinUser.commentAmount}}
                                </view>
                            </view>
                        </view>
                    </view>
                    <view class="popularity">
                        <!-- <image src="../../../static/activity/popularity1.png"></image> -->
                        {{item.activityJoinUser.hotAmount}}
                    </view>
                </view>
            </view>
        </view>
        <view class="activity-my-ranking" hidden="{{selectInd === 1 || !myHotAmountData.activityJoinUser}}">
            <text class="ranking-number" style="color: #fff;">{{myHotAmountData.activityJoinUser.order}}</text>
            <view class="ranking-message">
                <view class="reanking-message-head">
                    <image class="haed-url" src="{{myHotAmountData.user.avatar}}"></image>
                </view>
                <view class="reanking-message-name" style="color: #fff;">
                    <text style="color: #fff;">{{myHotAmountData.user.nickName}}</text>
                    <view class="operation" style="color: #fff;">
                        <view class="forward">
                            <image src="../../../static/activity/forward.png"></image>
                            {{myHotAmountData.activityJoinUser.shareAmount}}
                        </view>
                        <view class="like">
                            <image src="../../../static/activity/like.png"></image>
                            {{myHotAmountData.activityJoinUser.likeAmount}}
                        </view>
                        <view class="comment">
                            <image src="../../../static/activity/comment.png"></image>
                            {{myHotAmountData.activityJoinUser.commentAmount}}
                        </view>
                    </view>
                </view>
            </view>
            <view class="popularity" style="color: #fff;">
                <!-- <image src="../../../static/activity/popularity.png"></image> -->
                {{myHotAmountData.activityJoinUser.hotAmount}}
            </view>
        </view>
        <view class="my-activity-read" hidden="{{selectInd === 0}}">
            <VideoSwiper wx:if="{{activityMyReadData.length > 0}}" class="video-swiper"
                video-list="{{activityMyReadData}}" nextMargin="{{nextMargin}}" isSwiper="{{isSwiper}}"
                noMoreWork="{{noMoreWork}}" ifHeadTap="{{true}}" binddelHideMyWork="delHideMyWork"
                bindcollectTap="collectTap" bindlikeTap="likeTap" bindopenComment="openComment"
                bindopenShare="openShare" />
            <image class="no_works" wx:if="{{activityMyReadData.length === 0}}"
                src="http://reader-wx.ai160.com/images/reader/activity/no_works.png" />
        </view>
        <view class="comment_section" catchtap="commentTap" data-type="blank" wx:if="{{commentShow}}">
            <Comment data-type="list" commentId="{{commentId}}" commentNum="{{commentNum}}" inputValue="{{inputValue}}"
                bindsendReply="sendReply" />
        </view>
    </view>

</view>
<canvas canvas-id="myCanvas"
    style="width:300px; height: 525px; position: absolute; left: -999rpx; top: -9999rpx;"></canvas>