zhihuixiaoyuan2-ui/mine/components/login/applyteacher.vue

<template>
  <view class="regbox flexdc">
	  <uni-forms ref="form" :rules="ruleas" :modelValue="datainfo">
		 
		 <picker  range-key='dictLabel' :value="xxindex" :range="schoolval" @change='bindDateChangea'>
		 	<uni-forms-item label="学校" required name="schoolName">
			<view  class="f16  flex1 txr" :class="datainfo.schoolName?'co16':'coa'">{{datainfo.schoolName||"请选择学校"}}
			</view>
		 	<view class="rimg"><image :src="rimg" class="rimgs"></image>	</view>
		 	</uni-forms-item>
		 </picker>
		 <uni-forms-item label="姓名" required name="userName">
		 	<uni-easyinput :inputBorder="false" v-model="datainfo.userName" placeholder="请输入您的姓名"></uni-easyinput>
		 	<view class="rimg"></view>
		 </uni-forms-item>
		 <uni-forms-item label="联系方式" required name="userPhone">
		 	<uni-easyinput :inputBorder="false" v-model="datainfo.userPhone" placeholder="请输入您的联系方式"></uni-easyinput>
		 	<view class="rimg"></view>
		 </uni-forms-item>
		 <!-- 单选 -->
		 <view v-for="(ite,idx) in classlist" class="pr" :key="idx" @click="getShow(idx)">
			 <view @click="getDel(idx)" class="delbox" v-if="idx!=0">
				 <image :src="tcdel"></image>
			 </view>
			 <picker  range-key='dictLabel' :value="bjindex" :range="classval" @change='bindDateChangeb'>
			 	<uni-forms-item label="班级" required name="className" @click="getClass">
			 		<view  class="f16  flex1 txr" :class="ite.className?'co16':'coa'">{{ite.className||"请选择班级"}}
			 		</view>
			 		<view class="rimg"><image :src="rimg" class="rimgs"></image>	</view>
			 	</uni-forms-item>
			 </picker>
			 <picker  range-key='dictLabel' :value="xkindex" :range="subject" @change='bindDateChangec'>
			 	<uni-forms-item label="学科" required name="discipline" >
			 		<view  class="f16  flex1 txr" :class="ite.discipline?'co16':'coa'">{{ite.discipline||"请选择学科"}}
			 		</view>
			 		<view class="rimg"><image :src="rimg" class="rimgs"></image>	</view>
			 	</uni-forms-item>
			 </picker>
			 <view class="line"></view>
		 </view>
		 
		 <view class="addbox f17 co47 flexcc mt26" @click="getAddFn">
		 	<image :src="addimg"></image>
		 	新增班级信息
		 </view>
		 
	  </uni-forms>
	 
	  <view class="mt26">
	  	<view class="rbtn" @click="getSubmit">保存</view>
	  	 <view class="apllytxt f15" @click="gethome">稍后完善</view>
	  </view>
  </view>
</template>

