reader/pages/activityDet/index.wxml

<view class="activityDet">
    <view class="header" wx:if="{{state!='after'||!greetingCard.cardUrl}}">
        <image src="{{configure.bgImg}}" class="templateImg" />
        <view class="toBox"
            style="top:{{configure.templateBase.fromTop}}rpx;left: {{configure.templateBase.fromLeft}}rpx;">
            <input value="{{configure.fromText}}" disabled="{{state=='process'}}" class="text" maxlength='8'
                style="color:{{configure.fromColor}};font-size: {{configure.fromFontSize}}rpx;border-color: {{configure.fromColor}}60;width: {{fromWidth}}rpx;"
                bindinput="bindKeyInput" data-type='from' />
            <image src="/static/image/edit_new.png" wx:if="{{state!='process'}}" />
        </view>
        <view class="toBox" style="top:{{configure.templateBase.toTop}}rpx;left: {{configure.templateBase.toLeft}}rpx;">
            <input value="{{configure.toText}}" disabled="{{state=='process'}}" class="text" maxlength='8'
                style="color:{{configure.toColor}};font-size: {{configure.toFontSize}}rpx;border-color: {{configure.toColor}}60;width: {{toWidth}}rpx;"
                bindinput="bindKeyInput" data-type='to' />
            <image src="/static/image/edit_new.png" wx:if="{{state!='process'}}" />
        </view>
        <view class="avatar" bindtap="showActionSheet" wx:if="{{state!='process'}}"
            style="top:{{configure.templateBase.photoTop}}rpx;left: {{configure.templateBase.photoLeft}}rpx;width: {{configure.templateBase.photoWidth}}rpx;height:{{configure.templateBase.photoHeight}}rpx">
            <view class="tips" wx:if="{{!changeAvatarFlag}}">点击更换图片</view>
        </view>
        <image class="avatarImg"
            style="top:{{configure.templateBase.photoTop}}rpx;left: {{configure.templateBase.photoLeft}}rpx;width: {{configure.templateBase.photoWidth}}rpx;height:{{configure.templateBase.photoHeight}}rpx"
            src="{{avatar}}"></image>
    </view>
    <view class="header" wx:if="{{state=='after'&&greetingCard.cardUrl}}">
        <image src="{{greetingCard.cardUrl}}" class="templateImg" />
        <view class="progressBox">
            <view class="after">{{playTime}}</view>
            <progress percent="{{vProgress}}" class="progress" stroke-width="8" activeColor="#9FFB3E"
                backgroundColor="#3333340" />
            <view class="before">{{endTime}}</view>
        </view>
    </view>
    <!-- 录制控制区域 -->
    <view class="btnsBox" wx:if="{{state!='after'}}">
        <image wx:if="{{state=='before'}}" src="http://reader-wx.ai160.com/images/reader/card/play_1.png" class="send"
            bindtap="play" />
        <view class="recordingBox" wx:if="{{state=='process'}}">
            <image class="readingNow" src="/static/index/readingNow.gif" />
            <image src="http://reader-wx.ai160.com/images/reader/card/play_3.png" class="send" bindtap="play" />
        </view>
        <view class="countDown" wx:if="{{state=='process'}}">
            倒计时：<view class="countBox">{{tens}}</view>
            <view class="countBox">{{bits}}</view>秒
        </view>
    </view>
    <!-- 试听与分享控制区域 -->
    <view class="music" wx:if="{{state=='after'}}">
        <!-- <view class="music"> -->
        <image
            src="{{userAudioState?'http://reader-wx.ai160.com/images/reader/card/audition2.png':'http://reader-wx.ai160.com/images/reader/card/audition.png'}}"
            class="playAuido" bindtap="playUserAudio" />
        <button class="resetBtn share textOver" open-type="share">
            发送给{{configure.toText}}
        </button>
    </view>
    <!-- 祝福语 -->
    <view class="blessing">
        <view wx:for="{{greeting}}" wx:key="index" class="content">{{item}}</view>
    </view>
    <!-- 上传进度 -->
    <view class="mask" wx:if="{{uploadState}}">
        <view class="maskBox" catchtap="true">
            <image src="/static/index/zqq.png" class="img" />
            <view>祝福生成中</view>
        </view>
    </view>
</view>
<yeyouzi-cropper id="yeyouzi-cropper" style="width: 100%;height: 100%;"></yeyouzi-cropper>
<canvas id='share' type="2d"> </canvas>