<template>
	<view class="content">
		<view class="header_box"></view>
		<view class="main_content_box">
			<view class="curriculum_box">
				<view class="curriculum_item_box" v-for="(item, index) in curriculumList" @click="handleClickCurriculum(item.url)">
					<image :src="item.imgUrl"></image>
					<text class="curriculum_item_name">{{ item.name }}</text>
				</view>
			</view>
			<!-- 应对华为审核，去掉app跳转 -->
			<view class="appJump" v-if="$platform=='android'">
				<view class="app_item wumen" @click="appjumpfun('wumen')">
					<view class="img">
						<image src="@/static/logo_wumen.png"></image>
					</view>
					<view class="text">
						<text>吴门医述</text>
					</view>
				</view>
				<view class="app_item zmzm" @click="appjumpfun('zmzm')">
					<view class="img">
						<image src="@/static/logo_zmzm.png"></image>
					</view>
					<view class="text">
						<text>众妙之门</text>
					</view>
				</view>
				<view class="app_item fzds" @click="appjumpfun('nuttyreading')">
					<view class="img">
						<image src="@/static/logo_fzds.png"></image>
					</view>
					<view class="text">
						<text>疯子读书</text>
					</view>
				</view>
			</view>
			<view class="cate_box">
				<scroll-view scroll-x="true">
					<view class="cate_list" v-if="cateList.length>0">
						<view class="cate_item_box" v-for="(item, index) in cateList" @click="handleClickCate(item)">
							<view class="cate_item_border">
								<image :src="item.icon"></image>
							</view>
							<view class="cate_item_name">{{ item.title }}</view>
						</view>
					</view>
				</scroll-view>
			</view>
			<view class="notice_box" v-if="noticeList.length>0">
				<view class="flash_sale_top">
					<u-notice-bar :text="noticeList" class="miaoShaContent"
					direction="column" label="title" @click="goNotice">
					</u-notice-bar>
				</view>
			</view>
			<view class="miaoSha_box" v-if="seckillLst.length>0">
				<view class="flash_sale_top">
					<image class="miaoShaIcon" src="@/static/icon/home_ms.png" mode="aspectFill"></image>
					<text class="miaoShaTitle">秒杀</text>
				</view>
			
				<view class="flash_sale_content">
					<scroll-view scroll-x="true">
						<view class="miaosha_list">
							<view class="miaosha_item" @click="goGoodsDetail(v)"
								v-for="(v, i) in seckillLst">
								<text class="miaosha_youhui" v-if="v.isVipPrice==1&&v.vipPrice!=null&&v.vipPrice!=0">VIP优惠</text>
								<image class="book_image" :src="v.productImages" mode="aspectFit"></image>
								<view class="book_name">{{ v.productName }}</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</view>
			<view class="learning_box" v-if="studyList.length>0">
				<view class="learning_box_top">
					<image src="@/static/icon/homeTitleBg.png"></image>
					<text>正在学习</text>
				</view>
				
				<view class="flash_sale_content greenCardBoxContent">
					<view class="learning_box_list">
						<view class="learning_item" @click="goCourseDescription(item)"
							v-if="studyList.length>0"
							v-for="(item, index) in studyList">
							<image class="book_image" :src="item.image" mode="aspectFit"></image>
							<view class="book_name">{{ item.title }}</view>
						</view>
						<text class="null_text" v-if="studyList.length==0">暂无数据</text>
					</view>
				</view>	
			</view>
			
			<view class="learning_box" v-if="flashSaleList.length>0">
				<view class="learning_box_top">
					<image src="@/static/icon/homeTitleBg.png"></image>
					<text>欢迎试听</text>
				</view>
				
				<view class="flash_sale_content greenCardBoxContent">
					<view class="learning_box_list">
						<view class="learning_item" @click="goCourseDescription(item)"
							v-for="(item, index) in flashSaleList">
							<image class="book_image" :src="item.image" mode="aspectFit"></image>
							<view class="book_name">{{ item.title }}</view>
						</view>
					</view>
				</view>	
			</view>
		</view>
	</view>
</template>

