92 lines
2.4 KiB
Vue
92 lines
2.4 KiB
Vue
<template>
|
|
<view>
|
|
<status-container titlet="我的课程" returnc="#FFFFFF">
|
|
<view slot="content" style="margin-top: -20rpx;">
|
|
<view class="pad-zy30 bacf pad-x30" v-if="total">
|
|
<view class="pad-sx30 disac fon24 bbot" v-for="(item,index) in dataList" :key="index">
|
|
<image class="flexs" :src="item.cover" mode="aspectFill" style="width: 228rpx;height: 160rpx;"></image>
|
|
<view class="disjbac fc width100 mar-z20" style="height: 160rpx;">
|
|
<view class="fon26 col26 width100">
|
|
<view class="clips2">{{item.name}}</view>
|
|
<view class="fon20 mar-s10" style="color: #7f7f7f;">{{item.created_at}}</view>
|
|
</view>
|
|
<view class="disjbac width100">
|
|
<view class="fon24">￥{{item.price}}</view>
|
|
<view @tap="$toolAll.tools.goPage(`/pagesB/course-list/course-list?id=${item.spu_id}`)" class="disjcac fon22 radius26" style="width: 144rpx;height: 52rpx;color: #f37717;border: 2rpx solid #f37717;">点击学习</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="" v-if="loading">
|
|
<pitera :textStr="`${noMore && total > dataList.length?'上滑加载更多':'到底了'}~~`" textColor="#b0aaa9" paddingStr="40rpx 0 20rpx 0"></pitera>
|
|
</view>
|
|
</view>
|
|
</status-container>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import swiperTab from '@/components/swiper-tab/swiper-tab.vue';
|
|
import pitera from '@/components/nothing/pitera.vue';
|
|
export default {
|
|
components:{
|
|
swiperTab,
|
|
pitera
|
|
},
|
|
data() {
|
|
return {
|
|
dataList:[],
|
|
page:1,
|
|
size:20,
|
|
total:0,
|
|
noMore:false,
|
|
loading:false
|
|
}
|
|
},
|
|
onLoad() {
|
|
// 获取课程列表
|
|
this.getCouresList();
|
|
},
|
|
onReachBottom() {
|
|
if(this.total!=this.dataList.length){
|
|
this.page++;
|
|
this.getCouresList();
|
|
}
|
|
},
|
|
methods: {
|
|
// 获取课程列表
|
|
getCouresList(){
|
|
this.loading = false;
|
|
let params = {
|
|
page:this.page,
|
|
size:this.size
|
|
}
|
|
this.$requst.get('/api/user/course',params).then(res=>{
|
|
this.total = res.data.total;
|
|
if(this.page==1){this.dataList=[];}
|
|
this.dataList = [...this.dataList,...res.data.list];
|
|
if(this.total==this.dataList.length && this.page!=1){
|
|
this.noMore = true;
|
|
}
|
|
this.loading = true;
|
|
})
|
|
},
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.used-item{
|
|
border-top: 2rpx solid ;
|
|
}
|
|
.noshow{
|
|
transform: rotate(-90deg);
|
|
transition: all .3s linear;
|
|
}
|
|
.isshow{
|
|
transform: rotate(90deg);
|
|
transition: all .3s linear;
|
|
}
|
|
</style>
|