|
@@ -1,261 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="apply-wrap">
|
|
|
- <form class="login-form" @submit="formSubmit">
|
|
|
- <view class="form-item">
|
|
|
- <text class="require-tip">*</text>
|
|
|
- <input v-model="form.name" class="item-inp" name="name" type="text" placeholder="请输入企业名称" />
|
|
|
- </view>
|
|
|
- <view class="form-item">
|
|
|
- <text class="require-tip">*</text>
|
|
|
- <input v-model="areaInfo.label" class="item-inp" type="text" :disabled="true" placeholder="请选择省市区" @tap="openAddress" />
|
|
|
- <Address ref="applyAddress" @onConfirm="areaConfirm"></Address>
|
|
|
- </view>
|
|
|
- <view class="form-item">
|
|
|
- <input v-model="form.addrDetail" class="item-inp" name="addrDetail" type="text" placeholder="请输入详细地址" />
|
|
|
- </view>
|
|
|
- <view class="form-item">
|
|
|
- <text class="require-tip">*</text>
|
|
|
- <input v-model="form.contactPhone" class="item-inp" name="contactPhone" type="number" maxlength="11" placeholder="请输入手机号,该号码会作为系统登录账号" />
|
|
|
- </view>
|
|
|
- <view class="form-item">
|
|
|
- <text class="require-tip">*</text>
|
|
|
- <input v-model="form.verifyCode" class="item-inp" name="verifyCode" type="number" maxlength="6" placeholder="请输入手机验证码" />
|
|
|
- <button class="getcode-btn" :disabled="isDisable" @click="getCodeValidate">{{nowVal}}</button>
|
|
|
- </view>
|
|
|
- <view class="form-item">
|
|
|
- <input v-model="form.introPhone" class="item-inp" name="introPhone" type="number" maxlength="11" placeholder="请输入推荐人手机" />
|
|
|
- </view>
|
|
|
- <view class="form-btn-con">
|
|
|
- <button class="form-btn" form-type="submit">提交</button>
|
|
|
- <text class="apply-btn" @click="goLogin">已有账号?去登录</text>
|
|
|
- </view>
|
|
|
- </form>
|
|
|
- <!-- 图文验证码 -->
|
|
|
- <uni-popup ref="imageTxtPopup" type="center">
|
|
|
- <!-- type值 用于区分applyImageTxt申请试用 forgetImageTxt忘记密码 -->
|
|
|
- <popup-con type="applyImageTxt" title="图文验证码" :popBtn="popBtn" :changeImg="changeImg" @captchaImg="captchaImg"></popup-con>
|
|
|
- </uni-popup>
|
|
|
- <view class="authUserYs">
|
|
|
- <checkbox-group @change="authuserChange">
|
|
|
- <label>
|
|
|
- <checkbox value="true" :checked="isAuthuserYs" class="login-form-checkbox" />
|
|
|
- 注册代表同意<text @click="toYsPage()">章鱼车管家用户隐私政策</text>
|
|
|
- </label>
|
|
|
- </checkbox-group>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import { isvalidPhone } from '@/libs/validate.js'
|
|
|
- import Address from '@/components/address.vue'
|
|
|
- import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
|
|
- import popupCon from '@/components/uni-popup/popup-con.vue'
|
|
|
- import { clzConfirm } from '@/libs/tools.js'
|
|
|
- import { sendVerifyCode, apply, validateUser } from '@/api/user.js'
|
|
|
-
|
|
|
- export default{
|
|
|
- components: {
|
|
|
- Address,
|
|
|
- uniPopup,
|
|
|
- popupCon
|
|
|
- },
|
|
|
- data(){
|
|
|
- return{
|
|
|
- form: {
|
|
|
- name: '',
|
|
|
- orgType: '',
|
|
|
- addrProvince: '',
|
|
|
- addrCity: '',
|
|
|
- addrDistrict: '',
|
|
|
- addrDetail: '',
|
|
|
- contactPhone: '',
|
|
|
- introPhone: '',
|
|
|
- verifyCode: ''
|
|
|
- },
|
|
|
- nowVal: '获取验证码', // 按钮显示内容
|
|
|
- count: '', // 当前秒数
|
|
|
- timer: null, // 倒计时
|
|
|
- isDisable: false, // 是否禁止获取验证码
|
|
|
- areaInfo: '', // 省市区
|
|
|
- areaIdArr: [], // 省市区id数组
|
|
|
- popBtn: [], // name为操作按钮名称,color为操作按钮颜色值
|
|
|
- changeImg: false, // 是否重新更换图形验证码
|
|
|
- randomCode: '', // 图片验证码随机码
|
|
|
- isAuthuserYs: false // 是否同意隐私政策
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.isAuthuserYs = this.$store.state.vuex_isUsrAuthYs
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 表单提交
|
|
|
- formSubmit(){
|
|
|
- // 表单校验
|
|
|
- if(this.form.name == ''){
|
|
|
- uni.showToast({icon: 'none',title: '请输入企业名称'})
|
|
|
- return
|
|
|
- }
|
|
|
- // 省市区
|
|
|
- if(this.areaIdArr.length == 0){
|
|
|
- uni.showToast({icon: 'none',title: '请选择省市区'})
|
|
|
- return
|
|
|
- }
|
|
|
- if(this.form.contactPhone == ''){
|
|
|
- uni.showToast({icon: 'none',title: '请输入手机号码'})
|
|
|
- return
|
|
|
- }
|
|
|
- if(!isvalidPhone(this.form.contactPhone)){
|
|
|
- uni.showToast({icon: 'none',title: '请输入正确的手机号码'})
|
|
|
- return
|
|
|
- }
|
|
|
- if(this.form.verifyCode == ''){
|
|
|
- uni.showToast({icon: 'none',title: '请输入验证码'})
|
|
|
- return
|
|
|
- }
|
|
|
- if(this.randomCode == ''){
|
|
|
- uni.showToast({icon: 'none',title: '请输入正确的手机验证码'})
|
|
|
- return
|
|
|
- }
|
|
|
- if(!this.isAuthuserYs){
|
|
|
- uni.showToast({icon: 'none',title: '请同意并阅读用户隐私政策'})
|
|
|
- return
|
|
|
- }
|
|
|
- let obj = this.form
|
|
|
- obj.addrProvince = this.areaIdArr[0] // 省id
|
|
|
- obj.addrCity = this.areaIdArr[1] // 市id
|
|
|
- obj.addrDistrict = this.areaIdArr[2] // 区id
|
|
|
- obj.random = this.randomCode // 图片验证码随机码
|
|
|
- // 申请试用
|
|
|
- apply(obj).then(res => {
|
|
|
- console.log(res)
|
|
|
- if(res.status == 200){
|
|
|
- clzConfirm({
|
|
|
- title: '提示',
|
|
|
- content: '资料已提交成功,客服会在3个工作日内同您联系。请保持电话畅通,谢谢!',
|
|
|
- showCancel: false,
|
|
|
- success: function (ret) {
|
|
|
- if (ret.confirm||ret.index==0) {
|
|
|
- uni.reLaunch({
|
|
|
- url: '/pages/index'
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- }else{
|
|
|
- uni.showToast({icon: 'none',title: res.message})
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 获取验证码
|
|
|
- getCodeValidate(){
|
|
|
- if(this.form.contactPhone){
|
|
|
- if(!isvalidPhone(this.form.contactPhone)){
|
|
|
- uni.showToast({icon: 'none',title: '请输入正确的手机号码'})
|
|
|
- return
|
|
|
- }else{
|
|
|
- // 校验手机号是否注册过
|
|
|
- validateUser({phone: this.form.contactPhone}).then(res => {
|
|
|
- if(res.status == 200){
|
|
|
- // 图文验证码
|
|
|
- this.$refs.imageTxtPopup.open()
|
|
|
- }else{
|
|
|
- uni.showToast({icon: 'none',title: res.message})
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }else{
|
|
|
- uni.showToast({icon: 'none',title: '请先输入手机号'})
|
|
|
- }
|
|
|
- },
|
|
|
- // 图文验证码
|
|
|
- captchaImg(code, nowRandomCode){
|
|
|
- this.captchaVerify(code, nowRandomCode)
|
|
|
- },
|
|
|
- // 验证图片验证码
|
|
|
- captchaVerify(code, nowRandomCode){
|
|
|
- const _this = this
|
|
|
- let obj = {}
|
|
|
- obj.contactPhone = this.form.contactPhone
|
|
|
- obj.random = nowRandomCode
|
|
|
- obj.captcha = code
|
|
|
- // 短信验证码
|
|
|
- sendVerifyCode(obj).then(res => {
|
|
|
- console.log(JSON.stringify(res))
|
|
|
- if(res.status == 200){ // 验证码输入正确
|
|
|
- _this.randomCode = nowRandomCode // 图片验证码随机码
|
|
|
- // 关闭 图形验证码 弹框
|
|
|
- _this.$refs.imageTxtPopup.close()
|
|
|
- // 开启倒计时
|
|
|
- this.getCodeFun()
|
|
|
- uni.showToast({icon: 'none',title: '验证码发送成功'})
|
|
|
- }else { // 验证码输入错误
|
|
|
- _this.randomCode = ''
|
|
|
- // 切换验证码重新校验
|
|
|
- _this.changeImg = false
|
|
|
- _this.$nextTick(function(){
|
|
|
- _this.changeImg = true
|
|
|
- })
|
|
|
- uni.showToast({icon: 'none',title: res.message})
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 开始倒计时
|
|
|
- getCodeFun(){
|
|
|
- const TIME_COUNT = 60
|
|
|
- if (!this.timer) {
|
|
|
- this.count = TIME_COUNT
|
|
|
- this.timer = setInterval(() => {
|
|
|
- if (this.count > 0 && this.count <= TIME_COUNT) {
|
|
|
- this.count--
|
|
|
- this.nowVal = this.count + 's后重发'
|
|
|
- this.isDisable = true
|
|
|
- } else {
|
|
|
- this.nowVal = '重新获取验证码'
|
|
|
- clearInterval(this.timer)
|
|
|
- this.timer = null
|
|
|
- this.isDisable = false
|
|
|
- }
|
|
|
- }, 1000)
|
|
|
- }
|
|
|
- },
|
|
|
- // 选择省区市
|
|
|
- areaConfirm(e) {
|
|
|
- console.log('已选择的省市区', e)
|
|
|
- this.areaInfo = e
|
|
|
- this.areaIdArr = [ e.provinceCode, e.cityCode, e.areaCode ]
|
|
|
- },
|
|
|
- openAddress(){
|
|
|
- // 省市区 回显 参数为省市区id数组
|
|
|
- this.$refs.applyAddress.open(this.areaIdArr)
|
|
|
- },
|
|
|
- // 去登录
|
|
|
- goLogin(){
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/login/login'
|
|
|
- })
|
|
|
- },
|
|
|
- // 隐私
|
|
|
- authuserChange(e){
|
|
|
- this.isAuthuserYs = e.detail.value.length > 0
|
|
|
- this.$u.vuex('vuex_isUsrAuthYs', this.isAuthuserYs)
|
|
|
- },
|
|
|
- toYsPage(){
|
|
|
- uni.navigateTo({
|
|
|
- url:'/pages/login/userAuthYs'
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-<style scoped lang="scss">
|
|
|
- @import './login.scss';
|
|
|
- .apply-wrap .login-form{
|
|
|
- padding-top: 80upx;
|
|
|
- }
|
|
|
- .getcode-btn {
|
|
|
- background-color: #298bf2 !important;
|
|
|
- color: #fff !important;
|
|
|
- border: none !important;
|
|
|
- }
|
|
|
-</style>
|