<script>
import $http from "@/config/requestConfig.js";
export default {
	data() {
		return {
			curriculumList: [],
			// curriculumList: [
			// 	{
			// 		name: "我的课程",
			// 		url: "/pages/curriculum/index/index",
			// 		imgUrl: require("@/static/icon/home_bg1.png")
			// 	},
			// 	{
			// 		name: "免费课程",
			// 		url: "/pages/curriculum/index/free",
			// 		imgUrl: require("@/static/icon/home_bg2.png")
			// 	},
			// 	{
			// 		name: "VIP情况",
			// 		url: "/pages/vip/index",
			// 		imgUrl: require("@/static/icon/home_bg3.png")
			// 	},
			// ],
			cateList: [],
			noticeList: [], //通知消息
			seckillLst: [], //秒杀列表
			studyList: [],  //正在学习
			flashSaleList: [],  //欢迎试听
			subList: [],
			cateIndex: 0  //分类默认选中第一个
		}
	},
	onLoad() {
		if(this.$platform=='android'){
			this.curriculumList = [
				{
					name: "我的课程",
					url: "/pages/curriculum/index/index",
					imgUrl: require("@/static/icon/home_bg1.png")
				},
				{
					name: "免费课程",
					url: "/pages/curriculum/index/free",
					imgUrl: require("@/static/icon/home_bg2.png")
				},
				{
					name: "VIP情况",
					url: "/pages/vip/index",
					imgUrl: require("@/static/icon/home_bg3.png")
				},
			]
		}else{
			this.curriculumList = [
				{
					name: "我的课程",
					url: "/pages/curriculum/index/index",
					imgUrl: require("@/static/icon/home_bg1.png")
				},
				{
					name: "免费课程",
					url: "/pages/curriculum/index/free",
					imgUrl: require("@/static/icon/home_bg2.png")
				}
			]
		}
	},
	onShow() {
		let cateIndex = uni.getStorageSync('cateIndex');
		this.cateIndex = cateIndex;
		this.getCourseList();
		this.getCateList();
		this.getNotice();
		this.getMarketProductList();
		this.getMarketCourseList();
	},
	methods: {
		//获取列表数据
		getCateList(){
			this.$http.request({
				url: 'psyche/home/getPsycheLabels',
				method: "POST",
				data: {
					id: 0,
				},
				header: {
					"Content-Type": "application/json",
				},
			})
			.then(res=> {
				if (res.labels&&res.labels.length>0) {
					this.cateList = res.labels;
					//默认获取第一个id 请求二级列表
					this.getSubList(res.labels[this.cateIndex].id);
				}
			})
			.catch(e=>{
			    uni.setStorageSync("guidePages", 2);
			});
		},
		//获取二级列表数据
		getSubList(id){
			this.$http.request({
				url: 'psyche/home/getChildCoursePsycheTree',
				method: "POST",
				data: {
					id: id,
				},
				header: {
					"Content-Type": "application/json",
				},
			})
			.then(res=> {
				if (res.labels&&res.labels.length>0) {
					this.subList = res.labels;
				}
			})
			.catch(e=>{
			    uni.setStorageSync("guidePages", 2);
			    uni.redirectTo({
					url: "/pages/user/login",
			    });
			});
		},
		//获取通知数据
		getNotice() {
			var data = {
				isPsyche: 1 //是否是心灵空间
			};
			this.$http.request({
				url: 'common/message/listByPage',
				method: "POST",
				data: data,
				header: {
					"Content-Type": "application/json",
				},
			})
			.then(res=> {
				if(res.result&&res.result.length>0){
					this.noticeList = res.result;
				}
			});
		},
		//通知跳转
		goNotice(index) {
			uni.navigateTo({
				url: `/pages/detail/noticeDetail?id=${this.noticeList[index].id}`,
			});
		},
		//获取秒杀数据
		getMarketProductList() {
			this.$http.request({
				url: 'psyche/home/getPsycheMarketProductList',
				method: "POST",
				data: {
					shopProductToPsycheMarketId: 31,
					limit: 10,
					page: 1
				},
				header: {
					"Content-Type": "application/json",
				},
			})
			.then(res=> {
				if(res.shopProductPage.records&&res.shopProductPage.records.length>0){
					this.seckillLst = res.shopProductPage.records;
				}
			});
		},
		//秒杀跳转
		goGoodsDetail(v) {
			uni.navigateTo({
				url: `/pages/goods/index?isMiaosha=1&id=${v.productId}`
			});
		},
		//获取正在学习数据
		getCourseList() {
			this.$http.request({
				url: 'psyche/home/getUserLateCourseList',
				method: "POST",
				data: {},
				header: {
					"Content-Type": "application/json",
				},
			})
			.then(res=> {
				if (res.courseList&&res.courseList.length>0) {
					this.studyList = res.courseList;
				}
			});
		},
		//获取欢迎试听数据
		getMarketCourseList() {
			this.$http.request({
				url: 'psyche/home/getPsycheMarketCourseList',
				method: "POST",
				data: {
					courseToPsycheMarketId: 29,
					limit: 10,
					page: 1,
				},
				header: {
					"Content-Type": "application/json",
				},
			})
			.then(res=> {
				if(res.courseEntityPage.records&&res.courseEntityPage.records.length){
					this.flashSaleList = res.courseEntityPage.records;
				}
			});
		},
		//课程详情
		goCourseDescription(v) {
			uni.navigateTo({
				url: `/pages/curriculum/order/index?navTitle=${v.title}&title=${v.title}&id=${v.id}`
			});
		},
		//跳转
		handleClickCurriculum(url) {
			uni.navigateTo({
				url: url,
			});
		},
		//课程列表
		handleClickCate(item){
			uni.navigateTo({
				url: `/pages/curriculum/list/index?title=${item.title}&id=${item.id}`,
			});
		},
		//其他app跳转
		appjumpfun(name) {
			let bagName = "";
			let schemes = "";
			if (name == "wumen") {
				bagName = "com.cn.medicine";
				schemes = "medicine";
			}
			if (name == "zmzm") {
				bagName = "com.cn.zmzm";
				schemes = "zmzm";
			}
			if (name == "nuttyreading") {
				bagName = "com.cn.nuttyreading";
				schemes = "nuttyreading";
			}
			
			if (plus.os.name == "Android") {
				//安卓
				if (
					plus.runtime.isApplicationExist({
						//查看安卓系统手机有没有下载这款app
						pname: bagName, //B款app云打包的包名
					})
				) {
					//安装了app
					plus.runtime.launchApplication({
						//打开app
						pname: bagName, //B款app云打包的包名
						extra: {
							url: `${schemes}://${bagName}`, //B款app配置的schemes+云打包的包名
						},
						function(e) {
							
						},
					});
				} else {
					//未安装app
					plus.runtime.openURL(
						`https://a.app.qq.com/o/simple.jsp?pkgname=${bagName}`,
						function(res) {
							
						}
					);
				}
			} else if (plus.os.name == "iOS") {
				//苹果
				//因为ios查不到B款app在ios系统手机里面，其实下载了，也是检测不到，所以就不检测了
				//直接打开B款app，B款app没有的话，会进入回调报错，我们在回调去打开下载链接
				plus.runtime.launchApplication({
						action: "${schemes}://",
					},
					function(e) {
						plus.runtime.openURL(
							`https://a.app.qq.com/o/simple.jsp?pkgname=${bagName}`,
							function(res) {
								
							}
						);
					}
				);
			}
		},
	}
}
</script>

