mkm/OfficeApp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增手机号验证,身份证验证,修复bug,优化选择逻辑

Browse Source
This commit is contained in:
weipengfei 2023-07-28 09:47:00 +08:00
parent 7461e66fd7
commit fbd6636387
1 changed files with 86 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

137
subpkg/newPersonnel/newPersonnel.vue
View File

@ -34,49 +34,53 @@
</u-form-item> --> </u-form-item> -->
<view class="title">地区信息</view> <view class="title">地区信息</view>
<u-form-item label="省" required prop="province" @click="changeCity('province')" borderBottom> <u-form-item label="省" required prop="province" @click="changeCity('province')" borderBottom>
<u--input :value="formDataText.province" placeholder="请选择省"></u--input> <u--input :value="formDataText.province" disabled disabledColor="#fff" placeholder="请选择省"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon> <u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="市" required prop="city" @click="changeCity('city')" borderBottom> <u-form-item label="市" required prop="city" @click="changeCity('city')" borderBottom>
<u--input :value="formDataText.city" placeholder="请选择市"></u--input> <u--input :value="formDataText.city" disabled disabledColor="#fff" placeholder="请选择市"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon> <u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="区县" required prop="area" @click="changeCity('area')" borderBottom> <u-form-item label="区县" required prop="area" @click="changeCity('area')" borderBottom>
<u--input :value="formDataText.area" placeholder="请选择区县"></u--input> <u--input :value="formDataText.area" disabled disabledColor="#fff" placeholder="请选择区县"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon> <u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="镇" required prop="street" @click="changeCity('street')" borderBottom> <u-form-item label="镇" required prop="street" @click="changeCity('street')" borderBottom>
<u--input :value="formDataText.street" placeholder="请选择镇"></u--input> <u--input :value="formDataText.street" disabled disabledColor="#fff" placeholder="请选择镇"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon> <u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="村" required prop="village" @click="changeCity('village')" borderBottom> <u-form-item label="村" required prop="village" @click="changeCity('village')" borderBottom>
<u--input :value="formDataText.village" placeholder="请选择村"></u--input> <u--input :value="formDataText.village" disabled disabledColor="#fff" placeholder="请选择村"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon> <u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item> </u-form-item>
<u-form-item label="小队" required prop="brigade" @click="changeCity('brigade')" borderBottom> <u-form-item label="小队" required prop="brigade" @click="changeCity('brigade')" borderBottom>
<u--input :value="formDataText.brigade" placeholder="请选择小队"></u--input> <u--input :value="formDataText.brigade" disabled disabledColor="#fff" placeholder="请选择小队"></u--input>
<u-icon slot="right" name="arrow-right"></u-icon> <u-icon slot="right" name="arrow-right"></u-icon>
</u-form-item> </u-form-item>
<view class="title">资质信息</view> <view class="title">资质信息</view>
<u-form-item label="身份证正面" required labelPosition="top" labelWidth="200rpx" prop="qualification.id_card" borderBottom> <u-form-item label="身份证正面" required labelPosition="top" labelWidth="200rpx" prop="qualification.id_card"
borderBottom>
<u-upload :fileList="formData.qualification.id_card?[{url:formData.qualification.id_card}]:[]" <u-upload :fileList="formData.qualification.id_card?[{url:formData.qualification.id_card}]:[]"
@afterRead="afterRead" @delete="formData.qualification.id_card=''" name="id_card" :maxCount="1" @afterRead="afterRead" @delete="formData.qualification.id_card=''" name="id_card" :maxCount="1"
width="638rpx" height="300rpx" style="margin-top: 10rpx;"> width="638rpx" height="300rpx" style="margin-top: 10rpx;">
</u-upload> </u-upload>
</u-form-item> </u-form-item>
<u-form-item label="身份证反面" required labelPosition="top" labelWidth="200rpx" prop="qualification.id_card_b" borderBottom> <u-form-item label="身份证反面" required labelPosition="top" labelWidth="200rpx" prop="qualification.id_card_b"
borderBottom>
<u-upload :fileList="formData.qualification.id_card_b?[{url:formData.qualification.id_card_b}]:[]" <u-upload :fileList="formData.qualification.id_card_b?[{url:formData.qualification.id_card_b}]:[]"
@afterRead="afterRead" @delete="formData.qualification.id_card_b=''" name="id_card_b" :maxCount="1" @afterRead="afterRead" @delete="formData.qualification.id_card_b=''" name="id_card_b" :maxCount="1"
width="638rpx" height="300rpx" style="margin-top: 10rpx;"> width="638rpx" height="300rpx" style="margin-top: 10rpx;">
</u-upload> </u-upload>
</u-form-item> </u-form-item>
<u-form-item label="驾驶证正面" required labelPosition="top" labelWidth="200rpx" prop="qualification.car_card" borderBottom> <u-form-item label="驾驶证正面" required labelPosition="top" labelWidth="200rpx" prop="qualification.car_card"
borderBottom>
<u-upload :fileList="formData.qualification.car_card?[{url:formData.qualification.car_card}]:[]" <u-upload :fileList="formData.qualification.car_card?[{url:formData.qualification.car_card}]:[]"
@afterRead="afterRead" @delete="formData.qualification.car_card=''" name="car_card" :maxCount="1" @afterRead="afterRead" @delete="formData.qualification.car_card=''" name="car_card" :maxCount="1"
width="638rpx" height="300rpx" style="margin-top: 10rpx;"> width="638rpx" height="300rpx" style="margin-top: 10rpx;">
</u-upload> </u-upload>
</u-form-item> </u-form-item>
<u-form-item label="驾驶证反面" required labelPosition="top" labelWidth="200rpx" prop="qualification.car_card_b" borderBottom> <u-form-item label="驾驶证反面" required labelPosition="top" labelWidth="200rpx" prop="qualification.car_card_b"
borderBottom>
<u-upload :fileList="formData.qualification.car_card_b?[{url:formData.qualification.car_card_b}]:[]" <u-upload :fileList="formData.qualification.car_card_b?[{url:formData.qualification.car_card_b}]:[]"
@afterRead="afterRead" @delete="formData.qualification.car_card_b=''" name="car_card_b" :maxCount="1" @afterRead="afterRead" @delete="formData.qualification.car_card_b=''" name="car_card_b" :maxCount="1"
width="638rpx" height="300rpx" style="margin-top: 10rpx;"> width="638rpx" height="300rpx" style="margin-top: 10rpx;">
@ -148,107 +152,102 @@
}, },
rules: { rules: {
account: { account: {
type: 'string',
required: true, required: true,
message: '不能为空', pattern: /^(1[3456789]\d{9})$/,
trigger: ['blur'] message: '请输入正确的手机号码',
trigger: ['change', 'blur']
}, },
id_card: { id_card: {
type: 'string',
required: true, required: true,
message: '不能为空', pattern: /^\d{17}[\dX]$|^\d{15}[\dX]$/,
trigger: ['blur'] message: '请输入正确的身份证号',
trigger: ['change', 'blur']
}, },
sex: { sex: {
type: 'string', type: 'number',
max: 1, max: 1,
required: true, required: true,
message: '请选择男或女', message: '请选择男或女',
trigger: ['blur','change'] trigger: ['blur', 'change']
}, },
avatar: { avatar: {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '头像不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
name: { name: {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '姓名不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
province: { province: {
type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
city: { city: {
type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
area: { area: {
type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
street: { street: {
type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
village: { village: {
type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
brigade: { brigade: {
type: 'string', type: 'any',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
'qualification.id_card': { 'qualification.id_card': {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
'qualification.id_card_b': { 'qualification.id_card_b': {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
'qualification.car_card': { 'qualification.car_card': {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
'qualification.car_card_b': { 'qualification.car_card_b': {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
'qualification.bank_account': { 'qualification.bank_account': {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
'qualification.bank_account_b': { 'qualification.bank_account_b': {
type: 'string', type: 'string',
required: true, required: true,
message: '不能为空', message: '不能为空',
trigger: ['blur'] trigger: ['change', 'blur']
}, },
}, },
provinceList: [], provinceList: [],
@ -263,6 +262,10 @@
onLoad() { onLoad() {
this.initProvinceAndCity() this.initProvinceAndCity()
}, },
onReady() {
//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
this.$refs.uForm.setRules(this.rules)
},
onShow() {}, onShow() {},
methods: { methods: {
async initProvinceAndCity() { async initProvinceAndCity() {
@ -294,6 +297,7 @@
}, },
// 选择城市 // 选择城市
changeCity(type) { changeCity(type) {
if (this[type + 'List'].length == 0) return Toast('请先选择上一级地区');
this.changeType = type; this.changeType = type;
this.showProvince = true; this.showProvince = true;
}, },
@ -304,13 +308,14 @@
// 选中城市 // 选中城市
confirm(e) { confirm(e) {
if (this.changeType == 'brigade') { if (this.changeType == 'brigade') {
this.formData[this.changeType] = e.value[0].id; this.formData.brigade = e.value[0].id;
this.formDataText[this.changeType] = e.value[0].brigade_name; this.formDataText.brigade = e.value[0].brigade_name;
this.showProvince = false; this.showProvince = false;
return; return ;
} }
this.formData[this.changeType] = e.value[0][this.changeType + '_code']; this.formData[this.changeType] = e.value[0][this.changeType + '_code'];
this.formDataText[this.changeType] = e.value[0][this.changeType + '_name']; this.formDataText[this.changeType] = e.value[0][this.changeType + '_name'];
// 加载下一级城市信息
switch (this.changeType) { switch (this.changeType) {
case 'province': case 'province':
this.loadCity(this.formData['province']); this.loadCity(this.formData['province']);
@ -328,6 +333,24 @@
this.loadBrigade(this.formData['village']); this.loadBrigade(this.formData['village']);
break; break;
} }
// 清空之前所选信息
switch (this.changeType) {
case 'province':
this.formData.city = '';
this.formDataText.city = ''
case 'city':
this.formData.area = '';
this.formDataText.area = ''
case 'area':
this.formData.street = '';
this.formDataText.street = ''
case 'street':
this.formData.village = '';
this.formDataText.village = ''
case 'village':
this.formData.brigade = '';
this.formDataText.brigade = ''
}
this.showProvince = false; this.showProvince = false;
}, },
loadCity(code) { loadCity(code) {
@ -390,9 +413,16 @@
// 创建账号 // 创建账号
addAcountNum() { addAcountNum() {
this.$refs.uForm.validate().then(async (e) => { this.$refs.uForm.validate().then(async (e) => {
console.log(e); if(e){
// let res = await loginAdd(this.formData); let res = await loginAdd(this.formData);
// Toast('添加成功') uni.showToast({
icon:"none",
title:"添加成功",
success: () => {
uni.navigateBack()
}
})
}
}) })
}, },
@ -454,11 +484,16 @@
} }
} }
.card_img { .btn{
width: 600rpx; margin-top: 32rpx;
height: 300rpx; // margin-bottom: 40rpx;
background-color: #efefef; width: 100%;
border-radius: 14rpx; height: 84rpx;
background: $theme-oa-color;
border-radius: 42rpx 42rpx 42rpx 42rpx;
color: #fff;
line-height: 80rpx;
text-align: center;
} }
} }
</style> </style>