114 lines
2.9 KiB
Vue
114 lines
2.9 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="hostapi + 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.title}}</view>
|
||
|
|
<view class="fon20 mar-s10" style="color: #7f7f7f;">{{item.summary}}</view>
|
||
|
|
</view>
|
||
|
|
<view class="disjbac width100" style="justify-content: flex-end;">
|
||
|
|
<view @tap="getVideoInfo(item.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:[],
|
||
|
|
course_id:'',
|
||
|
|
hostapi:'',
|
||
|
|
page:1,
|
||
|
|
size:20,
|
||
|
|
total:0,
|
||
|
|
noMore:false,
|
||
|
|
loading:false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad(e) {
|
||
|
|
this.course_id = e.id;
|
||
|
|
this.hostapi = getApp().globalData.hostapi;
|
||
|
|
// 获取课程列表
|
||
|
|
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,
|
||
|
|
course_id:this.course_id,
|
||
|
|
}
|
||
|
|
this.$requst.get('/api/course/get-course-video',params).then(res=>{
|
||
|
|
this.total = res.data.list;
|
||
|
|
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;
|
||
|
|
})
|
||
|
|
},
|
||
|
|
|
||
|
|
|
||
|
|
getVideoInfo(id) {
|
||
|
|
this.$requst.get('/api/course/get-course-video-info',{course_video_id:id}).then(res=>{
|
||
|
|
console.log(res.code,'课程视频')
|
||
|
|
if(res.code == 0) {
|
||
|
|
uni.navigateTo({
|
||
|
|
url:`/pagesB/course-video/course-video?id=${id}`
|
||
|
|
})
|
||
|
|
}else {
|
||
|
|
uni.showToast({
|
||
|
|
title: res.msg,//标题 必填
|
||
|
|
icon: 'error',//图标
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</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>
|