You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

261 lines
6.8 KiB

<template>
<view class="container">
<image class="cbg" src="../../static/common_bg.png"></image>
<!-- <u-divider>个人信息</u-divider> -->
<view class="wrap">
<u-form :model="form" :label-width="140" ref="uForm" :label-align="'left'" :error-type="['message']">
<u-form-item label="姓名" prop="username" required>
<u-input v-model="form.username" placeholder="请输入姓名" />
</u-form-item>
<u-form-item label="性别" prop="sex" required>
<u-input @click="showSex = true" placeholder="请选择性别" v-model="form.sex" type="select" />
</u-form-item>
<u-form-item label="身份证号" prop="idcard" required>
<u-input type="idcard" placeholder="请输入身份证号" v-model="form.idcard" /></u-form-item>
<u-form-item label="联系方式" prop="mobile" required>
<u-input type="number" placeholder="请输入联系方式" v-model="form.mobile" />
</u-form-item>
<u-form-item label="出生日期" prop="birthday" required>
<u-input @click="dateShow=true" placeholder="请选择出生日期" v-model="form.birthday"
type="select" /></u-form-item>
<u-form-item label="邮箱" prop="email" required>
<u-input v-model="form.email" placeholder="请输入邮箱" /></u-form-item>
<u-form-item label="公司名称" prop="company_name">
<u-input v-model="form.company_name" placeholder="请输入公司名称" />
</u-form-item>
<u-form-item label="职务" prop="company_position">
<u-input @click="showPosition = true" v-model="form.company_position" type="select"
placeholder="请选择职务" /></u-form-item>
</u-form>
<!-- <u-divider>报名信息</u-divider> -->
<applyForm ref="applyForm" @backForm="backForm" :course_forms="course_forms"></applyForm>
</view>
<!-- <view class="form-btn">
<view @click="submit" type="primary">提交</view>
</view> -->
<u-picker @confirm="selectSex" v-model="showSex" :range="sexList" range-key="value" mode="selector"></u-picker>
<u-picker @confirm="dateConfirm" mode="time" v-model="dateShow" :params="dateParams"></u-picker>
<u-picker @confirm="selectPosition" v-model="showPosition" :range="positionList" range-key="value"
mode="selector"></u-picker>
</view>
</template>
<script>
import applyForm from "@/components/applyForm/index.vue"
export default {
components: {
applyForm
},
data() {
return {
course_id: '',
showPosition: false,
positionList: [],
dateShow: false,
dateParams: {
year: true,
month: true,
day: true,
hour: false,
minute: false,
second: false
},
form: {},
apply_form: [],
course_forms: [],
showSex: false,
sexList: [{
label: '男',
value: '男'
}, {
label: '女',
value: '女'
}],
rules: {
username: [{
required: true,
message: '请输入姓名',
trigger: ['blur'],
}],
sex: [{
required: true,
message: '请选择性别',
trigger: ['change', 'blur'],
}],
birthday: [{
required: true,
message: '请选择出生日期',
trigger: ['change', 'blur'],
}],
mobile: [{
required: true,
message: '请输入联系方式',
trigger: ['blur'],
}, {
validator: (rule, value, callback) => {
return this.$u.test.mobile(value);
},
message: '手机号码不正确',
trigger: ['blur'],
}],
idcard: [{
required: true,
message: '请输入身份证号',
trigger: ['blur'],
}, {
validator: (rule, value, callback) => {
return this.$u.test.idCard(value);
},
message: '身份证号不正确',
trigger: ['blur'],
}],
email: [{
required: true,
message: '请输入邮箱',
trigger: ['blur'],
}, {
validator: (rule, value, callback) => {
return this.$u.test.email(value);
},
message: '邮箱不正确',
trigger: ['blur'],
}],
}
}
},
onReady() {
this.$refs.uForm.setRules(this.rules);
},
onLoad(options) {
this.course_id = options.id
this.getCourseDetail(options.id)
let user = uni.getStorageSync("stbc_lifeData") ? uni.getStorageSync("stbc_lifeData").vuex_user : {}
this.form = user
this.getPosition()
},
methods: {
selectSex(e) {
console.log("e", e)
this.form.sex = this.sexList[e[0]]['value']
},
selectPosition(e){
this.form.company_position = this.positionList[e[0]]['value']
},
// 日期
dateConfirm(e) {
this.form.birthday = e.year + '-' + e.month + '-' + e.day
},
getPosition(){
this.$u.api.getparameter({
number:'company_position'
}).then(res=>{
this.positionList = res.detail
})
},
async getCourseDetail(id) {
const res = await this.$u.api.courseDetail({
course_id: id
})
if (res.course_forms && res.course_forms.length > 0) {
this.course_forms = res.course_forms
}
},
backForm(e) {
console.log("e", e)
let _arr = []
e.map(item => {
_arr.push({
name: item.name,
field: item.field,
value: item.value
})
})
this.apply_form = _arr
console.log("this.apply_form", this.apply_form)
// return
this.$refs.uForm.validate(valid => {
if (valid) {
this.saveUser()
this.applyCourse()
} else {
console.log('验证失败');
// this.base.toast("注册失败")
}
});
},
saveUser() {
this.$u.api.saveUser(this.form).then(res => {
// this.base.toast("更新用户信息成功")
this.$u.api.user().then(res => {
// let stor = uni.getStorageSync('stbc_lifeData')
// stor.vuex_user = res.user
// uni.setStorageSync('stbc_lifeData',stor)
this.$u.vuex('vuex_user', res.user)
})
})
},
applyCourse() {
this.$u.api.courseSign({
course_id: this.course_id,
data: this.apply_form
}).then(res => {
this.base.toast("报名成功")
uni.redirectTo({
url: '/packages/mycourse/index'
})
})
},
}
}
</script>
<style scoped lang="scss">
.container {
padding: 30rpx;
height: 100vh;
.cbg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
}
.wrap {
background-color: #fff;
padding: 20rpx 50rpx;
border-radius: 20rpx;
position: relative;
height: 100%;
overflow: scroll;
}
.form-btn {
width: 100%;
position: fixed;
left: 0;
bottom: 0;
padding: 20rpx 0;
&>view {
width: 70%;
text-align: center;
margin: 0 auto;
color: #fff;
background-color: #010296;
border-radius: 10rpx;
padding: 20rpx;
}
}
}
</style>