FE-V2-XCX/pages_supplier/register/register.vue

<!-- 注册 -->
<template>
    <view id="register">
		<view class="register_li" v-if="pageStatus==0">
			<view class="register_li_min">
				<view>*</view>
				<view>所属学院：</view>
				<input v-model="form.sysUserDto.faculty"  disabled type="text" placeholder-style="color:#999;" placeholder="请输入登录账号">
			</view>
			<view class="register_li_min">
				<view>*</view>
				<view>登录账号：</view>
				<input v-model="form.sysUserDto.userName"  type="text" placeholder-style="color:#999;" placeholder="请输入登录账号">
			</view>
			<view class="register_li_min">
			    <view>*</view>
				<view>登录密码：</view>
				<input v-model="form.sysUserDto.password" type="text" placeholder-style="color:#999;" placeholder="请输入登录密码">
			</view>
			<view class="register_li_min" style="border-bottom:0;">
				<view>*</view>
				<view>确认密码：</view>
				<input  v-model="form.sysUserDto.repassword"  type="text" placeholder-style="color:#999;" placeholder="请再次确认密码">
			</view>
		</view>
		<view class="register_li">
			<view class="register_li_min">
				<view>*</view>
				<view>企业名称：</view>
				<input v-model="form.companyName" @blur="nameCheck()"  maxlength="20"type="text" placeholder-style="color:#999;" placeholder="请输入供应商名称">
			</view>
			<view class="register_li_min">
			    <view style="margin-left: 12rpx;"></view>
				<view>企业简称：</view>
				<input v-model="form.companyShort" maxlength="10" type="text" placeholder-style="color:#999;" placeholder="请输入供应商简称">
			</view>
			<view class="register_li_min" >
				<view>*</view>
				<view>联系人：</view>
				<input v-model="form.contacts" maxlength="10"  type="text" placeholder-style="color:#999;" placeholder="请输入联系人姓名">
			</view>
			<view class="register_li_min" >
				<view>*</view>
				<view>联系方式：</view>
				<input  v-model="form.phone"  type="text" placeholder-style="color:#999;" placeholder="请输入联系方式">
			</view>
			<view class="register_li_min" style="border-bottom:0;">
				 <view style="margin-left: 12rpx;"></view>
				<view>经营地址：</view>
				<input v-model="form.businessAddress" maxlength="30" type="text" placeholder-style="color:#999;" placeholder="请输入经营地址">
			</view>
		</view>
		<view class="sub_btn" @click="nextStep()">下一步</view>
	</view>
</template>