<style lang="scss" scoped>
.content{
	background-image: linear-gradient(180deg, #a7defc 0%, #eff5f8 60%);
	padding-bottom: 100rpx;
}
.header_box {
	width: 100%;
	height: 350rpx;
	display: flex;
	justify-content: center;
	overflow: hidden;
	background-size: 100% 100%;
	background-image: url("@/static/header_bg.jpeg");
	background-repeat: no-repeat;
}
.main_content_box{
	padding: 0 20rpx;
	color: #333;
	
	.curriculum_box{
		margin-top: 5rpx;
		display: flex;
		align-items: center;
		justify-content: space-around;
		
		.curriculum_item_box{
			padding: 20rpx;
			display: flex;
			align-items: center;
			position: relative;
			
			.curriculum_item_flag{
				font-size: 26rpx;
				color: #294a97;
				position: absolute;
				right: 35rpx;
			}
			
			.curriculum_item_name{
				font-size: 30rpx;
				padding-left: 12rpx;
				color: #294a97;
				font-weight: bold;
			}
			image{
				width: 30rpx;
				height: 37rpx;
			}
		}
		.curriculum_item_box:last-child{
			border-right: 0;
		}
	}
	
	.cate_box {
		background: #7dc1f0;
		box-shadow: 0rpx 0rpx 6rpx 0rpx #f9f6ea;
		border-radius: 10rpx;
		
			.cate_list{
				display: flex;
				align-items: center;
				justify-content: space-around;
			
			.cate_item_box {
				width: 20%;
				padding: 40rpx 0 30rpx;
				text-align: center;
		
				.cate_item_border {
					width: 60rpx;
					height: 60rpx;
					background-size: 100% 100%;
					background-image: url("@/static/cate_bg.png");
					border-radius: 4rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					margin: 0 auto;
					
					image{
						width: 46rpx;
						height: 46rpx;
					}
				}
		
				.cate_item_name {
					margin-top: 15rpx;
					font-size: 26rpx;
					line-height: 34rpx;
					text-align: center;
					color: #fff;
					font-weight: bold;
				}
			}
		}
	}
	.notice_box {
		margin-top: 30rpx;
	}
}
.flash_sale_top {
	width: 100%;
	height: 60rpx;
	background-color: rgba(125, 193, 240, 0.1);
	color: rgb(46, 103, 106);
	border-color: rgb(197, 227, 215);
	box-shadow: 0rpx 0rpx 2rpx 0rpx #fcf2f6;
	border-radius: 6rpx;
	padding: 3rpx 18rpx 3rpx 10rpx;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	border: 0.5px solid #7dc1f0;
}
.miaoShaContent {
	padding: 0;
	font-size: 22rpx;
	color: #ebb76b;
	font-weight: bold;
}
.u-notice-bar {
	background-color: transparent !important;
}
.noticeIcon{
	width: 45rpx;
	height: 45rpx;
}
.miaoSha_box{
	margin-top: 30rpx;
}
.miaoShaIcon{
	width: 45rpx;
	height: 45rpx;
}
.miaoShaTitle {
	font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
	font-size: 32rpx;
	color: #294a97;
	line-height: 46rpx;
	padding-left: 10rpx;
}
.flash_sale_content{
	margin-top: 20rpx;
}
.miaosha_list{
	display: flex;
	align-items: center;
}
.miaosha_item{
	width: 180rpx;
	margin-right: 20rpx;
	text-align: center;
	position: relative;
	
	.book_image{
		width: 180rpx;
		height: 180rpx;
		background-color: rgba(125, 193, 240, 0.15);
	}
}
.book_name{
	text-align: center;
	font-size: 28rpx;
	color: #333;
	line-height: 50rpx;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.learning_box{
	margin-top: 40rpx;
	margin-bottom: 30rpx;
	position: relative;
}
.learning_box_top{
	width: 100%;
	position: relative;
	z-index: 99;
	image{
		width: 290rpx;
		height: 70rpx;
		margin: 0 auto;
	}
	text{
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		font-size: 32rpx;
		font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
		font-weight: normal;
		color: #294a97;
		text-align: center;
		line-height: 65rpx;
	}
}
.learning_box_list{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	
	.learning_item{
		width: 326rpx;
		margin-bottom: 20rpx;
		
		.book_image{
			background-color: rgba(125, 193, 240, 0.15);
			display: block;
			width: 100% !important;
			height: 180rpx;
		}
	}
}

.greenCardBoxContent {
	border: 2rpx solid #7dc1f0;
	padding: 80rpx 20rpx 20rpx;
	border-radius: 10rpx;
	background-image: linear-gradient(180deg, #d8ecf8 20%, #ecf6fc 100%);
	width: 100%;
	display: flex;
	overflow: hidden;
	height: auto;
	box-sizing: border-box;
}
.null_text{
	display: block;
	width: 100%;
	padding: 30rpx 0 70rpx;
	text-align: center;
	font-size: 30rpx;
	color: #666;
}
.appJump {
	position: fixed;
	right: 0;
	top: 120rpx;
	z-index: 1;

	.app_item {
		background: rgba(255, 255, 255, 0.9);
		margin-bottom: 20rpx;
		border: 1px solid #fff;
		display: flex;
		align-items: center;
		padding-right: 10rpx;
		overflow: hidden;
		border-radius: 50rpx 0 0 50rpx;

		text {
			font-size: 20rpx;
			padding-left: 3rpx;
		}

		.img {
			padding: 6rpx;
			overflow: hidden;

			image {
				width: 36rpx;
				height: 36rpx;
				border-radius: 100%;
			}
		}
	}
}
.miaosha_youhui{
	position: absolute;
	left: 0rpx;
	top: 0;
	z-index: 99;
	background: #ff1f00;
	padding: 0 10rpx;
	border-radius: 10rpx;
	line-height: 38rpx;
	font-size: 20rpx;
	color: #fff;
}

.sub_list{
	height: 110rpx;
	display: flex;
	align-items: center;
	justify-content: space-around;
	background: #7dc1f0;
}
.sub_item_name{
	color: #fff;
	padding: 0 10rpx;
}
</style>
