//let state = initalstate();

document.addEventListener("DOMContentLoaded", function () {
    if (document.getElementById('landvue')) {
        Vue.component('modal', {
            template: '#modal-template',
            props: {
                show: {
                    type: Boolean,
                    required: true,
                    twoWay: true
                }
            }
        });
        const Login = new Vue({
            el: '#landvue',
            data: function(){
                return some();
            },
            mounted() {
                if (localStorage.getItem('username')) {
                    let en64us = window.atob(localStorage.getItem('username'))
                    this.LoginForm.username = en64us;
                    this.IfExistLogin = true;
                } else {
                    this.IfExistLogin = false;
                }
            },
            methods: {
                enableev: function () {
                    document.onkeydown = this.writetwoauth;
                },
                writetwoauth(e) {
                    debugger
                    let key = Number(e.key);
                    let checkvals = this.twoauth.one !== null && this.twoauth.two !== null && this.twoauth.three !== null && this.twoauth.four !== null;


                    if (this.twoauthmodal == true) {
                        if (e.keyCode === 8) {
                            if (this.twoauth.four >= 0 && this.twoauth.four !== null) {
                                this.twoauth.four = null
                                return;
                            } else if (this.twoauth.three >= 0 && this.twoauth.three !== null) {
                                this.twoauth.three = null
                                return;
                            } else if (this.twoauth.two >= 0 && this.twoauth.two !== null) {
                                this.twoauth.two = null
                                return;
                            } else if (this.twoauth.one >= 0 && this.twoauth.one !== null) {
                                this.twoauth.one = null
                                return;
                            }
                        }

                        if (!isNaN(key) && this.twoauth.one == null) {
                            this.twoauth.one = e.key;
                        } else if (!isNaN(key) && this.twoauth.two == null) {
                            this.twoauth.two = e.key;
                        } else if (!isNaN(key) && this.twoauth.three == null) {
                            this.twoauth.three = e.key;
                        } else if (!isNaN(key) && this.twoauth.four == null) {
                            this.twoauth.four = e.key;

                                let otp = "";
                                otp = this.twoauth.one.toString();
                                otp = otp + this.twoauth.two.toString();
                                otp = otp + this.twoauth.three.toString();
                                otp = otp + this.twoauth.four.toString();
                                if (this.login_title == "რეგისტრაცია") {
                                    this.RegTwoAuth(otp);
                                } else {
                                    this.LoginTwoAuth(otp);
                                }


                        }


                    } else {
                    }

                },
                RegTwoAuth: function (otp) {
                    this.isLoading = true;
                    console.log("RegTwoAuth");
                    let token = document.querySelector('token, input[name=__RequestVerificationToken]').getAttribute('value');

                    let data = new FormData();
                    data.append('Phone', this.RegistrationForm.phone);
                    data.append('Otp', otp);
                    data.append('__RequestVerificationToken', token);

                    axios.post('/user/SubmitPhoneOtp', data)
                        .then((response) => {
                            console.log(response);
                            this.RegistrationForm.GUID = response.data.model.otpGuid;
                            this.twoauthmodal = false;
                            this.isLoading = false;
                            document.onkeydown = null;
                        })
                        .catch((response) => {
                            console.log(response);
                        })
                    //this.twoauthmodal = true;
                    //this.enableev();
                },
                ConfirmRegOTP: function () {
                    this.isLoading = true;

                    this.twoauth.one = null;
                    this.twoauth.two = null;
                    this.twoauth.three = null;
                    this.twoauth.four = null;
                    let token = document.querySelector('token, input[name=__RequestVerificationToken]').getAttribute('value');

                    let data = new FormData();
                    data.append('Phone', this.RegistrationForm.phone);
                    data.append('__RequestVerificationToken', token);

                    axios.post('/user/GeneratePhoneOtp', data)
                        .then((response) => {
                            this.isLoading = false;
                            console.log(response);
                        })
                        .catch((response) => {
                            console.log(response);
                        })
                    this.twoauthmodal = true;
                    this.enableev();
                },
                UserRegistration: function () {
                    this.isLoading = true;
                    let token = document.querySelector('token, input[name=__RequestVerificationToken]').getAttribute('value');

                    let data = new FormData();
                    data.append('UserName', this.RegistrationForm.username);
                    data.append('PhoneNumber', this.RegistrationForm.phone);
                    data.append('Name', this.RegistrationForm.name);
                    data.append('Surname', this.RegistrationForm.surname);
                    data.append('Email', this.RegistrationForm.mail);
                    data.append('Password', this.RegistrationForm.password);
                    data.append('RepeatPassword', this.RegistrationForm.repassword);
                    data.append('IsApplyTerms', this.RegistrationForm.rules);
                    data.append('OtpToken', this.RegistrationForm.GUID);
                    data.append('__RequestVerificationToken', token);

                    axios.post('/user/Registration', data)
                        .then((response) => {
                            console.log(response);
                        })
                        .catch((error) => {

                        })
                },
                UserLogin: function () {
                    this.isLoading = true;
                    let token = document.querySelector('token, input[name=__RequestVerificationToken]').getAttribute('value');

                    let data = new FormData();
                    data.append('UserName', this.LoginForm.username);
                    data.append('Password', this.LoginForm.password);
                    data.append('IsRemember', this.LoginForm.remember);
                    data.append('__RequestVerificationToken', token);

                    axios.post('/user/Login', data, {
                        headers: {
                            'Content-Type': "application/json; charset=utf-8",
                        }
                    })
                        .then((response) => {
                            debugger
                            console.log(response);
                            this.isLoading = false;
                            switch (true) {
                                case (this.LoginForm.username == "" && this.LoginForm.password == ""):
                                    this.errors.fielderror = true;
                                    this.errors.emptyfield.username = true;
                                    this.errors.emptyfield.password = true;
                                    this.errors.errortext = "გთხოვთ შეავსოთ ყველა სავალდებულო ველი";
                                    this.errors.showerror = true;
                                    break;
                                case (this.LoginForm.username == ""):
                                    this.errors.fielderror = true;
                                    this.errors.emptyfield.password = false;
                                    this.errors.emptyfield.username = true;
                                    this.errors.errortext = "გთხოვთ შეავსოთ ყველა სავალდებულო ველი";
                                    this.errors.showerror = true;
                                    break;
                                case (this.LoginForm.password == ""):
                                    this.errors.fielderror = true;
                                    this.errors.emptyfield.username = false;
                                    this.errors.emptyfield.password = true;
                                    this.errors.errortext = "გთხოვთ შეავსოთ ყველა სავალდებულო ველი";
                                    this.errors.showerror = true;
                                    break;
                                case (!response.data.success && response.data.fieldErrors.length > 0 && response.data.fieldErrors[0].fieldName == "UserName"):
                                    this.errors.fielderror = true;
                                    this.errors.emptyfield.username = true;
                                    this.errors.emptyfield.password = false;
                                    this.errors.errortext = "ელ-ფოსტის მისამართი არ არის სწორი";
                                    this.errors.showerror = true;
                                    break;
                                case (!response.data.success):
                                    this.errors.showerror = true;
                                    this.errors.emptyfield.username = false;
                                    this.errors.emptyfield.password = false;
                                    this.errors.errortext = response.data.messages[0];
                                    break;
                                case (response.data.success && !response.data.model.isOtpAuthorization):
                                    this.errors.showerror = false;
                                    if (this.LoginForm.remember) {
                                        let sv64us = window.btoa(this.LoginForm.username)
                                        localStorage.setItem("username", `${sv64us}`)
                                    }
                                    window.location = response.data.redirectUrl;
                                    break;
                                case (response.data.success && response.data.model.isOtpAuthorization):
                                    this.twoauthmodal = true;
                                    this.enableev();
                                    break;

                            }
                        })
                        .catch((response) => {
                            console.log(response)
                        })
                },
                LoginTwoAuth(otp) {
                    let token = document.querySelector('token, input[name=__RequestVerificationToken]').getAttribute('value');

                    let data = new FormData();
                    data.append('UserName', this.LoginForm.username);
                    data.append('Otp', otp);
                    data.append('Password', this.LoginForm.password);
                    data.append('__RequestVerificationToken', token);

                    axios.post('/user/OtpLogin', data, {
                        headers: {
                            'Content-Type': "application/json; charset=utf-8",
                        }
                    })
                        .then((response) => {
                            console.log(response);
                        })
                        .catch((response) => {
                            console.log(response)
                        })
                },
                Hinteye() {
                    this.passwordFieldType = this.passwordFieldType === 'password' ? 'text' : 'password'
                    if (this.passwordFieldType == 'text') {
                        this.passeye = "greeneye.svg";
                    } else {
                        this.passeye = "pass_eye.svg";
                    }
                },
                PassOnChange: function () {
                    if (this.LoginForm.password === "") {
                        this.InputValidate = false
                    } else {
                        this.InputValidate = true
                    }
                },
                ChangeTitle: function () {
                    if (this.login_title == "ავტორიზაცია") {
                        this.RegistrationForm.password = "";
                        this.InputValidate = false
                        this.login_title = "რეგისტრაცია";
                    } else {
                        this.login_title = "ავტორიზაცია";
                    }
                },
                removeExistUser: function () {
                    localStorage.removeItem("username");
                    this.LoginForm.username = "";
                    this.IfExistLogin = false;
                },
                ProfileDropdown: function () {
                    this.ProfileDropdownCheck = this.ProfileDropdownCheck === true ? false : true
                },
                MobileInpChange: function () {
                    console.log("tes");
                    if (this.RegistrationForm.phone === "") {
                        this.RegistrationForm.phoneconfirm = false
                    } else {
                        this.RegistrationForm.phoneconfirm = true
                    }
                }
            }
            //created() {
            //    if (this.showModal === true) {
            //        document.onkeydown = this.writetwoauth
            //    } else {

            //    }
            //}
        });
    } else if (document.getElementById('dashboard')) {
        const dashboard = new Vue({
            el: "#dashboard",
            data: {
                ProfileDropdownCheck: false
            },
            methods: {
                ProfileDropdown: function () {
                    this.ProfileDropdownCheck = this.ProfileDropdownCheck === true ? false : true
                }
            }
        })
    }
});