<script>
	import {getDeptList,getDeptListminea} from "@/api/mine/mine.js"
	import config from '@/config'
	 const baseUrl = config.baseUrl
	 import { getToken } from '@/utils/auth'
	 import {getDictionaryFn,getteacherregFn,getteacherputFn,getteacherdetFn} from "@/api/mine/register.js"
  export default {
	  props:{
	  	schoolval:{
	  		type: Array,
	  		default () {
	  			return []
	  		}
	  	},
		subject:{
			type: Array,
			default () {
				return []
			}
		},
		classvals:{
			type: Array,
			default () {
				return []
			}
		}
	  },
	  watch:{
		classvals(val){
			this.classval=val
		}
	  },
	data(){
		return{
			rimg:require("@/static/images/rimg.png"),
			wimg:require('@/static/images/read.png'),
			delimg:require('@/static/images/del.png'),
			addimg:require('@/static/images/add.png'),
			tcdel:require('@/static/images/tcdel.png'),
			cyvalue:'',
			xxindex:0,
			bjindex:0,
			xkindex:0,
			ruleas: {
			  schoolName: {rules: [{required: true,errorMessage: '请输入学校名称'}]},
			  userName: {rules: [{required: true,errorMessage: '请输入姓名',}]},
			  userPhone: {rules: [{required: true,errorMessage: '请输入联系方式'},{pattern:"^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\\d{8}$",errorMessage: '请输入正确的联系方式'}]},
			},
			datainfo:{
				  "schoolId": "",
				  "schoolName":"",
				  "userName":"",
				  "userPhone":"",
				  "registerTeacherClassList":[{
				      "classId":"",
				      "className":"",
				      "discipline":""
				}]
			},
			classlist:[{
				      "classId":"",
				      "className":"",
				      "discipline":""
				  }],
			classval:[],
			checkidx:-1,
			id:'',
			type:'add',//页面类型
		}
	},
	mounted: function(e) {
	},
	methods:{
		
		getAddFn(){
			var obj={
				    "classId":"",
				    "className":"",
				    "discipline":""
				}
			this.classlist.push(obj);
		},
		getDel(idx){
			var that=this;
			uni.showModal({
				title: '确认删除',
				content: "是否确认删除",
				cancelText: '取消删除',
				confirmText: '确认删除',
				success: function(res) {
					if (res.confirm) {
						that.classlist.splice(idx,1)
					} else if (res.cancel) {
						// console.log('用户点击取消');
					}
				}
			});
		},
		getShow(idx){
			this.checkidx=idx;
		},
		// 选择学校
		bindDateChangea(e){
			var val=e.detail.value;
			var v=this.schoolval[val];
			var id=v.dictValue;
			if(this.datainfo.schoolId!=id){
				this.datainfo.schoolName=v.dictLabel;
				this.datainfo.tenantId=v.tenantId;
				this.datainfo.schoolId=id;
				this.$emit("getclassListFn",id)
				this.$emit("getinit",v.tenantId)
				var obj={"classId":"","className":"","discipline":""};
				var newarr=[];
				newarr.push(obj)
				this.classlist=JSON.parse(JSON.stringify(newarr))
			}
			
		},
		// 班级
		bindDateChangeb(e) {
			var val=e.detail.value;
			var idx=this.checkidx;
			this.classlist[idx].className=this.classval[val].dictLabel
			this.classlist[idx].classId=this.classval[val].dictValue
		},
		// 学科
		bindDateChangec(e){
			var val=e.detail.value;
			var idx=this.checkidx;
			this.classlist[idx].discipline=this.subject[val].dictLabel
		},
		getSubmit(){
			var that=this;
			this.$refs.form.validate().then(res => {
				var list=this.classlist;
				var newArr = [];
				var a=0;
				Object.keys(list).some((key) => {
					// 去重
					if (list[key].className && list[key].discipline) {
						newArr.push(list[key])
					} else if (list[key].className && !list[key].discipline) {
						a=1;
						this.$toast("请选择"+list[key].className+"的学科")
						return
					} else {
						a=1;
						this.$toast("请选择班级")
						return
					}
				})
				// 相同班级去重
				var newArrs = [];
				const map = new Map();
				 newArrs = list.filter(v => !map.has(v.classId) && map.set(v.classId, 1));
				if(newArrs.length<newArr.length){
					this.$toast("请勿添加同一年级")
					return
				}
				
				if(a==1){
					return
				}
				var params=JSON.parse(JSON.stringify(this.datainfo))
				params.registerTeacherClassList=JSON.parse(JSON.stringify(newArr))
				this.$emit('getteacherregFn',params)
				
				// this.$tab.navigateTo(`/mine/pages/mine/success`)
			})
			
		},
		gethome(){
			this.$tab.reLaunch(`/pages/index/index`)
		},
	},
	
  }
</script>

<style lang="scss" scoped>

.regbox{padding: 20rpx 36rpx 80rpx;box-sizing: border-box;min-height: auto;overflow: auto;
	.apllytxt{font-size:30rpx ;}
	.line{width: 40rpx;height: 6rpx;background: #FFB132;margin: 60rpx auto 0;}
	
	.addbox{font-weight: 500;
		image{width: 44rpx;height: 44rpx;margin-right: 24rpx;flex: 0 0 auto;}
	}
	
	.delbox{width: 40rpx;height: 40rpx;position: absolute;right: 0;top: -40rpx;padding: 0;display: flex;align-items: center;justify-content: center;
		image{
			width: 36rpx;height: 36rpx;
		}
	}
}
.regbox /deep/ .uni-forms{flex: 1;}
.regbox /deep/ .uni-forms-item__label{flex: 0 0 auto;width: auto !important;font-size: 32rpx;font-weight: bold;
color: #161616;}
.regbox /deep/ .uni-forms .uni-forms-item{padding: 28rpx 24rpx 20rpx;border-bottom: 2rpx #C1C1C1 solid;margin-bottom: 0;
	// &:nth-of-type(3){margin-bottom: 0;border-bottom: 0;}
}
.regbox /deep/ .uni-forms-item__content{display: flex;align-items: center;flex-direction: row;}
.regbox /deep/ .uni-easyinput{flex: 1;text-align: right;}
.regbox /deep/ .uni-easyinput__placeholder-class{font-size: 30rpx;}
.regbox /deep/ .uni-easyinput__content-input{font-size: 30rpx;}
 .regbox /deep/ .uni-forms-item__error{margin-top:20rpx;left: auto;right: 0;}
</style>