Before Width: | Height: | Size: 122 KiB |
Before Width: | Height: | Size: 419 KiB After Width: | Height: | Size: 342 KiB |
Before Width: | Height: | Size: 7.6 KiB |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 385 KiB After Width: | Height: | Size: 111 KiB |
Before Width: | Height: | Size: 89 KiB After Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 374 KiB After Width: | Height: | Size: 112 KiB |
Before Width: | Height: | Size: 584 KiB After Width: | Height: | Size: 176 KiB |
Before Width: | Height: | Size: 291 KiB After Width: | Height: | Size: 104 KiB |
Before Width: | Height: | Size: 453 KiB After Width: | Height: | Size: 146 KiB |
Before Width: | Height: | Size: 56 KiB After Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 411 KiB After Width: | Height: | Size: 134 KiB |
Before Width: | Height: | Size: 532 KiB After Width: | Height: | Size: 131 KiB |
Before Width: | Height: | Size: 102 KiB After Width: | Height: | Size: 46 KiB |
Before Width: | Height: | Size: 874 B |
Before Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 7.2 KiB |
Before Width: | Height: | Size: 875 B |
Before Width: | Height: | Size: 171 B |
Before Width: | Height: | Size: 1.2 KiB |
Before Width: | Height: | Size: 761 B |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 6.3 KiB |
Before Width: | Height: | Size: 274 B |
Before Width: | Height: | Size: 371 B |
Before Width: | Height: | Size: 759 B |
Before Width: | Height: | Size: 875 B |
Before Width: | Height: | Size: 395 KiB |
Before Width: | Height: | Size: 517 B |
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 16 KiB |
Before Width: | Height: | Size: 62 KiB After Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 645 B |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 880 B |
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 70 KiB After Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 62 KiB After Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 176 KiB |
After Width: | Height: | Size: 59 KiB |
Before Width: | Height: | Size: 61 KiB |
After Width: | Height: | Size: 22 KiB |
Before Width: | Height: | Size: 103 KiB |
After Width: | Height: | Size: 36 KiB |
Before Width: | Height: | Size: 75 KiB |
After Width: | Height: | Size: 25 KiB |
Before Width: | Height: | Size: 138 KiB |
After Width: | Height: | Size: 39 KiB |
Before Width: | Height: | Size: 875 B After Width: | Height: | Size: 542 B |
Before Width: | Height: | Size: 171 B After Width: | Height: | Size: 155 B |
Before Width: | Height: | Size: 1.2 KiB After Width: | Height: | Size: 659 B |
Before Width: | Height: | Size: 186 KiB |
After Width: | Height: | Size: 82 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 618 B |
Before Width: | Height: | Size: 6.3 KiB |
Before Width: | Height: | Size: 61 KiB After Width: | Height: | Size: 23 KiB |
Before Width: | Height: | Size: 989 B After Width: | Height: | Size: 587 B |
Before Width: | Height: | Size: 759 B After Width: | Height: | Size: 483 B |
Before Width: | Height: | Size: 159 KiB After Width: | Height: | Size: 71 KiB |
Before Width: | Height: | Size: 112 KiB After Width: | Height: | Size: 48 KiB |
Before Width: | Height: | Size: 114 KiB After Width: | Height: | Size: 50 KiB |
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,639 @@ |
|||
<template> |
|||
<div class="app-container"> |
|||
<div class="app-main"> |
|||
<p class="font-size-24 font-weight-bold line-height-2em">加入联盟</p> |
|||
<el-divider></el-divider> |
|||
<el-form :model="form" :rules="rules" ref="userInfo" class="el-form-new"> |
|||
<el-row> |
|||
<p class="tab-title">登录信息</p> |
|||
<el-col :span="11" > |
|||
<el-form-item label="用户名:" :label-width="formLabelWidth" prop="account"> |
|||
<el-input v-model="form.account" auto-complete="new-password" size="small" placeholder="请输入用户名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="密码:" :label-width="formLabelWidth" prop="password"> |
|||
<el-input type="password" v-model="form.password" auto-complete="new-password" size="small" placeholder="请输入密码"></el-input> |
|||
</el-form-item> |
|||
<el-form-item :label-width="formLabelWidth"> |
|||
<check-password-strong :sValue="form.password"></check-password-strong> |
|||
</el-form-item> |
|||
<el-form-item label="确认密码:" :label-width="formLabelWidth" prop="confirmPassword"> |
|||
<el-input type="password" v-model="form.confirmPassword" autocomplete="off" size="small" placeholder="请再次输入密码"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="2" style="height:1px;"></el-col> |
|||
<el-col :span="11"> |
|||
<el-form-item label="姓名:" :label-width="formLabelWidth" prop="name"> |
|||
<el-input v-model="form.name" autocomplete="off" size="small" placeholder="请输入姓名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="邮箱:" :label-width="formLabelWidth" prop="email"> |
|||
<el-input v-model="form.email" autocomplete="off" size="small" placeholder="请输入邮箱"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="手机号:" :label-width="formLabelWidth" prop="phone" ref="phone"> |
|||
<el-input v-model.number="form.phone" autocomplete="off" minlength="11" maxlength="11" size="small" placeholder="请输入手机号"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="验证码:" :label-width="formLabelWidth" prop="verificationCode"> |
|||
<el-input v-model="form.verificationCode" autocomplete="off" minlength="4" maxlength="4" size="small" style="width:180px;" placeholder="请输入验证码"></el-input> |
|||
<img id="codePic" :src="codeSrc" alt="点击刷新" class="code-pic" @click="refreshCode"/> |
|||
<img :src="_getImage('login','refresh.png')" alt="点击刷新" class="code-refresh" @click="refreshCode" /> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
|
|||
<el-row> |
|||
<p class="tab-title">企业信息</p> |
|||
<el-col :span="11"> |
|||
<el-form-item label="企业名称:" :label-width="formLabelWidth" prop="companyRegisterVo.name"> |
|||
<el-input v-model="form.companyRegisterVo.name" autocomplete="off" placeholder="请输入企业名称"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="企业类型:" :label-width="formLabelWidth" prop="companyRegisterVo.typeId"> |
|||
<!-- 企业类型的下拉菜单 --> |
|||
<el-select v-model="form.companyRegisterVo.typeId" placeholder="请选择企业类型"> |
|||
<el-option label="政府机关" :value="1"></el-option> |
|||
<el-option label="研究机构" :value="2"></el-option> |
|||
<el-option label="社会团体" :value="3"></el-option> |
|||
<el-option label="企事业单位" :value="4"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="统一社会信用代码:" :label-width="formLabelWidth" prop="companyRegisterVo.code"> |
|||
<el-input v-model="form.companyRegisterVo.code" autocomplete="off" placeholder="请输入统一社会信用代码"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="法人证件类型:" :label-width="formLabelWidth" prop="companyRegisterVo.ceId"> |
|||
<!-- 法人证件类型的下拉菜单 --> |
|||
<el-select v-model="form.companyRegisterVo.ceId" placeholder="请选择法人证件类型"> |
|||
<el-option label="中国居民身份证" :value="1"></el-option> |
|||
<el-option label="港澳居民往来内地通行证" :value="2"></el-option> |
|||
<el-option label="台湾居民往来大陆通行证" :value="3"></el-option> |
|||
<el-option label="外国人永久居留身份证" :value="4"></el-option> |
|||
<el-option label="港澳台居民居住证" :value="5"></el-option> |
|||
<el-option label="护照" :value="6"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="法人证件号码:" :label-width="formLabelWidth" prop="companyRegisterVo.enCeNumber"> |
|||
<el-input v-model="form.companyRegisterVo.enCeNumber" autocomplete="off" placeholder="请输入法人证件号码"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="2" style="height:1px;"></el-col> |
|||
<el-col :span="11"> |
|||
<el-form-item label="所属行业:" :label-width="formLabelWidth" prop="companyRegisterVo.inBigId"> |
|||
<!-- 行业大类的下拉菜单 --> |
|||
<el-select |
|||
v-model="form.companyRegisterVo.inBigId" |
|||
placeholder="行业大类" |
|||
style="width:calc(50% - 10px);margin-right: 20px;" |
|||
@change="changeSmallIndustry(true)" |
|||
> |
|||
<el-option |
|||
v-for="(item,index) in bigIndustryType" |
|||
:key="index" |
|||
:label="item.name" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
<!-- 行业小类的下拉菜单 --> |
|||
<el-select |
|||
v-model="form.companyRegisterVo.inSmallId" |
|||
placeholder="行业小类" |
|||
style="width:calc(50% - 10px);" |
|||
> |
|||
<el-option |
|||
v-for="(item,index) in smallIndustryType" |
|||
:key="index" |
|||
:label="item.name" |
|||
:value="item.value" |
|||
></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="法人姓名:" :label-width="formLabelWidth" prop="companyRegisterVo.enLegalName"> |
|||
<el-input v-model="form.companyRegisterVo.enLegalName" autocomplete="off" placeholder="请输入法人姓名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="法人证件:" :label-width="formLabelWidth" prop="companyRegisterVo.enCeAddressZ"> |
|||
<div class="flex-box"> |
|||
<el-upload |
|||
class="avatar-uploader flex-1" |
|||
:action="upload_file" |
|||
:headers="upload_headers" |
|||
:data="upload_data" |
|||
:show-file-list="false" |
|||
:on-success="handlePhotoSuccess" |
|||
:before-upload="beforeAvatarUpload" |
|||
> |
|||
<img v-if="photoUrl" :src="photoUrl" class="avatar"/> |
|||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
<el-upload |
|||
class="avatar-uploader flex-1" |
|||
:action="upload_file" |
|||
:headers="upload_headers" |
|||
:data="upload_data" |
|||
:show-file-list="false" |
|||
:on-success="handleReverseSuccess" |
|||
:before-upload="beforeAvatarUpload" |
|||
> |
|||
<img v-if="reversePhotoUrl" :src="reversePhotoUrl" class="avatar"/> |
|||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
</div> |
|||
<el-form-item label-width="150px" prop="companyRegisterVo.enCeAddressF"></el-form-item> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="24"> |
|||
<el-form-item label="企业简介:" :label-width="formLabelWidth" prop="companyRegisterVo.enIntroduction"> |
|||
<!-- <el-input v-model="form.enIntroduction" autocomplete="off"></el-input> --> |
|||
<el-input type="textarea" v-model="form.companyRegisterVo.enIntroduction" placeholder="请输入企业简介"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="11"> |
|||
<el-form-item label="组织/单位注册所在地:" :label-width="formLabelWidth" prop="companyRegisterVo.areaId"> |
|||
<!-- <v-distpicker @selected="onSelected" class="my-distpicker"></v-distpicker> --> |
|||
<el-select |
|||
v-model="form.companyRegisterVo.provinceId" |
|||
placeholder="省" |
|||
style="width:calc(33.3% - 7px);margin-right:10px;" |
|||
@change="changeArea(form.companyRegisterVo.provinceId,1,true)" |
|||
> |
|||
<el-option |
|||
v-for="(item,index) in provinces" |
|||
:key="index" |
|||
:label="item.name" |
|||
:value="parseInt(item.value)" |
|||
></el-option> |
|||
</el-select> |
|||
<el-select |
|||
v-model="form.companyRegisterVo.cityId" |
|||
placeholder="市" |
|||
style="width:calc(33.3% - 7px);margin-right:10px;" |
|||
@change="changeArea(form.companyRegisterVo.cityId,2,true)" |
|||
> |
|||
<el-option |
|||
v-for="(item,index) in citys" |
|||
:key="index" |
|||
:label="item.name" |
|||
:value="parseInt(item.value)" |
|||
></el-option> |
|||
</el-select> |
|||
<el-select v-model="form.companyRegisterVo.areaId" placeholder="区" style="width:calc(33.3% - 7px);"> |
|||
<el-option |
|||
v-for="(item,index) in areas" |
|||
:key="index" |
|||
:label="item.name" |
|||
:value="parseInt(item.value)" |
|||
></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="联系人姓名:" :label-width="formLabelWidth" prop="companyRegisterVo.conName"> |
|||
<el-input v-model="form.companyRegisterVo.conName" autocomplete="off" placeholder="请输入联系人姓名"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系人电话:" :label-width="formLabelWidth" prop="companyRegisterVo.phone"> |
|||
<el-input v-model="form.companyRegisterVo.phone" autocomplete="off" minlength="11" maxlength="11" placeholder="请输入联系人电话"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系人邮箱:" :label-width="formLabelWidth" prop="companyRegisterVo.email"> |
|||
<el-input v-model="form.companyRegisterVo.email" autocomplete="off" placeholder="请输入联系人邮箱"></el-input> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="2" style="height:1px;"></el-col> |
|||
<el-col :span="11"> |
|||
<el-form-item label="注册详细地址:" :label-width="formLabelWidth" prop="companyRegisterVo.enDetAddress"> |
|||
<el-input v-model="form.companyRegisterVo.enDetAddress" autocomplete="off" placeholder="请输入注册详细地址"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="官方网址:" :label-width="formLabelWidth" prop="companyRegisterVo.enOffWeb"> |
|||
<el-input v-model="form.companyRegisterVo.enOffWeb" autocomplete="off" placeholder="请输入官方网址"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="组织/单位营业执照:" :label-width="formLabelWidth" prop="companyRegisterVo.enOpeAddress"> |
|||
<div class="flex-box"> |
|||
<el-upload |
|||
class="avatar-uploader" |
|||
:action="upload_file" |
|||
:headers="upload_headers" |
|||
:data="upload_data" |
|||
:show-file-list="false" |
|||
:on-success="handleLicenceSuccess" |
|||
:before-upload="beforeAvatarUpload" |
|||
> |
|||
<img v-if="businessLicenceUrl" :src="businessLicenceUrl" class="avatar"/> |
|||
<i v-else class="el-icon-plus avatar-uploader-icon"></i> |
|||
</el-upload> |
|||
</div> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-form-item :label-width="formLabelWidth" style="text-align: center;"> |
|||
<el-checkbox true-label="1" false-label="0" v-model="form.companyRegisterVo.isSynchronizationIdis">同步注册国家工业互联网标识解析食品行业二级节点</el-checkbox> |
|||
<br> |
|||
<el-button type="primary" size="small" @click="submitForm('userInfo')" style="width:200px;text-align: center;">注册</el-button> |
|||
</el-form-item> |
|||
<el-form-item :label-width="formLabelWidth" class="text-center"> |
|||
已有账号? |
|||
<el-link :underline="false" type="primary" @click="goLogin">立即登录</el-link> |
|||
</el-form-item> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import CheckPasswordStrong from '@/components/CheckPasswordStrong'; |
|||
import {registerUser,existsUserName} from "@/api/login" |
|||
import { getToken } from '@/utils/auth' |
|||
import {validateEmail, validatePhone, validateIDCard, validateChinese,validateURL} from "@/utils/validate" |
|||
import { getBigIndustryList,getSmallIndustryList,getArea } from "@/api/company"; |
|||
export default { |
|||
name: 'register', |
|||
components: { |
|||
CheckPasswordStrong |
|||
}, |
|||
data() { |
|||
const checkAgainPassword = (rule, value, callback) => { |
|||
if (value != this.form.password) { |
|||
return callback(new Error('两次输入密码不一致')); |
|||
} else { |
|||
callback() |
|||
} |
|||
}; |
|||
const checkIsUserdUser = (rule, value, callback) => { |
|||
if (validateChinese(value)) { |
|||
return callback(new Error('用户名不可为中文')); |
|||
} else { |
|||
if (!this.isEdit) { |
|||
existsUserName({account: this.form.account}).then(res => { |
|||
callback() |
|||
}).catch(err => { |
|||
return callback(new Error(err.message)); |
|||
}) |
|||
} else { |
|||
callback() |
|||
} |
|||
} |
|||
}; |
|||
const checkPhone = (rule, value, callback) => { |
|||
if (!value) { |
|||
return callback(new Error('手机号不能为空')); |
|||
} else { |
|||
if (validatePhone(value)) { |
|||
callback(); |
|||
} else { |
|||
return callback(new Error('请输入正确的手机号')); |
|||
} |
|||
} |
|||
} |
|||
const checkEmail = (rule, value, callback) => { |
|||
if (!validateEmail(value)) { |
|||
return callback(new Error('请输入正确格式的Email')); |
|||
} else { |
|||
callback(); |
|||
} |
|||
} |
|||
const checkIDNum = (rule, value, callback) => { |
|||
if (!value) { |
|||
return callback(new Error('请输入身份证件号码')); |
|||
} else if (this.form.typeId == 1 && !validateIDCard(value)) { |
|||
return callback(new Error('请输入正确格式的身份证件号码')); |
|||
} else { |
|||
callback(); |
|||
} |
|||
} |
|||
//法人正面照校验 |
|||
const checkPhotoZ = (rule, value, callback) => { |
|||
if ("" == value || !value) { |
|||
return callback(new Error("请上传正面法人证件照")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
//法人反面照校验 |
|||
const checkPhotoF = (rule, value, callback) => { |
|||
if ("" == value || !value) { |
|||
return callback(new Error("请上传反面法人证件照")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
//营业执照照校验 |
|||
const checkPhotoOpe = (rule, value, callback) => { |
|||
if ("" == value || !value) { |
|||
return callback(new Error("请上传营业执照")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
//网址校验 |
|||
const checkURL = (rule, value, callback) => { |
|||
if (value && !validateURL(value)) { |
|||
return callback(new Error("请输入正确格式的网址")); |
|||
} else { |
|||
callback(); |
|||
} |
|||
}; |
|||
return { |
|||
code_url: config.CODE_URL, |
|||
codeSrc: '', |
|||
formLabelWidth: '170px', |
|||
upload_file: config.UPLOAD_URL, //上传图片的接口地址 |
|||
upload_headers:{ |
|||
powerToken: '800580795f01449f9100c4d2983d13c9' |
|||
}, |
|||
upload_data:{ |
|||
uploadType:'1', |
|||
suffixType:'8', |
|||
folder:'company' |
|||
}, |
|||
bigIndustryType: [], //行业大类列表 |
|||
smallIndustryType: [], //行业小类列表 |
|||
photoUrl: "", //正面法人证件照 |
|||
reversePhotoUrl: "", //反面法人证件照 |
|||
businessLicenceUrl: "", //组织/单位营业执照 |
|||
provinceValue: "", //注册地的省 |
|||
provinces: [], //注册地-省列表 |
|||
cityValue: "", //注册地的市 |
|||
citys: [], //注册地-市列表 |
|||
areaValue: "", //注册地的区域 |
|||
areas: [], //注册地-区列表 |
|||
form: { |
|||
name: '', |
|||
account: '', |
|||
password: '', |
|||
confirmPassword: '', |
|||
email: '', |
|||
phone: '', |
|||
verificationCode: '', |
|||
t:'', |
|||
"companyRegisterVo": { |
|||
"isSynchronizationIdis":'1', |
|||
"areaId": "", |
|||
"areaName": "", |
|||
"ceId": "", |
|||
"cityId": "", |
|||
"cityName": "", |
|||
"code": "", |
|||
"conName": "", |
|||
"email": "", |
|||
"enCeAddressF": "", |
|||
"enCeAddressZ": "", |
|||
"enCeNumber": "", |
|||
"enDetAddress": "", |
|||
"enIntroduction": "", |
|||
"enLegalName": "", |
|||
"enOffWeb": "", |
|||
"enOpeAddress": "", |
|||
"inBigId": "", |
|||
"inSmallId": "", |
|||
"name": "", |
|||
"phone": "", |
|||
"provinceId": "", |
|||
"provinceName": "", |
|||
"typeId": "" |
|||
}, |
|||
|
|||
}, |
|||
rules: { |
|||
name: [ |
|||
{required: true, message: '请输入姓名', trigger: 'blur'} |
|||
], |
|||
account: [ |
|||
{required: true, message: '请输入用户名', trigger: 'blur'}, |
|||
{validator: checkIsUserdUser, trigger: 'blur'} |
|||
], |
|||
password: [ |
|||
{required: true, message: '请输入新密码', trigger: 'blur'}, |
|||
{min: 8, max: 12, message: '长度在 8 到 12 个字符', trigger: 'blur'} |
|||
], |
|||
confirmPassword: [ |
|||
{required: true, message: '请再次输入新密码', trigger: 'blur'}, |
|||
{validator: checkAgainPassword, trigger: 'blur'} |
|||
], |
|||
email: [ |
|||
{required: true, message: '请输入邮箱', trigger: 'blur'}, |
|||
{validator: checkEmail, trigger: 'blur'} |
|||
], |
|||
phone: [ |
|||
{required: true, validator: checkPhone, trigger: 'blur'} |
|||
], |
|||
verificationCode: [ |
|||
{ required: true, message: '请输入验证码', trigger: 'blur' } |
|||
], |
|||
companyRegisterVo:{ |
|||
name: [{required: true, message: "请输入企业名称", trigger: "blur"}], |
|||
code: [ |
|||
{required: true, message: "请输入统一社会信用代码", trigger: "blur"} |
|||
], |
|||
|
|||
typeId: [ |
|||
{required: true, message: "请选择企业类型", trigger: "click"} |
|||
], |
|||
inBigId: [ |
|||
//必须选择完大类才能选择小类,所以只校验小类就可以了 |
|||
{required: true, message: "请选择行业类型", trigger: "click "} |
|||
], |
|||
enLegalName: [ |
|||
{required: true, message: "请输入法人姓名", trigger: "blur"} |
|||
], |
|||
ceId: [ |
|||
{required: true, message: "请选择法人证件类型", trigger: "click"} |
|||
], |
|||
enCeNumber: [ |
|||
{required: true, message: "请输入法人证件号码", trigger: "blur"} |
|||
// { type: 'number', message: '法人证件号码必须为数字值'} |
|||
], |
|||
enIntroduction: [ |
|||
{required: true, message: "请输入企业简介", trigger: "blur"} |
|||
], |
|||
|
|||
enDetAddress: [ |
|||
{required: true, message: "请输入注册地详细地址", trigger: "blur"} |
|||
], |
|||
enOffWeb: [{validator: checkURL, trigger: "blur"}], |
|||
enCeAddressZ: [ |
|||
{required: true, validator: checkPhotoZ, trigger: "blur"} |
|||
], |
|||
enCeAddressF: [ |
|||
{required: true, validator: checkPhotoF, trigger: "blur"} |
|||
], |
|||
enOpeAddress: [ |
|||
{required: true, validator: checkPhotoOpe, trigger: "blur"} |
|||
], |
|||
conName: [ |
|||
{required: true, message: "请输入联系人姓名", trigger: "blur"} |
|||
], |
|||
phone: [{required: true, validator: checkPhone, trigger: "blur"}], |
|||
email: [{required: true, validator: checkEmail, trigger: "blur"}], |
|||
areaId: [ |
|||
{required: true, message: "请选择注册区域", trigger: "change"} |
|||
] |
|||
} |
|||
}, |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.form.t = Math.random().toString().substring(0,13) |
|||
this.codeSrc = this.code_url + "/common/getVerificationCode/" + this.form.t; |
|||
this.initData() |
|||
}, |
|||
methods: { |
|||
//初始化数据 |
|||
initData() { |
|||
//获取行业大类列表 |
|||
getBigIndustryList().then(res => { |
|||
this.bigIndustryType = res.data; |
|||
}); |
|||
this.changeArea("0", 0); |
|||
}, |
|||
//省市区变化时动态获取 |
|||
changeArea(pid, type, clean) { |
|||
getArea(pid).then(res => { |
|||
if (type == 0) { |
|||
this.provinces = res.data; |
|||
} else if (type == 1) { |
|||
if (clean) { |
|||
this.form.companyRegisterVo.cityId = ""; |
|||
this.form.companyRegisterVo.areaId = ""; |
|||
} |
|||
this.citys = res.data; |
|||
} else if (type == 2) { |
|||
if (clean) { |
|||
this.form.companyRegisterVo.areaId = ""; |
|||
} |
|||
this.areas = res.data; |
|||
} |
|||
}); |
|||
}, |
|||
goLogin() { |
|||
this.$router.push({name: 'login'}) |
|||
}, |
|||
//刷新验证码 |
|||
refreshCode: function () { |
|||
this.form.t = Math.random().toString().substring(0,13) |
|||
document |
|||
.getElementById("codePic") |
|||
.setAttribute( |
|||
"src", |
|||
this.code_url + "/common/getVerificationCode/" + this.form.t |
|||
); |
|||
}, |
|||
submitForm(formName) { |
|||
this.$refs[formName].validate((valid) => { |
|||
if (valid) { |
|||
let temp1 = this.provinces.filter(item => { |
|||
if(item.value == this.form.companyRegisterVo.provinceId) |
|||
return item |
|||
}) |
|||
this.form.provinceName = temp1[0].name |
|||
let temp2 = this.citys.filter(item => { |
|||
if(item.value == this.form.companyRegisterVo.cityId) |
|||
return item |
|||
}) |
|||
this.form.cityName = temp2[0].name |
|||
let temp3 = this.areas.filter(item => { |
|||
if(item.value == this.form.companyRegisterVo.areaId) |
|||
return item |
|||
}) |
|||
this.form.areaName = temp3[0].name |
|||
|
|||
let param = JSON.parse(JSON.stringify(this.form)) |
|||
param.password = this.$md5(param.password) |
|||
param.confirmPassword = this.$md5(param.confirmPassword) |
|||
registerUser(param).then(res => { |
|||
this.$message({ |
|||
message: '注册成功!', |
|||
type: 'success' |
|||
}); |
|||
this.goLogin() |
|||
}) |
|||
} else { |
|||
console.log('error submit!!'); |
|||
return false; |
|||
} |
|||
}); |
|||
}, |
|||
resetForm(formName) { |
|||
this.$refs[formName].resetFields(); |
|||
this.$router.go(-1) |
|||
}, |
|||
//行业大类变化获取行业小类 |
|||
changeSmallIndustry(clean) { |
|||
if (clean) { |
|||
this.form.companyRegisterVo.inSmallId = ""; |
|||
} |
|||
getSmallIndustryList(this.form.companyRegisterVo.inBigId).then(res => { |
|||
this.smallIndustryType = res.data; |
|||
}); |
|||
}, |
|||
//组织/单位营业执照图片上传成功的回调 |
|||
handleLicenceSuccess(res, file) { |
|||
this.businessLicenceUrl = URL.createObjectURL(file.raw); |
|||
this.form.companyRegisterVo.enOpeAddress = res.data; |
|||
}, |
|||
//法人正面照图片上传成功的回调 |
|||
handlePhotoSuccess(res, file) { |
|||
this.photoUrl = URL.createObjectURL(file.raw); |
|||
this.form.companyRegisterVo.enCeAddressZ = res.data; |
|||
}, |
|||
//法人反面照图片上传成功的回调 |
|||
handleReverseSuccess(res, file) { |
|||
this.reversePhotoUrl = URL.createObjectURL(file.raw); |
|||
this.form.companyRegisterVo.enCeAddressF = res.data; |
|||
}, |
|||
//图片上传前的检测 |
|||
beforeAvatarUpload(file) { |
|||
const isLt2M = file.size / 1024 / 1024 < 2; |
|||
if (!isLt2M) { |
|||
this.$message.error("上传图片大小不能超过 2MB!"); |
|||
} |
|||
return isLt2M; |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scope> |
|||
// .form-footer { |
|||
// text-align: center; |
|||
// } |
|||
.tab-title { |
|||
font-size: 16px; |
|||
font-family: Microsoft YaHei; |
|||
font-weight: bold; |
|||
color: #000000; |
|||
line-height: 26px; |
|||
margin: 20px 0; |
|||
&::before { |
|||
content: " "; |
|||
position: absolute; |
|||
left: -15px; |
|||
top: 23px; |
|||
width: 5px; |
|||
height: 18px; |
|||
background: #01496E; |
|||
} |
|||
} |
|||
.el-form-new { |
|||
max-width: 1200px; |
|||
padding: 0 70px; |
|||
// width: 400px; |
|||
// margin: 0 auto; |
|||
} |
|||
|
|||
.code-refresh { |
|||
position: absolute; |
|||
top: 10px; |
|||
width: 25px; |
|||
height: 20px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.code-pic { |
|||
margin: 0 5px; |
|||
border: 1px solid rgba(220, 220, 220, 1); |
|||
border-radius: 3px; |
|||
width: 90px; |
|||
height: 32px; |
|||
vertical-align: middle; |
|||
} |
|||
.el-select { |
|||
width: 100%; |
|||
} |
|||
</style> |