zhihuixiaoyuan2-ui/work/pages/examine/ketime.vue

<template>
	<view class="course">
		<view class="cour_top">
			<view class="f17 co16 fw mb6">请认真完善以下课程表所需内容！</view>
			<view class="f15 coa">填写完成后可进行修改。</view>
		</view>
		<uni-forms ref="form" :rules="rules" :modelValue="datainfo">
			<view class="cour_box">
				<view class="list">
					<view class="line bg1"></view>
					<view class="listr">
						<!-- <picker range-key="dictLabel" :value="xxindex" :range="schoolval" @change="bindDateChange">
							<uni-forms-item label="学校名称" required name="schoolName">
								<view class="f16  flex1 " :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="schoolName">
							<view class="f16  flex1" :class="datainfo.schoolName ? 'co16' : 'coa'">{{ datainfo.schoolName || '请选择学校名称' }}</view>
							<view class="rimg"><image :src="rimg" class="rimgs"></image></view>
						</uni-forms-item>
					</view>
				</view>

				<view class="list_tit">课程信息</view>
				<view class="list" v-for="(ite,idx) in timelist" :key="idx">
					<view class="line bg2"></view>
					<view class="listr" @click="getChose(ite.val)">
						<picker mode="time" :value="time"  @change="bindTimeChangea">
							<uni-forms-item :label="ite.tit+'开始时间'" name="oneStartTime">
								<block v-if="ite.val==1"><view class="f16  flex1" :class="datainfo.oneStartTime ? 'co16' : 'coa'">{{ datainfo.oneStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==2"><view class="f16  flex1" :class="datainfo.twoStartTime ? 'co16' : 'coa'">{{ datainfo.twoStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==3"><view class="f16  flex1" :class="datainfo.threeStartTime ? 'co16' : 'coa'">{{ datainfo.threeStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==4"><view class="f16  flex1" :class="datainfo.fourStartTime ? 'co16' : 'coa'">{{ datainfo.fourStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==5"><view class="f16  flex1" :class="datainfo.fiveStartTime ? 'co16' : 'coa'">{{ datainfo.fiveStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==6"><view class="f16  flex1" :class="datainfo.sixStartTime ? 'co16' : 'coa'">{{ datainfo.sixStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==7"><view class="f16  flex1" :class="datainfo.sevenStartTime ? 'co16' : 'coa'">{{ datainfo.sevenStartTime || '请选择开始时间' }}</view></block>
								<block v-if="ite.val==8"><view class="f16  flex1" :class="datainfo.eightStartTime ? 'co16' : 'coa'">{{ datainfo.eightStartTime || '请选择开始时间' }}</view></block>
								
							</uni-forms-item>
						</picker>
						<picker mode="time" :value="time"  @change="bindTimeChangeb">
							<uni-forms-item :label="ite.tit+'结束时间'" name="oneEndTime">
								<block v-if="ite.val==1"><view class="f16  flex1 " :class="datainfo.oneEndTime ? 'co16' : 'coa'">{{ datainfo.oneEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==2"><view class="f16  flex1" :class="datainfo.twoEndTime ? 'co16' : 'coa'">{{ datainfo.twoEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==3"><view class="f16  flex1" :class="datainfo.threeEndTime ? 'co16' : 'coa'">{{ datainfo.threeEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==4"><view class="f16  flex1" :class="datainfo.fourEndTime ? 'co16' : 'coa'">{{ datainfo.fourEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==5"><view class="f16  flex1" :class="datainfo.fiveEndTime ? 'co16' : 'coa'">{{ datainfo.fiveEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==6"><view class="f16  flex1" :class="datainfo.sixEndTime ? 'co16' : 'coa'">{{ datainfo.sixEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==7"><view class="f16  flex1" :class="datainfo.sevenEndTime ? 'co16' : 'coa'">{{ datainfo.sevenEndTime || '请选择结束时间' }}</view></block>
								<block v-if="ite.val==8"><view class="f16  flex1" :class="datainfo.eightEndTime ? 'co16' : 'coa'">{{ datainfo.eightEndTime || '请选择结束时间' }}</view></block>
							</uni-forms-item>
						</picker>
					</view>
				</view>
				<view class="text">
					<uni-forms-item label="备注" name="remark" class="text">
						<uni-easyinput type="textarea" :inputBorder="false"  v-model="datainfo.remark" placeholder="请输入备注内容，非必填项..."></uni-easyinput>
					</uni-forms-item>
				</view>
			</view>
			<view class="btnbox">
				<view class="btn btn1" @click="getSubmit">提交</view>
				<view class="btn btn2" @click="getRemove" v-if="pagetype=='update'">删除</view>
			</view>
		</uni-forms>
	</view>
</template>

<script>
import {getTimelistFn,getTimeAddFn,getTimePutFn,getTimeDelFn} from "@/api/work/index.js"
import {getDeptList,getselfList} from "@/api/mine/mine.js"
export default {
	data() {
		return {
			rimg: require('@/static/images/wrimg.png'),
			datainfo: {
				"schoolId": "",
				  "schoolName": "",
				  "oneStartTime": "",
				  "oneEndTime": "",
				  "twoStartTime": "",
				  "twoEndTime": "",
				  "threeStartTime": "",
				  "threeEndTime": "",
				  "fourStartTime": "",
				  "fourEndTime": "",
				  "fiveStartTime": "",
				  "fiveEndTime": "",
				  "sixStartTime": "",
				  "sixEndTime": "",
				  "sevenStartTime": "",
				  "sevenEndTime": "",
				  "eightStartTime": "",
				  "eightEndTime": "",
				  "remark":''
			},
			rules: {
				schoolName: { rules: [{ required: true, errorMessage: '请输入学校名称' }] },
			},
			timelist:[
				{tit:"第一节课",val:'1'},
				{tit:"第二节课",val:'2'},
				{tit:"第三节课",val:'3'},
				{tit:"第四节课",val:'4'},
				{tit:"第五节课",val:'5'},
				{tit:"第六节课",val:'6'},
				{tit:"第七节课",val:'7'},
				{tit:"第八节课",val:'8'},
			],
			schoolval: [],
			xxindex: [],
			pagetype:'add',
		};
	},
	onLoad: function() {
		this.datainfo.schoolId=this.$store.state.user.schoolId||this.$store.state.user.deptId;;
		this.datainfo.schoolName=this.$store.state.user.schoolName||this.$store.state.user.deptName;
		this.getclassinfoFn();
		// this.getDeptListFn();
	},
	methods: {
		// 学校列表
		getDeptListFn(){
			var params={
				parentId:0
			}
			getDeptList(0).then(res=>{
				if(res.code==200){
					this.schoolval = res.data.map(v => {
						return {
							dictLabel: v.deptName,
							dictValue: v.deptId
						}
					})
				}else{
					this.$toast(res.msg)
				}
			})
		},
		getTimelistFn(id){
			var id=this.datainfo.schoolId;
			var params={
				schoolId:id,
			}
			getTimelistFn(params).then(res=>{
				if(res.code==200){
					if(res.rows.length){
						this.datainfo=res.rows[0];
						this.pagetype='update'
					}
				}else{
					this.$toast(res.msg)
				}
			})
		},
		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
							}
						})
					}
				}else{
					this.$toast(res.msg)
				}
			})
		},
		getclassinfoFn(){
			var that=this;
			var roles=that.$store.state.user.choseroles;
			that.roles=roles;
			if(roles=='teacher'){
				var id=this.datainfo.schoolId;
				this.getselfList(id)
			}else if(roles=='parents'){
				this.$store.dispatch('GetInforoles').then(resd => {
					if(resd.code==200){
						var res=resd.data;
						if(res.user&&res.user.parentsStudent&&res.user.parentsStudent.length){
							this.classval = res.user.parentsStudent.map(v => {
								return {
									dictLabel: v.className,
									dictValue: v.classId,
									schoolName: v.schoolName
								}
							})
						}
					}
					
				})
			}else{
				// 学校
				that.datainfo.classId='';
				that.datainfo.className='';
				that.datainfo.schoolId=that.$store.state.user.deptId;
				that.datainfo.schoolName=that.$store.state.user.deptName;
				that.getTimelistFn()
			}
		},
		// 选择学校
		bindDateChange(e) {
			var val = e.detail.value;
			var v = this.schoolval[val];
			var idx = this.checkidx;
			var id = v.dictValue;
			this.datainfo.schoolId=v.dictValue;
			this.datainfo.schoolName=v.dictLabel;
			this.getTimelistFn(id);
		},
		getChose(idx){
			this.choseidx=idx;
		},
		bindTimeChangea(e){
			var idx=this.choseidx;
			var val=e.detail.value;
			if(idx==1){
				this.datainfo.oneStartTime=val
			}else if(idx==2){
				this.datainfo.twoStartTime=val;
			}else if(idx==3){
				this.datainfo.threeStartTime=val;
			}else if(idx==4){
				this.datainfo.fourStartTime=val;
			}else if(idx==5){
				this.datainfo.fiveStartTime=val;
			}else if(idx==6){
				this.datainfo.sixStartTime=val;
			}else if(idx==7){
				this.datainfo.sevenStartTime=val;
			}else if(idx==8){
				this.datainfo.eightStartTime=val;
			}	
		},
		bindTimeChangeb(e){
			var val=e.detail.value;
			var idx=this.choseidx;
			if(idx==1){
				this.datainfo.oneEndTime=val
			}else if(idx==2){
				this.datainfo.twoEndTime=val
			}else if(idx==3){
				this.datainfo.threeEndTime=val;
			}else if(idx==4){
				this.datainfo.fourEndTime=val;
			}else if(idx==5){
				this.datainfo.fiveEndTime=val;
			}else if(idx==6){
				this.datainfo.sixEndTime=val;
			}else if(idx==7){
				this.datainfo.sevenEndTime=val;
			}else if(idx==8){
				this.datainfo.eightEndTime=val;
			}
			
		},
		getSubmit(){
			var that=this;
			this.$refs.form.validate().then(res => {
				var params=JSON.parse(JSON.stringify(this.datainfo))
				if(this.pagetype=='add'){
					getTimeAddFn(params).then(res=>{
						if(res.code==200){
							that.$toast("新增成功")
							setTimeout(function(){
							uni.$emit('refreshdatalis');
								that.$tab.reLaunch('/pages/work/index') 
							},1500)
						}else{
							that.$toast(res.msg)
						}
					})
				}else{
					getTimePutFn(params).then(res=>{
						if(res.code==200){
							that.$toast("修改成功")
							setTimeout(function(){
							uni.$emit('refreshdatalis');
								that.$tab.reLaunch('/pages/work/index') 
							},1500)
						}else{
							that.$toast(res.msg)
						}
					})
				}
				// this.$tab.navigateTo(`/mine/pages/mine/success`)
			})
			
		},
		getRemove(){
			var that=this;
			uni.showModal({
				title: '确认删除',
				content: "是否确认删除",
				cancelText: '取消删除',
				confirmText: '确认删除',
				success: function(res) {
					if (res.confirm) {
						var id=that.datainfo.id;
						getTimeDelFn(id).then(res=>{
							if(res.code==200){
								that.$toast("删除成功")
								setTimeout(function(){
								uni.$emit('refreshdatalis');
									that.$tab.reLaunch('/pages/work/index') 
								},1500)
							}else{
								that.$toast(res.msg)
							}
						})
					} else if (res.cancel) {
						// console.log('用户点击取消');
					}
				}
			});	
		}
	}
};
</script>

<style lang="scss" scoped>
.cour_top{padding: 60rpx 36rpx;}
.cour_box{padding: 0 36rpx;
	.list_tit{font-size: 32rpx;color: #161616;font-weight: 500;padding: 16rpx 0 24rpx;}
	.list{width: 100%;background: #FFFFFF;border-radius: 14rpx;box-sizing: border-box;margin-bottom: 24rpx;display: flex;align-items: stretch;
		.rimg{flex: 0 0 auto;margin-left: 12rpx;display: flex;align-items: center;justify-content: center;width: 40rpx;height: 40rpx;
			image{width: 12rpx;height: 20rpx;}
		}
		.line{width: 12rpx;border-radius: 14rpx 0 0 14rpx;opacity: 0.7;
			&.bg1{background: #fc733a;}
			&.bg2{background: #1f57e6;}
		}
		.listr{padding: 16rpx 32rpx 16rpx 36rpx;flex: 1;}
	}
}
.course /deep/ .uni-forms{flex: 1;}
.course /deep/ .uni-forms-item__label{flex: 0 0 auto;width: auto !important;font-size: 32rpx;font-weight: 500;
color: #161616;}
.course /deep/ .uni-forms .uni-forms-item{margin-bottom: 0;}
.course /deep/ .uni-forms .text .uni-forms-item{margin-bottom: 0;border-bottom: 0;flex-direction: column;text-align: left;}
.course /deep/ .uni-forms .uni-forms-item .uni-easyinput__content-textarea{border: 2rpx solid #CDCDCD;background-color: #FFFFFF;border-radius: 14rpx;padding: 32rpx 40rpx;font-size: 30rpx;margin: 0;min-height: 256rpx;box-sizing: border-box;
		}
.course /deep/ .uni-forms-item__content{display: flex;align-items: center;flex-direction: row;}
.course /deep/ .uni-easyinput{flex: 1;text-align: left;}
.course /deep/ .uni-easyinput__placeholder-class{font-size: 30rpx;}
.course /deep/ .uni-easyinput__content-input{font-size: 30rpx;}
 .course /deep/ .uni-forms-item__error{margin-top:20rpx;left: auto;right: 0;}
.course{padding-bottom: 140rpx;
	.btnbox{position: fixed;left: 0;right: 0;bottom: 0;font-size: 34rpx;color: #FFFFFF;display: flex;align-items: center;z-index: 4;
	.btn{
		height: 100rpx;display: flex;align-items: center;justify-content: center;
		&.btn1{background-color: #1f57e6;flex: 1;}
		&.btn2{background-color: red;flex: 1;}
	}
		
	} 
}
</style>