<template>
	<view>
		<u-toast ref="messager"></u-toast>
		<view class="homework">
			<view class="homework-info">
				<view class="homework-label">作业名称</view>
				<view class="homework-value">{{info.name}}</view>
			</view>
			<view class="homework-info">
				<view class="homework-label">作业内容</view>
				<view class="homework-value">{{info.content}}</view>
			</view>
			<view v-if="info.file && info.file!=''" class="homework-info">
				<view class="homework-label">作业附件</view>
				<view class="homework-value">
					<a :href="fileBaseUrl+info.file" target="_blank" style="color: #387DF7;">下载作业附件</a>
				</view>
			</view>
			<view class="homework-info">
				<view class="homework-label">截止时间</view>
				<view class="homework-value" :style="{color:close? 'red':''}">{{info.deadTime? info.deadTime: '无'}}</view>
			</view>
			<!-- <view>
				<u-divider text="填写作业内容并提交"></u-divider>
			</view> -->
			<view class="homework-info" v-if="info.submitMode!=2">
				<view class="homework-label">上传附件</view>
				<view class="homework-value">
					<u-upload uploadIcon="plus" :fileList="fileList" @afterRead="afterRead" @delete="deleteFile" name="hwfile" :maxCount="1">
					</u-upload>
				</view>
			</view>
			<view class="homework-info" v-if="info.submitMode!=1">
				<view class="homework-label">作业内容</view>
				<view class="homework-value">
					<u--textarea :height="200" v-model="answer" placeholder="在此输入内容"></u--textarea>
				</view>
			</view>
	
			<view class="homework-btn">
				<u-button type="primary"  @click="submitHomework()" :text="records.length>0?'重新提交':'提交'"></u-button>
			</view>
		</view>
		<!--作业提交记录-->
		<view class="hwlist content" v-if="records.length>0">
			<view class="hwlist-row" v-for="record in records" :key="record.id">
				<view class="hwlist-info-title">
					<view>已提交作业</view>
					<view class="hwlist-info-time">{{record.endTime}}</view>
				</view>
				<view>
					<view style="padding: 20upx 0upx;">{{record.hwAnswer}}</view>
					<view v-if="record.filePath!=''">
						<a :href="fileBaseUrl+record.filePath" target="_blank">作业附件</a>
					</view>
				</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	import apiCourseStudy from '@/api/modules/courseStudy.js';
	import apiCourse from '@/api/modules/course.js';
	import uploadUtil from '@/utils/upload.js'
	export default {
		props:{
			content:{
				type: Object,
				default:()=>{}
			},
			studyId:{
				type:String,
				default:''
			}
		},
		data() {
			return {
				fileBaseUrl:this.$config.fileUrl,
				has:true,
				info:{},
				studyItemId:'',
				filePath:'',
				answer:'',
				close:false,
				records:[],//作业记录
				fileList: []
			}
		},
		mounted() {
		  this.loadHomeworkInfo();
		},
		watch:{
			studyId(newVal){
				this.loadHomeworkInfo();
			},
			content(newVal,oldVal){
				if(newVal.id!=oldVal.id){
					this.loadHomeworkInfo();
				}
			}
		},
		methods: {
			loadHomeworkInfo(){
			  apiCourse.getHomework(this.content.id).then(res=>{
			     if(res.status==200){
			         this.info=res.result;
			         //检查是否过期
			        if(res.result.deadTime!=''){
			           var d = new Date(res.result.deadTime);
			           var now=new Date();
			           if(now.getTime() > d.getTime()){
			              this.close=true;
			           } else {
			              this.close=false;
			           }
			        }
			        this.loadRecord();
			     }else if(res.status==404){
			        //没有找到作业信息
			     }else{
					this.$refs.messager.show({message:res.message,type:'error'})
			     }
			  });
			  //
			},
			loadRecord(){
				if(this.studyId==''){
					return;
				}
				let params={
					studyId:this.studyId,
					contentId:this.content.id
				}
				apiCourseStudy.myHomeworkList(params).then(rs=>{
					if(rs.status==200 && rs.result){
						this.records=rs.result;
					}
				})
			},
			submitHomework() {//提交作业
				let oldTime=new Date(this.info.deadTime).getTime()
				let newTime=+new Date()
				if(oldTime<newTime){
					return this.$refs.messager.show({message:'提交作业时间已过期,无法提交',type:'error'})
				}
			// if(newTime<oldTime){
			// 	return this.$refs.messager.show({message:'',type:'error'})
			// }
				if(this.content.submitMode==1){
					if(this.filePath==''){
						this.$refs.messager.show({message:'请上传作业内容',type:'error'})
						return;
					}
				}else if(this.content.submitMode==2){
					if(this.answer==''){
						this.$refs.messager.show({message:'请先填写作业内容',type:'error'})
						return;
					}
				}else{
					if(this.answer=='' && this.filePath==''){
						this.$refs.messager.show({message:'请填写或上传作业',type:'error'})
						return;
					}
				}
			
			  let pamars = {
			    studyId: this.studyId,//学习id,
			    courseId: this.content.courseId,//课程id,
			    contentId: this.content.id,//内容id,
			    hwId:this.info.id,//作业的id
			    hwName: this.info.name,//作业的名称
			    //hwContent: this.homeworkInfo.info.content,//作业的内容,先不要此字段了
			    filePath:  this.filePath,//文件的路径，可以为空，
			    hwAnswer: this.answer,//文本提交的信息
			    score: 0
			  }
			  if(this.studyItemId){
				  pamars.studyItemId=this.studyItemId;//学习内容记录id,
			  }
			  apiCourseStudy.saveHomework(pamars).then(res=>{
			     if(res.status==200){
			      	//this.$refs.messager.show({message:'作业已提交',type:'success'})
					uni.showToast({title:'提交成功',type:'success'})
			        this.filePath='';
					this.fileList=[];
			        this.answer='';
				    this.records=[res.result];
			        this.$emit("submit", this.content);
			     }else {
			        this.$message.error(res.message);
			     }
			
			  })
			},
			//删除文件
			deleteFile(event) {
				this.fileList.splice(event.index, 1)
			},
			//上传附件
			async afterRead(event) {
				uni.showLoading({ title: '正在上传' });
				uploadUtil.uploadFile(event.file.url).then(rs=>{
					this.filePath = rs.result.filePath;
					this.fileList.push({
						status: 'success',
						message: '已上传',
						url:rs.result.httpPath
					})
					uni.hideLoading();
				});
			}
		}

	}
</script>

<style lang="scss" scoped>
	.homework {
		padding: 0upx 20upx 20upx 20upx;
		background-color: #fff;
		.homework-info {
			border-bottom: 1px solid rgba(153,153,153,0.1);
			.homework-label {
				padding-top:  10upx;
				font-weight: 650;
				font-size: 32upx;
				color: #444;
			}

			.homework-value {
				padding: 32upx 0upx;
				font-weight: 400;
				font-size: 28upx;
				color: #787878;
				word-break:break-all;
				// background-color: #FFFFFF;
				// /deep/ textarea{
				// 	//background: #F5F5F5;
				// }
			}
		}
	}
	.u-textarea{
		background-color: #F5F5F5;
	}
	.hwlist {
		margin-bottom: 30px;
		.hwlist-row {
			line-height: 60upx;
			border-bottom: 1px solid #d2d2d2;
			a{
				text-decoration: none;
			}
			.hwlist-info-title {
				display: flex;
				justify-content: space-between;
				color: #6b6b6b;
			}
			.hwlist-info-time {
				color: #6c6c6c;
			}

			.hwlist-name {
				padding-left: 10px;
			}
		}
	}
</style>