<script>
    import {supplierCheck,supplierDetail} from '@/api/index.js'
	import { config } from '@/api/request/config.js'
    export default {
        data() {
            return {
				form:{
					sysUserDto:{
						faculty:'环境与气候研究院',
						userName:'',
						password:'',
						repassword:'',
					},
					companyName:'',
					companyShort:'',
					contacts:'',
					phone:'',
					businessAddress:'',
					id:'',
				},
				pageStatus:null,//判断是从那个页面进入 0登录页，1驳回页面
				license:null,//证件数据
            }
        },
        onLoad(option) {
			this.pageStatus=option.pageStatus;
        },
        onShow(){

        },
        methods: {
			//校验企业名称是否重复
			async nameCheck(){
				const {data} = await supplierCheck({name:this.form.companyName,})
				let res=data.data
				if(data.code==200){

				}
			},

			//获取详情
			async getInfo(){
			    let _this = this;
			    const {data} = await supplierDetail()
				let res=data.data
			    if(data.code==200){
					this.form.id=res.id
					this.form.companyName=res.companyName
					this.form.companyShort=res.companyShort
					this.form.contacts=res.contacts
					this.form.phone=res.phone
					this.form.businessAddress=res.businessAddress
					this.license=res.qpSupplierCredentialsVos
			    }
			},
			nextStep(){
				let _this = this;
				if(!this.form.sysUserDto.userName && this.pageStatus==0){
					uni.showToast({
						title: '请输入登陆账号',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(this.form.sysUserDto.userName){
					if(_this.form.sysUserDto.userName.length<6 || _this.form.sysUserDto.userName.length>16){
						uni.showToast({
							title: '登录账号不能超出16位、不能低于6位',
							icon:"none",
							mask:true,
							duration: 2000
						});
						form.sysUserDto.userName='';
						return
					}
					let reg=/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]|[`~@!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】、；‘’，。、\s+]/;
					let aa= reg.test(_this.form.sysUserDto.userName)
					if(reg.test(_this.form.sysUserDto.userName)){
						uni.showToast({
							title: '登录密码中有中文，空格或特殊字符，请重新输入!',
							icon:"none",
							mask:true,
							duration: 2000
						});
						_this.form.sysUserDto.userName='';
						return
					}

				}
				if(!this.form.sysUserDto.password && this.pageStatus==0){
					uni.showToast({
						title: '请输入登陆密码',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(_this.form.sysUserDto.password){
					if(_this.form.sysUserDto.password.length<6 || _this.form.sysUserDto.password.length>16){
						uni.showToast({
							title: '登录密码不能超出16位、不能低于6位',
							icon:"none",
							mask:true,
							duration: 2000
						});
						_this.form.sysUserDto.password='';
						return
					}
					let reg=/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]|[`~@!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】、；‘’，。、\s+]/;
					let aa= reg.test(this.form.sysUserDto.password)
					if(reg.test(this.form.sysUserDto.password)){
						uni.showToast({
							title: '登录密码中有中文，空格或特殊字符，请重新输入!',
							icon:"none",
							mask:true,
							duration: 2000
						});
						this.form.sysUserDto.password='';
						return
					}

				}
				if(!this.form.sysUserDto.repassword && this.pageStatus==0){
					uni.showToast({
						title: '请输入确认密码',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(this.form.sysUserDto.password!==this.form.sysUserDto.repassword){
					uni.showToast({
						title: '密码输入不一致，请重新输入!',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(!this.form.companyName){
					uni.showToast({
						title: '请输入企业名称',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(!this.form.contacts){
					uni.showToast({
						title: '请输入联系人',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(!this.form.phone){
					uni.showToast({
						title: '请输入手机号码',
						icon:"none",
						mask:true,
						duration: 2000
					});
					return
				}
				if(this.form.phone){
					let reg=/^((13[0-9])|(14[5,7])|(15[0-3,5-9])|(16[0-9])|(17[0,3,5-8])|(18[0-9])|(147))+\d{8}$/;
					let aa= reg.test(this.form.phone)
					if(!reg.test(this.form.phone)){
						uni.showToast({
							title: '请输入正确的手机号!',
							icon:"none",
							mask:true,
							duration: 2000
						});
						this.form.phone='';
						return
					}

				}

				uni.navigateTo({
				    url: '/pages_supplier/register/registerTow?form='+encodeURIComponent(JSON.stringify(this.form))+'&license='+encodeURIComponent(JSON.stringify(this.license)),//安全检查
				});
			},
        },
		mounted(){
			if(this.pageStatus==1){
				this.getInfo();
			}
			//
		},
    }
</script>

<style lang="stylus" scoped>
    #register{
        height:auto;
        width:100%;
        display flex
        flex-direction column;
		padding-bottom: 220rpx;
		.register_li{
			background #fff;
			border-radius:20rpx;
			margin:20rpx 20rpx 0;
			padding:20rpx 0;
			box-sizing: border-box;
			.register_li_min{
				margin:0 26rpx;
				display flex;
				align-items center;
				border-bottom: 1px solid #F5F5F5;
				view{
					line-height:100rpx;
					font-size:28rpx;
				}
				view:nth-child(1){
					color:red;
					line-height:28rpx;
					margin-right: 12rpx;
				}
				view:nth-child(2){
					width:160rpx;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}

				>input{
					width 460rpx;
					text-align: right;
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}
			}
		}
		/* 按钮 */
		.sub_btn{
			width: 650rpx;
			height: 100rpx;
			background: #0183FA;
			border-radius: 20rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			line-height: 100rpx;
			text-align: center;
			margin-left: 50rpx;
			position: fixed;
			bottom:30rpx;
			z-index: 1000;
		}
	}
	/deep/.input-value-border{
		display :none !important;
	}
</style>