details.wxml 3.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <view style="background: #f5f5f5; padding: 20rpx 0;">
  2. <view class="container">
  3. <view class="header">
  4. <text>{{ itemlist.name }}</text>
  5. <text>{{itemlist.publisher}} • {{ itemlist.createdAt }}</text>
  6. <text>{{itemlist.type === 0 ? '视频' : itemlist.type === 1 ? '音频' : itemlist.type === 2 ? 'PDF' : itemlist.type === 3 ? 'PPT' : '图文'}} 适用于 {{ itemlist.range }}</text>
  7. </view>
  8. <!-- 预览 -->
  9. <view class="{{itemlist.type === 1 ? 'file-preview' : 'file-preview'}}">
  10. <view class="file-preview" wx:if="{{itemlist.type === 0}}">
  11. <video id="myVideo" class="course-videos" src="{{itemlist.url}}" controls></video>
  12. </view>
  13. <view class="file-preview" wx:elif="{{itemlist.type === 1}}">
  14. <image style="width: 100%; height: 100%;" src="{{itemlist.cover}}" alt="" class="file-placeholder"/>
  15. <!-- <web-view src="{{itemlist.url}}"/> -->
  16. <view class="play-button">点击下方按钮预览课件</view>
  17. </view>
  18. <view class="file-preview" wx:elif="{{itemlist.type === 2}}">
  19. <image style="width: 100%; height: 100%;" src="{{itemlist.cover}}" alt="" class="file-placeholder"/>
  20. <!-- <web-view src="{{itemlist.url}}"/> -->
  21. <view class="play-button">点击下方按钮预览课件</view>
  22. </view>
  23. <view class="file-preview" wx:elif="{{itemlist.type === 3}}">
  24. <image style="width: 100%; height: 100%;" src="{{itemlist.cover}}" alt="" class="file-placeholder"/>
  25. <view class="play-button">点击下方按钮预览课件</view>
  26. </view>
  27. <view class="file-preview" wx:else>
  28. <image style="width: 100%; height: 100%;" src="{{itemlist.cover}}" alt="" class="file-placeholder"/>
  29. </view>
  30. </view>
  31. <view class="buttons">
  32. <button bindtap="previewPDF" class="preview-btns yulan">
  33. <image class="download-iconss" src="{{show_1}}" />
  34. 在线预览
  35. </button>
  36. <button bindtap="goTocollect" data-item="{{itemlist}}" class="preview-btns shoucang {{isCollected ? 'active' : ''}}">
  37. <image wx:if="{{isCollected}}" class="download-iconss" src="{{shouchangs}}" />
  38. <image wx:else class="download-iconss" src="{{shouchang}}" />
  39. 收藏
  40. </button>
  41. <button bindtap="goToGoodsLists" data-item="{{itemlist}}" class="download-btn xiazai">
  42. <image class="download-iconss" src="{{xia}}" />
  43. 下载
  44. </button>
  45. </view>
  46. <view class="related-courses">相关课件推荐</view>
  47. <!-- 列表 -->
  48. <view class="course-list">
  49. <block wx:for="{{courseList}}" wx:key="id">
  50. <view class="card" bindtap="goToGoodsList" data-item="{{item}}">
  51. <view class="cardimg">
  52. <image style="width: 100%; height: 100%;" src="{{item.cover}}" />
  53. <view class="label {{item.type === 0 ? 'shipin' : item.type === 1 ? 'yinpin' : item.type === 2 ? 'PDF' : item.type === 3 ? 'PPT' : '图文'}} labelwg" >{{item.type === 0 ? '视频' : item.type === 1 ? '音频' : item.type === 2 ? 'PDF' : item.type === 3 ? 'PPT' : '图文'}}</view>
  54. </view>
  55. <view class="item-content">
  56. <view class="item-title">{{item.name}}</view>
  57. <view style="display: flex; justify-content: space-between;">
  58. <view class="item-subtitle">
  59. {{item.describe}}
  60. </view>
  61. <view class="item-download-count">
  62. 已有{{item.download_count}}人下载
  63. </view>
  64. </view>
  65. <view class="item-buttons">
  66. <button class="preview-btn"><image class="download-icons" src="{{show_1}}" />在线预览</button>
  67. <image class="download-icon" src="{{xiazi}}" />
  68. </view>
  69. </view>
  70. </view>
  71. </block>
  72. </view>
  73. <float />
  74. </view>
  75. </view>