<template>
|
<view class="page-content">
|
<view class="top-box">
|
<view class="form">
|
<view class="form-item">
|
<text class="label require">姓名</text>
|
<input type="text" placeholder="请输入" v-model="form.companyUser"/>
|
</view>
|
<view class="form-item">
|
<text class="label require">手机号</text>
|
<input type="number" placeholder="请输入" v-model="form.companyPhone"/>
|
</view>
|
<view class="form-item">
|
<text class="label require">验证码</text>
|
<input type="text" placeholder="请输入" v-model="form.code"/>
|
<text @click="getCode">{{tips}}</text>
|
</view>
|
</view>
|
</view>
|
<view class="top-box" style="margin-top: 20rpx;">
|
<view class="form">
|
<view class="form-item">
|
<text class="label require">企业名称</text>
|
<input type="text" placeholder="请输入" v-model="form.companyName"/>
|
</view>
|
<view class="form-item">
|
<text class="label require">统一社会信用代码</text>
|
<input type="text" placeholder="请输入" v-model="form.companyCode"/>
|
</view>
|
<view class="form-item">
|
<text class="label require">企业地址</text>
|
<input type="text" placeholder="请输入" v-model="form.companyAddress"/>
|
</view>
|
<view class="form-item">
|
<text class="label require">营业执照</text>
|
|
</view>
|
|
</view>
|
<view style="text-align: center;" @click="startUpload">
|
<img src="/static/i07.png" v-if="!form.companyImg" alt="" class="sc" />
|
<image :src="config + form.companyImg" mode="aspectFit" class="sc border" v-else></image>
|
</view>
|
|
</view>
|
<!-- <view class="form">
|
<view class="form-item">
|
<text class="label require">姓名</text>
|
<input type="text" placeholder="请输入" v-model="form.companyUser"/>
|
</view>
|
<view class="form-item">
|
<text class="label">手机号</text>
|
<input type="number" placeholder="请输入" v-model="form.companyPhone"/>
|
</view>
|
<view class="form-item">
|
<text class="label">验证码</text>
|
<input type="text" placeholder="请输入" v-model="form.code"/>
|
</view>
|
<view class="form-item">
|
<text class="label">企业名称</text>
|
<input type="text" placeholder="请输入" v-model="form.companyName"/>
|
</view>
|
<view class="form-item">
|
<text class="label">社会统一信用代码</text>
|
<input type="text" placeholder="请输入" v-model="form.companyCode"/>
|
</view>
|
<view class="form-item">
|
<text class="label">营业执照</text>
|
<input type="text" placeholder="请输入" v-model="form.companyImg"/>
|
</view>
|
<view class="form-item">
|
<text class="label">企业地址</text>
|
<input type="text" placeholder="请输入" v-model="form.companyAddress"/>
|
</view>
|
</view> -->
|
<view class="bottom">
|
<view @click="register" class="button">
|
注册
|
</view>
|
</view>
|
|
</view>
|
</template>
|
|
<script>
|
import { registerCompany, checkCode, getNewVerify } from '@/api/auth.js'
|
import { upload } from '@/common/upload'
|
import { config } from '@/common/config.js'
|
export default {
|
data() {
|
return {
|
form: {
|
companyImg: ''
|
},
|
config: config.baseUrl,
|
isSendCode: false,
|
countdownTime: 20,
|
timer: null,
|
tips: '获取验证码',
|
}
|
},
|
methods: {
|
startCountdown() {
|
if(this.timer) {
|
clearTimeout(this.timer)
|
this.timer = null
|
}
|
if(this.countdownTime <= 0) {
|
this.tips = "重新获取"
|
this.isSendCode = false
|
this.countdownTime = 20
|
return
|
}
|
this.timer = setTimeout(() => {
|
this.countdownTime--
|
this.tips = `${this.countdownTime}s后重新获取`
|
this.startCountdown()
|
}, 1000)
|
},
|
getCode() {
|
if(!this.form.companyPhone){
|
uni.showToast({
|
title: '请输入手机号',
|
icon: 'none'
|
})
|
return
|
}
|
if(!this.$u.test.mobile(this.form.companyPhone)){
|
uni.showToast({
|
title: '请输入正确的手机号',
|
icon: 'none'
|
})
|
return
|
}
|
if (!this.isSendCode) {
|
this.isSendCode = true
|
uni.showLoading({
|
title: '正在获取验证码'
|
})
|
getNewVerify({phone: this.form.companyPhone }).then(val => {
|
if(val.data.code == 200) {
|
this.startCountdown()
|
uni.hideLoading();
|
this.tips = `${this.countdownTime}s后重新获取`
|
uni.$u.toast('验证码已发送');
|
}
|
})
|
} else {
|
uni.$u.toast('倒计时结束后再发送');
|
}
|
},
|
uploadImage(file) {
|
upload(file).then(val => {
|
// console.log(val.fileName)
|
this.form.companyImg = val.fileName
|
})
|
},
|
// 图片上传接口
|
startUpload() {
|
uni.chooseImage({
|
count: 1,
|
success: val => {
|
// console.log(val.tempFilePaths[0])
|
this.uploadImage(val.tempFilePaths[0])
|
}
|
})
|
},
|
// 校验字段
|
authField(){
|
if(!this.form.companyUser) {
|
return '请输入姓名'
|
}
|
if(!this.form.companyPhone) {
|
return '请输入手机号'
|
}
|
if(!this.form.code){
|
return '请输入验证码'
|
}
|
if(!this.form.companyName) {
|
return "请输入企业名称"
|
}
|
if(!this.form.companyCode){
|
return '请输入统一社会信用代码'
|
}
|
if(!this.form.companyAddress){
|
return "请输入企业地址"
|
}
|
if(!this.form.companyImg || !this.form.companyImg.length){
|
return '请上传营业执照'
|
}
|
return false
|
},
|
// 校验code
|
async checkCode() {
|
try {
|
const { data } = await checkCode({ code: this.form.code, phone: this.form.companyPhone, userType: '02' })
|
console.log(data.data)
|
if(data.code == 200 && data.data != false) {
|
return Promise.resolve()
|
} else {
|
uni.showToast({
|
title: '验证码错误',
|
icon: 'none'
|
})
|
throw "校验失败"
|
return Promise.refject()
|
}
|
}catch(err){
|
throw "校验失败"
|
}
|
},
|
|
// 注册接口
|
async register(){
|
try{
|
const value = this.authField()
|
if(value){
|
uni.showToast({
|
title: value,
|
icon: 'none'
|
})
|
return
|
}
|
await this.checkCode()
|
// this.form.companyStatus = 1
|
registerCompany(this.form).then(val=>{
|
if(val.data.code == 200) {
|
uni.showToast({
|
title: '注册成功',
|
icon: 'none'
|
})
|
setTimeout(() => {
|
uni.navigateBack()
|
}, 500)
|
}
|
})
|
}catch(err) {
|
console.log('审核不通过')
|
}
|
}
|
}
|
}
|
</script>
|
<style>
|
page{
|
background-color: #F4F4F4;
|
}
|
</style>
|
<style scoped lang="scss">
|
.page-content{
|
padding: 32rpx;
|
}
|
.form{
|
padding: 24rpx;
|
.form-item{
|
margin-top: 20rpx;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
padding-bottom: 20rpx;
|
border-bottom: 1px solid #F1F1F1;
|
input{
|
text-align: right;
|
font-size: 26rpx;
|
}
|
.label{
|
font-size: 26rpx;
|
|
}
|
.require{
|
color: #4A4E60;
|
position: relative;
|
&::after{
|
content: '*';
|
color: #FF7500;
|
position: absolute;
|
top: 0rpx;
|
}
|
}
|
}
|
.form-item:last-child{
|
padding-bottom: 0;
|
border-bottom: none;
|
}
|
.form-item:first-child{
|
margin-top: 0;
|
}
|
}
|
|
.top-box{
|
background: #fff;
|
border-radius: 5px;
|
}
|
.bottom{
|
position: fixed;
|
bottom: 0;
|
width: 100%;
|
background: #fff;
|
height: 132rpx;
|
left: 0;
|
display: flex;
|
align-items: center;
|
.button{
|
margin: 0 32rpx;
|
height: 88rpx;
|
border-radius: 20rpx;
|
border: 1px solid #1171E0;
|
background: #1171E0;
|
color: #fff;
|
line-height: 88rpx;
|
width: 100%;
|
text-align: center;
|
font-size: 32rpx;
|
}
|
}
|
.sc{
|
width: 90%;
|
height: 346rpx;
|
margin-bottom: 20rpx;
|
border-radius: 20rpx;
|
|
}
|
.border{
|
border: 2rpx solid #efefef;
|
}
|
</style>
|