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.
278 lines
9.5 KiB
278 lines
9.5 KiB
<template> |
|
<view class="page_css"> |
|
<view class="container"> |
|
<betone-header-top :title="title" /> |
|
<u-form labelPosition="left" :model="registerInfo" :rules="rules" ref="registerForm"> |
|
<u-form-item prop="businessName" :border-bottom="false" label-width="0"> |
|
<betone-new-input label="企业名称" v-model="registerInfo.businessName" placeholder="请输入" :isRequire="true" /> |
|
</u-form-item> |
|
<u-form-item prop="area" :border-bottom="false" label-width="0"> |
|
<view @click.stop="addMap()" style="width: 100%;height: 100%;"> |
|
<betone-new-input label="实验室地址" v-model="registerInfo.area" placeholder="请选择" :isRequire="true" |
|
type="select" /> |
|
</view> |
|
</u-form-item> |
|
<u-form-item prop="personName" :border-bottom="false" label-width="0"> |
|
<betone-new-input label="负责人姓名" v-model="registerInfo.personName" placeholder="请输入" :isRequire="true" /> |
|
</u-form-item> |
|
<u-form-item prop="phoneNumber" :border-bottom="false" label-width="0"> |
|
<betone-new-input label="手机号" v-model="registerInfo.phoneNumber" placeholder="请输入" :isRequire="true" /> |
|
</u-form-item> |
|
<u-form-item prop="verificationCode" :border-bottom="false" label-width="0"> |
|
<betone-new-input label="手机验证码" v-model="registerInfo.verificationCode" placeholder="请输入手机6位数验证码" |
|
:isSms="true" @ch="sendCode" :isRequire="true" ref="verificationCode" /> |
|
</u-form-item> |
|
<u-form-item prop="password" :border-bottom="false" label-width="0"> |
|
<betone-new-input label="设置密码" v-model="registerInfo.password" placeholder="请输入8-16位数字与字母的组合" |
|
:isRequire="true" type="password" /> |
|
</u-form-item> |
|
<u-form-item prop="confirmPassword" :border-bottom="false" label-width="0"> |
|
<betone-new-input label="确认密码" v-model="registerInfo.confirmPassword" placeholder="请再次输入密码" :isRequire="true" |
|
type="password" /> |
|
</u-form-item> |
|
|
|
<u-form-item prop="checked" :border-bottom="false"> |
|
<u-checkbox-group style="margin-bottom: 16rpx" shape="square"> |
|
<u-checkbox v-model="registerInfo.checked" key="index" labelSize="24" |
|
name="我已阅读并接受《注册服务协议》及《隐私权政策》">我已阅读并接受《注册服务协议》及《隐私权政策》</u-checkbox> |
|
</u-checkbox-group> |
|
</u-form-item> |
|
</u-form> |
|
<u-button class="item-bottom" type="primary" @click="formSubmit()"> |
|
注册 |
|
</u-button> |
|
</view> |
|
<betone-dialog v-model="mapInfo.showMapSelect" :maskClose="true" :mode="'bottom'"> |
|
<map-Point @commitCheck="commitCheck" :mapKey='mapInfo.mapKey' :Radius='mapInfo.Radius' |
|
:showResetting='mapInfo.showResetting' :listIco='mapInfo.listIco' :orientationIco='mapInfo.orientationIco' |
|
:resettingIco='mapInfo.resettingIco'></map-Point> |
|
</betone-dialog> |
|
<betone-loading ref="BetLoading"></betone-loading> |
|
</view> |
|
</template> |
|
<script> |
|
import addrList from "@/utils/addr.js"; |
|
export default { |
|
data() { |
|
return { |
|
title: "注册", |
|
|
|
registerInfo: { |
|
businessName: "", //企业名称 |
|
area: "", //地区 |
|
personName: "", //负责人姓名 |
|
phoneNumber: "", //手机号 |
|
password: "", //密码 |
|
confirmPassword: "", //确认密码 |
|
verificationCode: "", //验证码 |
|
checked: false, //同意隐私政策 |
|
|
|
}, |
|
rules: { |
|
businessName: { |
|
type: "string", |
|
required: true, |
|
message: "请输入企业名称", |
|
trigger: ["blur", "change"], |
|
}, |
|
area: { |
|
type: "string", |
|
required: true, |
|
message: "请选择实验室位置", |
|
trigger: ["blur", "change"], |
|
}, |
|
personName: { |
|
type: "string", |
|
required: true, |
|
message: "请输入负责人姓名", |
|
trigger: ["blur", "change"], |
|
}, |
|
phoneNumber: [ |
|
{ |
|
type: "string", |
|
required: true, |
|
message: "请输入手机号", |
|
trigger: ["blur", "change"], |
|
}, |
|
{ |
|
validator: (rule, value, callback) => { |
|
return this.$u.test.mobile(value); |
|
}, |
|
message: '请输入正确的手机号', |
|
trigger: ["change", "blur"] |
|
}, |
|
], |
|
password: [ |
|
{ |
|
type: "string", |
|
required: true, |
|
message: "请输入密码", |
|
trigger: ["blur", "change"], |
|
}, |
|
{ |
|
min: 8, |
|
max: 16, |
|
message: '长度在8-16个字符之间' |
|
}, |
|
], |
|
confirmPassword: [ |
|
{ |
|
type: "string", |
|
required: true, |
|
message: "请确认密码", |
|
trigger: ["blur"], |
|
}, |
|
{ |
|
asyncValidator: (rules, value, callback) => { |
|
if (value != this.registerInfo.password) { |
|
callback(new Error('两次密码校验不一致')) |
|
} |
|
callback() |
|
}, |
|
message: '两次密码校验不一致', |
|
trigger: ["blur"] |
|
}, |
|
], |
|
verificationCode: { |
|
type: "string", |
|
required: true, |
|
message: "请输入验证码", |
|
trigger: ["blur", "change"], |
|
}, |
|
}, |
|
showAreaModal: false, |
|
|
|
countryData: [], |
|
childArr: [], // 二级分类数据源 120.439196,36.171428 |
|
mapInfo: { |
|
showMapSelect: false, |
|
mapKey: '58235226b0fab29ed527bac25ec853ae', |
|
address: '', |
|
latitude: '120.439196', |
|
longitude: '36.171428', |
|
listIco: '/uni_modules/map-Point/static/item-inx.png', |
|
orientationIco: '/uni_modules/map-Point/static/map-inx.png', |
|
resettingIco: "/uni_modules/map-Point/static/position.png", |
|
showResetting: true, |
|
Radius: '', |
|
}, |
|
selectMap: {},//选中地点的详细信息 |
|
|
|
}; |
|
}, |
|
onReady() { |
|
this.$refs.registerForm.setRules(this.rules); |
|
}, |
|
mounted() { |
|
this.getAllClassify() |
|
}, |
|
methods: { |
|
// 初始化数据 |
|
getAllClassify() { |
|
let dataLen = addrList.length; |
|
for (let i = 0; i < dataLen; i++) { |
|
// 将数据源中的二级分类 push 进 childArr，作为二级分类的数据源 |
|
this.childArr.push(addrList[i].children); |
|
} |
|
// 一级分类的数据源 |
|
this.countryData = [addrList, this.childArr[0]]; |
|
}, |
|
|
|
formSubmit() { |
|
this.$nextTick(() => { |
|
// uni.navigateTo({ |
|
// url: "/pages/register/registerSuccess?account=" + this.registerInfo.phoneNumber + '&pwd=' + this.registerInfo.password, |
|
// }); |
|
this.$refs.registerForm.validate(valid => { |
|
if (valid) { |
|
if (this.registerInfo.checked.length <= 0) { |
|
uni.$u.toast("请勾选《注册服务协议》及《隐私权政策》"); |
|
return false; |
|
} |
|
this.BetLoading.show(); |
|
let query_ = { |
|
"deptName": this.registerInfo.businessName,//企业名称 |
|
"address": this.registerInfo.area,//详细地址 |
|
"name": this.registerInfo.personName,//负责人姓名 |
|
"phone": this.registerInfo.phoneNumber,//手机号 |
|
"password": this.registerInfo.password,//设置密码 |
|
"addressLon": this.selectMap.location.split(',')[0],//经度 |
|
"addressLat": this.selectMap.location.split(',')[1],//纬度 |
|
"verifyCode": this.registerInfo.verificationCode,//验证码 |
|
} |
|
this.$u.api.registerUser(query_).then(res => { |
|
this.BetLoading.hide(); |
|
if (res.code == 200) { |
|
setTimeout(() => { |
|
uni.navigateTo({ |
|
url: "/pages/register/registerSuccess?account=" + this.registerInfo.phoneNumber + '&pwd=' + this.registerInfo.password, |
|
}); |
|
}, 1000) |
|
} else { |
|
uni.$u.toast(res.msg); |
|
} |
|
}).finally(err => { |
|
this.BetLoading.hide(); |
|
uni.$u.toast(err.data.msg); |
|
}) |
|
} else { |
|
this.BetLoading.hide(); |
|
console.log('验证失败'); |
|
} |
|
}); |
|
}) |
|
|
|
|
|
}, |
|
// 发送验证码 |
|
sendCode() { |
|
if (this.registerInfo.phoneNumber == '') { |
|
uni.$u.toast("请先输入手机号"); |
|
return false; |
|
} |
|
let query = { |
|
phone: this.registerInfo.phoneNumber |
|
} |
|
this.$u.api.sendVerify(query).then(res => { |
|
if (res.code == 200) { |
|
this.$refs.verificationCode.sendSuceess() |
|
} |
|
}) |
|
|
|
}, |
|
// 打开地图选择框 |
|
addMap() { |
|
this.mapInfo.showMapSelect = true |
|
}, |
|
commitCheck(e) { |
|
if (e) { |
|
this.selectMap = e |
|
console.log('选中地点', e) |
|
uni.$emit('commitCheck', e); |
|
this.registerInfo.area =e.province+e.city+e.district+e.address |
|
} |
|
this.mapInfo.showMapSelect = false |
|
} |
|
|
|
}, |
|
}; |
|
</script> |
|
<style lang="scss" scoped> |
|
.page_css { |
|
width: 100%; |
|
min-height: 100%; |
|
padding-top: var(--status-bar-height); |
|
|
|
.container { |
|
padding: 32rpx 64rpx 32rpx 64rpx; |
|
} |
|
|
|
/deep/.u-form-item__body { |
|
padding-bottom: 0 !important; |
|
} |
|
|
|
/deep/.u-form-item__body__right__message { |
|
margin-left: 0 !important; |
|
} |
|
} |
|
</style> |