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

<template>
  <view class="format">
	  <view class="box mb20">
		  <view class="addbtn flexcc" @click="getImport">
			  <image :src="addimg" class="addimg"></image>
			  添加学生成绩
		  </view>
		  <!-- <view class="xsname">
			<view class="xslist">
				<view class="flex1">王巧巧</view>
				<image :src="editimg"></image>
			</view> 
		  </view> -->
		  <!-- 做成表格形式的 -->
		  <view class="flex1 over">
			  <zb-table
			    :show-header="true"
			    :columns="column1"
			    :stripe="true"
			    :fit="false"
			    
			    :border="true"
			    @edit="buttonEdit"
			    @dele="dele"
			    :data="tabscorelist"></zb-table>
				<!-- @rowClick="rowClick"
			    @toggleRowSelection="toggleRowSelection"
			    @toggleAllSelection="toggleAllSelection" -->
		  </view>
	  </view>
	  <view class="refixed">
		 <view class="rebtn" @click="getFinsh">完成录入</view> 
	  </view>
	  <pop-up :type="type" @getClose="getClose" :subjectlists="subjectlist" :nostudenlist="nostudenlist" :studentinfos="studentinfo" :subLists="subLists"  @getScore="getScore" @getsubConfirm="getsubConfirm" @getConfirm="getConfirm"></pop-up>
  </view>
</template>

<script>
	import popUp from "@/mine/components/popup/popup.vue"
	import zbTable from "@/mine/components/zb-table/zb-tables.vue"
