mirror of
https://git.imnavajas.es/jjimenez/safekat.git
synced 2025-07-25 22:52:08 +00:00
haciendo el borrar!
This commit is contained in:
51
httpdocs/assets/js/safekat/components/ConfirmDeleteModal.js
Normal file
51
httpdocs/assets/js/safekat/components/ConfirmDeleteModal.js
Normal file
@ -0,0 +1,51 @@
|
||||
class ConfirmDeleteModal {
|
||||
constructor(alias = "") {
|
||||
this.modalId = 'confirm2delete';
|
||||
|
||||
const removeClass = alias !== "" ? `btn-remove-${alias}` : 'btn-remove';
|
||||
|
||||
this.modalHtml = `
|
||||
<div class="modal fade" id="${this.modalId}" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="${this.modalId}Label" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="${this.modalId}Label">¿Estás seguro de que deseas eliminar?</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
Esta acción no se puede deshacer.
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-bs-dismiss="modal">Cancelar</button>
|
||||
<a id="confirmDelete" href="javascript:void(0);" class="btn btn-danger btn-confirm ${removeClass}">Eliminar</a>
|
||||
</div><!--//.modal-footer -->
|
||||
</div><!--//.modal-content -->
|
||||
</div><!--//.modal-dialog -->
|
||||
</div><!--//.modal -->
|
||||
`;
|
||||
}
|
||||
|
||||
// Método para mostrar el modal
|
||||
show(callback) {
|
||||
// Insertar el modal en el body del documento si no existe
|
||||
if (!document.getElementById(this.modalId)) {
|
||||
document.body.insertAdjacentHTML('beforeend', this.modalHtml);
|
||||
}
|
||||
|
||||
// Mostrar el modal usando Bootstrap
|
||||
const modal = new bootstrap.Modal(document.getElementById(this.modalId));
|
||||
modal.show();
|
||||
|
||||
// Configurar el evento de confirmación de eliminación
|
||||
document.getElementById('confirmDelete').addEventListener('click', () => {
|
||||
callback(); // Llamar al callback que el usuario haya proporcionado
|
||||
modal.hide(); // Cerrar el modal
|
||||
});
|
||||
}
|
||||
|
||||
// Método para ocultar el modal si es necesario
|
||||
hide() {
|
||||
const modal = new bootstrap.Modal(document.getElementById(this.modalId));
|
||||
modal.hide();
|
||||
}
|
||||
}
|
||||
@ -156,19 +156,21 @@ let Table = function (
|
||||
this.actionBtns = function (data) {
|
||||
let btns = ``;
|
||||
if (this.actions.includes('view')) {
|
||||
btns += `<span class="edit"><a href="javascript:void(0);"><i class="ti ti-eye ti-sm btn-edit-${this.alias} mx-2" data-id="${data.id}"></i></a></span>`;
|
||||
btns += `<span class="view"><a href="javascript:void(0);"><i class="ti ti-eye ti-sm btn-edit-${this.alias} mx-2" data-id="${data.id}"></i></a></span>`;
|
||||
}
|
||||
if (this.actions.includes('edit')) {
|
||||
btns += `<span class="edit"><a href="javascript:void(0);"><i class="ti ti-pencil ti-sm btn-edit-${this.alias} mx-2" data-id="${data.id}"></i></a></span>`;
|
||||
}
|
||||
if (this.actions.includes('delete')) {
|
||||
btns += `<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-${this.alias} mx-2" data-id="${data.id}" data-bs-toggle="modal" data-bs-target="${this.deleteModal}"></i></a>`;
|
||||
}
|
||||
if (this.actions.includes('cancel')) {
|
||||
btns += `<span class="cancel"></span>`;
|
||||
}
|
||||
if (this.actions.includes('delete')) {
|
||||
btns += `<a href="javascript:void(0);"><i class="ti ti-trash ti-sm btn-delete-${this.alias} mx-2" data-id="${data.id}" data-bs-toggle="modal" data-bs-target="${this.deleteModal}"></i></a>`;
|
||||
}
|
||||
|
||||
return btns;
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -23,7 +23,7 @@ let TableEditor = function (
|
||||
},
|
||||
table : table,
|
||||
idSrc: idSrc,
|
||||
fields: fields
|
||||
fields: fields,
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import Table from '../../components/table.js';
|
||||
import TableEditor from '../../components/tableEditor.js';
|
||||
import Confirm2Delete from '../../components/confirm2delete.js';
|
||||
import { getToken } from '../../common/common.js';
|
||||
|
||||
|
||||
@ -13,18 +14,51 @@ class tarifasClienteView {
|
||||
this.csrf_hash = $('#mainContainer').find('input[name="' + this.csrf_token + '"]').val();
|
||||
|
||||
this.clienteId = window.location.href.split("/").pop();
|
||||
this.actions = ['edit', 'delete'];
|
||||
this.actions = ['edit', 'delete', 'cancel'];
|
||||
|
||||
this.headerSearcher();
|
||||
|
||||
this.tableTarifas = null;
|
||||
this.editorTarifas = null;
|
||||
this.confirmDeleteModal = null;
|
||||
}
|
||||
|
||||
init() {
|
||||
|
||||
const self = this;
|
||||
|
||||
this.#initEditor();
|
||||
|
||||
this.#initTable();
|
||||
|
||||
|
||||
// Editar en linea la fila
|
||||
this.tableTarifas.table.on('click', 'tbody span.edit', function (e) {
|
||||
|
||||
const row = $(this).closest('tr');
|
||||
|
||||
// Iniciar la edición en línea para todas las celdas de la fila
|
||||
self.editorTarifas.editor.inline(
|
||||
self.tableTarifas.table.cells(row, '*').nodes(),
|
||||
{
|
||||
cancelHtml: '<a href="javascript:void(0);"><i class="ti ti-x"></i></a>',
|
||||
submitHtml: '<a href="javascript:void(0);"><i class="ti ti-device-floppy"></i></a>',
|
||||
cancelTrigger: row.find('span.cancel')[0],
|
||||
submitTrigger: row.find('span.edit')[0],
|
||||
submit: 'allIfChanged'
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
#initEditor() {
|
||||
|
||||
const self = this;
|
||||
|
||||
const tipo_linea = [
|
||||
{ label: window.language.ClientePrecios.interior, value: 'interior' },
|
||||
{ label: window.language.ClientePrecios.cubierta, value: 'cubierta' },
|
||||
@ -43,120 +77,111 @@ class tarifasClienteView {
|
||||
{ label: window.language.ClientePrecios.colorhq, value: 'colorhq' },
|
||||
];
|
||||
|
||||
const editorFields = [{
|
||||
name: "tipo",
|
||||
type: "select",
|
||||
options: tipo_linea
|
||||
}, {
|
||||
name: "tipo_maquina",
|
||||
type: "select",
|
||||
options: tipo_maquina
|
||||
}, {
|
||||
name: "tipo_impresion",
|
||||
type: "select",
|
||||
options: tipo_impresion
|
||||
}, {
|
||||
name: "tiempo_min"
|
||||
}, {
|
||||
name: "tiempo_max"
|
||||
}, {
|
||||
name: "precio_hora"
|
||||
}, {
|
||||
name: "margen"
|
||||
}, {
|
||||
name: "user_updated_id",
|
||||
type: 'hidden',
|
||||
const editorFields = [
|
||||
{
|
||||
name: "id",
|
||||
type: "readonly"
|
||||
}, {
|
||||
name: "tipo",
|
||||
type: "select",
|
||||
options: tipo_linea
|
||||
}, {
|
||||
name: "tipo_maquina",
|
||||
type: "select",
|
||||
options: tipo_maquina
|
||||
}, {
|
||||
name: "tipo_impresion",
|
||||
type: "select",
|
||||
options: tipo_impresion
|
||||
}, {
|
||||
name: "tiempo_min"
|
||||
}, {
|
||||
name: "tiempo_max"
|
||||
}, {
|
||||
name: "precio_hora"
|
||||
}, {
|
||||
name: "margen"
|
||||
}, {
|
||||
name: "user_updated_id",
|
||||
type: 'hidden',
|
||||
|
||||
}, {
|
||||
name: "updated_at",
|
||||
type: 'hidden',
|
||||
}, {
|
||||
name: "updated_at",
|
||||
type: 'hidden',
|
||||
|
||||
}, {
|
||||
"name": "plantilla_id",
|
||||
"type": "hidden"
|
||||
}, {
|
||||
"name": "cliente_id",
|
||||
"type": "hidden"
|
||||
}, {
|
||||
"name": "deleted_at",
|
||||
"type": "hidden"
|
||||
}, {
|
||||
"name": "is_deleted",
|
||||
"type": "hidden"
|
||||
},
|
||||
}, {
|
||||
name: "plantilla_id",
|
||||
type: "hidden"
|
||||
}, {
|
||||
name: "cliente_id",
|
||||
type: "hidden"
|
||||
}, {
|
||||
name: "deleted_at",
|
||||
type: "hidden"
|
||||
}, {
|
||||
name: "is_deleted",
|
||||
type: "hidden"
|
||||
},
|
||||
];
|
||||
this.editorTarifas = new TableEditor(
|
||||
$('#tableOfPrecios'),
|
||||
'/clienteprecios/datatable_editor',
|
||||
{ [this.csrf_token]: this.csrf_hash },
|
||||
'id',
|
||||
editorFields);
|
||||
|
||||
this.editorTarifas.init();
|
||||
|
||||
this.editorTarifas.editor.on('preSubmit', function (e, d, type) {
|
||||
if (type === 'create') {
|
||||
d.data[0]['cliente_id'] = this.clienteId;
|
||||
}
|
||||
else if (type === 'edit') {
|
||||
for (v in d.data) {
|
||||
d.data[v]['cliente_id'] = this.clienteId;
|
||||
}
|
||||
d.data[0]['cliente_id'] = self.clienteId;
|
||||
}
|
||||
});
|
||||
|
||||
this.editorTarifas.editor.on('submitSuccess', function (e, json, data, action) {
|
||||
|
||||
this.tableTarifas.table.clearPipeline();
|
||||
this.tableTarifas.table.draw();
|
||||
self.tableTarifas.table.clearPipeline();
|
||||
self.tableTarifas.table.draw();
|
||||
});
|
||||
|
||||
|
||||
this.editorTarifas.editor.on('postEdit', function (e, json, data, action) {
|
||||
/*const domain = window.location.origin
|
||||
fetch(domain + "/clientes/clienteprecios/update/" + id, {
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
<?= csrf_token() ?? "token" ?> : <?= csrf_token() ?> v
|
||||
}),
|
||||
headers: {
|
||||
"Content-type": "application/json; charset=UTF-8"
|
||||
}
|
||||
})*/
|
||||
self.#borrarPlantillaTarifa(self.clienteId);
|
||||
})
|
||||
|
||||
this.editorTarifas.editor.on('postCreate', function (e, json, data, action) {
|
||||
const domain = window.location.origin
|
||||
/*fetch(domain + "/clientes/clienteprecios/update/" + id, {
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
<?= csrf_token() ?? "token" ?> : <?= csrf_token() ?> v
|
||||
}),
|
||||
headers: {
|
||||
"Content-type": "application/json; charset=UTF-8"
|
||||
}
|
||||
})*/
|
||||
self.#borrarPlantillaTarifa(self.clienteId);
|
||||
})
|
||||
this.#initTable();
|
||||
|
||||
this.tableTarifas.table.on( 'click', 'tbody span.edit', function (e) {
|
||||
self.editorTarifas.editor.inline(
|
||||
self.tableTarifas.table.cells(this.parentNode.parentNode, '*').nodes(),
|
||||
{
|
||||
cancelHtml: '<a href="javascript:void(0);"><i class="ti ti-x"></i></a>',
|
||||
cancelTrigger: 'span.cancel',
|
||||
submitHtml: '<a href="javascript:void(0);"><i class="ti ti-device-floppy"></i></a>',
|
||||
submitTrigger: 'span.edit',
|
||||
submit: 'allIfChanged'
|
||||
}
|
||||
);
|
||||
} );
|
||||
this.editorTarifas.editor.on('postCancel', function (e, json, data) {
|
||||
// Restaurar botones de acción por fila
|
||||
self.tableTarifas.table.rows().nodes().each(function (node) {
|
||||
$(node).find('span.edit').removeClass('d-none');
|
||||
$(node).find('span.cancel, span.submit').addClass('d-none');
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
#borrarPlantillaTarifa(id) {
|
||||
|
||||
const domain = window.location.origin
|
||||
fetch(domain + "/clientes/clienteprecios/update/" + id, {
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
[self.csrf_token]: self.csrf_hash
|
||||
}),
|
||||
headers: {
|
||||
"Content-type": "application/json; charset=UTF-8"
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
#initTable() {
|
||||
|
||||
const self = this;
|
||||
|
||||
const columns = [
|
||||
{ 'data': 'id' },
|
||||
{
|
||||
'data': 'tipo',
|
||||
'render': function (data, type, row, meta) {
|
||||
@ -217,10 +242,11 @@ class tarifasClienteView {
|
||||
|
||||
|
||||
this.tableTarifas.init({
|
||||
actions: ['edit', 'delete'],
|
||||
actions: self.actions,
|
||||
buttonNewWithEditor: true,
|
||||
buttonsExport: true,
|
||||
editor: this.editorTarifas.editor,
|
||||
deleteModal: '#confirm2delete'
|
||||
});
|
||||
|
||||
|
||||
@ -245,7 +271,7 @@ class tarifasClienteView {
|
||||
|
||||
if (!$(this).hasClass("noFilter")) {
|
||||
|
||||
if (i == 0) {
|
||||
if (i == 1) {
|
||||
|
||||
// Agregar un selector en la segunda columna
|
||||
$(this).html('<select class="form-control" style="min-width:100px;max-width:120px;font-size:0.8rem !important;"></select>');
|
||||
@ -266,7 +292,7 @@ class tarifasClienteView {
|
||||
|
||||
}
|
||||
|
||||
else if (i == 1) {
|
||||
else if (i == 2) {
|
||||
// Agregar un selector en la tercera columna
|
||||
$(this).html('<select class="form-control" style="min-width:100px;max-width:120px;font-size:0.8rem !important;"></select>');
|
||||
|
||||
@ -284,7 +310,7 @@ class tarifasClienteView {
|
||||
});
|
||||
}
|
||||
|
||||
else if (i == 2) {
|
||||
else if (i == 3) {
|
||||
// Agregar un selector en la cuarta columna
|
||||
$(this).html('<select class="form-control" style="min-width:100px;max-width:120px;font-size:0.8rem !important;"></select>');
|
||||
|
||||
|
||||
Reference in New Issue
Block a user