实验室运维app端
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.
 
 
 
 

239 lines
7.7 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" ref="item1" :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" ref="item1" :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" ref="item1" :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" ref="item1" :border-bottom="false" label-width="0">
<betone-new-input label="手机号" v-model="registerInfo.phoneNumber" placeholder="请输入" :isRequire="true" />
</u-form-item>
<u-form-item prop="password" ref="item1" :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" ref="item1" :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="verificationCode" ref="item1" :border-bottom="false" label-width="0">
<betone-new-input label="手机验证码" v-model="registerInfo.verificationCode" placeholder="请输入手机6位数验证码"
:isSms="true" @ch="sendCode" :isRequire="true" />
</u-form-item>
<u-form-item prop="checked" ref="item1" :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>
</view>
</template>
<script>
import addrList from "@/utils/addr.js";
export default {
components: {
},
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('两次密码校验不一致'))
}
},
message: '两次密码校验不一致',
trigger: ["blur"]
},
],
verificationCode: {
type: "string",
required: true,
message: "请输入验证码",
trigger: ["blur", "change"],
},
},
showAreaModal: false,
countryData: [],
childArr: [], // 二级分类数据源
mapInfo: {
showMapSelect: false,
mapKey: '58235226b0fab29ed527bac25ec853ae',
address: '',
latitude: '',
longitude: '',
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: '',
}
};
},
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() {
// uni.navigateTo({
// url: "/pages/register/registerSuccess",
// });
this.$refs.registerForm.validate(valid => {
if (valid) {
if (this.registerInfo.checked.length <= 0) {
uni.$u.toast("请勾选《注册服务协议》及《隐私权政策》");
return false;
}
console.log('验证通过');
} else {
console.log('验证失败');
}
});
},
// 发送验证码
sendCode() {
setTimeout(() => {
// this.isCanSms = true;
uni.$u.toast("发送成功");
}, 1500);
},
// 打开地图选择框
addMap() {
this.mapInfo.showMapSelect = true
},
commitCheck(e) {
if (e) {
uni.$emit('commitCheck', e);
this.registerInfo.area = e.name
}
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>