课程说明未完成

pages/course/myCourse.vue

@@ -2,38 +2,43 @@
 	<view>
 		<!-- 公共组件-每个页面必须引入 -->
 		<public-module></public-module>
-		<z-nav-bar :title="pageTitle ? pageTitle : '课程中心'"></z-nav-bar>		
+		<z-nav-bar title="我的课程"></z-nav-bar>
+		<view class="tabsBox" :class="[fixed ? 'fixed' : '' ]">
+			<u-tabs v-if="tabList.length > 0" :class="['tabList']" @click="fatherClick" :current="curTagId"
+				:activeStyle="activeStyle" :scrollable="scrollable" :list="tabList"
+				itemStyle="padding-left: 15px; padding-right: 15px; height: 50px;"></u-tabs>
+		</view>
 		<view class="containerBg1">			
 			<!-- <view class="containerBg"> -->
-			<view class="coursePart flexbox" v-if="tabList.length > 1">
-				<view :class="['item','flexbox',curId == item.id? 'active': '' ]" v-for="(item, index) in tabList"
-					:key="index" @click="clicklib(item,index)">
-					<!-- <u-icon v-if="item.isBuy == 0 && curId == item.id" name="lock" color="#258feb" size="28"></u-icon> -->
-					<!-- <u-icon v-if="item.isBuy == 0 && curId != item.id" name="lock" color="#fff" size="28"></u-icon> -->
-					<view class="">{{item.title}}</view>
-				</view>
-			</view>
-			<view :class="['courseList',fold ? 'fold' : '']" v-if="courseList.length > 0">
-			<!-- 目录是否已经购买 -->
-			<!-- 0:普通 1超级 2医学 3国学 -->
-			<view class="endBox" v-if="tabList[curIndex].isBuy == 1 && userMsg.vip == '0'">
-				<view class="" >
-					<view class="flexbox" v-if="tabList[curIndex].startTime == null">
-						<text >当前目录还未开始学习</text><uni-tag type="warning" text="去学习" @click="goToLearn()"></uni-tag>
+			<view class="newBox">
+					<view class="item flexbox" v-for="(item, index) in MyCourseList.list" :key="index" @click="onPageJump('/pages/course/courseDetail',item.id)">
+						<!-- <view class="imgcontainer" :style="{backgroundImage:surl(item.image)}"> -->
+						<view class="imgcontainer">
+							<image :src="item.image" mode="aspectFit"></image>
+						</view>
+						<view class="buyItems">
+							<view class="txt555">
+								{{item.title}}
+							</view>
+							<view class="jianjie" v-html="item.content">
+			
+							</view>
+							<view class="tag-view">
+								<uni-tag v-if="item.level != 0" style="margin-right: 10rpx;" :text="item.level == 1 ? '初级':'高级'" type="primary" size="small" />
+								<uni-tag v-if="item.selective != 0 && item.selective == 1" style="margin-right: 10rpx;" text="必修" size="small" type="warning" />
+								<uni-tag v-if="item.selective != 0 && item.selective == 2" style="margin-right: 10rpx;" text="选修" size="small" type="success" />
+							</view>
+							<view class="btn_box">
+								<text>了解课程</text>
+							</view>
+						</view>
+						
 					</view>
-					<view class="flexbox" v-else>
-						<text >课程观看有效期截止到：{{tabList[curIndex].endTime}} </text><uni-tag type="primary" @click="goToLearn()" text="继续学习"></uni-tag>
-					</view>					
 				</view>
-				
+				<u-divider v-show="MyCourseList.status == 2" text="已加载全部"></u-divider>
+				<u-divider v-show="MyCourseList.status == 3" text="暂无数据"></u-divider>
+				<u-divider v-show="MyCourseList.status == 1" text="加载中..."></u-divider>
 			</view>
