zhihuixiaoyuan2-ui/mine/pages/release/index.vue

<template>
	<view class="addfb">
		<!-- :reservatType="yktypes" -->
		<step-bar :steps="steps"  :fixeda="fixedflag" ></step-bar>
		<view class="card">
		 <view class="tit">接收班级<text class="fwn f14 co6">(单选)</text></view>
			<view class="bjlist" v-for="(ite,idx) in classval" :key="idx" @click="getCheck(idx)">
				<image :src="checkimg" v-if="classidx==idx"></image>
				<image :src="ncheckimg" v-else></image>
				<view class="f16 c16 flex1">{{ite.dictLabel}}</view>
			</view>
		</view>
		<view class="card">
			<view class="flexc mb20">
				<view class="cttit">成绩标题</view>
				<input type="text" v-model="datainfo.scoreTitle" placeholder-style="color:#aaa;" placeholder="请输入成绩标题" class="ctinp">
			</view>
			<picker range-key='dictLabel'  :value="ksindex" :range="kaoshilist"	@change='bindDateChangea'>
				<view class="flexc mb20">
					<view class="cttit">考试类型</view>
					<view class="f16 flex1 txr" :class="datainfo.scoreType?'co16':'coa'">{{scoreType||"请选择考试分类"}}</view>
				</view>
			</picker>
			
			<picker mode="date" class="mb20" :value="datainfo.scoreTime" @change="bindDateChange">
				<view class="flexc">
					<view class="cttit">本次考试时间</view>
					<view class="f16 flex1 txr" :class="datainfo.scoreTime ? 'co16' : 'coa'">{{ datainfo.scoreTime || '请选择本次考试时间' }}</view>
				</view>
			</picker>
			<view class="addbtn flexcc" @click="getImport">
				<image :src="addimg" class="addimg"></image>
				导入或录入成绩
			</view>
		</view>
		<view class="card" @click="getPrivacy">
			<view class="tit" style="margin-bottom: 32rpx;">隐私设置</view>
			<view class="flexc mb8">
				<view class="f15 co6 fw flex1">学生只能查看自己的成绩</view>
				<image :src="openimg" class="openimg"></image>
			</view>
		</view>
		<!-- 底部按钮 -->
		<view class="fbtn">
			<!-- <view class="flexcdc fbtnl">
				<image :src="draftimg"></image>
				<view>存草稿</view>
			</view> -->
			<view class="fbtnr flexcc" @click="getSubmit">发布</view>
		</view>
		<!-- 弹窗 -->
		<pop-up :type="type" @getClose="getClose" @getDel="getDel" @getLook="getLook"   @getEnter="getEnter" @getConfirm="getConfirm"></pop-up>
		<!-- 上传 -->
		<view >
			<lsj-upload
			  	    ref="lsjUpload"
			  	    childId="upload1"
			  	    :width="width"
			  	    :height="height"
			  	    :option="option"
			  	    :size="size"
			  	    :count="count"
			  	    :formats="formats"
			  	    :debug="debug"
			  	    :instantly="instantly"
					:files="files"
					@change="change"
			  		@uploadEnd="onuploadEnd" 
					>
			</lsj-upload>
			 <view class="rebtn" :style="{width: width,height: height}"></view>
		</view>
	</view>
</template>

