| | |
| | | <view class="form"> |
| | | <view class="form-item"> |
| | | <text class="label require">姓名</text> |
| | | <input type="text" placeholder="请输入"/> |
| | | <input type="text" placeholder="请输入" v-model="form.companyUser"/> |
| | | </view> |
| | | <view class="form-item"> |
| | | <text class="label require">手机号</text> |
| | | <input type="text" placeholder="请输入"/> |
| | | <input type="number" placeholder="请输入" v-model="form.companyPhone"/> |
| | | </view> |
| | | <view class="form-item"> |
| | | <text class="label require">验证码</text> |
| | | <input type="text" placeholder="请输入"/> |
| | | <text>获取验证码</text> |
| | | <input type="text" placeholder="请输入" v-model="form.code"/> |
| | | <text @click="getCode">{{tips}}</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="top-box"> |
| | | <view class="top-box" style="margin-top: 20rpx;"> |
| | | <view class="form"> |
| | | <view class="form-item"> |
| | | <text class="label require">企业名称</text> |
| | | <input type="text" placeholder="请输入"/> |
| | | <input type="text" placeholder="请输入" v-model="form.companyName"/> |
| | | </view> |
| | | <view class="form-item"> |
| | | <text class="label require">统一社会信用代码</text> |
| | | <input type="text" placeholder="请输入"/> |
| | | <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> |
| | | <input type="text" placeholder="请输入"/> |
| | | |
| | | </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"> |
| | |
| | | <input type="text" placeholder="请输入" v-model="form.companyAddress"/> |
| | | </view> |
| | | </view> --> |
| | | <u-button @click="register"> |
| | | 注册 |
| | | </u-button> |
| | | <view class="bottom"> |
| | | <view @click="register" class="button"> |
| | | 注册 |
| | | </view> |
| | | </view> |
| | | |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import { registerCompany, checkCode } from '@/api/auth.js' |
| | | 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]) |
| | | }, |
| | | fail: err => { |
| | | uni.showToast({ |
| | | title: "上传出错", |
| | | icon: 'none' |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | // 校验字段 |
| | | 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 { code, data } = await checkCode({ code: this.form.code, phone: this.form.companyPhone, userType: '02' }) |
| | | if(code == 200) { |
| | | 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=>{ |
| | |
| | | } |
| | | </style> |
| | | <style scoped lang="scss"> |
| | | .page-content{ |
| | | padding: 30rpx; |
| | | } |
| | | .page-content{ |
| | | padding: 32rpx; |
| | | } |
| | | .form{ |
| | | padding: 24rpx; |
| | | .form-item{ |
| | | margin-top: 20rpx; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 20rpx; |
| | | padding-bottom: 20rpx; |
| | | border-bottom: 1px solid #F1F1F1; |
| | | input{ |
| | | text-align: right; |
| | | font-size: 26rpx; |
| | |
| | | |
| | | } |
| | | .require{ |
| | | color: #4A4E60; |
| | | position: relative; |
| | | &::after{ |
| | | content: '*'; |
| | |
| | | } |
| | | } |
| | | } |
| | | .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> |