laravel-jstools
Version:
JS tools for building front-side of Laravel applications
230 lines (229 loc) • 10.5 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const App_1 = require("../../../../app/App");
const EntityTypeEnum_1 = require("../../../../entities/EntityTypeEnum");
const ModalUsageEnum_1 = require("../../../../entities/Modal/ModalUsageEnum");
const AppServiceProvider_1 = require("../../../../app/providers/AppServiceProvider");
window.App = new App_1.App({
lang: window.langData || {},
});
window.App.registerProvider(new AppServiceProvider_1.AppServiceProvider());
window.noty = (notyData) => {
window.App.noty(notyData);
};
window.table = (tableId, columns, scroll = true, options = {}, callbacks = {}) => {
const fullTableId = `#${tableId}`;
const $table = window.$(fullTableId);
const pageId = tableId.split('__Table')[0];
const scrollOpt = scroll ? { dom: '<lf<"wrapper-scroller"t>ip>', bAutoWidth: false } : {};
const table = $table.DataTable(Object.assign({
aaSorting: [],
ajax: {
url: $(`${fullTableId}_urlData`).val(),
data: function (data) {
const columnsList = $(`#${tableId}__colSelect`).val();
return Object.assign(Object.assign(Object.assign({}, window.tableFilterData(data, tableId)), { tableId, pageId }), { [tableId + '__filter_columns']: columnsList });
},
},
columns: columns,
preDrawCallback: function () {
$(`${fullTableId}_length`).find('select').addClass('form-select form-select-sm');
$(`${fullTableId}_filter`).find('input').addClass('form-control form-control-sm');
},
initComplete: function () {
$table.on('change', '.filter-input', function () {
table.draw();
});
$table.on('click', '.js-row-edit', function () {
const $this = window.$(this);
const formId = `${tableId}__formEdit`;
const modalId = `${tableId}__modalEdit`;
const formEdit = window.form(formId, {
noBtn: true,
ajax: true,
});
formEdit === null || formEdit === void 0 ? void 0 : formEdit.setAction(formEdit === null || formEdit === void 0 ? void 0 : formEdit.getAction().replace('*', $this.data('rowId')));
const modalEdit = window.modal(modalId, ModalUsageEnum_1.ModalUsageEnum.form, {
preloadData: {
method: 'GET',
url: $(`${fullTableId}_urlRowData`).val().replace('*', $this.data('rowId')),
},
submitCallback: () => {
table.draw();
},
});
modalEdit === null || modalEdit === void 0 ? void 0 : modalEdit.setForm(formEdit);
modalEdit === null || modalEdit === void 0 ? void 0 : modalEdit.show();
if (callbacks.jsRowEdit) {
callbacks.jsRowEdit(formId, modalId, formEdit, modalEdit);
}
});
$table.on('click', '.js-row-delete', function () {
const $this = window.$(this);
const rowCaption = $this.data('rowCaption');
const url = $(`${fullTableId}_urlRowDelete`).val().replace('*', $this.data('rowId'));
window.modalConfirmDeleteTableRow(rowCaption, url, table, fullTableId.substring(1));
});
$(`#${tableId}__colSelect`).on('change', function () {
$(`#${tableId}__form`).submit();
});
if (callbacks.initComplete) {
callbacks.initComplete();
}
},
}, options, scrollOpt));
return table;
};
window.tableHistory = (tableId, options = {}) => {
return window.table(tableId, [
{ data: 'id', name: 'id' },
{ data: 'user_id', name: 'user_id' },
{ data: 'model_id', name: 'model_id' },
{ data: 'event', name: 'event' },
{ data: 'occur_at', name: 'occur_at' },
{ data: 'data', name: 'data' },
], true, Object.assign({
order: [[0, 'desc']],
bFilter: false,
}, options));
};
window.tableFilterData = function (data, tableId) {
const checkboxNames = [];
$(`.${tableId}.filter.filter-input[type="checkbox"], #${tableId}.filter.filter-input[type="checkbox"]`).each(function () {
const $this = $(this);
data[$this.attr('name')] = $this.is(':checked') ? 'on' : 'off';
checkboxNames.push($this.attr('name'));
});
const componentNames = [];
$(`.${tableId} .filter .filter-input[data-jst-component], #${tableId} .filter .filter-input[data-jst-component]`).each(function () {
const $this = $(this);
const name = $this.data('jstField');
const id = $this.attr('id');
data[name] = window.components[id].getValue();
componentNames.push(name);
});
$.each($(`.${tableId} .filter .filter-input, #${tableId} .filter .filter-input`).serializeArray(), function (index, element) {
if (checkboxNames.indexOf(element.name) === -1 && componentNames.indexOf(element.name) === -1) {
if (element.name.indexOf('[]') > 0) {
if (!data[element.name]) {
data[element.name] = [];
}
data[element.name].push(element.value);
}
else {
data[element.name] = element.value;
}
}
});
return data;
};
window.form = (formId, formData = {}, componentsOptions = {}) => {
componentsOptions['jstree'] = window.cmpJsTreeOptions;
componentsOptions['quill'] = window.cmpQuillOptions;
componentsOptions['flatpickr'] = window.cmpFlatPickrOptions;
if (!!document.getElementById(formId)) {
return window.App.form(formId, formData, !!formData.ajax, componentsOptions, EntityTypeEnum_1.EntityTypeEnum.bs_5_2);
}
return null;
};
window.modal = (modalId, modalUsage, modalData = {}) => {
if (!!document.getElementById(modalId)) {
return window.App.modal(modalId, modalUsage, modalData, true, { bootstrap: window.bootstrap }, EntityTypeEnum_1.EntityTypeEnum.bs_5_2);
}
return null;
};
window.modalConfirmDeleteTableRow = (rowCaption, url, table, tableId, callback) => {
var _a;
(_a = window
.modal(!!tableId ? `${tableId}_ModalConfirmDelete` : 'PartialsModalConfirmDelete', ModalUsageEnum_1.ModalUsageEnum.confirm, {
bodyText: rowCaption,
submitData: {
url: url,
method: 'DELETE',
},
submitCallback: () => {
callback ? callback() : table === null || table === void 0 ? void 0 : table.draw();
},
})) === null || _a === void 0 ? void 0 : _a.show();
};
window.initButtonCreate = (table, tableId, callback = null) => {
$(`#${tableId}__btnCreate`).on('click', () => {
const formId = `${tableId}__formCreate`;
const modalId = `${tableId}__modalCreate`;
const preloadUrl = $(`#${formId}_urlData`).val();
const formCreate = window.form(formId, {
noBtn: true,
ajax: true,
});
const modalCreate = window.modal(modalId, ModalUsageEnum_1.ModalUsageEnum.form, Object.assign({
submitCallback: () => {
table.draw();
},
}, !preloadUrl
? {}
: {
preloadData: {
method: 'GET',
url: preloadUrl,
},
}));
modalCreate === null || modalCreate === void 0 ? void 0 : modalCreate.setForm(formCreate);
modalCreate === null || modalCreate === void 0 ? void 0 : modalCreate.show();
if (callback) {
callback(formId, modalId, formCreate, modalCreate);
}
});
};
window.initHistoryTab = (pageId, tableId, options = {}) => {
let table = null;
const buttonPaneHistoryEl = document.getElementById(`${pageId}__tabCard__buttonHistory`);
const tabPaneHistoryEl = document.getElementById(`${pageId}__tabCard__paneHistory`);
if (tabPaneHistoryEl === null || tabPaneHistoryEl === void 0 ? void 0 : tabPaneHistoryEl.classList.contains('active')) {
if (table === null) {
table = window.tableHistory(tableId, options);
}
}
buttonPaneHistoryEl === null || buttonPaneHistoryEl === void 0 ? void 0 : buttonPaneHistoryEl.addEventListener('shown.bs.tab', (event) => {
if (table === null) {
table = window.tableHistory(tableId, options);
}
});
return table;
};
window.initButtonCreateSettingColumn = (tableId) => {
$(`#${tableId}__btnCreateColumns`).on('click', () => {
const formId = `${tableId}__formCreateSettingColumns`;
const modalId = `${tableId}__modalCreateSettingColumns`;
const backTab = $(`#${formId}__inpBackTab`).val();
const formCreate = window.form(formId, {
noBtn: true,
ajax: true,
});
const modalCreate = window.modal(modalId, ModalUsageEnum_1.ModalUsageEnum.form, {
submitCallback: () => {
let url = window.location.href;
if (backTab) {
url += url.indexOf('?') > -1 ? '&' : '?' + 'tab=' + encodeURIComponent(backTab);
}
window.location.href = url;
},
});
modalCreate === null || modalCreate === void 0 ? void 0 : modalCreate.setForm(formCreate);
modalCreate === null || modalCreate === void 0 ? void 0 : modalCreate.show();
});
};
window.initButtonExport = (tableId) => {
const formId = `${tableId}__formExport`;
const form = window.form(formId);
form === null || form === void 0 ? void 0 : form.setSubmitButton($(`#${tableId}__btnExport`));
};
window.initButtonImport = (pageId) => {
const formId = `${pageId}__formImport`;
const form = window.form(formId);
// form?.setSubmitButton($(`#${formId}__btnUpload`));
};
window.initButtonImportTemplate = (pageId) => {
const formId = `${pageId}__formImportTemplate`;
const form = window.form(formId);
form === null || form === void 0 ? void 0 : form.setSubmitButton($(`#${formId}__btnDownload`));
};