Авторизация по номеру телефона

События в JS

На клиентской стороне для выполнения тех или иных операций связанных с определенными событиями авторизации и регистрации, добавлен ряд событий, на которые можно подписаться.

На текущий момент в каждом комопненте свои события, нет како-то единого варианта пока.

Call и Login

В комопненте в основном вызывается везде одно события после любого Ajax запроса и получения ответа. Вместе с событием приходят данные о парамтрах инициализации, переданых данных и полученных.

<script type="text/javascript">
/*
// так вызывается событие
$(document).trigger('bxmaker.authuserphone.ajax', {
    'params': {},  // парамтеры  инифиализации комопнента
    'request': {}, // даныне отправленные в зарпосе
    'result': {}, //  полученые ответ от сервера
});
*/


// добавление обработчик события, чтобы отследить произошедшую авторизацию /
// регистрацию и отправить событие достижения цели в яндекс метрику
//  заменить XXXX на номер счетчика

$(document).on("bxmaker.authuserphone.ajax", function(event, data){

    var counterId = 'XXX';

    if(data.result && data.result.response && data.request.method === "auth") {

        if(data.result.response.type == 'AUTH') {
            console.log('AUTH');
            ym(counterId, "reachGoal", "authSuccess");
        }
        else {
            console.log('REGISTER');
            ym(counterId, "reachGoal", "registerSuccess");
        }
    }

    if(data.result && data.result.response && data.request.method === "register") {
        console.log('REGISTER');
        ym(counterId, "reachGoal", "registerSuccess");
    }
})
</script>

Simple

В комопненте в основном вызывается везде одно события после любого Ajax запроса и получения ответа. Вместе с событием приходят переданые данные и полученный ответ

Ответ на ajax запрос Simple 

<script type="text/javascript">
/*
// так вызывается событие
BX.Vue.event.$emit('BXmakerAuthuserphoneSimpleAjaxResponse', {
    request: {}, // данные в запросе
    result: {}, // полученный результат
});
*/


// добавление обработчик события, чтобы отследить произошедшую авторизацию /
// регистрацию и отправить событие достижения цели в яндекс метрику
//  заменить XXXX на номер счетчика


BX.Vue.event.$on('BXmakerAuthuserphoneSimpleAjaxResponse',(data) => {

    var counterId = 'XXX';
    var rand = data.request.rand;

    //получить доступ к объекту класса, через который можно управлять комопнентом
    // переменная определяется в шаблоне компонента
    var obj = window['BXmakerAuthuseremailSimple__' +  rand];

    // доступ к корневому vue
    var instance = obj.instance;

    // обновить капчу омжно так
    // instance.refreshCaptcha();


    if(data.result.response && data.request.method === 'checkConfirmation')
    {
        // если есть response, значит все хорошо и удалось
        // проверить подтвреждение и авторизоваться, зарегистрироваться

        if(data.result.response.type  == 'AUTH')
        {
            console.log('AUTH');
            ym(counterId, "reachGoal", "authSuccess");
        }
        else if(data.result.response.type == 'REG')
        {
            console.log('REGISTER');
            ym(counterId, "reachGoal", "registerSuccess");
        }


    }
});

</script>

Способ подтверждения Simple

Событие смены способа подтверждения - смс код, звонок от робота и тп

BX.Vue.event.$on('BXmakerAuthuserphoneSimpleChangeConfirmationType',(data) => {

    console.log('BXmakerAuthuserphoneSimpleChangeConfirmationType', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneSimple__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value === obj.instance.const.CONFIRM_TYPE_SMS_CODE)
    {
        console.info('*** Способ подтвреждения - СМС код')
    }
    else
    {
        console.info('*** Способ подтвреждения - НЕ СМС код')
    }
});

Блок подтверждения Simple

Событие показа/скрытия блоков с проверкой телефона

/**
 * Событие показа/скрытия блоков с проверкой телефона
 */
BX.Vue.event.$on('BXmakerAuthuserphoneSimpleChangeShowConfirm',(data) => {

    console.log('BXmakerAuthuserphoneSimpleChangeShowConfirm', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneSimple__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value)
    {
        console.info('*** Проверяется номер')
    }
    else
    {
        console.info('*** Подготовка к проверке номера')
    }
});

Enter

В комопненте в основном вызывается везде одно события после любого Ajax запроса и получения ответа. Вместе с событием приходят переданые данные и полученный ответ

Ответ на ajax запрос Enter 

<script type="text/javascript">
/*
// так вызывается событие
BX.Vue.event.$emit('BXmakerAuthuserphoneEnterAjaxResponse', {
    request: {}, // данные в запросе
    result: {}, // полученный результат
});
*/


// добавление обработчик события, чтобы отследить произошедшую авторизацию /
// регистрацию и отправить событие достижения цели в яндекс метрику
//  заменить XXXX на номер счетчика


