KindergartenAppletUI/pages/add/add.vue
2023-08-04 14:09:59 +08:00

459 lines
11 KiB
Vue

<template>
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm">
<view class="" @tap="popupTitlelist">
<u-form-item label="所属幼儿园:" prop="kindergartenName" borderBottom>
<u--input class="bindtitle" v-model="form.kindergartenName" disabled disabledColor="#ffffff"
placeholder="请选择所属幼儿园" border="none"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon>
<qianziyu-select v-if="show" :show="show" type="radio" :popupTitle="popupTitle" name="cworkStationName"
:kindergartenId="form.kindergartenId" :dataLists="range" placeholder="输入幼儿园名称搜索" @cancel="cancel"
@search="selectSearch" @submit="SubmitEvent"></qianziyu-select>
</u-form-item>
</view>
<view class="" @tap="popupTitlelistitem">
<u-form-item label="所属班级:" prop="className" borderBottom>
<u--input v-model="form.className" disabled disabledColor="#ffffff" placeholder="请选择所属班级"
border="none"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon>
<qianziyu-select v-if="showitems" :show="showitems" type="radio" :popupTitle="popupTitle"
name="cworkStationName" :classId="form.classId" :dataListgraded="rangegrade" placeholder="输入班级名称搜索"
@cancel="cancelgrade" @search="selectSearchgrade" @submit="submitgrade"></qianziyu-select>
</u-form-item>
</view>
<u-form-item label="学生家长:" prop="parentName" borderBottom>
<u--input v-model="form.parentName" disabled disabledColor="#ffffff" placeholder="学生家长"
border="none"></u--input>
</u-form-item>
<u-form-item label="民族:" prop="nationDictId" borderBottom>
<uni-data-select v-model="form.nationDictId" placeholder="请选择民族" :localdata="List"
@change="changenation"></uni-data-select>
</u-form-item>
<u-form-item label="学生姓名:" prop="studentName" borderBottom ref="item1">
<u--input v-model="form.studentName" placeholder="请输入学生姓名" border="none"></u--input>
</u-form-item>
<u-form-item label="学生编号:" prop="studentNumber" borderBottom ref="item1">
<u--input v-model="form.studentNumber" placeholder="请输入学生编号" border="none"></u--input>
</u-form-item>
<u-form-item label="证件编号:" prop="cardNumber" borderBottom ref="item1">
<u--input v-model="form.cardNumber" placeholder="请输入证件编号" border="none" maxlength="18"></u--input>
</u-form-item>
<u-form-item label="曾用名:" prop="onceName" borderBottom ref="item1">
<u--input v-model="form.onceName" placeholder="请输入曾用名" border="none"></u--input>
</u-form-item>
<u-form-item label="家庭住址:" prop="homeAddress" borderBottom ref="item1">
<u--input v-model="form.homeAddress" placeholder="请输入家庭住址" border="none"></u--input>
</u-form-item>
<view class="" @tap="birthday">
<u-form-item label="出生日期:" prop="birthDate" borderBottom>
<uni-datetime-picker :show="showitem" type="date" placeholder="请选择出生日期" v-model="form.birthDate"
:clear-icon="false" />
</u-form-item>
</view>
<u-form-item label="学生性别:" borderBottom>
<u-radio-group v-model="studentSex" @change="groupChange">
<u-radio :customStyle="{marginBottom: '4px'}" v-for="(item, index) in radiolist1" :key="index"
:label="item.name" :name="item.name" @change="radioChange">
</u-radio>
</u-radio-group>
</u-form-item>
<view class="submit" @tap="submitend">
提交
</view>
<view class="cancel" @tap="ontouchcancel">
取消
</view>
<u-toast ref="uToast" />
</u--form>
</template>
<script>
import {
getKindergartenList,
getClassInfo,
getInfoByPhone,
typeInfo,
getStudent,
updateStudent
} from '@/api/index/index.js'
import baseurl from '@/api/baseurl.js'
export default {
data() {
return {
phone: '',
range: {},
rangegrade: [],
showitems: false,
show: false,
showitem: false,
mode: 'single',
form: {
parentName: '',
birthDate: '',
kindergartenName: '',
cardNumber: '',
classId: '',
homeAddress: '',
kindergartenId: '',
nationDictId: '',
onceName: '',
parentIdList: [],
studentName: "",
studentNumber: "",
studentSex: '',
className: '',
},
studentSex: '',
rules: {
'birthDate': {
type: 'string',
required: true,
message: '请选择出生日期',
trigger: ['blur', ]
},
'nationDictId': {
type: 'number',
required: true,
message: '请选择民族',
trigger: ['blur', ]
},
},
radiolist1: [{
name: '男',
disabled: false
},
{
name: '女',
disabled: false
},
],
kindergartenName: '',
radio: '',
switchVal: false,
List: [], // 民族
studentId: '',
}
},
onLoad(options) {
if (options.studentId) {
uni.setNavigationBarTitle({
title: "修改学生信息"
});
this.studentId = options.studentId
getStudent(this.studentId).then(res => {
if (res.data.studentSex == 'MALE') {
this.studentSex = '男'
} else if (res.data.studentSex == 'FEMALE') {
this.studentSex = '女'
}
this.form = res.data
this.form.parentName = res.data.parentName
})
} else {
uni.setNavigationBarTitle({
title: "新增学生信息"
});
this.infolist();
}
},
onShow() {
this.getinfo();
var dictType = 'nation_type'
typeInfo(dictType).then(res => {
res.data.forEach(e => {
this.List.push({
value: e.dictCode,
text: e.dictLabel
});
})
})
},
methods: {
ontouchcancel() {
uni.reLaunch({
url: "/pages/Personal/Personal"
})
},
infolist() {
this.phone = uni.getStorageSync('phone');
getInfoByPhone(this.phone).then(res => {
this.form.parentName = res.data.parentName;
this.form.parentIdList.push(res.data.parentInfoId)
})
},
groupChange(n) {
if (n == '男') {
this.form.studentSex = 'MALE'
} else if (n == '女') {
this.form.studentSex = 'FEMALE'
}
},
radioChange(n) {
if (n == '男') {
this.form.studentSex = 'MALE'
} else if (n == '女') {
this.form.studentSex = 'FEMALE'
}
},
// 民族
changenation(e) {
// this.form.nationDictId = e
},
//提交
submitend() {
if (!this.form.kindergartenName) {
this.$refs.uToast.show({
message: "请选择所属幼儿园",
type: 'error',
duration: '2000'
})
} else if (!this.form.className) {
this.$refs.uToast.show({
message: "请选择所属班级",
type: 'error',
duration: '2000'
})
}
this.$refs.uForm.validate().then(res => {
// uni.$u.toast('校验通过')
updateStudent(this.form).then(res => {
if (res.code == 200) {
this.$refs.uToast.show({
message: "提交成功",
type: 'success',
duration: '2000'
})
setTimeout(e => {
uni.reLaunch({
url: '/pages/Personal/Personal'
})
}, 1000)
} else if (res.code == 500) {
uni.showToast({
title: res.msg,
duration: 2000,
mask: true,
icon: 'none'
})
}
})
}).catch(errors => {
uni.showToast({
title: errors,
duration: 2000,
mask: true,
icon: 'none'
})
})
// }
},
// 关闭
cancel() {
this.show = false,
this.getinfo()
},
cancelgrade() {
this.showitems = false,
this.info()
},
// 幼儿园确定
SubmitEvent(e) {
this.form.kindergartenName = e.kindergartenName
this.form.kindergartenId = e.id
this.show = false
},
// 班级确定
submitgrade(e) {
this.form.className = e.className
this.form.classId = e.id
this.showitems = false
},
// 出生日期
closecancel() {
this.showitem = false
},
// 幼儿园搜索
selectSearch(e) {
getKindergartenList(e).then(res => {
console.log(res)
this.range = res.data
console.log(this.range)
})
},
// 班级搜索
selectSearchgrade(e) {
getClassInfo(this.form.kindergartenId, e).then(res => {
console.log(res)
this.rangegrade = res.data
})
},
// 幼儿园
getinfo() {
getKindergartenList(this.kindergartenName).then(res => {
this.range = res.data
})
},
// 班级
info() {
this.form.className = ''
getClassInfo(this.form.kindergartenId, this.form.className).then(res => {
this.rangegrade = res.data
})
},
//选择所属幼儿园
popupTitlelist() {
this.show = true
this.form.className = ''
},
// 选择所属班级
popupTitlelistitem() {
if (this.form.kindergartenId == '') {
this.$refs.uToast.show({
message: '请先选择幼儿园',
type: 'error'
})
} else {
this.showitems = true
this.info();
}
},
birthday() {
this.showitem = true
},
maskClick(e) {
console.log(e);
this.form.birthDate = e[0]
this.showitem = false
},
}
}
</script>
<style lang="scss">
.sex {
width: 500rpx;
display: inline-block;
// background-color: red;
height: 50rpx
}
.Motion {
margin-left: 15%;
font-size: 30rpx;
}
::v-deep.u-input__content__field-wrapper__field.data-v-fdbb9fe6 {
margin-left: 15%;
}
::v-deep.uni-select__input-text {
font-size: 30rpx !important;
}
::v-deep.uni-select__selector-item {
font-size: 30rpx !important;
}
::v-deep.u-input__content__field-wrapper__field.data-v-fdbb9fe6 {
font-size: 30rpx !important;
}
.cancel {
margin-top: 5%;
width: 200rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
border-radius: 10rpx;
position: absolute;
left: 54%;
color: white;
background-color: #D7EEE8;
// bottom: 5%;
}
.submit {
margin-top: 5%;
width: 200rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
border-radius: 10rpx;
position: absolute;
left: 20%;
color: white;
// bottom: 5%;
background-color: #35A97A;
}
::v-deep.uni-date-editor--x {
margin-left: 10%;
}
::v-deep .uni-select {
width: 84% !important;
margin-left: 10% !important;
}
// ::v-deep .bindtitle {
// ::v-deep .input-inner {
// // color: #fff!important;
// font-size: 5rpx !important;
// }
::v-deep .u-input {
font-size: 5rpx !important;
}
::v-deep .u-form-item__body__left__content__label.data-v-5e7216f1 {
margin-left: 18% !important;
width: 180rpx !important;
font-size: 28rpx !important;
}
::v-deep.u-radio.data-v-643b3322 {
margin-left: 10% !important;
}
::v-deep .input-placeholder {
font-size: 30rpx !important;
}
::v-deep.u-input__input.data-v-fdbb9fe6 {
margin-left: 12% !important;
}
::v-deep .uni-data-select {
z-index: 9999 !important;
height: 200rpx !important;
/* background: red; */
overflow: auto;
}
</style>