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

import { contactMethodCheck } from "@utils/utils.js";
import { setTitle } from "@/utils/utils.js";

import Auth from "@components/auth/auth.vue";
import modalComp from "@/components/modal-comp/modal-comp.vue";
import PolicyHeadList from "./policy-head-list.vue";
import Vue from "vue";
import { Loading } from "vant";
Vue.use(Loading);

export default {
	data() {
		return {
			loading: false,
			showForm: false,
			key: "value",
			checked1: false,
			checked2: false,
			checked3: false,
			dataInit: false,
			selectedPolicies: [],
			data: {
				mobileAreaCode: "",
				mobile: "",
				email: "",
				address: "",

				areaCode: ""
			},
			errorTips: {
				e1: "",
				e2: "",
				e3: ""
			},

			modalSimpleVisiable: false,
			modalVisiable: false,
			targetPath: "",
			modalIcon: "succ",
			modalContent: "",

			// 新增
			// 国际号码区号列表
			areaCodeList: [
				{
					v: "abc",
					n: "abc"
				},
				{
					v: "efg",
					n: "efg"
				}
			],
			countryList:[
				{
					v: "cn",
					n: "中国"
				},
				{
					v: "en",
					n: "美国"
				}
			]
		};
	},
	components: {
		Auth,
		PolicyHeadList,
		modalComp
	},
	computed: {
		locale() {
			return this.$i18n.locale || "tc";
		},
		i18n() {
			return this.$i18n.messages && this.$i18n.locale
				? this.$i18n.messages[this.$i18n.locale]
				: {};
		},
		submitBtnDisabled() {
			let b1 = !this.selectedPolicies || this.selectedPolicies.length == 0;
			let b2 = !this.data.address && !this.data.email && !this.data.mobile;
			return b1 || b2;
		}
	},
	methods: {
		showModal(content, icon) {
			icon = !icon || typeof icon === "undefined" ? "succ" : icon;
			this.modalIcon = icon;
			this.modalContent = content;
			this.modalVisiable = true;
		},
		modalCallback() {
			this.modalVisiable = false;
		},
		showSuccess() {
			this.showModal(this.i18n.policyChangeContact.success);
		},
		updateContactsHandler() {
			if (this.submitBtnDisabled) {
				return;
			}

			let b1 = this.checkMobile();
			let b2 = this.checkEmail();
			let b3 = this.checkAddress();
			let b = b1 & b2 & b3;
			if (b) {
				if (this.loading) {
					return;
				}
				let policies = [];
				this.selectedPolicies.forEach(element => {
					policies.push({ policyId: element.id, policyCode: element.code });
				});
				let data = {
					mobileNo: this.data.mobile,
					address: this.data.address,
					email: this.data.email,
					mobileNoAcceptMsg: this.checked1 ? 1 : 0,
					addressAcceptMsg: this.checked2 ? 1 : 0,
					emailAcceptMsg: this.checked3 ? 1 : 0,
					policies: policies
				};
				this.loading = true;
				httpPost({
					url: api.updatePolicyContanct,
					data: data,
					sid: true
				})
					.then(() => {
						this.loading = false;
						this.showSuccess();
					})
					.catch(err => {
						this.loading = false;
						if (err.code == 404) {
							this.$refs.auth.noAuth();
						}
					});
			}
		},
		checkMobile() {
			if (this.data.mobile) {
				let hkMobile = contactMethodCheck("hkmobile", this.data.mobile);
				let zhMobile = contactMethodCheck("mobile", this.data.mobile);
				if (!hkMobile && !zhMobile) {
					this.errorTips.e1 = this.i18n.policyChangeContact.errorTips.e1;
					return false;
				}
			}
			return true;
		},
		checkAddress() {
			return true;
		},
		checkEmail() {
			if (this.data.email && !contactMethodCheck("email", this.data.email)) {
				this.errorTips.e3 = this.i18n.policyChangeContact.errorTips.e3;
				return false;
			}
			return true;
		},
		initData() {
			if (this.dataInit) {
				return;
			}
			if (this.loading) {
				return;
			}
			this.data = null;
			this.loading = true;
			let param = {
				policyId: this.selectedPolicies[0].id,
				policyCode: this.selectedPolicies[0].code
			};
			httpPost({
				url: api.policyDetail,
				data: param,
				sid: true
			})
				.then(response => {
					this.data = {};
					if (response) {
						this.loading = false;
						this.dataInit = true;
						this.data.mobile = response.clientMobileNo;
						this.checked1 = "1" == response.clientMobileAcceptMessage;
						this.data.address = response.clientContactAddress;
						this.checked2 = "1" == response.clientAddressAcceptMessage;
						this.data.email = response.clientEmail;
						this.checked3 = "1" == response.clientEmailAcceptMessage;
					}
				})
				.catch(res => {
					if (res.code == "404") {
						this.$refs.auth.noAuth();
					}
				});
		},
		handlePolicySelect(data) {
			this.selectedPolicies = data;
			this.initData();
		},
		userLogout() {
			this.showForm = false;
		},
		userLogin(data) {
			this.showForm = true;
		},
		initTitle() {
			try {
				let title = this.i18n.customService.menu42;
				setTitle(title);
			} catch (e) {
				console.error(e);
			}
		}
	},
	watch: {
		"data.mobile": function() {
			this.errorTips.e1 = "";
		},
		"data.address": function() {
			this.errorTips.e2 = "";
		},
		"data.email": function() {
			this.errorTips.e3 = "";
		}
	},
	mounted() {
		this.initTitle();
	}
};