<template>
	<page-meta :page-style="showPopu?'overflow:hidden;':''">
	<view class="indexpage">
		<navbar class="navbarSticky" bg="#F6F6F6">
			<view class="index-header-box">
				<view class="index-header-img">
					<van-image width="100%" height="100%" fit="cover" class="img" src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653464014000_713.png" />
				</view>
				<view class="index-header-tetx">
					<view class="index-header-title">
						welcome
					</view>
					<view class="index-header-name">{{userData.AccountName}}</view>
				</view>
			</view>
		</navbar>
		<view style="margin: 40rpx 0 10rpx 0;">
			<view style="padding:0 50rpx;font-weight: 800;color: #282828;">
				<view style="font-size: 36rpx;">Hello,{{userData.AccountName}}</view>
				<view style="font-size: 50rpx;">您的学情反馈已准备好</view>
			</view>
		</view>
		<course-card :stuCourseList="stuCourseList" @changePopStatus='changePopStatusHandler' @change="changeCourseHandler"></course-card>
		<view class="index-student-title flex">
			<text>学情反馈</text>
			<view>(共{{workList!=null&&workList.length>0?workList.length:0}}条)</view>
		</view>
		<view class="index-student-information" v-if="workList && workList.length>0">
			<template v-for="(item,index) in workList">
				<JobComponents v-if="item.ResultType==1" :jobData="item"></JobComponents>
				<examComponents  v-if="item.ResultType==2" :jobData="item"></examComponents>
				<commentsComponents  v-if="item.ResultType==3" :jobData="item"></commentsComponents>
			</template>
		</view>
		<view class="index-student-information" v-else>
			<view class="noData">
				<image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653902791000_806.png" mode="widthFix"></image>
				<view>暂无反馈信息</view>
			</view>
		</view>
	</view>
	</page-meta>
</template>

<script>
	import courseCard from '../../components/index/course-card'
	import JobComponents from '@/components/index/JobComponents'
	import examComponents from '@/components/index/examComponents'
	import commentsComponents from '@/components/index/commentsComponents'
	import vue, {
		ref,
		reactive,
		toRefs,
		toRef,
		getCurrentInstance,
		watch,
		computed,
		onMounted,
		provide,
		nextTick,
	} from "vue";

	import {
		getSweepCode
	} from '../../api/index.js'
	import {
		getImageColor
	} from '../../utils/index.js'
	import indexassembly from './components/indexassembly.vue'
	import navbar from '../../components/navbar.vue'
	import bottom from '../../components/bottom.vue'
	export default {
		components: {
			indexassembly,
			navbar,
			bottom,
			courseCard,
			JobComponents,
			examComponents,
			commentsComponents
		},
		setup(props) {
			let {
				proxy
			} = getCurrentInstance();
			let data = reactive({
				stuCourseList: [], //学员课程列表
				userData: {}, //用户信息
				//学员作业和考试查询参数
				workMsg: {
					courseId: 0,
				},
				showPopu:false,
				workList: [],//学员作业、考试、评语数据
			});

			let methods = {
				changePopStatusHandler(status){
					data.showPopu=status==1
				},
				jumpPage(url) {
					uni.navigateTo({
						url: url,
					});
				},
				changeCourseHandler(id){
					console.log(id,',,,,,,,,,,,,,')
					methods.getStuHomeWorkAndExam(id)
				},
				getStuCourse() {
					proxy.$request("/Stu/GetStuCourse", {}).then(res => {
						let tempArray = res.Data;
						data.stuCourseList = tempArray;
						if (tempArray && tempArray.length > 0) {
							methods.getStuHomeWorkAndExam(tempArray[0].courseId)
						}
					})
				},
				//获取学员作业、考试、评语
				getStuHomeWorkAndExam(courseId) {
					
					uni.showLoading()
					data.workMsg.courseId = courseId;
					data.workList = [];
					proxy.$request("/Stu/GetStuWork", data.workMsg).then(res => {
						data.workList = res.Data;
						uni.hideLoading()
					})
				},
			};
			methods.getStuCourse();
			data.userData = uni.getStorageSync('userInfo');
			if(data.userData && data.userData.AccountType==1){
				uni.redirectTo({
					url:'/pages/index/workSituation'
				})
			}
			// onMounted(() => {

			// });
			return {
				...toRefs(data),
				...methods,
			};
		},
		onShareAppMessage() {
			return {
				title: "进阶思维学情反馈",
				query: "/pages/index/index",
				imageUrl: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1654483222000_317.png",
			};
		},
		onShareTimeline() {
			return {
				title: "进阶思维学情反馈",
				query: "/pages/index/index",
				imageUrl: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1654483222000_317.png",
			};
		},
	};
</script>

<style scoped>
	.indexpage .noData{
		text-align: center;
		flex:1;
		width: 100%;
	}
	.indexpage .noData image{
		width:200rpx;
		margin-bottom: 40rpx;
	}
	.indexpage .noData view{
		font-size: 24rpx;
		color: #cecece;
		text-align: center;
	}
	.index-student-title view {
		font-size: 25rpx;
		color: #ABABAB;
		margin-left: 20rpx;
		padding: 13rpx 0 0 0;
	}

	.index-student-title text {
		font-size: 36rpx;
		font-weight: 800;
		color: #282828;
	}

	.index-student-title {
		padding: 0 50rpx 45rpx;
	}

	.index-student-information {
		min-height: 500rpx;
		background: rgba(255, 255, 255, .7);
		border-radius: 50rpx 50rpx 0 0;
		padding: 71rpx 0 0 0;
	}

	.index-header-name {
		font-size: 30rpx;
		color: #474747;
	}

	.index-header-tetx {
		color: #D0D0D0;
		font-size: 24rpx;
	}

	.index-header-img .img {
		display: block;
		border: 2rpx solid rgba(164, 164, 164, 0.32);
		border-radius: 50%;
		overflow: hidden;
		width: 60rpx;
		height: 60rpx;
		box-sizing: border-box;
		margin: 4rpx;
	}

	.index-header-img {
		width: 68rpx;
		height: 68rpx;
		border-radius: 50%;
		overflow: hidden;
		text-align: center;
		margin-right: 20rpx;
		background: #FFFFFF;
	}

	.indexpage {
		min-height: 100vh;
		background-color: #f6f6f6;
		box-sizing: border-box;
		background-image: url('https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1653464014000_398.png');
		background-position: 0 200rpx;
		background-repeat: no-repeat;
		background-size: 100% auto;
	}

	.index-header-box {
		display: flex;
		flex-direction: row;
		align-items: center;
		padding: 0rpx 42rpx;
	}

	.index-header-box .index-header-title {
		font-size: 24rpx;
		font-weight: 400;
		color: #B8B8B8;
	}

	.index-header-box .index-header-name {
		font-size: 30rpx;
		font-weight: 800;
		color: #282828;
	}

	.navbarSticky {
		display: sticky;
		top: 0;
		z-index: 9;
	}
</style>
