You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
152 lines
4.0 KiB
152 lines
4.0 KiB
<template>
|
|
<BaseContainer class="favorite" :fixedNav="false">
|
|
<NavBarTitle title="我的课程" :height="200"/>
|
|
<view v-if="gradeList.length" class="list">
|
|
<navigator hover-class="none" v-for="item of gradeList" :key="item.id" :url="item.path" >
|
|
<view>
|
|
<image mode="aspectFill" :src="item.image" />
|
|
<view>{{ item.typeName }}</view>
|
|
</view>
|
|
<view>
|
|
<view>{{ item.title }}</view>
|
|
<view v-if="item.label.length">
|
|
<template v-for="(label, index) in item.label">
|
|
<view v-if="index < 2" :key="index">{{ label }}</view>
|
|
</template>
|
|
</view>
|
|
<view>
|
|
<view :class="{ money: item.pay_type }">
|
|
<template v-if="item.pay_type">
|
|
￥<text>{{ item.is_pink ? item.pink_money : item.money }}</text>
|
|
</template>
|
|
<template v-else> 免费 </template>
|
|
</view>
|
|
<view v-if="!item.is_light && item.types !== 4">共{{ item.count }}节</view>
|
|
</view>
|
|
</view>
|
|
</navigator>
|
|
</view>
|
|
<view v-show="loading" class="loading">
|
|
<text class="fa fa-spinner"></text>
|
|
</view>
|
|
<view v-if="loadend && gradeList.length" class="loaded">已全部加载</view>
|
|
<view v-if="loadend && !gradeList.length">
|
|
<image class="nothing" :src="getImgPath('/wap/first/zsff/images/no_data_available.png')" />
|
|
</view>
|
|
</BaseContainer>
|
|
</template>
|
|
|
|
<script>
|
|
import { getMyGradeList } from "@/api/special";
|
|
export default {
|
|
data() {
|
|
return {
|
|
site_name: "",
|
|
navlist: [{ title: "我的课程" }, { title: "我的收藏" }],
|
|
loadend: false,
|
|
loading: false,
|
|
active: 0,
|
|
gradeList: [],
|
|
min: 2,
|
|
page: 1,
|
|
limit: 10,
|
|
count: 0,
|
|
codeUrl: "",
|
|
loginShow: false,
|
|
isfollow: false,
|
|
url: "/pages/login/phone_check",
|
|
tabs: [
|
|
{
|
|
name: "我的课程",
|
|
value: 1,
|
|
},
|
|
],
|
|
};
|
|
},
|
|
onLoad() {
|
|
this.getGradeList();
|
|
},
|
|
onReachBottom() {
|
|
this.getGradeList();
|
|
},
|
|
methods: {
|
|
// 获取课程
|
|
async getGradeList() {
|
|
if (this.loading || this.loaded) return;
|
|
uni.showLoading({ mask: true });
|
|
this.loading = true;
|
|
try {
|
|
const { data } = await getMyGradeList({
|
|
page: this.page,
|
|
limit: this.limit,
|
|
});
|
|
|
|
const list = data.list;
|
|
|
|
list.forEach((item) => {
|
|
let path = "/pages/special/details";
|
|
let typeName = "图文";
|
|
if (item.types === 2 || item.light_type === 2) {
|
|
typeName = "音频";
|
|
} else if (item.types === 3 || item.light_type === 3) {
|
|
typeName = "视频";
|
|
} else if (item.types === 4) {
|
|
typeName = "直播";
|
|
} else if (item.types === 5) {
|
|
typeName = "专栏";
|
|
}
|
|
if (item.light_type) {
|
|
path = "/pages/special/single_details";
|
|
}
|
|
item.path = path + "?id=" + item.s_id;
|
|
item.typeName = typeName;
|
|
});
|
|
this.gradeList = this.gradeList.concat(list);
|
|
this.loadend = this.limit > list.length;
|
|
this.page = data.page;
|
|
this.loading = false;
|
|
uni.hideLoading();
|
|
} catch (err) {
|
|
this.loading = false;
|
|
uni.hideLoading();
|
|
this.$util.showMsg(err.message);
|
|
}
|
|
},
|
|
// 切换
|
|
tab(value) {
|
|
if (this.loading) return;
|
|
this.active = value;
|
|
this.gradeList = [];
|
|
this.page = 1;
|
|
this.loadend = false;
|
|
this.getGradeList();
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style>
|
|
page{
|
|
background: #F7F8F9;
|
|
}
|
|
</style>
|
|
<style lang="scss">
|
|
@import "@/static/style/favorite.scss";
|
|
|
|
.loaded {
|
|
font-size: 28rpx;
|
|
line-height: 72rpx;
|
|
text-align: center;
|
|
color: #999999;
|
|
}
|
|
.list {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
margin: 0 auto;
|
|
margin-top: calc(128rpx + var(--safe-top));
|
|
width: 686rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 24rpx;
|
|
z-index: 999;
|
|
}
|
|
</style>
|
|
|