WenWuGuanJia/xueYuan_fenbao/keCheng/keCheng.vue

<template>
	<view class="box">
		<u-navbar :autoBack="true" title="专家课程" bgColor="rgba(255,255,255,0)" :placeholder="true" titleStyle="font-weight:bold;color:#000000"></u-navbar>
		<view class="scarch_box">
			<u-search
				@custom="search"
				:actionStyle="{ color: '#985741', fontSize: '28rpx', fontWeight: 'bold' }"
				height="25"
				shape="square"
				placeholder="搜索课程"
				v-model.trim="value"
			></u-search>
		</view>
		<view class="" v-if="state.course_list.length > 0">
			<course-item v-for="(item, index) in state.course_list" :key="index" :item="item"></course-item>
		</view>
		<u-empty v-else text="暂无课程" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty>
		<view class="kc_box">
			<!-- 	<view class="b-cover">
				<image style="width: 100%; height: 100%" src="https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/dt_lb1.jpg" mode="aspectFill"></image>
			</view> -->

			<!-- 	<view class="b-main">
				<view class="text_23">
					<view class="">学习文物新知识</view>
					<view class="text_25">讲师:李老师</view>
				</view>
				<view class="button_6">立即观看</view>
			</view> -->
		</view>
	</view>
</template>

<script>
let that;
export default {
	data() {
		return { value: '', state: null };
	},
	onLoad() {
		that = this;
		this.getHomeData();
	},
	methods: {
		search() {
			console.log(this.value);
		},
		// 课程
		getHomeData() {
			this.$api.getHomeData({}, function (res) {
				console.log(res, 1010);
				// this.hasLoad = true
				// this.loadingType = -1
				that.state = res.data;
				console.log(that.state, 1010);
			});
		}
	}
};
</script>

<style>
.box {
	width: 100%;
	padding-bottom: 50rpx;
	/* 	background-image: url('https://huli-app.wenlvti.net/app_static/WenWuGuanJia/image/xbg_2.png');
	background-size: 100% 100%;
	background-attachment: fixed;
	background-repeat: repeat-y; */
	min-height: 100%;
	height: auto;
	background-color: #fff9e9;
}
.scarch_box {
	width: 600rpx;
	height: 82rpx;
	margin: auto;
	padding: 15rpx 0 0 30rpx;
	background-image: url('/static/img/search_bg1.png');
	background-size: 100% 100%;
}
/deep/.u-search__content.data-v-0a306a29 {
	border-radius: 0 !important;
}
.kc_box {
	padding: 30upx;
	display: flex;
	align-items: center;
	/* box-shadow: rgba(0, 0, 0, 0.1) 0px 20rpx 15px -6rpx, rgba(0, 0, 0, 0.05) 0px 8rpx 12rpx -4rpx; */
}
.b-cover {
	width: 307rpx;
	height: 171rpx;
}
.b-main {
	flex: 1;
	margin-left: 20upx;
}
.text_23 {
	color: #272727;
	font-size: 30rpx;
	margin-top: 10rpx;
	font-weight: 600;
}
.button_6 {
	background-color: rgba(202, 86, 66, 1);
	color: rgba(248, 226, 175, 1);
	font-size: 24rpx;
	line-height: 45rpx;
	height: 42rpx;
	width: 137rpx;
	text-align: center;
	margin: 62rpx 0 0 160rpx;
}
.text_25 {
	font-size: 26rpx;
	color: #727070;
	margin-top: 10rpx;
	font-weight: 400;
}
</style>