laravel-jstools/lib/entities/Form/Form.js

JS tools for building front-side of Laravel applications

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Form = void 0;
const laravel_jstools_di_1 = require("laravel-jstools-di");
const JSToolsAbstractMap_1 = require("../../app/JSToolsAbstractMap");
const ValidateError_1 = require("../../services/ValidateService/ValidateError");
const ContextTypeEnum_1 = require("../../types/ContextTypeEnum");
/*TODO omadonex:
  1. Из общих кейсов. Web форма внутри модалки после сабмита и получения ошибок валидации отрабатывает некорректно
     Необходимо переоткрыть форму с алертом
*/
class Form extends laravel_jstools_di_1.Service {
    constructor(formId, formData, showNoty, componentsOptions, validateService) {
        super();
        this.serviceDependsList = [
            JSToolsAbstractMap_1.JSToolsAbstractMap.TranslateServiceContract,
            JSToolsAbstractMap_1.JSToolsAbstractMap.AxiosServiceContract,
        ];
        this.modal = null;
        this.ruleList = {};
        this.defaultValues = {};
        this.defaultAction = '';
        this.defaultMethod = '';
        this.submitCallback = null;
        this.preSubmitCallback = null;
        this.afterSubmitCallback = null;
        this.extraSpinners = null;
        this.formId = formId;
        this.formData = formData;
        this.showNoty = showNoty;
        this.componentsOptions = componentsOptions;
        this.components = {};
        this.isSending = false;
        this.validateService = validateService;
        this.initData = {};
    }
    isAjax() {
        return this.formData.ajax || false;
    }
    isNoSubmitBtn() {
        return this.formData.noBtn || false;
    }
    isSubmitOnEnter() {
        if (this.formData.submitOnEnter !== undefined) {
            return this.formData.submitOnEnter;
        }
        return true;
    }
    saveDefaultValues() {
        this.defaultValues = this.serialize();
        this.defaultAction = this.getAction();
        this.defaultMethod = this.getMethod();
    }
    clearInputs() {
        this.setInputsValues(this.defaultValues);
    }
    getInitData() {
        return this.initData;
    }
    setInitData(data) {
        this.initData = data;
        this.setInputsValues(data);
    }
    setSubmitCallback(callback) {
        this.submitCallback = callback;
    }
    setPreSubmitCallback(callback) {
        this.preSubmitCallback = callback;
    }
    setAfterSubmitCallback(callback) {
        this.afterSubmitCallback = callback;
    }
    setExtraSpinners(spinnerList) {
        this.extraSpinners = spinnerList;
    }
    clear() {
        this.clearErrors();
        this.clearInputs();
        this.clearAlerts();
        this.setMethod(this.defaultMethod);
        this.setAction(this.defaultAction);
    }
    attachToModal(modal) {
        this.modal = modal;
    }
    preSubmitActions() {
        if (this.modal === null) {
            this.showSpinner();
            this.disableSubmitBtn();
            this.disableFieldsInput();
            if (this.preSubmitCallback) {
                this.preSubmitCallback();
            }
        }
        else {
            this.modal.showSubmitSpinner();
            this.modal.disableButtons();
            this.modal.showOverlay();
        }
    }
    afterSubmitActions() {
        if (this.modal === null) {
            this.hideSpinner();
            this.enableSubmitBtn();
            this.enableFieldsInput();
            if (this.afterSubmitCallback) {
                this.afterSubmitCallback();
            }
        }
        else {
            this.modal.hideSubmitSpinner();
            this.modal.enableButtons();
            this.modal.hideOverlay();
        }
    }
    submit() {
        this.clearErrors();
        this.clearAlerts();
        const errorList = this.validate();
        if (errorList !== true) {
            this.showErrors(errorList);
        }
        else {
            if (!this.isAjax()) {
                this.preSubmitActions();
                this.callFormSubmit();
            }
            else {
                this.doSubmit();
            }
        }
    }
    validate() {
        return this.validateService.validateForm(this);
    }
    doSubmit() {
        const axiosService = this.getService(JSToolsAbstractMap_1.JSToolsAbstractMap.AxiosServiceContract);
        const callbackList = {
            start: () => {
                this.isSending = true;
                this.preSubmitActions();
            },
            finish: () => {
                this.isSending = false;
                this.afterSubmitActions();
            },
            success: (data) => {
                if (this.modal === null) {
                    this.callSubmitCallback();
                }
                else {
                    this.modal.hide();
                    this.modal.callSubmitCallback();
                }
                this.clear();
            },
            error: (errors) => {
                const errorList = {};
                const alertList = [];
                for (const field of Object.keys(errors)) {
                    errorList[field] = {
                        rule: new ValidateError_1.ValidateError(field, 'rule', [], errors[field][0]),
                    };
                    alertList.push(errors[field][0]);
                }
                this.showErrors(errorList);
                this.showAlerts(alertList, ContextTypeEnum_1.ContextTypeEnum.danger);
            },
        };
        const send = axiosService.send({
            url: this.getAction(),
            method: this.getMethod(),
            data: this.serialize(),
            headers: {
                'X-Requested-With': 'XMLHttpRequest',
            },
        }, callbackList, this.showNoty);
        send.then((res) => {
            if (res.result && !res.data.status) {
                this.showAlerts(res.data.errors, ContextTypeEnum_1.ContextTypeEnum.danger);
                return;
            }
            if (!res.result && typeof res.data.status === 'undefined') {
                this.showAlerts([res.data], ContextTypeEnum_1.ContextTypeEnum.warning);
            }
        });
    }
    setRuleList(ruleList) {
        this.ruleList = ruleList;
    }
    callSubmitCallback() {
        if (this.submitCallback) {
            this.submitCallback();
            return;
        }
        if (typeof this.formData.submitCallback !== 'undefined') {
            this.formData.submitCallback();
        }
    }
    getId() {
        return this.formId;
    }
    getRuleList() {
        return this.ruleList;
    }
    getComponent(type) {
        return this.components[type];
    }
}
exports.Form = Form;