import {getDictionaryFn} from '@/api/mine/register.js'
import {getstunoListFn} from "@/api/mine/files.js"
// import {column1,column2,column3,column4} from '@/mine/components/zb-table/all.js'
  export default {
	data(){
		return{
			addimg: require("@/mine/static/score/add.png"),
			editimg: require("@/mine/static/score/edit.png"),
			type:0,
			comsubList:[],//空的数据
			subject:[],
			column1:[],
			mfboList:[],//满分的成绩
			// column1,column2,column3,column4,
			flag1:true,
			num:0,
			studentinfo:{},
			tabscorelist:[],//表格需要的格式
			stuscorelist:[],//后台需要的格式
			editidx:0,
			subLists:[],
			scoreClassId:'',
			nostudenlist:[],
			subjectlist:[{tit:'语文',val:'yuwen',check:false,manfen:''},{tit:'数学',val:'shuxue',check:false,manfen:''},{tit:'英语',val:'yingyu',check:false,manfen:''},{tit:'物理',val:'wuli',check:false,manfen:''},]
		}
	},
	components:{popUp,zbTable},
	onLoad: function(e) {
		// this.type=2;
		if(e.type&&e.type=='look'){
			 var data = JSON.parse(uni.getStorageSync('scorelist'))//取出缓存数据
			this.tabscorelist=this.gethandleTable(data.item);//需要处理成
			this.stuscorelist=data.item;
			this.column1=data.column1;
			this.mfboList=data.mfboList;
			this.subLists=[];
			this.comsubList=data.subList;
			this.scoreClassId=e.scoreClassId;
			this.getstunoListFn()
			 // this.userInfo = res
			 // uni.removeStorageSync('userInfo')
			 // var data = uni.getStorageSync('userInfo')//销毁缓存数据
			 // console.log(data);
		}else{
			this.type=2;
			this.scoreClassId=e.scoreClassId;
			this.getstunoListFn()
			this.init()
		}
		
	},
	methods:{
		buttonEdit(e){
			this.type=3;
			var idx=e.key;
			this.editidx=e.key;
			this.studentinfo=this.stuscorelist[idx]
			this.subLists=this.stuscorelist[idx].scoreDataDetailBoList;
		},
		dele(e){
			var idx=e.key;
			this.$modal.confirm('确定删除该条信息？').then(() => {
				this.tabscorelist.splice(idx,1)
				this.stuscorelist.splice(idx,1)
			})
		},
		getstunoListFn(){
			var params={
				classId:this.scoreClassId
			}
			params['params[role]']=this.$store.state.user.choseroles
			getstunoListFn(params).then(res=>{
				if(res.code==200){
					this.nostudenlist = res.rows.map(v => {
						return {
							dictLabel: v.studentName,
							dictValue:v.id,
							// studentNumber:v.id,
							studentNumber:v.studentNumber,
						}
					})
				}
			})
		},
		getFinsh(){
			if(this.stuscorelist&&this.stuscorelist.length>0){
				var obj={
					scoreDataDetailsList:this.stuscorelist,
					column1:this.column1,
					subList:this.comsubList,
					mfboList:this.mfboList
				}
				uni.$emit("refreshscorelist",JSON.parse(JSON.stringify(obj)))
				uni.navigateBack({
					delta: 1 //返回层数，2则上上页
				});
			}else{
				this.$toast("请上传成绩")
				return
			}
		},
		// 处理表头
		// getColumns(info){
		// 			var newArr=info;
		// 			var narr=[];
		// 			var column1=[{ type:'index', fixed:true,width:30,align:'center', },{ name: 'scoreDataName', label: '姓名',fixed:true,width:70,emptyString:'--',align:'center' }];
		// 			var narr=[{ name: 'zongfen', label: '总分',align:'center',width:56 },
		// { name: 'scoreSort', label: '排名',align:'center',width:56 }]
		// 			Object.keys(newArr).some((key) => {
		// 				var obj={};
		// 				obj.name=newArr[key].xueke;
		// 				obj.label=newArr[key].xueke;
		// 				obj.manfen=newArr[key].manfen;
		// 				obj.sorter=true
		// 				obj.align='center'
		// 				obj.width=70
		// 				obj.paddingRight=12
		// 				column1.push(obj)
		// 			})
		// 			column1=column1.concat(narr)
		// 			this.columns=JSON.parse(JSON.stringify(column1))
		// 		},
		// 处理成表格数据
		gethandleTable(info){
			var strarr=[];
			var newArr=info;
			Object.keys(newArr).some((key) => {
				var params={}
				params.scoreDataName=newArr[key].scoreDataName
				params.scoreDataNameId=newArr[key].scoreDataNameId
				if (newArr[key].scoreDataDetailBoList&&newArr[key].scoreDataDetailBoList.length) {
					var scBoList=newArr[key].scoreDataDetailBoList;
					scBoList.forEach(ite=>{
						params[ite.xueke]=ite.score
					})
				}
				strarr.push(params);
			})
			return strarr
		},
		// 对象处理成表格
		gethandleTableobj(info){
			var params={}
			for(var i in info){
				if(i!='scoreDataDetailBoList'){
					params[i]=info[i]
				}else{
					if (info.scoreDataDetailBoList&&info.scoreDataDetailBoList.length) {
						var scBoList=info.scoreDataDetailBoList;
						scBoList.forEach(ite=>{
							params[ite.xueke]=ite.score
						})
					}
				}
			}
			return params
		},
		// 处理成后台格式
		gethandleList(){
			
		},
		getScore(data){
			var info=JSON.parse(JSON.stringify(data))
			var tabinfo=this.gethandleTableobj(info)
			var idx=this.editidx;
			if(idx!=-1){
				this.tabscorelist.splice(idx,1,tabinfo)
				this.stuscorelist[idx]=info;
			}else{
				this.tabscorelist.push(tabinfo);
				this.stuscorelist.push(info);
			}
			this.type=0;
		},
		getImport(){
			this.subLists=JSON.parse(JSON.stringify(this.comsubList))
			this.type=3;
			this.editidx=-1
			var newobj={
				scoreDataName:'',//姓名
				scoreDataNameId:'',//姓名id
				studentNumber:''
			}
			this.studentinfo=JSON.parse(JSON.stringify(newobj))
		},
		 getConfirm(data){
		 	this.type=0;
			this.editidx=-1;
		 },
		 getsubConfirm(data){
			this.type=0;
			this.editidx=-1;
			this.comsubList=JSON.parse(JSON.stringify(data.narr))
			this.column1=JSON.parse(JSON.stringify(data.column1))
			this.mfboList=JSON.parse(JSON.stringify(data.mfboList))
		 },
		 getClose(){
		 	this.type=0;
			this.editidx=-1;
		 },
		 init(){
		 	// 学科
		 	getDictionaryFn('chjbxk').then(res=>{
		 		if(res.code==200){
		 			this.subjectlist = res.data.map(v => {
		 				return {
		 					tit: v.dictLabel,
		 					val:v.dictValue,
		 					check:false,
							manfen:''
		 				}
		 			})
		 			this.type=2;
		 		}
		 	})
		 },
	},
	
  }
</script>

<style lang="scss" scoped>
.format{padding: 40rpx 36rpx 180rpx;
	.box{width: 100%;background: #ffffff;padding:40rpx 26rpx 26rpx ;box-sizing: border-box;border-radius: 18rpx;
		.addbtn{width: 100%;height: 110rpx;background: #EEF3FE;border-radius: 10rpx;font-size: 30rpx;font-weight: bold;
		color: #4775EA;margin-bottom: 48rpx;flex: 0 0 auto;
			.addimg{width: 22rpx;height: 22rpx;margin-right: 20rpx;}
		}
		// 学生姓名
		.xsname{
			display: flex;align-items: center;flex-wrap: wrap;
			.xslist{height: 76rpx;background: #F2F2F2;border-radius: 38rpx;display: flex;align-items: center;font-size: 30rpx;color: #666666;width: 190rpx;padding: 0 24rpx;
				box-sizing: border-box;margin:0 28rpx 26rpx 0;
				image{width: 28rpx;height: 18rpx;flex: 0 0 auto;margin-left: 8rpx;}
				&:nth-child(3n){margin-right: 0;}
			}
		}
	}
	.refixed{position: fixed;left: 0;right: 0;bottom: 0;z-index: 1;padding: 20rpx 36rpx 56rpx;}
}
// 表格
.format{height: 100vh;box-sizing: border-box;
	.box{height: 100%;display: flex;flex-direction: column;}
}
</style>