GNS.login = {};

new Vue({
    el: '[data-auth-login-block]',
    data: {
        email: '',
        phone: '',
        password: '',
        isSubmit: false,
        errorMessage: ''
    },
    mounted: function () {
        var self = this;

        GNS.login.$form = $(self.$el).find('form');

        GNS.login.$form.validate({
            onsubmit: false,
            ignore: false,
            errorElement: 'span',
            focusCleanup: true,
            onfocusout: false,
            onkeyup: false,
            onclick: false,
            rules: {
                'login-email': {
                    require_from_group: [1, '.login-login-group'],
                    email: true,
                    maxlength: 191
                },
                'login-phone': {
                    require_from_group: [1, '.login-login-group'],
                    minlength: 14,
                    pattern: /^\(0[1-9][0-9]\)[0-9]{3}-[0-9]{2}-[0-9]{2}$/
                },
                'login-password': {
                    required: true,
                    minlength: 8,
                    maxlength: 191,
                    nowhitespace: true
                }
            },
            errorPlacement: function (error, element) {
                error.addClass('form-el-error-message');
                element.closest('.form-group').append(error);
            },
            highlight: function (element, errorClass, validClass) {
                $(element).addClass('form-el-error');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('form-el-error');
            }
        });
    },
    methods: {
        submit: function () {
            var self = this;

            if (self.errorMessage) {
                self.errorMessage = '';
            }

            if (self.isSubmit) {
                return false;
            } else if (!GNS.login.$form.valid()) {
                return false;
            }

            self.isSubmit = true;

            $.ajax({
                url: '/auth/login',
                type: 'POST',
                data: {
                    email: self.email.toLocaleLowerCase(),
                    phone: self.phone,
                    password: sha1(self.password),
                    remember_me: +$('#login-remember-me').is(':checked'),

                    language: GNS.language,
                    user_location_id: GNS.userLocationId,
                    user_shop_id: GNS.userShopId,
                    user_delivery_address: GNS.userDeliveryAddress
                },
                success: function (data) {
                    if (data.status === 'success') {
                        self.reset();
                        $('#auth_modal').modal('hide');

                        window.location.reload(true);
                    } else {
                        self.errorMessage = data.message;
                    }

                    self.isSubmit = false;

                    if (GNS.isDebug) {
                        console.log('/auth/login[success]:', data);
                    }
                },
                error: function (error) {
                    self.isSubmit = false;

                    if (GNS.isDebug) {
                        console.log('/auth/login[error]:', error.responseJSON);
                    }
                }
            });
        },
        reset: function () {
            this.email = '';
            this.phone = '';
            this.password = '';
        }
    }
});