-				<view class="item" v-for="(item, index) in courseList" :key="index" @click="chooseChapter(item, index)">
-					<text>{{item.title}}</text>
-					<uni-tag v-if="item.isAudition == 1" style="margin-left: 10rpx;" :inverted="true" text="试听"
-						size="mini" type="primary" />
-				</view>
-			</view>
-			<u-divider v-else text="暂无数据"></u-divider>
 			
 			<view>
 				<u-back-top :scroll-top="scrollTop" bottom="150" :customStyle='bgiStyle'
@@ -61,6 +66,7 @@
 	export default {
 		data() {
 			return {
+				curTagId:0,
 				playData: {},				
 				// fixed: false,
 				bgiStyle: {
@@ -81,13 +87,29 @@
 
 				},
 				scrollable: false,
-				pageTitle: null,
-				courseList: [],
-			
+				pageTitle: null,				
+			fixed:false,
 				tabList: [{id:1, name:'我的课程'},{id:2, name:'在学习'},{id:3, name:'已过期'}], // 目录列表
 				curId: null,
 				curIndex: 0,
-				
+				MyCourseList:{
+					list:[],
+					status:88,
+					page:1,
+					flag:false
+				},
+				LearningCourseList:{
+					list:[],
+					status:88,
+					page:1,
+					flag:false
+				},
+				ExpiredCourseList:{
+					list:[],
+					status:88,
+					page:1,
+					flag:false
+				}
 				
 			};
 		},
@@ -99,10 +121,10 @@
 			// this.pageTitle = e.title
 			console.log(e, '传入分类id')
 			this.getUserInfo()
-			// this.courseId = e.id
-			// this.getCateList(this.courseId)
-			// this.getData(e.id)			
-			// this.getSayList()
+			this.fatherClick()
+			this.getMyCourseList()
+			this.getLearningCourseList()
+			this.getExpiredCourseList()
 		},
 		onPageScroll(e) {
 			this.scrollTop = e.scrollTop;
@@ -123,10 +145,10 @@
 		},
 		onReachBottom() {
 			console.log('触底');
-			if (this.status != 2) {
-				this.pPage++
-				this.getSayList()
-			}
+			// if (this.status != 2) {
+			// 	this.pPage++
+			// 	this.getSayList()
+			// }
 		},
 		components: {
 			// musicPlay
@@ -136,6 +158,51 @@
 		},
 		//方法
 		methods: {
+			fatherClick(){},
+			getMyCourseList(){
+				this.MyCourseList.status = 1
+				if (!this.MyCourseList.flag) {
+					console.log('正在执行，未完成')
+					return
+				}
+				
+				this.MyCourseList.flag = false
+				$http.request({
+						url: "medical/home/getMedicalCourseList",
+						method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
+						data: {
+							"id": id,
+							"limit": 12,
+							"page": this.MyCourseList.page
+						},
+						header: { //默认 无 说明：请求头
+							'Content-Type': 'application/json'
+						},
+					})
+					.then(res => {
+						if (res.code == 0) {
+							if (res.courses.records.length > 0) {
+								var list = res.courses.records
+								this.courseList = this.MyCourseList.list.concat(list)
+								if (res.courses.pages > this.MyCourseList.page) {
+									this.MyCourseList.status = 0
+								} else {
+									this.MyCourseList.status = 2
+								}
+							}		
+							else {
+				
+								this.MyCourseList.status = 3 // 暂无数据
+							}
+							console.log('status', this.MyCourseList.status)
+						}
+						this.MyCourseList.flag = true
+					}).catch(e => {
+						console.log(e, '数据报错')
+					});
+			},
+			getLearningCourseList(){},
+			getExpiredCourseList(){},
 			getUserInfo() {
 				// 用户详情
 				// if (this.userInfo.id != undefined) {
@@ -160,7 +227,7 @@
 <style lang="scss" scoped>
 	@import '@/style/mixin.scss';
 
-
+	.tabsBox{background-color: #e4eefa;}
 	.flexbox {
 		display: flex;
 	}