|
|
@@ -22,29 +22,37 @@
|
|
|
<!-- 表单 -->
|
|
|
<view class="example">
|
|
|
<uni-forms style="padding: 0 20rpx 0 20rpx" label-position="top" ref="valiForm" :rules="rules" :modelValue="valiFormData">
|
|
|
- <!-- 姓名 -->
|
|
|
- <uni-forms-item label="姓名" label-width="80px" required name="name">
|
|
|
+ <uni-forms-item label="您的姓名" label-width="80px" required name="name">
|
|
|
<uni-easyinput v-model="valiFormData.name" placeholder="请输入姓名" />
|
|
|
</uni-forms-item>
|
|
|
-
|
|
|
- <!-- 性别 -->
|
|
|
- <uni-forms-item label="性别" label-width="80px" required name="gender">
|
|
|
- <uni-data-checkbox v-model="valiFormData.gender" :localdata="genderList" />
|
|
|
+ <uni-forms-item label="您的联系电话" label-width="100px" required name="mobile">
|
|
|
+ <uni-easyinput type="number" v-model="valiFormData.mobile" placeholder="请输入联系电话" />
|
|
|
</uni-forms-item>
|
|
|
-
|
|
|
- <!-- 出生年月 -->
|
|
|
- <uni-forms-item label="出生年月" label-width="100px" required name="birth_date">
|
|
|
- <uni-datetime-picker type="date" v-model="valiFormData.birth_date" placeholder="请选择出生年月" />
|
|
|
+
|
|
|
+ <uni-forms-item label="您的身份证" label-width="100px" required name="id_card">
|
|
|
+ <uni-easyinput type="idcard" v-model="valiFormData.id_card" placeholder="请输入身份证号" />
|
|
|
</uni-forms-item>
|
|
|
-
|
|
|
- <!-- 户籍 -->
|
|
|
- <uni-forms-item label="户籍" label-width="80px" required name="hukou">
|
|
|
- <uni-easyinput v-model="valiFormData.hukou" placeholder="请输入户籍所在地" />
|
|
|
+ <uni-forms-item label="您的区域" label-width="100px" required name="id_card">
|
|
|
+ <uni-data-picker :localdata="regionList" popup-title="请选择班级" @change="onchange" @nodeclick="onnodeclick"></uni-data-picker>
|
|
|
</uni-forms-item>
|
|
|
-
|
|
|
- <!-- 所在地 -->
|
|
|
- <uni-forms-item label="所在地" label-width="100px" required name="location">
|
|
|
- <uni-easyinput v-model="valiFormData.location" placeholder="请输入当前所在地" />
|
|
|
+ <uni-forms-item label="住址" label-width="100px" required name="address">
|
|
|
+ <uni-easyinput v-model="valiFormData.address" placeholder="请输入住址" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <uni-forms-item label="单位" label-width="80px" required name="unit_name">
|
|
|
+ <uni-easyinput v-model="valiFormData.unit_name" placeholder="请输入单位名称" />
|
|
|
+ </uni-forms-item>
|
|
|
+ <!-- <uni-forms-item label="备注" label-width="80px" required name="notesVal">
|
|
|
+ <uni-easyinput v-model="valiFormData.notesVal" placeholder="请输入申请类型(个人、家庭、机构)" />
|
|
|
+ </uni-forms-item> -->
|
|
|
+
|
|
|
+ <uni-forms-item label="认领原因" label-width="80px" required name="intro">
|
|
|
+ <uni-easyinput type="textarea" v-model="valiFormData.intro" placeholder="请输入认领原因或个人介绍(可上传个人优秀证明、奖项)" />
|
|
|
+ <view @click="chooseFile" class="scfj">
|
|
|
+ <view>上传文件</view>
|
|
|
+ <view>
|
|
|
+ <uni-icons type="wallet" size="18"></uni-icons>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</uni-forms-item>
|
|
|
|
|
|
<!-- 政治面貌 -->
|
|
|
@@ -52,62 +60,36 @@
|
|
|
<uni-data-select v-model="valiFormData.political_status" :localdata="politicalStatusList" placeholder="请选择政治面貌" />
|
|
|
</uni-forms-item>
|
|
|
|
|
|
- <!-- 参加工作时间 -->
|
|
|
- <uni-forms-item label="参加工作时间" label-width="140px" required name="work_start_date">
|
|
|
- <uni-datetime-picker type="date" v-model="valiFormData.work_start_date" placeholder="请选择参加工作时间" />
|
|
|
- </uni-forms-item>
|
|
|
-
|
|
|
<!-- 联系邮箱 -->
|
|
|
<uni-forms-item label="联系邮箱" label-width="100px" required name="email">
|
|
|
<uni-easyinput type="email" v-model="valiFormData.email" placeholder="请输入联系邮箱" />
|
|
|
</uni-forms-item>
|
|
|
|
|
|
- <!-- 联系电话 -->
|
|
|
- <uni-forms-item label="联系电话" label-width="100px" required name="mobile">
|
|
|
- <uni-easyinput type="number" v-model="valiFormData.mobile" placeholder="请输入联系电话" />
|
|
|
- </uni-forms-item>
|
|
|
-
|
|
|
- <!-- 身份证号码 -->
|
|
|
- <uni-forms-item label="身份证号码" label-width="120px" required name="id_card">
|
|
|
- <uni-easyinput type="idcard" v-model="valiFormData.id_card" placeholder="请输入身份证号码" />
|
|
|
- </uni-forms-item>
|
|
|
-
|
|
|
- <!-- 工作经历 -->
|
|
|
- <uni-forms-item label="工作经历" label-width="100px" required name="work_experience">
|
|
|
- <uni-easyinput type="textarea" v-model="valiFormData.work_experience" placeholder="请输入工作经历" />
|
|
|
- </uni-forms-item>
|
|
|
-
|
|
|
- <!-- 相关特长 -->
|
|
|
- <uni-forms-item label="相关特长" label-width="100px" required name="specialties">
|
|
|
- <uni-easyinput type="textarea" v-model="valiFormData.specialties" placeholder="请填写相关获奖证书、资格证书、培训结业证明、实践经历证明等" />
|
|
|
- </uni-forms-item>
|
|
|
-
|
|
|
- <!-- 报名选项 -->
|
|
|
- <uni-forms-item label="报名选项" label-width="100px" required name="application_options">
|
|
|
- <uni-data-checkbox v-model="valiFormData.application_options" :multiple="true" :localdata="optionList" class="checkbox-group" />
|
|
|
- </uni-forms-item>
|
|
|
-
|
|
|
<!-- 本人承诺 -->
|
|
|
- <uni-forms-item label="本人承诺" label-width="100px" required name="commitment">
|
|
|
+ <uni-forms-item label="本人承诺" label-width="100px" required name="commitment" >
|
|
|
<view class="commitment-text">
|
|
|
本人保证以上所填信息真实、有效，如有虚假，由此产生的一切后果由本人承担。
|
|
|
</view>
|
|
|
- <uni-data-checkbox v-model="valiFormData.commitment" :localdata="[
|
|
|
- {value: 1, text: '我已阅读并同意以上承诺'},
|
|
|
- {value: 0, text: '不同意'}
|
|
|
- ]" />
|
|
|
- </uni-forms-item>
|
|
|
+ <view style="background-color: #fdfaf6;">
|
|
|
+ <uni-data-checkbox v-model="valiFormData.commitment" :localdata="[
|
|
|
+ {value: 1, text: '我已阅读并同意以上承诺'},
|
|
|
+ {value: 0, text: '不同意'}
|
|
|
+ ]" />
|
|
|
+ </view>
|
|
|
+ </uni-forms-item>
|
|
|
</uni-forms>
|
|
|
</view>
|
|
|
<view class="text-wrapper_3" @click="submit('valiForm')">
|
|
|
<view class="bm_tit">报名</view>
|
|
|
</view>
|
|
|
+
|
|
|
|
|
|
<!-- 对话框 -->
|
|
|
<uni-popup ref="popup" type="center">
|
|
|
<view class="modal-container">
|
|
|
+ <text class="modal-title">{{ modalTitle }}</text>
|
|
|
<view class="modal-content">
|
|
|
- <rich-text :nodes="modalContent"></rich-text>
|
|
|
+ <u-parse :content="modalContent"></u-parse>
|
|
|
</view>
|
|
|
<view class="modal-footer">
|
|
|
<view class="modal-btn" @click="$refs.popup.close()">关闭</view>
|
|
|
@@ -133,6 +115,7 @@ export default {
|
|
|
// 对话框相关变量
|
|
|
showModal: false,
|
|
|
modalContent: '' /* 对话框富文本内容 */,
|
|
|
+ modalTitle: '' /* 对话框标题 */,
|
|
|
|
|
|
// 性别列表
|
|
|
genderList: [
|
|
|
@@ -149,118 +132,131 @@ export default {
|
|
|
{ value: '群众', text: '群众' }
|
|
|
],
|
|
|
|
|
|
- // 报名选项列表
|
|
|
- optionList: [
|
|
|
- { value: '巡查守护', text: '巡查守护' },
|
|
|
- { value: '宣讲传播', text: '宣讲传播' }
|
|
|
- ],
|
|
|
|
|
|
/* 表单数据 */
|
|
|
valiFormData: {
|
|
|
name: '',
|
|
|
- gender: '',
|
|
|
- birth_date: '',
|
|
|
- hukou: '',
|
|
|
- location: '',
|
|
|
- political_status: '',
|
|
|
- work_start_date: '',
|
|
|
- email: '',
|
|
|
mobile: '',
|
|
|
+ address: '',
|
|
|
id_card: '',
|
|
|
- work_experience: '',
|
|
|
- specialties: '',
|
|
|
- application_options: [],
|
|
|
- commitment: 0
|
|
|
+ unit_name: '',
|
|
|
+ fullurl: '',
|
|
|
+ intro: '',
|
|
|
+ political_status: '',
|
|
|
+ email: '',
|
|
|
},
|
|
|
|
|
|
/* 校验规则 */
|
|
|
rules: {
|
|
|
- // 姓名校验
|
|
|
+
|
|
|
+ // 对name字段进行必填验证
|
|
|
name: {
|
|
|
+ // name 字段的校验规则
|
|
|
rules: [
|
|
|
+ // 校验 name 不能为空
|
|
|
{
|
|
|
required: true,
|
|
|
errorMessage: '请输入姓名'
|
|
|
},
|
|
|
+ // 对name字段进行长度验证
|
|
|
{
|
|
|
minLength: 1,
|
|
|
maxLength: 6,
|
|
|
errorMessage: '{label}长度在 {minLength} 到 {maxLength} 个字符'
|
|
|
}
|
|
|
],
|
|
|
+ // 当前表单域的字段中文名，可不输入
|
|
|
label: '姓名',
|
|
|
validateTrigger: 'submit'
|
|
|
},
|
|
|
-
|
|
|
- // 性别校验
|
|
|
- gender: {
|
|
|
+ /* 手机号校验 */
|
|
|
+ mobile: {
|
|
|
+ // mobile 字段的校验规则
|
|
|
rules: [
|
|
|
+ // 校验 mobile 不能为空
|
|
|
{
|
|
|
required: true,
|
|
|
- errorMessage: '请选择性别'
|
|
|
+ errorMessage: '请输入联系电话'
|
|
|
+ },
|
|
|
+ // 对mobile字段进行长度验证
|
|
|
+ {
|
|
|
+ minLength: 11,
|
|
|
+ maxLength: 11,
|
|
|
+ errorMessage: '{label}长度为 {minLength} 个字符'
|
|
|
}
|
|
|
],
|
|
|
- label: '性别',
|
|
|
+ // 当前表单域的字段中文名，可不输入
|
|
|
+ label: '手机号',
|
|
|
validateTrigger: 'submit'
|
|
|
},
|
|
|
-
|
|
|
- // 出生年月校验
|
|
|
- birth_date: {
|
|
|
+ /* 身份证校验 */
|
|
|
+ id_card: {
|
|
|
+ // idCard 字段的校验规则
|
|
|
rules: [
|
|
|
+ // 校验 idCard 不能为空
|
|
|
{
|
|
|
required: true,
|
|
|
- errorMessage: '请选择出生年月'
|
|
|
+ errorMessage: '请输入身份证号'
|
|
|
}
|
|
|
+ // 对idCard字段进行长度验证
|
|
|
+ // {
|
|
|
+ // minLength: 18,
|
|
|
+ // maxLength: 18,
|
|
|
+ // errorMessage: '{label}长度为 {minLength} 个字符'
|
|
|
+ // }
|
|
|
],
|
|
|
- label: '出生年月',
|
|
|
+ // 当前表单域的字段中文名，可不输入
|
|
|
+ label: '身份证号',
|
|
|
validateTrigger: 'submit'
|
|
|
},
|
|
|
-
|
|
|
- // 户籍校验
|
|
|
- hukou: {
|
|
|
+
|
|
|
+ /* 单位 */
|
|
|
+ unit_name: {
|
|
|
rules: [
|
|
|
+ // 校验 unit 不能为空
|
|
|
{
|
|
|
required: true,
|
|
|
- errorMessage: '请输入户籍'
|
|
|
+ errorMessage: '请输入单位名称'
|
|
|
}
|
|
|
- ],
|
|
|
- label: '户籍',
|
|
|
- validateTrigger: 'submit'
|
|
|
+ ]
|
|
|
},
|
|
|
-
|
|
|
- // 所在地校验
|
|
|
- location: {
|
|
|
+
|
|
|
+ address: {
|
|
|
rules: [
|
|
|
+ // 校验 住址 不能为空
|
|
|
{
|
|
|
required: true,
|
|
|
- errorMessage: '请输入所在地'
|
|
|
+ errorMessage: '请输入单位名称'
|
|
|
}
|
|
|
- ],
|
|
|
- label: '所在地',
|
|
|
- validateTrigger: 'submit'
|
|
|
+ ]
|
|
|
},
|
|
|
-
|
|
|
- // 政治面貌校验
|
|
|
- political_status: {
|
|
|
+ // notesVal: {
|
|
|
+ // rules: [
|
|
|
+ // // 校验 申请类型 不能为空
|
|
|
+ // {
|
|
|
+ // required: true,
|
|
|
+ // errorMessage: '请输入申请类型'
|
|
|
+ // }
|
|
|
+ // ]
|
|
|
+ // },
|
|
|
+ intro: {
|
|
|
rules: [
|
|
|
{
|
|
|
required: true,
|
|
|
- errorMessage: '请选择政治面貌'
|
|
|
+ errorMessage: '请输入认领原因或个人介绍'
|
|
|
}
|
|
|
- ],
|
|
|
- label: '政治面貌',
|
|
|
- validateTrigger: 'submit'
|
|
|
+ ]
|
|
|
},
|
|
|
|
|
|
- // 参加工作时间校验
|
|
|
- work_start_date: {
|
|
|
+ // 政治面貌校验
|
|
|
+ political_status: {
|
|
|
rules: [
|
|
|
{
|
|
|
required: true,
|
|
|
- errorMessage: '请选择参加工作时间'
|
|
|
+ errorMessage: '请选择政治面貌'
|
|
|
}
|
|
|
],
|
|
|
- label: '参加工作时间',
|
|
|
+ label: '政治面貌',
|
|
|
validateTrigger: 'submit'
|
|
|
},
|
|
|
|
|
|
@@ -268,7 +264,7 @@ export default {
|
|
|
email: {
|
|
|
rules: [
|
|
|
{
|
|
|
- required: true,
|
|
|
+ required: false,
|
|
|
errorMessage: '请输入联系邮箱'
|
|
|
},
|
|
|
{
|
|
|
@@ -280,79 +276,6 @@ export default {
|
|
|
validateTrigger: 'submit'
|
|
|
},
|
|
|
|
|
|
- // 联系电话校验
|
|
|
- mobile: {
|
|
|
- rules: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- errorMessage: '请输入联系电话'
|
|
|
- },
|
|
|
- {
|
|
|
- pattern: /^1[3-9]\d{9}$/,
|
|
|
- errorMessage: '请输入正确的手机号格式'
|
|
|
- }
|
|
|
- ],
|
|
|
- label: '联系电话',
|
|
|
- validateTrigger: 'submit'
|
|
|
- },
|
|
|
-
|
|
|
- // 身份证号码校验
|
|
|
- id_card: {
|
|
|
- rules: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- errorMessage: '请输入身份证号码'
|
|
|
- },
|
|
|
- {
|
|
|
- pattern: /^[1-9]\d{5}(18|19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}[\dXx]$/,
|
|
|
- errorMessage: '请输入正确的身份证号码格式'
|
|
|
- }
|
|
|
- ],
|
|
|
- label: '身份证号码',
|
|
|
- validateTrigger: 'submit'
|
|
|
- },
|
|
|
-
|
|
|
- // 工作经历校验
|
|
|
- work_experience: {
|
|
|
- rules: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- errorMessage: '请输入工作经历'
|
|
|
- }
|
|
|
- ],
|
|
|
- label: '工作经历',
|
|
|
- validateTrigger: 'submit'
|
|
|
- },
|
|
|
-
|
|
|
- // 相关特长校验
|
|
|
- specialties: {
|
|
|
- rules: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- errorMessage: '请输入相关特长'
|
|
|
- }
|
|
|
- ],
|
|
|
- label: '相关特长',
|
|
|
- validateTrigger: 'submit'
|
|
|
- },
|
|
|
-
|
|
|
- // 报名选项校验
|
|
|
- application_options: {
|
|
|
- rules: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- errorMessage: '请至少选择一项报名选项'
|
|
|
- },
|
|
|
- {
|
|
|
- type: 'array',
|
|
|
- minLength: 1,
|
|
|
- errorMessage: '请至少选择一项报名选项'
|
|
|
- }
|
|
|
- ],
|
|
|
- label: '报名选项',
|
|
|
- validateTrigger: 'submit'
|
|
|
- },
|
|
|
-
|
|
|
// 本人承诺校验
|
|
|
commitment: {
|
|
|
rules: [
|
|
|
@@ -374,22 +297,23 @@ export default {
|
|
|
},
|
|
|
onLoad(o) {
|
|
|
that = this;
|
|
|
+ this.user = this.$common.userInfo();
|
|
|
this.cr_id = o.id;
|
|
|
this.volunteer_id = o.volunteer_id;
|
|
|
this.modifyId = o.modifyId;
|
|
|
this.getCategoryCascadeList();
|
|
|
|
|
|
if (this.isLogin) {
|
|
|
- // 调用API获取对话框内容并显示
|
|
|
- this.$api.getSubmit2ModalContent({}, function (res) {
|
|
|
- if (res.code === 1) {
|
|
|
- that.modalContent = res.data;
|
|
|
- that.$refs.popup.open();
|
|
|
- } else {
|
|
|
- that.modalContent = '获取对话框内容失败:' + res.msg;
|
|
|
- that.$refs.popup.open();
|
|
|
- }
|
|
|
- });
|
|
|
+ setTimeout(() => {
|
|
|
+ // 调用API获取对话框内容并显示
|
|
|
+ this.$api.getVolunteerNotify({}, function (res) {
|
|
|
+ if (res.data.status === 1) {
|
|
|
+ that.modalContent = res.data.introduce;
|
|
|
+ that.modalTitle = res.data.title;
|
|
|
+ that.$refs.popup.open();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }, 200);
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -448,30 +372,33 @@ export default {
|
|
|
|
|
|
submit() {
|
|
|
this.$refs.valiForm.validate(['id'], async (err, valiFormData) => {
|
|
|
- if (!err) {
|
|
|
+ console.log('this.valiFormData.commitment', this.valiFormData.commitment);
|
|
|
+
|
|
|
+ if (this.valiFormData.commitment !== 1) {
|
|
|
+ that.$common.errorToShow('请先阅读并同意本人承诺');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (!err) {
|
|
|
console.log('校验成功');
|
|
|
/* 检验成功 */
|
|
|
const {
|
|
|
- name, gender, birth_date, hukou, location, political_status,
|
|
|
- work_start_date, email, mobile, id_card, work_experience,
|
|
|
- specialties, application_options
|
|
|
+ name, mobile, address, id_card,
|
|
|
+ political_status,
|
|
|
+ unit_name, intro, fullurl,
|
|
|
+ email,
|
|
|
} = this.valiFormData;
|
|
|
- this.$api.applyVolunteer(
|
|
|
+ this.$api.scanApplyVolunteer(
|
|
|
{
|
|
|
main_body_id: 1,
|
|
|
name: name,
|
|
|
- gender: gender,
|
|
|
- birth_date: birth_date,
|
|
|
- hukou: hukou,
|
|
|
- location: location,
|
|
|
- political_status: political_status,
|
|
|
- work_start_date: work_start_date,
|
|
|
- email: email,
|
|
|
mobile: mobile,
|
|
|
+ address: address,
|
|
|
+ unit_name: unit_name,
|
|
|
id_card: id_card,
|
|
|
- work_experience: work_experience,
|
|
|
- specialties: specialties,
|
|
|
- application_options: application_options,
|
|
|
+ intro: intro,
|
|
|
+ file: fullurl,
|
|
|
+ politics_status: political_status,
|
|
|
+ email: email,
|
|
|
region_id: this.region_id,
|
|
|
cr_id: this.cr_id
|
|
|
},
|
|
|
@@ -531,6 +458,9 @@ export default {
|
|
|
/deep/.uni-forms-item__error {
|
|
|
color: red !important;
|
|
|
}
|
|
|
+/deep/ .uni-stat__select {
|
|
|
+ padding: 0!important;
|
|
|
+}
|
|
|
.is-input-border {
|
|
|
background-color: #f7dfc0 !important;
|
|
|
}
|
|
|
@@ -697,8 +627,9 @@ export default {
|
|
|
font-size: 28rpx;
|
|
|
color: #666;
|
|
|
line-height: 44rpx;
|
|
|
- margin-bottom: 20rpx;
|
|
|
+ padding-bottom: 20rpx;
|
|
|
text-indent: 2em;
|
|
|
+ background-color: #fdfaf6;
|
|
|
}
|
|
|
|
|
|
.commitment-agree {
|
|
|
@@ -710,12 +641,21 @@ export default {
|
|
|
/* 对话框样式 */
|
|
|
.modal-container {
|
|
|
width: 80%;
|
|
|
- max-width: 600rpx;
|
|
|
background-color: #ffffff;
|
|
|
border-radius: 12rpx;
|
|
|
overflow: hidden;
|
|
|
+ margin-left: 10%;
|
|
|
}
|
|
|
|
|
|
+
|
|
|
+ .modal-title {
|
|
|
+ display: block;
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 700;
|
|
|
+ color: #444444;
|
|
|
+ text-align: center;
|
|
|
+ padding: 20rpx 0;
|
|
|
+ }
|
|
|
.modal-content {
|
|
|
padding: 30rpx;
|
|
|
max-height: 500rpx;
|
快乐的梦鱼