<script>
	import popUp from "@/mine/components/popup/popup.vue"
	import stepBar from "@/mine/components/popup/stepbar.vue"
	import {getscoreAddFn,getscoreAddimpFn} from "@/api/mine/score.js"
	import {getDeptList,getDeptListparent,getselfList} from "@/api/mine/mine.js"
	import {getDictionaryFn} from '@/api/mine/register.js'
	import config from '@/config'
	const baseUrl = config.baseUrl
	const clientid = config.Clientid
	import { getToken } from '@/utils/auth'
	export default {
		components:{popUp,stepBar},
		data() {
			return {
				checkimg: require("@/mine/static/score/check.png"),
				ncheckimg: require("@/mine/static/score/ncheck.png"),
				addimg: require("@/mine/static/score/add.png"),
				draftimg:require("@/mine/static/score/draft.png"),
				openimg:require("@/mine/static/mine/check.png"),
				date: '',
				type:0,
				kaoshilist:[],
				ksindex:0,
				classval:[],
				classidx:0,
				importtype:1,//1 导入 2 录入
				scoreType:'',
				datainfo:{
					scoreTitle:'',//考试名称
					scoreTime:'',//考试时间
					scoreClassId:'',//接收班级id
					scoreClassName:'',//接收班级名称
					scoreType:'',
					privacyType:3,//隐私设置 1:仅自己 2:仅本班 3:全部
	
				},
				scoreDataDetailsList:[],//成绩子表
				file:[],//文件
				option: {
				    // 上传服务器地址，需要替换为你的接口地址
				    url: baseUrl+'/score/data/importData', // 该地址非真实路径，需替换为你项目自己的接口地址
				    // 上传附件的key
				    name: 'file',
				    // 根据你接口需求自定义请求头,默认不要写content-type,让浏览器自适配
				    header: {
				        // 示例参数可删除
				        'Authorization':  'Bearer ' + getToken(),
						"Clientid":clientid
				    },
				    // 根据你接口需求自定义body参数
				    formData: {
				    	scoreClassName:'',
				    	scoreClassId:'',
				    	scoreTime:'',
				    	scoreTitle:'',
						scoreType:''
				    }
				},
				// 选择文件后是否立即自动上传，true=选择后立即上传
				instantly: false,
				// 必传宽高且宽高应与slot宽高保持一致
				width: '0',
				height: '0',
				// 限制允许上传的格式，空串=不限制，默认为空
				formats: 'xls,xlsx',
				// 文件上传大小限制
				size: 100,
				// 文件数量限制 默认10
				count: 1,
				// 文件回显列表
				files: new Map(),
				// 微信小程序Map对象for循环不显示，所以转成普通数组，不要问为什么，我也不知道
				wxFiles: [],
				// 是否打印日志
				debug: false,
				column1:[],
				subList:[],
				mfboList:[],//满分的数据
				steps:[{tit:'选择班级',status:0,val:0},{tit:'上传或录入',status:0,val:1},{tit:'隐私设置',status:0,val:2},{tit:'发布成绩',status:0,val:3}],
				fixedflag:true,
			}
		},
		watch:{
			scoreDataDetailsList:{
				handler(newVal) {
					var data=newVal;
					var info=this.datainfo;
					if(data&&data.length&&info.scoreTitle&&info.scoreTime&&info.scoreType){
						this.steps[1].status=2;
					}else{
						this.steps[1].status=0;
					}
				},
				deep: true
			},
			file:{
				handler(newVal) {
					var data=newVal;
					var info=this.datainfo;
					if(data&&data.length&&info.scoreTitle&&info.scoreTime&&info.scoreType){
						this.steps[1].status=2;
					}else{
						this.steps[1].status=0;
					}
				},
				deep: true
			},
			datainfo: {
				handler(newVal) {
					var data=newVal;
					var score=this.scoreDataDetailsList;
					var file=this.file;
					if(data.scoreClassId){
						this.steps[0].status=2;
					}
					if(data.scoreTitle&&data.scoreTime&&data.scoreType&&(score&&score.length||file&&file.length)){
						this.steps[1].status=2;
					}else{
						this.steps[1].status=0;
					}
					if(data.privacyType){
						this.steps[2].status=2;
					}
					// scoreTitle:'',//考试名称
					// scoreTime:'',//考试时间
					// scoreClassId:'',//接收班级id
					// scoreClassName:'',//接收班级名称
					// scoreType:'',
					// privacyType:3,//隐私设置 1:仅自己 2:仅本班 3:全部
				},
				deep: true
			},
			// datainfo(val){
			// 	var data=this.datainfo;
			// 	if(val!=0){
			// 		if(data.visitDate&&data.visitTime) this.steps[0].status=2;
			// 		else if(!data.visitDate||!data.visitTime) this.steps[0].status=0;
			// 	}
			// 	if(val!=1){
			// 		if(this.yktypes==1){
			// 			if(this.inputValue&&data.visitPhone&&data.visitName&&data.visitUnitName) this.steps[1].status=2;
			// 			else if(!this.inputValue||!data.visitPhone||!data.visitName||!data.visitUnitName) this.steps[1].status=0;
			// 		}else{
			// 			if(this.inputValue&&data.visitPhone&&data.visitName) this.steps[1].status=2;
			// 			else if(!this.inputValue||!data.visitPhone) this.steps[1].status=0;
			// 		}
					
			// 	}
			// }
		},
		onUnload(){
			uni.$off('refreshscorelist')
			uni.$off('refreshscorefile')
		},
		onLoad: function() {
			uni.$on('refreshscorelist', (e) => {
				var nobj=JSON.parse(JSON.stringify(e))
				this.scoreDataDetailsList=e.scoreDataDetailsList
				this.column1=e.column1
				this.subList=e.subList
				this.mfboList=e.mfboList
			})
			uni.$on('refreshscorefile', (e) => {
				console.log(e,1)
				this.file=JSON.parse(JSON.stringify(e.file))
				this.files=e.files
			})
			this.init()
			this.getClassFn()
		},
		methods: {
			init(){
				// 考试类型
				getDictionaryFn('kaoshi').then(res=>{
					if(res.code==200){
						this.kaoshilist = res.data.map(v => {
							return {
								dictLabel: v.dictLabel,
								dictValue:v.dictValue,
							}
						})
				
					}
				})
			},
			bindDateChangea(e) {
				var val = e.detail.value;
				this.scoreType=this.kaoshilist[val].dictLabel
				this.datainfo.scoreType=this.kaoshilist[val].dictValue
			},
			getselfList(id){
				var params={
					parentId:id,
				}
				params['params[role]']=this.$store.state.user.choseroles
				getselfList(params).then(res=>{
					if(res.code==200){
						var newArr=res.data;
						if(newArr&&newArr.length){
							this.classval = newArr.map(v => {
								return {
									dictLabel: v.deptName,
									dictValue: v.deptId
								}
							})
							this.datainfo.scoreClassId=newArr[0].deptId
							this.datainfo.scoreClassName=newArr[0].deptName
						}
					}else{
						this.$toast(res.msg)
					}
				})
			},
			getClassFn(){
				var that=this;
				var roles=that.$store.state.user.choseroles;
				that.roles=roles;
				if(roles=='teacher'){
					var id=that.$store.state.user.schoolId;
					that.schoolId=id;
					this.getselfList(id)
				}else{
					var id=that.$store.state.user.deptId;
					that.schoolId=id;
					this.getselfList(0)
				}
			},
			getclassListFn(id){
				var that=this;
				// var params={
				// 	parentId:id
				// }
				getDeptList(id).then(res=>{
					if(res.code==200){
						that.classval = res.data.map(v => {
							return {
								dictLabel: v.deptName,
								dictValue:v.deptId,
							}
						})
						that.datainfo.scoreClassId=res.data[0].deptId
						that.datainfo.scoreClassName=res.data[0].deptName
					}else{
						that.$toast(res.msg)
					}
				})
			},
			getSubmit(){
				var that=this;
				var params=JSON.parse(JSON.stringify(this.datainfo))
				if(!params.scoreTitle){
					this.$toast("请输入成绩标题")
					return
				}
				if(!params.scoreType){
					this.$toast("请选择考试类型")
					return
				}
				if(!params.scoreTime){
					this.$toast("请选择考试时间")
					return
				}
				params['params[role]']=this.$store.state.user.choseroles
				// var formData = new FormData()
				// Object.keys(info).some((key) => {
				// 	if (info[key] != '') {
				// 		params[key]=info[key]
				// 		return ;
				// 	}
				// })
				// formData.append( 'file',file)
				// 录入
				if(this.importtype==2){
					if(this.scoreDataDetailsList&&this.scoreDataDetailsList.length<1){
						this.$toast("请上传成绩")
						return
					}
					params.scoreDataStudentBoList=this.scoreDataDetailsList
					params.scoreDataMfBoList=this.mfboList;
					// return
					getscoreAddFn(params).then(res=>{
						if(res.code==200){
							that.$toast('发布成功')
							uni.removeStorageSync('scorelist')
							uni.removeStorageSync('filelist')
							setTimeout(function(){
								uni.navigateBack({
									delta:1
								})
							},1200)
						}else{
							that.$toast(res.msg)
						}
						
					})
				}else{
					if(this.file&&this.file.length<1){
						this.$toast("请上传成绩")
						return
					}
					this.option.formData=JSON.parse(JSON.stringify(this.datainfo))
					var name=this.file[0].name;
					var files=this.files
					this.$refs['lsjUpload'].setData('formData.scoreClassName',this.datainfo.scoreClassName); 
					this.$refs['lsjUpload'].setData('formData.scoreClassId',this.datainfo.scoreClassId); 
					this.$refs['lsjUpload'].setData('formData.scoreTime',this.datainfo.scoreTime); 
					this.$refs['lsjUpload'].setData('formData.scoreTitle',this.datainfo.scoreTitle); 
					this.$refs['lsjUpload'].setData('formData.scoreType',this.datainfo.scoreType); 
					this.$refs['lsjUpload'].uploadimp(name,files);
				}
				
			},
			onuploadEnd(item){
				var that=this;
				var responseText=JSON.parse(item.responseText)
				if(responseText.code==200){
					that.$toast('发布成功')
					uni.removeStorageSync('scorelist')
					uni.removeStorageSync('filelist')
					setTimeout(function(){
						uni.navigateBack({
							delta:1
						})
					},1200)
				}else{
					that.$toast(responseText.msg)
				}
			},
			getCheck(idx){
				this.classidx=idx;
				this.datainfo.scoreClassId=this.classval[idx].dictValue;
				this.datainfo.scoreClassName=this.classval[idx].dictLabel;
			},
			bindDateChange(e) {
				var val=e.detail.value;
				this.datainfo.scoreTime=val;
			},
			getPrivacy(){
				this.type=5
			},
			getLook(){
				// console.log(this.scoreDataDetailsList)
				if(this.scoreDataDetailsList&&this.scoreDataDetailsList.length>0){//录入
					var obj={
						column1:this.column1,
						subList:this.subList,
						mfboList:this.mfboList,
						item:this.scoreDataDetailsList
					}
					uni.setStorageSync('scorelist',JSON.stringify(obj))
					this.$tab.navigateTo('/mine/pages/release/entry?type=look&scoreClassId='+this.datainfo.scoreClassId);	
				}else if(this.file&&this.file.length>0){// 导入
					var obj={
						files:this.files,
						item:this.file
					}
					uni.setStorageSync('filelist',JSON.stringify(obj))
					this.$tab.navigateTo('/mine/pages/release/format?type=look');	
				}
				this.type=0;
			},
			getDel(){
				var that=this
				uni.showModal({
					title: '确认删除',
					content: "是否确认删除",
					cancelText: '取消删除',
					confirmText: '确认删除',
					success: function(res) {
						if (res.confirm) {
							that.scoreDataDetailsList=[];
							that.file=[];
							uni.removeStorageSync('scorelist')
							uni.removeStorageSync('filelist')
							that.type=0;
						} else if (res.cancel) {
						}
					}
				});	
				
			},
			getImport(){
				// 判断是否有值
				// console.log(this.scoreDataDetailsList,1)
				if(this.scoreDataDetailsList&&this.scoreDataDetailsList.length>0){//录入
					this.type=6
				}else if(this.file&&this.file.length>0){// 导入
					this.type=6
				}else{
					this.type=1;
				}
			},
			getEnter(e){
				this.type=0;
				this.importtype=e;
				if(e==1){
					this.$tab.navigateTo('/mine/pages/release/format');
				}else{
					this.$tab.navigateTo('/mine/pages/release/entry?scoreClassId='+this.datainfo.scoreClassId);
				}
			},
			getConfirm(){
				this.$tab.navigateTo('/mine/pages/release/entry');
				this.type=0;
			},
			getClose(){
				this.type=0;
			}
		},

	}
