zz--front/pages2/study/index.vue

<template>
	<view style="padding: 30rpx;">
		<view style="padding: 0 50rpx;">
			<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="button" activeColor="#2F4379"></uni-segmented-control>
		</view>
		<view>
			<view v-show="current === 0">
				<view v-if="list1.length === 0" class="mar-t"><u-empty text="未购买课程" mode="list"></u-empty></view>
				<view v-else class="content" v-for="(item, index) in list1" :key="index" @click="jumpDetail(item)">
					<view>
						<u-row>
							<u-col span="5">
								<view style="padding: 5rpx;"><image :src="$method.splitImgHost(item.coverUrl)" class="c_img"></image></view>
							</u-col>
							<u-col span="7">
								<view style="position: relative;height: 134rpx;padding-left: 10rpx;">
									<view class="c_title">{{ item.courseName }}</view>
								</view>
							</u-col>
						</u-row>
					</view>
				</view>
			</view>
			<view v-show="current === 1">
				<view v-if="list2.length === 0" class="mar-t"><u-empty text="未购买题库" mode="list"></u-empty></view>
				<view v-else class="content" v-for="(item, index) in list2" :key="index" @click="jumpDetail(item)">
					<view>
						<u-row>
							<u-col span="5">
								<view style="padding: 5rpx;"><image :src="$method.splitImgHost(item.coverUrl)" class="c_img"></image></view>
							</u-col>
							<u-col span="7">
								<view style="position: relative;height: 134rpx;padding-left: 10rpx;">
									<view class="c_title">{{ item.bankName }}</view>
								</view>
							</u-col>
						</u-row>
					</view>
				</view>
			</view>
			<view v-show="current === 2">
				<view v-if="list3.length === 0" class="mar-t"><u-empty text="未购买考点重点" mode="list"></u-empty></view>
				<view v-else class="content" v-for="(item, index) in list3" :key="index" @click="jumpDetail(item)">
					<view>
						<u-row>
							<u-col span="5">
								<view style="padding: 5rpx;"><image :src="$method.splitImgHost(item.coverUrl)" class="c_img"></image></view>
							</u-col>
							<u-col span="7">
								<view style="position: relative;height: 134rpx;padding-left: 10rpx;">
									<view class="c_title">{{ item.name }}</view>
								</view>
							</u-col>
						</u-row>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			current: 0,
			items: ['课程', '刷题', '重点考点'],
			list1: [],
			list2: [],
			list3: [],
			paramList: [
				{
					typeId: 1
				},
				{
					typeId: 2
				},
				{
					typeId: 3
				}
			]
		};
	},
	onLoad(option) {
		if (option.status !== undefined) {
			this.current = parseInt(option.status);
		}
		this.getMyCourse();
		this.getMyBank();
		this.getMyNote();
	},
	onShow() {},
	methods: {
		jumpDetail(item) {
			if (this.current == 0) {
				this.$navTo.togo('/pages2/course/detail', {
					id: item.courseId
				});
				return;
			}
			if (this.current == 1) {
				this.$navTo.togo('/pages2/bank/detail', {
					id: item.bankId
				});
				return;
			}
			if (this.current == 2) {
				this.$navTo.togo('/pages2/course/keynote', {
					id: item.fileId
				});
				return;
			}
		},
		onClickItem(e) {
			this.current = e.currentIndex;
		},
		getMyCourse() {
			var self = this;
			var param = this.paramList[0];
			this.$api.getUserBuy(param).then(result => {
				if (result.data.data.courseVoList !== null) {
					self.list1.push.apply(self.list1, result.data.data.courseVoList);
				}
			});
		},
		getMyBank() {
			var self = this;
			var param = this.paramList[1];
			this.$api.getUserBuy(param).then(result => {
				if (result.data.data.questionBankList !== null) {
					self.list2.push.apply(self.list2, result.data.data.questionBankList);
				}
			});
		},
		getMyNote() {
			var self = this;
			var param = this.paramList[2];
			this.$api.getUserBuy(param).then(result => {
				if (result.data.data.examNoteList !== null) {
					self.list3.push.apply(self.list3, result.data.data.examNoteList);
				}
			});
		}
	}
};
</script>

<style scope>
.mar-t {
	margin-top: 30rpx;
}
.c_log {
	font-size: 20rpx;
	font-family: PingFang SC;
	font-weight: 400;
	color: #2f4379;
	position: absolute;
	bottom: 10rpx;
}
.c_title {
	font-size: 30rpx;
	font-family: PingFang SC;
	font-weight: bold;
	color: #2f4379;
	padding-top: 10rpx;
}
.c_img {
	width: 278rpx;
	height: 134rpx;
}
.c_t1 {
	font-size: 20rpx;
	color: #2f4379;
	padding: 15rpx;
}
.content {
	margin-top: 20rpx;
	width: 100%;
	height: 165rpx;
	background: #ffffff;
	box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
	border-radius: 32rpx;
}
.segmented-control__text {
	font-size: 24rpx !important;
}
.segmented-control {
	height: 56rpx !important;
	background-color: #f8f9ff;
}

page {
	background: #ffffff;
}
</style>