import api from '@/api/api'
import {
	httpGet,
	httpPost
} from '@/api/fetch-api.js'

import { contactMethodCheck } from '@utils/utils.js';

import modalComp from '@/components/modal-comp/modal-comp.vue';
import modalSimpleComp from '@/components/modal-simple-comp/modal-simple-comp.vue';
import { passwordEncrypt } from '@/utils/encrypt.js';

export default {
	data() {
		return {
			key: 'value',
			type: 1, // 1:手机验证 2:输入密码
			mobileNoType: "hk",// 选择的手机好类型
			mobileTip: {},
			mobileOptions: [],

			registerCheck: {
				showImageCode: false,
				agreeProtocol: false
			},
			values: {
				// 返回的token，串连整个流程，后台安全校验使用
				vcodeuuid: "",
				token: "",
				deviceId: "",
				imageBase64: "",
				password: "",
				passwordRepeat: ""
			},
			registerForm: {
				imageValue: "",
				mobileNo: "",
				otp: ""
			},
			times: {
				interval: 0, // 索引
				remain: 0, // 剩余时间
				tip: "" // 显示的文字
			},

			errorTips: {
				p1: "",// 手機號
				p2: "",// 短信驗證碼
				p3: "",// 圖像驗證碼
				p4: "",// 密碼
				p5: "",// 確認密碼
			},
			modalSimpleVisiable: false,
			modalVisiable: false,
			targetPath: "",
			modalIcon: "succ",
			modalContent: ""
		}
	},
	components: {
		modalComp,
		modalSimpleComp
	},
	computed: {
		locale() {
			return this.$i18n.locale || 'tc';
		},
		i18n() {
			return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
		},
		registerDisabled() {
			let b1 = !this.registerCheck.agreeProtocol;
			let b2 = !this.values.token;
			let b3 = this.values.vcodeuuid && !this.registerForm.imageValue;
			let b4 = !this.registerForm.opt;
			return b1 || b2 || b3 || b4;
		},
		submitDisabled() {
			let b1 = !this.values.password ? true : false;
			let b2 = !this.values.passwordRepeat ? true : false;
			return b1 || b2;
		}
	},
	methods: {
		showModal(content, icon) {
			icon = !icon || typeof icon === "undefined" ? "succ" : icon;
			this.modalIcon = icon;
			this.modalContent = content;
			if (icon == "succ") {
				this.modalVisiable = true;
			} else {
				this.modalSimpleVisiable = true;
			}
		},
		closeModal() {
			this.modalVisiable = false;
			this.modalSimpleVisiable = false;
		},
		onProtocolHandler() {
			this.$router.push({
				path: "/protocol"
			})
		},
		handlerStdSendOTP() {
			// 发送短信验证码
			this._checkMobileLegal().then(() => {
				if (this.times.remain > 0) {
					return;
				}
				if (this.values.vcodeuuid && !this.registerForm.imageValue) {
					this._showImageValueTip();
					return;
				}
				this._handlerIsShowImageVcode().then(() => {
					this._startStdSendOTP();
					this._startTimeClick();
				});
			});
		},
		_checkMobileLegal() {
			// 检测手机号是否正确
			return new Promise((resolve, reject) => {
				let mobile = this.registerForm.mobileNo;
				if (this.mobileNoType == "hk") {
					if (mobile.length != 8 && !contactMethodCheck('hkmobile', mobile)) {
						this._showMobileNoIllegalTip()
						return;
					}
				} else {
					if (mobile.length != 11 && !contactMethodCheck('mobile', mobile)) {
						this._showMobileNoIllegalTip()
						return;
					}
				}
				resolve(true);
			});
		},
		_handlerIsShowImageVcode() {
			return new Promise((resolve, reject) => {

				// 如果这个值不为空，标识出现了图片验证码，不需要重新询问是否需要图像验证码了
				if (this.values.vcodeuuid) {
					resolve();
					return;
				}

				httpPost({
					url: api.stdIsShowImageVcode,
					data: {
						deviceId: this.values.deviceId,
						userId: this.registerForm.mobileNo
					}
				}).then(response => {
					// 判断是否显示图形验证码
					if (response.returnCode == "0") {
						this.values.token = response.data.token;
						if (response.data.isShowVcode == "N") {
							// 测试代码
							// if (!this.values.vcodeuuid) {
							// 	this.registerCheck.showImageCode = true;
							// 	this.values.vcodeuuid = "123456";
							// 	return;
							// }
							this.values.vcodeuuid = null;
							resolve(response);
						} else {
							// image 值：
							this.registerCheck.showImageCode = true;
							this.values.vcodeuuid = response.data.vcodeuuid;
							this.values.imageBase64 = response.data.image;
						}
					}
					return false;
				})
			});
		},
		_showMobileNoIllegalTip() {
			let message = this.i18n.register.tips.e1;
			this.errorTips.p1 = message;
			// alert("手机号不正确");
		},
		_startStdSendOTP() {
			// 正式发送OTP信号
			let data = {
				mobileNo: this.registerForm.mobileNo,
				token: this.values.token,
				signFactor: new Date().getTime(),
				scene: "register",
			}
			if (this.values.vcodeuuid) {
				data["vcodeuuid"] = this.values.vcodeuuid;
				data["imageValue"] = this.registerForm.imageValue;
			}
			httpPost({ url: api.stdSendOTP, data: data });
		},
		_startTimeClick() {
			this.times.remain = 120;
			let _this = this;
			let i18n = this.$i18n.messages[this.$i18n.locale] || {};
			let msg = i18n.register.coutTips;
			_this.times.tip = msg.replace("{second}", _this.times.remain);
			this.times.interval = setInterval(function () {
				if (_this.times.remain <= 0) {
					clearInterval(_this.times.interval);
					_this.times.interval = 0;
					_this.times.remain = 0;
					return;
				}
				_this.times.remain--;
				_this.times.tip = msg.replace("{second}", _this.times.remain);
				_this.$set(_this, 'times', _this.times);
			}, 1000);
		},
		onSubmitHandler() {
			// this.type = 2;
			if (this.registerDisabled) {
				return;
			}
			this._checkParams().then(() => {
				this._regCheck().then(() => {
					// 验证短信验证码
					this._validateOTPandRepeat().then(() => {
						this.type = 2;
					});
				});
			});
		},
		_validateOTPandRepeat() {
			return new Promise((resolve, reject) => {
				let data = {
					mobileNo: this.registerForm.mobileNo,
					token: this.values.token,
					signFactor: new Date().getTime(),
					otp: this.registerForm.opt
				};
				httpPost({
					url: api.stdValidateOTPandRepeat,
					data: data
				}).then(response => {
					if (response.returnCode != "0") {
						this._showCheckOTPErrTip(response.returnMsg);
						// TODO 测试代码
						// resolve();
					} else {
						// this.type = 2;
						resolve();
					}
				})
			});
		},
		_regCheck() {
			// 检测手机号注册情况
			return new Promise((resolve, reject) => {
				let data = {
					mobileNo: this.registerForm.mobileNo,
				};
				httpPost({
					url: api.gsRegCheck,
					data: data
				}).then(response => {
					if (response.returnCode == "0") {
						if (response.data.mobileStatus == "N") {
							resolve();
						} else {
							// 重复注册
							this._showDuplicateRegistrationTip();
						}
					} else {
						// 错误提示
						this._showCheckOTPErrTip(response.returnMsg);
					}
				})
			});
		},
		_checkParams() {
			return new Promise((resolve, reject) => {
				this._checkMobileLegal().then(() => {
					if (!this.registerCheck.agreeProtocol) {
						this._showAgreeProtocolTip();
						return;
					}
					if (!this.values.token) {
						this._showTokenTip();
						return;
					}
					if (this.values.vcodeuuid && !this.registerForm.imageValue) {
						this._showImageValueTip();
						return;
					}
					if (!this.registerForm.opt) {
						this._showOTPTip();
						return;
					}
					resolve();
				})
			});
		},

		_showAgreeProtocolTip() {
			let message = this.i18n.register.tips.e2;
			// this.showModal(message, "info");

			// alert("请同意协议")
		},
		_showOTPTip() {
			let message = this.i18n.register.tips.e3;
			this.errorTips.p2 = message;
			// alert("请填写短信验证码")
		},
		_showTokenTip() {
			let message = this.i18n.register.tips.e4;
			this.errorTips.p2 = message;
			// alert("请先请求短信验证码")
		},
		_showDuplicateRegistrationTip() {
			let message = this.i18n.register.tips.e5;
			// this.showModal(message, "info");
			this.errorTips.p1 = message;
			// alert("手机号已经被注册，请使用其他手机号重新注册")
		},
		_showImageValueTip() {
			let message = this.i18n.register.tips.e5;
			this.errorTips.p3 = message;
			// alert("请输入图片验证码")
		},
		_showCheckOTPErrTip(msg) {
			this.showModal(msg, "info");
			// alert(msg);
		},
		onRegisterHandler() {
			let c = this.checkPassword(this.values.password);
			if (c) {
				this.errorTips.p4 = c;
			} else {
				this.errorTips.p4 = "";
				let data = {
					token: this.values.token,
					mobileNo: this.registerForm.mobileNo,
					loginPwd: passwordEncrypt(this.values.password)
				};
				httpPost({
					url: api.stdRegister,
					data: data
				}).then(response => {
					if (response.returnCode != 0) {
						this._showRegisterFailure(response);
						this.type = 1;
					} else {
						this._showSuccessMessage();
					}
				})
			}
		},
		checkPassword(password) {
			if (password.length < 8) {
				return this.i18n.register.tips.e7;
			}
			// 匹配字母
			let m1 = /([a-z])+/.test(password);
			let m2 = /([A-Z])+/.test(password);
			// 匹配数字
			let m3 = /([0-9])+/.test(password);
			// 匹配特殊字符
			let m4 = /[^a-zA-Z0-9]+/.test(password);
			if ((m1 | m2) & m3 & m4) {
				return "";
			} else {
				return this.i18n.register.tips.e8;
			}
		},
		_showPasswordLenthNotEnouth() {
			let message = this.i18n.register.tips.e7;
			this.errorTips.p4 = message;
			// alert("密码长度不能少于8位")
		},
		_showPasswordComplexityTips() {
			let message = this.i18n.register.tips.e8;
			this.errorTips.p4 = message;
			// alert("密码必须同时包含数字、字母、特殊字符")
		},
		_showPasswordNotTheSameTips() {
			let message = this.i18n.register.tips.e9;
			this.errorTips.p5 = message;
			// alert("两次输入的密码不一致")
		},
		_showRegisterFailure(response) {
			if ("COMMON_ERROR_052" == response.returnCode) {
				this._resetRegisterParam();
				this.handlerRefreshImageVcode();
				let message = this.i18n.register.tips.e10;
				// alert("验证码过期，请重新申请验证码");
				// this.showModal(message, "info");
				this.errorTips.p2 = message;
			} else {
				this._resetAllParams();
				let message = this.i18n.register.tips.e11;
				// alert("注册失败，请联系工作人员");
				// this.showModal(message, "info");
				this.errorTips.p5 = message;
			}
		},
		_resetAllParams() {
			this.values.vcodeuuid = "";
			this.values.token = "";
			this.values.imageBase64 = "";
			this.values.password = "";
			this.values.passwordRepeat = "";

			this.registerForm.imageValue = "";
			this.registerForm.mobileNo = "";
			this.registerForm.otp = "";

			this.times.interval = "";
			this.times.remain = "";
			this.times.tip = "";
		},
		_resetRegisterParam() {
			this.values.token = "";
			this.registerForm.otp = "";
			this.times.interval = "";
			this.times.remain = "";
			this.times.tip = "";
		},
		handlerRefreshImageVcode() {
			if (this.values.vcodeuuid) {
				let data = {
					vcodeuuid: this.values.vcodeuuid
				}
				httpPost({
					url: api.stdRefreshVcode,
					data: data
				}).then(response => {
					this.$set(this.values, 'imageBase64', response.data.image);
				})
			}
		},
		_showSuccessMessage() {
			let message = this.i18n.register.tips.e12;
			this.showModal(message, "succ");
			this.targetPath = "/login";
			// alert("注册成功")
		},
		onForgetHandler() {

		},
		onLoginTypeHandler(val) {

		},
		initData() {
			let i18n = this.$i18n.messages[this.$i18n.locale] || {};
			let mobileOptions = JSON.parse(JSON.stringify(i18n.register.mobileOptions));
			this.mobileOptions = mobileOptions;
			this.mobileTip = this.mobileOptions[0];
		},
		modalCallback() {
			this.modalVisiable = false;
			if (this.targetPath) {
				this.$router.push({
					"path": this.targetPath
				});
			}
		}
	},
	mounted() { },
	watch: {
		mobileNoType() {
			this.mobileOptions.forEach(element => {
				if (element.type == this.mobileNoType) {
					this.$set(this, 'mobileTip', element);
				}
			})
		},
		'registerForm.mobileNo': function () {
			this.errorTips.p1 = "";
		},
		'registerForm.opt': function () {
			this.errorTips.p2 = "";
		},
		'registerForm.imageValue': function () {
			this.errorTips.p3 = "";
		},
		'values.password': function () {
			this.$set(this.errorTips, 'p4', this.checkPassword(this.values.password));
		},
		'values.passwordRepeat': function () {
			if (this.values.password != this.values.passwordRepeat) {
				this._showPasswordNotTheSameTips();
			} else {
				this.errorTips.p5 = "";
			}
		},
	},
	created() {
		this.initData();
	}
}