details.wxml 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <!--
  2. title和背景
  3. 注:这部分的背景色还没有处理好
  4. -->
  5. <view class="toptitlebar">
  6. <!-- 背景虚化层 -->
  7. <view class="bg" style="background:url({{imgurl}}); background-size: 100% 100%; background-repeat: no-repeat;"></view>
  8. <!-- 内容 -->
  9. <view class="baritem" wx:for="{{performanceInfo}}" wx:key="index">
  10. <view class="baritemtop">
  11. <view class="themebgimg" style="background:url({{item.imgurl}}); background-size:100% 100%"></view>
  12. <view class="themeinfo">
  13. <view class="themetitle">{{item.title}}</view>
  14. <view class="themeauthor">
  15. <!-- <image class="" src="" mode="widthFix"></image> -->
  16. {{item.author}} <text class="icon-right"></text>
  17. </view>
  18. <view class="viewinfo">
  19. <view class="viewinfoleft">{{item.num1}}人收藏</view>
  20. <text class="viewinfomid">|</text>
  21. <view class="viewinforight">已更新{{item.num2}}期</view>
  22. </view>
  23. </view>
  24. </view>
  25. <view class="baritembottom">
  26. <button class="sharebut"><text class="icon-share"></text> 分享</button>
  27. <button class="collection"><text class="icon-add"></text> 收藏</button>
  28. </view>
  29. </view>
  30. </view>
  31. <!-- 顶部选项 -->
  32. <view class="Performance">
  33. <view class="selectbar">
  34. <view class="detail">详情</view>
  35. <view class="list active">节目<text>152</text>
  36. </view>
  37. </view>
  38. <!-- 播放选项 -->
  39. <view class="play">
  40. <view class="playall">
  41. <text class="icon-video"></text> 播放全部
  42. </view>
  43. <view class="playselect">
  44. <view style="margin-right:20rpx"><text class="icon-all"></text> 正序</view>
  45. <view><text class="icon-all"></text> 选集</view>
  46. </view>
  47. </view>
  48. <!-- 节目列表 -->
  49. <view class="performanceContent" wx:for="{{performance}}" wx:key="index">
  50. <!-- 序号 -->
  51. <view class="performanceIndex">{{index+1}}</view>
  52. <!-- 节目标题 -->
  53. <view class="performanceInfo">
  54. <view class="performanceInfoTop">
  55. <view style="font-size:33rpx">{{item.name}}</view>
  56. <view style="color:#aaaaaa">{{item.year}}</view>
  57. </view>
  58. <!-- 播放次数和时间 -->
  59. <view class="performanceInfoBottom">
  60. <view><text class="icon-video"></text>{{item.count}}</view>
  61. <view style="margin-left:20rpx"><text class="icon-time"></text>{{item.time}}</view>
  62. </view>
  63. </view>
  64. </view>
  65. </view>