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.
229 lines
7.5 KiB
229 lines
7.5 KiB
1 year ago
|
<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 label="" prop="businessName" ref="item1" :border-bottom="false">
|
||
|
|
<betone-new-input label="企业名称" v-model="registerInfo.businessName" placeholder="请输入" :isRequire="true" />
|
||
|
|
</u-form-item>
|
||
|
|
<!-- <u-form-item label="" prop="area" ref="item1" :border-bottom="false">
|
||
|
|
<betone-input-picker :label="'地区'" :isRequire="true" :pickerData="countryData" :mode="'multiSelector'" :keyName="'label'" @changeSelect="changeSelect" v-model="registerInfo.area"></betone-input-picker>
|
||
|
|
</u-form-item> -->
|
||
|
|
<u-form-item label="" prop="area" ref="item1" :border-bottom="false" @click="addMap()">
|
||
|
|
<betone-new-input label="实验室地址" v-model="registerInfo.businessName" placeholder="请选择" :isRequire="true"
|
||
|
|
:disabled="true" />
|
||
|
|
</u-form-item>
|
||
|
|
<u-form-item label="" prop="personName" ref="item1" :border-bottom="false">
|
||
|
|
<betone-new-input label="负责人姓名" v-model="registerInfo.personName" placeholder="请输入" :isRequire="true" />
|
||
|
|
</u-form-item>
|
||
|
|
<u-form-item label="" prop="phoneNumber" ref="item1" :border-bottom="false">
|
||
|
|
<betone-new-input label="手机号" v-model="registerInfo.phoneNumber" placeholder="请输入" :isRequire="true" />
|
||
|
|
</u-form-item>
|
||
|
|
<u-form-item label="" prop="password" ref="item1" :border-bottom="false">
|
||
|
|
<betone-new-input label="设置密码" v-model="registerInfo.password" placeholder="请输入8-16位数字与字母的组合"
|
||
|
|
:isRequire="true" type="password" />
|
||
|
|
</u-form-item>
|
||
|
|
<u-form-item label="" prop="confirmPassword" ref="item1" :border-bottom="false">
|
||
|
|
<betone-new-input label="确认密码" v-model="registerInfo.confirmPassword" placeholder="请再次输入密码" :isRequire="true"
|
||
|
|
type="password" />
|
||
|
|
</u-form-item>
|
||
|
|
<u-form-item label="" prop="verificationCode" ref="item1" :border-bottom="false">
|
||
|
|
<betone-new-input label="手机验证码" v-model="registerInfo.verificationCode" placeholder="请输入手机6位数验证码"
|
||
|
|
:isSms="true" @ch="sendCode" :isRequire="true" />
|
||
|
|
</u-form-item>
|
||
|
|
<u-form-item label="" 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="12"
|
||
|
|
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="showSelect" :maskClose="true">
|
||
|
|
|
||
|
|
</betone-dialog> -->
|
||
|
|
<view v-if="showMap">
|
||
|
|
<selectLoc :showMap="showMap" @close="closeLoc" @confirm="confirmLoc"></selectLoc>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import addrList from "@/utils/addr.js";
|
||
|
|
import selectLoc from './selectLoc/selectLoc.vue'
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
selectLoc
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
title: "注册",
|
||
|
|
showSelect: true,
|
||
|
|
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"],
|
||
|
|
},
|
||
|
|
password: {
|
||
|
|
type: "string",
|
||
|
|
required: true,
|
||
|
|
message: "请输入密码",
|
||
|
|
trigger: ["blur", "change"],
|
||
|
|
},
|
||
|
|
confirmPassword: {
|
||
|
|
type: "string",
|
||
|
|
required: true,
|
||
|
|
message: "请确认密码",
|
||
|
|
trigger: ["blur", "change"],
|
||
|
|
},
|
||
|
|
verificationCode: {
|
||
|
|
type: "string",
|
||
|
|
required: true,
|
||
|
|
message: "请输入验证码",
|
||
|
|
trigger: ["blur", "change"],
|
||
|
|
},
|
||
|
|
},
|
||
|
|
showAreaModal: false,
|
||
|
|
|
||
|
|
countryData: [],
|
||
|
|
childArr: [], // 二级分类数据源
|
||
|
|
|
||
|
|
title: '点击选择位置',
|
||
|
|
showMap: true,
|
||
|
|
lat: '',
|
||
|
|
lng: '',
|
||
|
|
prov: '',
|
||
|
|
city: '',
|
||
|
|
area: '',
|
||
|
|
address: ''
|
||
|
|
};
|
||
|
|
},
|
||
|
|
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]];
|
||
|
|
},
|
||
|
|
changeSelect(country) {
|
||
|
|
|
||
|
|
var province = {}
|
||
|
|
var area = {}
|
||
|
|
// 不操作列行
|
||
|
|
if (!!country) {
|
||
|
|
province = this.countryData[0][0]
|
||
|
|
area = province.children[0]
|
||
|
|
}
|
||
|
|
// 操作第一列
|
||
|
|
if (country.length == 1) {
|
||
|
|
province = this.countryData[0][country[0]]
|
||
|
|
area = province.children[0]
|
||
|
|
}
|
||
|
|
if (country.length == 2) {
|
||
|
|
province = this.countryData[0][country[0]]
|
||
|
|
area = province.children[country[0]]
|
||
|
|
|
||
|
|
}
|
||
|
|
this.registerInfo.area = province.label + "," + area.label;
|
||
|
|
console.log(this.registerInfo.area, province, area, country)
|
||
|
|
},
|
||
|
|
formSubmit() {
|
||
|
|
console.log("form表单的提交", this.registerInfo);
|
||
|
|
uni.navigateTo({
|
||
|
|
url: "/pages/register/registerSuccess",
|
||
|
|
});
|
||
|
|
this.$refs.registerForm
|
||
|
|
.validate()
|
||
|
|
.then((res) => {
|
||
|
|
if (this.registerInfo.checked.length <= 0) {
|
||
|
|
uni.$u.toast("请勾选《注册服务协议》及《隐私权政策》");
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
uni.$u.toast("校验通过");
|
||
|
|
})
|
||
|
|
.catch((errors) => {
|
||
|
|
uni.$u.toast("校验失败");
|
||
|
|
});
|
||
|
|
},
|
||
|
|
// 发送验证码
|
||
|
|
sendCode() {
|
||
|
|
setTimeout(() => {
|
||
|
|
// this.isCanSms = true;
|
||
|
|
uni.$u.toast("发送成功");
|
||
|
|
}, 1500);
|
||
|
|
},
|
||
|
|
|
||
|
|
confirmLoc(res) {
|
||
|
|
this.showMap = false;
|
||
|
|
this.lat = res.lat;
|
||
|
|
this.lng = res.lng;
|
||
|
|
this.prov = res.province;
|
||
|
|
this.city = res.city;
|
||
|
|
this.area = res.area;
|
||
|
|
this.address = res.district;
|
||
|
|
console.log('选择的信息', res);
|
||
|
|
},
|
||
|
|
closeLoc() {
|
||
|
|
this.showMap = false;
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.page_css {
|
||
|
|
width: 100%;
|
||
|
|
min-height: 100%;
|
||
|
|
|
||
|
|
.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>
|