<template>
|
<view>
|
<view class="block__title">基本信息</view>
|
<view class="cu-form-group">
|
<view class="title">姓名</view>
|
<input v-model="name" placeholder="必填,请输入成员名称"></input>
|
</view>
|
<view class="cu-form-group">
|
<view class="title">身份证</view>
|
<input v-model="idCard" placeholder="选填,请输入身份证"></input>
|
</view>
|
<view class="cu-form-group">
|
<view class="title">性别</view>
|
<picker bindchange="PickerChange" :value="index" :range="sexArr" @change="sexChange">
|
<view class="picker">
|
{{sex == '0'? '男':'女'}}
|
</view>
|
</picker>
|
</view>
|
<view class="cu-form-group">
|
<view class="title">人员角色</view>
|
<picker :value="typeCdIndex" :range="typeCds" range-key="name" @change="_changeTypeCd">
|
<view class="picker">
|
{{typeCds[typeCdIndex].name}}
|
</view>
|
</picker>
|
</view>
|
<view class="cu-form-group">
|
<view class="title">地址</view>
|
<input type="text" v-model="address" placeholder="选填,请输入地址"></input>
|
</view>
|
<view class="cu-form-group">
|
<view class="title">手机号</view>
|
<input v-model="link" placeholder="必填,请输入手机号"></input>
|
</view>
|
|
<view class="block__title">相关图片</view>
|
<uploadImageAsync ref="vcUploadRef" :communityId="communityId" :maxPhotoNum="uploadImage.maxPhotoNum"
|
:canEdit="uploadImage.canEdit" :title="uploadImage.imgTitle" @sendImagesData="sendImagesData">
|
</uploadImageAsync>
|
|
|
<!-- <view class="cu-form-group margin-top">
|
<textarea v-model="remark" placeholder="请输入备注"></textarea>
|
</view> -->
|
|
<view class="flex flex-direction margin-top margin-bottom">
|
<button class="cu-btn bg-green margin-tb-sm lg" @click="submitOwnerMember()">提交</button>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
// pages/enterCommunity/enterCommunity.js
|
import context from '../../lib/java110/Java110Context.js';
|
import {
|
isIDCard,
|
checkPhoneNumber,
|
idCardInfoExt
|
} from '../../lib/java110/utils/StringUtil.js';
|
import uploadImageAsync from "../../components/vc-upload-async/vc-upload-async.vue";
|
import {
|
sendMsgCode
|
} from '../../api/user/userApi.js';
|
const constant = context.constant;
|
const factory = context.factory;
|
|
export default {
|
data() {
|
return {
|
"sexArr": ["男", "女"],
|
"sexShow": false,
|
"sex": "0",
|
"name": "",
|
"link": "",
|
"remark": "",
|
"ownerId": "",
|
"userId": "",
|
"typeCds": [{
|
value: '3',
|
name: '家庭成员'
|
},
|
{
|
value: '2',
|
name: '租客'
|
},
|
{
|
value: '4',
|
name: '公司员工'
|
},
|
{
|
value: '99',
|
name: '其他'
|
}
|
],
|
"typeCdIndex": 0,
|
"personRole": '3',
|
"ownerTypeCd": "1002",
|
"idCard": "",
|
"memberId": "-1",
|
"communityId": "",
|
"second": 60,
|
"btnDisabled": false,
|
"btnValue": "验证码",
|
"msgCode": '',
|
"address": "",
|
photos: '',
|
uploadImage: {
|
maxPhotoNum: 1,
|
imgTitle: '图片上传',
|
canEdit: true
|
}
|
};
|
},
|
|
components: {
|
uploadImageAsync
|
},
|
|
/**
|
* 生命周期函数--监听页面加载
|
*/
|
onLoad: function(options) {
|
let _that = this;
|
context.onLoad(options);
|
context.getOwner(function(_owner) {
|
_that.ownerId = _owner.ownerId;
|
_that.communityId = _owner.communityId;
|
});
|
},
|
/**
|
* 页面相关事件处理函数--监听用户下拉动作
|
*/
|
onPullDownRefresh: function() {},
|
methods: {
|
sendImagesData: function(e) {
|
this.photos = e[0].url;
|
},
|
submitOwnerMember: function(e) {
|
let obj = {
|
"sex": this.sex,
|
"name": this.name,
|
"link": this.link,
|
"remark": this.remark,
|
"ownerId": this.ownerId,
|
"userId": this.userId,
|
"ownerTypeCd": this.ownerTypeCd,
|
"age": this.age,
|
"memberId": this.memberId,
|
"communityId": this.communityId,
|
"idCard": this.idCard,
|
"personRole": this.personRole,
|
"personType": 'P',
|
"address": this.address,
|
"ownerPhotoUrl": this.photos
|
}
|
|
let msg = "";
|
if (obj.ownerId == "") {
|
msg = "请填写业主";
|
} else if (obj.name == "") {
|
msg = "请填写姓名";
|
} else if (obj.link == "") {
|
msg = "请填写手机号";
|
} else if (!this.validatePhoneNumber(obj.link)) { // 添加手机号格式校验
|
msg = "手机号格式不正确";
|
}
|
// todo 这里手机号关闭 因为 小朋友没有手机号
|
//else if (obj.msgCode == "") {
|
// msg = "请填写验证码";
|
// }
|
if (msg != "") {
|
uni.showToast({
|
title: msg,
|
icon: 'none',
|
duration: 2000
|
});
|
} else {
|
uni.showLoading({
|
title: '提交中',
|
});
|
context.request({
|
url: constant.url.saveOwner,
|
header: context.getHeaders(),
|
method: "POST",
|
data: obj,
|
success: function(res) {
|
if (res.data.code == 0) {
|
uni.hideLoading();
|
uni.navigateBack();
|
return;
|
}
|
|
uni.hideLoading();
|
uni.showToast({
|
title: res.data.msg,
|
icon: 'none',
|
duration: 2000
|
});
|
},
|
fail: function(e) {
|
uni.hideLoading();
|
uni.showToast({
|
title: "服务器异常了",
|
icon: 'none',
|
duration: 2000
|
})
|
}
|
});
|
}
|
},
|
// 新增手机号格式校验的方法
|
validatePhoneNumber(phone) {
|
const phoneRegex = /^1[3-9]\d{9}$/; // 中国手机号的正则表达式
|
return phoneRegex.test(phone); // 检查手机号是否符合格式
|
},
|
_changeTypeCd: function(e) {
|
this.typeCdIndex = e.detail.value;
|
this.personRole = this.typeCds[this.typeCdIndex].value;
|
},
|
idCardChange: function() {
|
let idCard = this.idCard;
|
if (!isIDCard(idCard)) {
|
uni.showToast({
|
title: '身份证号有误',
|
icon: 'none',
|
});
|
return;
|
}
|
this.sex = idCardInfoExt(idCard, 2);
|
this.age = idCardInfoExt(idCard, 3);
|
},
|
sexChange: function(e) {
|
this.sex = e.detail.value;
|
},
|
_sendMsgCode: function() {
|
sendMsgCode(this.link, this);
|
},
|
|
}
|
};
|
</script>
|
<style>
|
.block__title {
|
margin: 0;
|
font-weight: 400;
|
font-size: 14px;
|
color: rgba(69, 90, 100, .6);
|
padding: 40rpx 30rpx 20rpx;
|
}
|
|
.button_up_blank {
|
height: 40rpx;
|
}
|
</style>
|