BX.Vue.event.$on('BXmakerAuthuserphoneEnterAjaxResponse',(data) => {

    var counterId = 'XXX';
    var rand = data.request.rand;

    //получить доступ к объекту класса, через который можно управлять комопнентом
    // переменная определяется в шаблоне компонента
    var obj = window['BXmakerAuthuserphoneEnter__' +  rand];

    // доступ к корневому vue
    var instance = obj.instance;

    // обновить капчу омжно так
    // instance.refreshCaptcha();


    if(data.result.response && data.request.method === 'authByPassword')
    {
        // если есть response, значит все хорошо и удалось
        // проверить подтвреждение и авторизоваться

            console.log('AUTH');
            ym(counterId, "reachGoal", "authSuccess");
    }

     if(data.result.response && data.request.method === 'register')
    {
        // если есть response, значит все хорошо и удалось
        // проверить подтвреждение и зарегистрироваться

            console.log('REGISTER');
            ym(counterId, "reachGoal", "registerSuccess");
    }


    if(data.result.response && data.request.method === 'authByPhone')
    {
        // если есть response, значит все хорошо и удалось
        // проверить подтверждение и авторизоваться, зарегистрироваться
        if(data.result.response.type  == 'AUTH')
        {
            console.log('AUTH');
            ym(counterId, "reachGoal", "authSuccess");
        }
        else if(data.result.response.type == 'REG')
        {
            console.log('REGISTER');
            ym(counterId, "reachGoal", "registerSuccess");
        }
    }


});
</script>

Тип действия Enter

Событие смены типа действия - Авторизация, регистрация, восстановление пароля и тп


BX.Vue.event.$on('BXmakerAuthuserphoneEnterChangeActionType',(data) => {

    console.log('BXmakerAuthuserphoneEnterChangeActionType', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneEnter__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // выведем сообщение над формой
    obj.instance.setMessage('event ok ' + (new Date()).toLocaleString());

});

Способ подтверждения Enter

Событие смены способа подтверждения - смс код, звонок от робота и тп

BX.Vue.event.$on('BXmakerAuthuserphoneEnterChangeConfirmationType',(data) => {

    console.log('BXmakerAuthuserphoneEnterChangeConfirmationType', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneEnter__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value === obj.instance.const.CONFIRM_TYPE_SMS_CODE)
    {
        console.info('*** Способ подтвреждения - СМС код')
    }
    else
    {
        console.info('*** Способ подтвреждения - НЕ СМС код')
    }
});

Блок подтверждения Enter

Событие показа/скрытия блоков с проверкой телефона

BX.Vue.event.$on('BXmakerAuthuserphoneEnterChangeShowConfirm',(data) => {

    console.log('BXmakerAuthuserphoneEnterChangeShowConfirm', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneEnter__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value)
    {
        console.info('*** Проверяется номер')
    }
    else
    {
        console.info('*** Подготовка к проверке номера')
    }

});

Вход по паролю Enter

Событие смены способа входа, по паролю или нет

BX.Vue.event.$on('BXmakerAuthuserphoneEnterChangeIsAuthByPassword',(data) => {

    console.log('BXmakerAuthuserphoneEnterChangeIsAuthByPassword', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneEnter__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value)
    {
        console.info('*** Вход по паролю')
    }
    else
    {
        console.info('*** Вход через подтерждение телефона')
    }
});

Edit

В комопненте в основном вызывается везде одно события после любого Ajax запроса и получения ответа. Вместе с событием приходят переданые данные и полученный ответ

Ответ на ajax запрос Edit 

<script type="text/javascript">
/*
// так вызывается событие
BX.Vue.event.$emit('BXmakerAuthuserphoneEditAjaxResponse', {
    request: {}, // данные в запросе
    result: {}, // полученный результат
});
*/


// добавление обработчик события, чтобы отследить произошедшую авторизацию /
// регистрацию и отправить событие достижения цели в яндекс метрику
//  заменить XXXX на номер счетчика


BX.Vue.event.$on('BXmakerAuthuserphoneEditAjaxResponse',(data) => {

    var counterId = 'XXX';
    var rand = data.request.rand;

    //получить доступ к объекту класса, через который можно управлять комопнентом
    // переменная определяется в шаблоне комопнента
    var obj = window['BXmakerAuthuserphoneEdit__' +  rand];

    // доступ к корневому vue
    var instance = obj.instance;

    // скрыть подтверждение можно так -
    // instance.hideConfirmation();
    // или показать
    // instance.showConfirmation();


    if(data.result.response && data.request.method === 'checkConfirmation')
    {
        // если есть response, значит все хорошо и в нем сообщение об успешности выполнения операции
        console.log('PHONE_IS_CHANGED');

        ym(counterId, "reachGoal", "PHONE_IS_CHANGED");

    }
});


</script>

Способ подтверждения Edit

Событие смены способа подтверждения - смс код, звонок от робота и тп

BX.Vue.event.$on('BXmakerAuthuserphoneEditChangeConfirmationType',(data) => {

    console.log('BXmakerAuthuserphoneEditChangeConfirmationType', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneEdit__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value === obj.instance.const.CONFIRM_TYPE_SMS_CODE)
    {
        console.info('*** Способ подтвреждения - СМС код')
    }
    else
    {
        console.info('*** Способ подтвреждения - НЕ СМС код')
    }
});

Блок подтверждения Edit

Событие показа/скрытия блоков с проверкой телефона

BX.Vue.event.$on('BXmakerAuthuserphoneEditChangeShowConfirm',(data) => {

    console.log('BXmakerAuthuserphoneEditChangeShowConfirm', data);

    var rand = data.rand;

    // объект класса комопнента
    var obj = window['BXmakerAuthuserphoneEdit__' +  rand];

    console.log('obj', obj);

    // obj.instance -  объект корневого Vue комопнента,
    // через которого можно вызывать методы, менять значения и тп

    // проверим тип подтвреждения
    if(data.value)
    {
        console.info('*** Проверяется номер')
    }
    else
    {
        console.info('*** Подготовка к проверке номера')
    }
});
Агенты
\BXmaker\AuthUserPhone\Agent