kechengCard.vue 1.2 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <view class="shouye-card-box kecheng-card-box">
  3. <!-- card title -->
  4. <view class="card-head-box">
  5. <view class="card-line-title">课程</view>
  6. <view class="card-more">更多<text class="more-num">{{data.count}}</text><icon class="more-jt"></icon></view>
  7. </view>
  8. <!-- kaoshi title -->
  9. <view class="card-name-box">
  10. <view class="card-name" v-if="data.name"><icon></icon>{{data.name}}</view>
  11. <text class="card-level">{{data.zyLevelName}}</text>
  12. </view>
  13. <!-- 内容区域 -->
  14. <view class="card-content-box kaoshi-content-box">
  15. <view class="card-content-item">
  16. <icon class="card-time-icon"></icon>
  17. <view class="content-text-box">
  18. <text>时间</text>
  19. <view>{{data.totalTm}}分钟</view>
  20. </view>
  21. </view>
  22. </view>
  23. <!-- 底部 -->
  24. <view class="card-bottom-box">
  25. <button type="default" class="index-card-btn" v-if="data.status == 1">课程学习</button>
  26. <button type="default" class="index-card-btn" v-if="data.status == 2">学习中</button>
  27. <button type="default" class="index-card-btn" v-if="data.status == 3">已完成</button>
  28. </view>
  29. </view>
  30. </template>
  31. <script setup>
  32. defineProps({
  33. data: {
  34. type: Object,
  35. }
  36. })
  37. </script>
  38. <style>
  39. </style>