</script>

<style lang="scss" scoped>
.addfb{min-height: 100vh;padding: 160rpx 36rpx 168rpx;box-sizing: border-box;
	.card{width: 100%;padding: 40rpx 24rpx 36rpx;box-sizing: border-box;background: #FFFFFF;
border-radius: 18rpx;margin-bottom: 24rpx;
	.tit{font-size: 32rpx;font-weight: bold;color: #161616;margin-bottom: 28rpx;}
	}
	.bjlist{display: flex;align-items: center;padding: 8rpx 26rpx;
		image{width: 30rpx;height: 28rpx;margin-right:26rpx;flex: 0 0 auto;}
	}
	
	.cttit{font-size: 32rpx;font-weight: bold;color: #000016;flex: 0 0 auto;margin-right: 12rpx;line-height: 48rpx;}
	.ctinp{flex: 1;text-align: right;font-size: 32rpx;color: #161616;}
	
	.addbtn{width: 100%;height: 110rpx;background: #EEF3FE;border-radius: 10rpx;font-size: 30rpx;font-weight: bold;
color: #4775EA;
		.addimg{width: 22rpx;height: 22rpx;margin-right: 20rpx;}
	}
	.openimg{width: 100rpx;height: 56rpx;flex: 0 0 auto;margin-left: 16rpx;}
	
	
	.fbtn{display: flex;align-items: center;position: fixed;left: 0;right: 0;bottom: 0;background-color: #f1f1f1;padding: 34rpx;
		.fbtnl{padding: 0 16rpx;flex: 0 0 auto;margin-right: 20rpx;
			image{width: 42rpx;height: 42rpx;margin-bottom: 8rpx;}
		}
		.fbtnr{height: 98rpx;background: #1f57e6;border-radius: 48rpx;font-size: 34rpx;font-weight: 500;
color: #FFFFFF;flex: 1;}
	}
	
	
	
	
	
	// .ccgimg{}
}
</style>