index.wxml 3.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <view class="activityDet">
  2. <view class="header" wx:if="{{state!='after'||!greetingCard.cardUrl}}">
  3. <image src="{{configure.bgImg}}" class="templateImg" />
  4. <view class="toBox" style="top:{{configure.templateBase.fromTop}}rpx;left: {{configure.templateBase.fromLeft}}rpx;">
  5. <input value="{{configure.fromText}}" class="text" maxlength='8'
  6. style="color:{{configure.fromColor}};font-size: {{configure.fromFontSize}}rpx;border-color: {{configure.fromColor}}60;width: {{fromWidth}}rpx;"
  7. bindinput="bindKeyInput" data-type='from' />
  8. <image src="/static/image/edit_new.png" />
  9. </view>
  10. <view class="toBox" style="top:{{configure.templateBase.toTop}}rpx;left: {{configure.templateBase.toLeft}}rpx;">
  11. <input value="{{configure.toText}}" class="text" maxlength='8'
  12. style="color:{{configure.toColor}};font-size: {{configure.toFontSize}}rpx;border-color: {{configure.toColor}}60;width: {{toWidth}}rpx;"
  13. bindinput="bindKeyInput" data-type='to' />
  14. <image src="/static/image/edit_new.png" />
  15. </view>
  16. <button class="avatar resetBtn" open-type="chooseAvatar" bind:chooseavatar="changeAvatar"
  17. style="top:{{configure.templateBase.photoTop}}rpx;left: {{configure.templateBase.photoLeft}}rpx;width: {{configure.templateBase.photoWidth}}rpx;height:{{configure.templateBase.photoHeight}}rpx">
  18. <view class="tips" wx:if="{{!changeAvatarFlag}}">点击更换图片</view>
  19. </button>
  20. <image class="avatarImg"
  21. style="top:{{configure.templateBase.photoTop}}rpx;left: {{configure.templateBase.photoLeft}}rpx;width: {{configure.templateBase.photoWidth}}rpx;height:{{configure.templateBase.photoHeight}}rpx"
  22. src="{{avatar}}"></image>
  23. </view>
  24. <view class="header" wx:if="{{state=='after'&&greetingCard.cardUrl}}">
  25. <image src="{{greetingCard.cardUrl}}" class="templateImg" />
  26. </view>
  27. <!-- 录制控制区域 -->
  28. <view class="btnsBox" wx:if="{{state!='after'}}">
  29. <image wx:if="{{state=='before'}}" src="http://reader-wx.ai160.com/images/reader/card/play_1.png" class="send"
  30. bindtap="play" />
  31. <view class="recordingBox" wx:if="{{state=='process'}}">
  32. <image class="readingNow" src="/static/index/readingNow.gif" />
  33. <image src="http://reader-wx.ai160.com/images/reader/card/play_3.png" class="send" bindtap="play" />
  34. </view>
  35. <view class="countDown" wx:if="{{state=='process'}}">
  36. 倒计时:<view class="countBox">{{tens}}</view>
  37. <view class="countBox">{{bits}}</view>秒
  38. </view>
  39. </view>
  40. <!-- 试听与分享控制区域 -->
  41. <view class="music" wx:if="{{state=='after'}}">
  42. <!-- <view class="music"> -->
  43. <image
  44. src="{{userAudioState?'http://reader-wx.ai160.com/images/reader/card/audition2.png':'http://reader-wx.ai160.com/images/reader/card/audition.png'}}"
  45. class="playAuido" bindtap="playUserAudio" />
  46. <button class="resetBtn share textOver" open-type="share">
  47. 发送给{{configure.toText}}
  48. </button>
  49. </view>
  50. <!-- 祝福语 -->
  51. <view class="blessing">
  52. <view wx:for="{{greeting}}" wx:key="index" class="content">{{item}}</view>
  53. </view>
  54. <!-- 上传进度 -->
  55. <view class="maskBox" catchtap="true" wx:if="{{uploadState}}">
  56. <view>{{percent}}%</view>
  57. <progress percent="{{percent}}" class="speedProgress" stroke-width="10" activeColor="#C3F166" />
  58. <view>祝福生成中</view>
  59. </view>
  60. </view>
  61. <canvas id='share' type="2d"> </canvas>