<template>
	<view class="container avstarBack relative">
		<uni-navbar title="注册账号"></uni-navbar>
		<view class="box commonMt relative">
			<view class="absolute">
				<view class="registerBox commonBj">
					<u--form :model="form" ref="uForm" :rules="rules" labelWidth="0">
						<u-form-item prop="companyName">
							<view class="redCircle"></view>
							<text class="itemText">企业名称</text>
							<u-input class="inputStyle" v-model="form.companyName" placeholder="请输入企业名称" />
						</u-form-item>
						<u-form-item prop="companyAbbreviation">
							<view class="redCircle"></view>
							<text class="itemText">企业简称</text>
							<u-input class="inputStyle" v-model="form.companyAbbreviation" placeholder="请输入企业简称" />
						</u-form-item>
						<u-form-item prop="companyCode">
							<view class="redCircle"></view>
							<text class="itemText">信用代码</text>
							<u-input class="inputStyle" v-model="form.companyCode" placeholder="请输入18位企业统一信用代码" />
						</u-form-item>
						<u-form-item prop="legalPerson">
							<view class="redCircle"></view>
							<text class="itemText">企业法人</text>
							<u-input class="inputStyle" v-model="form.legalPerson" placeholder="请输入企业法人姓名" />
						</u-form-item>
						<u-form-item prop="phoneNumber">
							<view class="redCircle"></view>
							<text class="itemText">联系电话</text>
							<u-input class="inputStyle" v-model="form.phoneNumber" placeholder="请输入联系电话" />
						</u-form-item>
						<!-- <u-form-item prop="account">
					<view class="redCircle"></view>
					<text class="itemText">企业账号</text>
					<u-input class="inputStyle" v-model="form.account" placeholder="设置账号字母+数字(限制8位)" />
				</u-form-item> -->
						<u-form-item prop="passWord">
							<view class="redCircle"></view>
							<text class="itemText">设置密码</text>
							<u-input class="inputStyle pasStyle" v-model="form.passWord"
								placeholder="大小写字母组合+特殊符号 长度8位" />
						</u-form-item>
						<u-form-item prop="code" v-if="captchaEnabled">
							<view class="redCircle"></view>
							<text class="itemText" style="letter-spacing: 8rpx;">验证码</text>
							<u-input v-model="form.code" type="number" class="inputStyle" placeholder="请输入验证码"
								maxlength="4" />
							<image :src="codeUrl" @click="getCode" class="login-code-img"></image>
						</u-form-item>
					</u--form>
				</view>
				<u-button @click="submit" shape="circle" color="linear-gradient(to top, #F59A02, #FFD334 )"
					class="buttonStyle mt33 commonMb buttonLang">确认注册</u-button>
			</view>
		</view>
		<tooltipNew :show="show" type='type2' @close='close' :password='form.passWord' :username='username'></tooltipNew>
	</view>

</template>

<script>
	import {
		companyChange
	} from "@/api/company/index.js"
	import {
		getCodeImg
	} from '@/api/login'
	export default {
		data() {
			return {
				captchaEnabled: true,
				codeUrl: '',
				// codeUrl: "data:image/gif;base64,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",
				show: false,
				username: 'ltkj0102',
				passWord: 'ltkj0102',
				form: {
					companyName: '',
					passWord: '',
					companyAbbreviation: '',
					companyCode: '',
					legalPerson: '',
					phoneNumber: '',
					code: null,
					uuid: null,
				},
				rules: {
					companyName: [{
						required: true,
						message: '请输入企业名称',
						trigger: ['blur']
					}, ],
					passWord: [{
						required: true,
						validator: (rule, value, callback) => {
							// let validationStr = /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]+$/;
							// 大小写字母+特殊字符组合+八位
							// let validationStr = /^(?=.*?[a-z])(?=.*?[A-Z])(?=.*?[!#@*&.])[a-zA-Z!#@*&.]{8,8}.*$/;
							//数字+字母+特殊字符组合
							let validationStr = /^(?=.*[A-Za-z])(?=.*\d)(?=.*[`~!@#$%^&*()_+<>?:"{},.\/\\;'[\]])[A-Za-z\d`~!@#$%^&*()_+<>?:"{},.\/\\;'[\]]{8,}$/;
							console.log(validationStr.test(value), 'validationStr.test(value)');
							if (!validationStr.test(value) || value.length !== 8) {
								return false;
							} else {
								return true;
							}

						},
						message: '请设置大小写字母组合+特殊符号 长度8位',
						trigger: ['blur', 'change']
					}, ],
					companyAbbreviation: [{
						required: true,
						message: '请输入企业简称',
						trigger: ['blur']
					}, ],
					companyCode: [{
						required: true,
						message: '请输入18位企业统一信用代码',
						validator: (rule, value, callback) => {

							if (value.length === 18) {
								return true;
							} else {
								return false;
							}

						},
						trigger: ['blur']
					}, ],
					legalPerson: [{
						required: true,
						message: '请输入企业法人姓名',
						trigger: ['blur']
					}, ],
					phoneNumber: [{
						required: true,
						message: '请输入联系电话',
						trigger: ['blur']
					}, ],
					code: [{
						type: 'number',
						required: true,
						message: '请输入验证码',
						trigger: ['blur']
					}, ],
				}
			}
		},
		created() {
			this.getCode()
		},
		methods: {
			// 获取图形验证码
			getCode() {
				getCodeImg().then(res => {
					this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
					this.rules.code[0].required=this.captchaEnabled;
					if (this.captchaEnabled) {
						this.codeUrl = 'data:image/gif;base64,' + res.img
						this.form.uuid = res.uuid
					}
				})
			},
			close() {
				this.show = false;
				this.$tab.reLaunch('/pages/login/index')
			},
			companyChange() {
				companyChange(this.form).then(response => {
					this.show = true;
					this.username=response.data
				})
			},
			submit() {


				this.$refs.uForm.validate().then(res => {
					this.companyChange();
					// this.$tab.reLaunch('/pages/register/index')
					// uni.$u.toast('校验通过')
				}).catch(errors => {
					console.log(errors, 'errors');
					// uni.$u.toast('校验失败')
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.relative {
		position: relative;
	}

	.absolute {
		position: absolute;
		bottom: 46rpx;
		width: 100%;
	}

	.avstarBack {
		background-image: url(@/static/images/6.png);
	}

	.registerBox {
		margin-left: auto;
		margin-right: auto;
		// height: 70vh;
		padding: 20rpx 35rpx;
	}

	.buttonStyle {
		margin-top: 30rpx;
		margin-left: auto;
		margin-right: auto;
	}

	.pasStyle .input-placeholder {
		font-size: 24rpx !important;
	}

	// /deep/ .u-form-item__body{
	// 	padding: 10rpx 0;
	// }
	.login-code-img {
		height: 76rpx;
		width: 160rpx;
		margin-left: 19rpx;
	}
</style>
