index.wxml 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. <view class="readingBox">
  2. <!-- 查看全部配音作品 -->
  3. <view class="moreWork" wx:if="{{readingType=='public'||readingType=='readMatch'}}">
  4. <view class="left">查看全部配音作品</view>
  5. <view class="right" bindtap="otherWork" style="width: {{(videoInfo.avatarList.length+1)*42+64}}rpx;">
  6. <block wx:for="{{videoInfo.avatarList}}" wx:key="index">
  7. <image class="moreImg" style="left: {{(index+1)*40}}rpx;" src="{{item}}"></image>
  8. </block>
  9. <image src="/static/more.png" class="moreImg" />
  10. </view>
  11. </view>
  12. <view class="videoBox" wx:if="{{!videoInfo.userReadExtend||videoInfo.userReadExtend.resourcesType==0}}">
  13. <image src="{{videoInfo.userRead.coverImg}}" class='poster' wx:if="{{!state&&!exampleState}}"
  14. bindtap="videoPlay" />
  15. <image src="/static/play-btn.png" bindtap="videoPlay" wx:if="{{!state&&!exampleState}}" class="playBtn" />
  16. <!-- 水印 -->
  17. <image src="{{videoInfo.readMaskTemplate.imgPath}}" class="watermark" />
  18. <video id="myVideo" src="{{videoPath}}" bindended='videoEnd' show-center-play-btn="{{readingReset}}"
  19. custom-cache="{{false}}" controls="{{!state&&!readingReset}}" muted="{{muted}}"></video>
  20. </view>
  21. <view class="audio" bindtap='videoPlay' wx:else>
  22. <!-- <image src="{{videoInfo.userRead.coverImg}}" class="audioBg" /> -->
  23. <!-- <view class="mask"></view> -->
  24. <view class="audioPlay" style="background-image: url({{videoInfo.userReadExtend.backgroundVirtualImg}});">
  25. <image src="/static/audioBg.png" class="audioPlayBg {{state?'circle':''}}" />
  26. <image src="/static/zhen.png" class="audioPlayZhen" />
  27. <image src="/static/play-btn.png" wx:if="{{!state&&!exampleState}}" class="playBtn" />
  28. <image src="{{videoInfo.userRead.coverImg}}" class="cover {{state||exampleState?'circle':''}}" mode="" />
  29. </view>
  30. <view class="progressBar">
  31. <image src="{{state||exampleState?'/static/aStop.png':'/static/aPlay.png'}}" class="audioSwitch" />
  32. <view class="time">{{silderData.currentTime}}</view>
  33. <slider class="slider" value="{{silderData.sliderValue}}" catchtap="false"
  34. disabled="{{!state&&!exampleState}}" catchchange="slider" block-size='12' backgroundColor='#ffffff50'
  35. selected-color="#ffffff" />
  36. <view class="time">{{silderData.endTime}}</view>
  37. </view>
  38. </view>
  39. <view class="contentBox" wx:if="{{!readingReset}}">
  40. <view class="articleMask"></view>
  41. <scroll-view class="content" scroll-y enhanced show-scrollbar="{{false}}" scroll-top="{{scrollTop}}"
  42. scroll-with-animation>
  43. <view style="height: 100rpx;"></view>
  44. <view class="row {{currentRow==index?'currentRow':''}}" wx:for="{{article}}" wx:key="id">{{item.text}}
  45. </view>
  46. <view style="height: {{contentH}}rpx;"></view>
  47. </scroll-view>
  48. </view>
  49. <view class="scoreBoxC" wx:elif="{{readingReset}}">
  50. <view class="scoreBox">
  51. <!-- 星星区域 -->
  52. <view class="lightBox">
  53. <image src="/static/{{readDetail.myOverall>=10?'stars-1.png':'stars-2.png'}}" class="stars stars-1"
  54. mode="" />
  55. <image src="/static/{{readDetail.myOverall>=30?'stars-1.png':'stars-2.png'}}" class="stars stars-2"
  56. mode="" />
  57. <image src="/static/{{readDetail.myOverall>=50?'stars-1.png':'stars-2.png'}}" class="stars stars-3"
  58. mode="" />
  59. <image src="/static/{{readDetail.myOverall>=70?'stars-1.png':'stars-2.png'}}" class="stars stars-4"
  60. mode="" />
  61. <image src="/static/{{readDetail.myOverall>=90?'stars-1.png':'stars-2.png'}}" class="stars stars-5"
  62. mode="" />
  63. <image src="/static/light.png" class="light" mode="" />
  64. </view>
  65. <!-- 主体得分区域 -->
  66. <view class="score">
  67. <view class="avatarBox">
  68. <image src="{{userInfo.avatar}}" class="avatar" mode="" />
  69. </view>
  70. <view class="nickName">
  71. {{userInfo.nickName||userInfo.eid}}
  72. </view>
  73. <view class="totalScore">
  74. <text>综合得分:</text>
  75. <text class="num">{{readDetail.myOverall}}</text>
  76. </view>
  77. <view class="progressBox">
  78. <view class="row">
  79. <view class="name">完整度</view>
  80. <progress class="progress" active percent='{{readDetail.integrity}}' stroke-width="18"
  81. activeColor="#70D9FF" />
  82. <view class="scoreInfo">
  83. {{readDetail.integrity}}/100
  84. </view>
  85. </view>
  86. <view class="row">
  87. <view class="name">正确率</view>
  88. <progress class="progress" active percent='{{readDetail.accuracy}}' stroke-width="18"
  89. activeColor="#918EFD" />
  90. <view class="scoreInfo">
  91. {{readDetail.accuracy}}/100
  92. </view>
  93. </view>
  94. <view class="row">
  95. <view class="name">流利度</view>
  96. <progress class="progress" active percent='{{readDetail.fluency}}' stroke-width="18"
  97. activeColor="#FE9500" />
  98. <view class="scoreInfo">
  99. {{readDetail.fluency}}/100
  100. </view>
  101. </view>
  102. <view class="row">
  103. <view class="name">语调</view>
  104. <progress class="progress" active percent='{{readDetail.tone}}' stroke-width="18"
  105. activeColor="#9BE74B " />
  106. <view class="scoreInfo">
  107. {{readDetail.tone}}/100
  108. </view>
  109. </view>
  110. </view>
  111. </view>
  112. </view>
  113. </view>
  114. <view class="controller">
  115. <!-- <image wx:else src="/static/work.png" class="playImg" bindtap="eeeeee" /> -->
  116. <view class="workBox">
  117. <view class="vipLogo" wx:if="{{!isVip}}">VIP</view>
  118. <image wx:if="{{state}}" src="/static/readingNow.gif" class="readingNow" bindtap="setCountDown" />
  119. <image wx:else src="/static/work.png" class="playImg" bindtap="setCountDown" />
  120. </view>
  121. <view class="text">
  122. {{state?'完成录制':readingReset?'点击重录':readingType=='public'||readingType=='readMatch'?'开始朗读':'开始挑战'}}
  123. </view>
  124. <block wx:if="{{readingReset}}">
  125. <uploadFile activityId='{{activityId}}' readingType='{{readingType}}' class="btnPosition"
  126. wx:if="{{!uploadHide}}" />
  127. <view class="stBtn" bindtap="backReading">退出</view>
  128. </block>
  129. </view>
  130. <view class="playImgBg"></view>
  131. <!-- 倒计时 -->
  132. <view class="countDownBox" wx:if="{{countDown.state}}">
  133. <view class="countDown">
  134. <view class="number">{{countDown.num}}</view>
  135. <view class="tips">秒后开始</view>
  136. </view>
  137. </view>
  138. <page-container show="{{uploadState}}" bind:beforeleave='beforeleave'>
  139. <view class="uploadBox">
  140. <view class="upload">
  141. <image src="/static/uploadTips.png" class="tipsImg" />
  142. <view>{{readingType=='pk'?'挑战结算中,小朋友请耐心等待哦~':'作品上传中,小朋友请耐心等待哦~'}}</view>
  143. <view class="speed">
  144. {{percent}}%
  145. </view>
  146. </view>
  147. </view>
  148. </page-container>
  149. <buyVip id="buyVip" />
  150. <canvas id='share' type="2d"> </canvas>
  151. <vipModal id="vipModal"></vipModal>
  152. <canvas id='vip' type="2d"> </canvas>
  153. </view>