Añadida funcionalidad de modal de confirmacion _modalConfirmDialog

This commit is contained in:
imnavajas
2023-09-21 23:44:54 +02:00
parent 46cff7dd2f
commit 9b38a685e4
5 changed files with 73 additions and 131 deletions

View File

@ -0,0 +1,45 @@
<div id="modalConfirmYesNo" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 id="labelTitleConfirmDialog" class="modal-title"></h4>
</div>
<div class="modal-body">
<p id="labelMsgConfirmDialog"></p>
</div>
<div class="modal-footer">
<button id="btnYesConfirmDialog"
type="button"
class="btn btn-primary"
><?= lang('Basic.global.yes') ?></button>
<button id="btnNoConfirmDialog"
type="button"
class="btn btn-default"
><?= lang('Basic.global.Cancel') ?></button>
</div>
</div>
</div>
</div>
<?= $this->section('additionalInlineJs') ?>
function asyncConfirmDialog(title, msg, yesCallbackFn, noCallbackFn) {
var $confirmDialog = $("#modalConfirmYesNo");
$confirmDialog.modal('show');
$("#labelTitleConfirmDialog").html(title);
$("#labelMsgConfirmDialog").html(msg);
$("#btnYesConfirmDialog").off('click').click(function () {
yesCallbackFn();
$confirmDialog.modal("hide");
});
$("#btnNoConfirmDialog").off('click').click(function () {
noCallbackFn();
$confirmDialog.modal("hide");
});
}
<?= $this->endSection() ?>

View File

@ -1,72 +0,0 @@
<div id="modalConfirmYesNo" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button"
class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<h4 id="lblTitleConfirmYesNo" class="modal-title">Confirmation</h4>
</div>
<div class="modal-body">
<p id="lblMsgConfirmYesNo"></p>
</div>
<div class="modal-footer">
<button id="btnYesConfirmYesNo"
type="button" class="btn btn-primary">Yes</button>
<button id="btnNoConfirmYesNo"
type="button" class="btn btn-default">No</button>
</div>
</div>
</div>
</div>
<?= $this->section('additionalInlineJs') ?>
function popAlert(message, alertClass, alertIcon){
var htmlString = `
<div class="alert ${alertClass} d-flex align-items-baseline" role="alert">
<span class="alert-icon alert-icon-lg text-primary me-2">
<i class="ti ${alertIcon} ti-sm"></i>
</span>
<div class="d-flex flex-column ps-1">
<h5 class="alert-heading mb-2">${message}</h5>
</div>
</div>`;
$(window).scrollTop(0);
$('#sk-alert').hide().empty().html(htmlString).fadeIn("slow", function(){
setTimeout(function(){
$('#sk-alert').fadeOut("slow");
}, 5000);
});
}
function popSuccessAlert(successMsg){
popAlert(successMsg, "alert-success", "ti-check");
}
function popWarningAlert(warningMsg){
popAlert(warningMsg, "alert-warning", "ti-bell");
}
function popErrorAlert(errorMsg){
popAlert(errorMsg, "alert-danger", "ti-ban");
}
<?php if (isset($successMessage) && $successMessage){ ?>
popSuccessAlert(`<?= $successMessage ?>`);
<?php } ?>
<?php if (isset($warningMessage) && $warningMessage){ ?>
popWarningAlert(`<?= $warningMessage ?>`);
<?php } ?>
<?php if (isset($errorMessage) && $errorMessage){ ?>
popErrorAlert(`<?= $errorMessage ?>`);
<?php } ?>
<?= $this->endSection() ?>