banben.vue 1.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  1. <template>
  2. <view class="ezy-xbb-page">
  3. <view class="icon-title-navBar-box">
  4. <view class="nav-bar-icon" @click="handleBack"></view>
  5. <view class="nav-bar-title">选择版本</view>
  6. </view>
  7. <view class="xbb-list-box">
  8. <template v-if="data.banbenList.length">
  9. <view class="xbb-item-box" v-for="item in data.banbenList" :key="item.id">
  10. <!-- 封面 -->
  11. <image class="item-img-box" :src="item.cover" mode=""></image>
  12. <view class="item-content-box">
  13. <!-- 名称+等级 -->
  14. <view class="item-name">{{item.chanpinName}} {{item.dengjiName}}</view>
  15. <!-- 版本名称 -->
  16. <view class="item-bb">{{item.name}}</view>
  17. </view>
  18. <view class="item-play-btn" @click="handleSelect(item)"></view>
  19. </view>
  20. </template>
  21. <template v-else>
  22. <!-- 无数据 -->
  23. </template>
  24. </view>
  25. <CustomTabBar :currentTabNumber="0"></CustomTabBar>
  26. </view>
  27. </template>
  28. <script setup>
  29. import {reactive} from "vue";
  30. import {onLoad} from "@dcloudio/uni-app"
  31. import * as shuxueHttp from "@/api/chanpinShuxue.js"
  32. import CustomTabBar from "@/components/custom-tabbar/custom-tabbar.vue";
  33. const data = reactive({
  34. dengjiId: null,
  35. banbenList: []
  36. })
  37. function getBanbenList() {
  38. shuxueHttp.getShuxueChanpinBanbenList({dengjiId: data.dengjiId}).then(res => {
  39. data.banbenList = res.data;
  40. })
  41. }
  42. function handleBack() {
  43. uni.redirectTo({
  44. url: `/pages/chanpinXuanze/index`
  45. })
  46. }
  47. function handleSelect(item) {
  48. if (cacheManager.get('xuexi-shuxue')) {
  49. cacheManager.remove("xuexi-shuxue")
  50. }
  51. uni.redirectTo({
  52. url: `/pages/chanpinneirong/index?banbenId=${item.id}&danyuanId=1&customType=3&chanpinId=${item.chanpinId}&dengjiId=${item.dengjiId}`
  53. })
  54. }
  55. onLoad((options) => {
  56. data.dengjiId = options.dengjiId;
  57. getBanbenList();
  58. })
  59. </script>
  60. <style>
  61. </style>