992 lines
32 KiB
HTML
992 lines
32 KiB
HTML
|
<section class="py-md-4 py-2">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h1 class="text-secondary font-weight-bolder">Encuestas</h1>
|
||
|
|
<p>Sistema de gestión de encuestas, se pueden agregar encuesta, desactivar encuesta y modificar encuesta.</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="py-md-4 py-2 controller">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row align-items-center align-self-center">
|
||
|
|
<div class="col-12">
|
||
|
|
<table id="datatable" class="display table table-striped table-bordered" cellspacing="0" width="100%">
|
||
|
|
<thead>
|
||
|
|
<tr></tr>
|
||
|
|
</thead>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="py-md-4 py-2 editor" style="display: none;">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row align-items-center justify-content-start">
|
||
|
|
<div class="col-12 text-left my-4">
|
||
|
|
<h3 class="title-cat edit" style="display: none;">Editar encuesta</h3>
|
||
|
|
<h3 class="title-cat crear" style="display: none;">Crear encuesta</h3>
|
||
|
|
</div>
|
||
|
|
<div class="col-12 col-md-10">
|
||
|
|
<form class="formcontroller">
|
||
|
|
<input type="hidden" name="idencuesta" id="idencuesta" value="">
|
||
|
|
<input type="hidden" name="urlimgencuesta" id="urlimgencuesta" value="">
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="catsuperior" class="col-lg-2 col-lg-2 col-md-2 col-12 col-form-label">Categoría</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<select id="catsuperior" name="catsuperior" required="required" class="form-control col-12" data-live-search="true">
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label class="col-lg-2 col-md-2 col-12 col-form-label" for="titulo">Titulo</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<input id="titulo" name="titulo" placeholder="Titulo" type="text" class="form-control" required="required">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="desc" class="col-lg-2 col-md-2 col-12 col-form-label">Descripción</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<textarea id="desc" name="desc" cols="40" rows="5" class="form-control"></textarea>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label class="col-lg-2 col-md-2 col-12 col-form-label" for="orden">Orden</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<input id="orden" name="orden" placeholder="Orden" type="text" class="form-control">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="estilo" class="col-lg-2 col-md-2 col-12 col-form-label">Estilo</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<select id="estilo" name="estilo" class="custom-select" required="required">
|
||
|
|
<option value="libre">Libre</option>
|
||
|
|
<option value="bloqueado">Bloqueado</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="habilitado" class="col-lg-2 col-md-2 col-12 col-form-label">Habilitado</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<select id="habilitado" name="habilitado" class="custom-select" required="required">
|
||
|
|
<option value="1">HABILITADO</option>
|
||
|
|
<option value="0">DESHABILITADO</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label class="col-lg-2 col-md-2 col-12 col-form-label">Imagen</label>
|
||
|
|
<div class="col-lg-8 col-md-10 col-12">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-lg-12 col-md-12 col-12">
|
||
|
|
<p class="text-dark font-weight-bold">Se recomienda usar png y un tamaño de 512 x 512 px</p>
|
||
|
|
</div>
|
||
|
|
<div class="col-12 col-md-6 py-2 py-md-0">
|
||
|
|
<div class="UppyDragDrop"></div>
|
||
|
|
<div class="w-100 my-3">
|
||
|
|
<div class="for-ProgressBar"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="col-12 col-md-6 py-2 py-md-0 preview" style="display: none;">
|
||
|
|
<div class="card h-100">
|
||
|
|
<div class="card-body text-center">
|
||
|
|
<div class="ThumbnailGenerator"></div>
|
||
|
|
<div class="uploaded-files text-secondary">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row justify-content-center">
|
||
|
|
<div class="col-12 col-md-6 text-right">
|
||
|
|
<div class="btn btn-warning btn_cancelar">Cancelar</div>
|
||
|
|
<button name="Enviar" type="submit" value="Enviar" class="btn btn-primary">Enviar</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="py-md-4 py-2 editor-options" style="display: none;">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row align-items-center justify-content-start">
|
||
|
|
<div class="col-12 text-left my-4">
|
||
|
|
<h3 class="title-cat edit-options" style="display: none;">Editar preguntas</h3>
|
||
|
|
<h3 class="title-cat crear-options" style="display: none;">Crear preguntas</h3>
|
||
|
|
</div>
|
||
|
|
<div class="col-12 col-md-10">
|
||
|
|
<form class="formcontroller-options">
|
||
|
|
<input type="hidden" name="idencuesta-options" id="idencuesta-options" value="">
|
||
|
|
<input type="hidden" name="idoptions" id="idoptions" value="">
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="desc" class="col-md-2 col-12 col-form-label">Pregunta</label>
|
||
|
|
<div class="col-8">
|
||
|
|
<textarea id="pregunta" name="pregunta" cols="40" rows="5" class="form-control" placeholder="Pregunta" required="required"></textarea>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="desc" class="col-md-2 col-12 col-form-label">Descripción de la pregunta</label>
|
||
|
|
<div class="col-8">
|
||
|
|
<textarea id="desc_pregunta" name="desc_pregunta" cols="40" rows="5" class="form-control" placeholder="Descripción de la pregunta"></textarea>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="answers" class="col-md-2 col-12 col-form-label">Respuestas (una por linea)</label>
|
||
|
|
<div class="col-8">
|
||
|
|
<textarea id="answers" name="answers" cols="40" rows="5" class="form-control" placeholder="Coloca una opción por cada linea" required="required"></textarea>
|
||
|
|
</div>
|
||
|
|
<br>
|
||
|
|
<div class="py-2 check_answers text-danger" style="display: none;"><input type="checkbox" id="editanswers" name="editanswers" value="desactivado"><b> Habilitar edición de respuestas</b></div>
|
||
|
|
<input type="hidden" name="status-answers" id="status-answers" value="desactivado">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="form-group row">
|
||
|
|
<label class="col-md-2 col-12 col-form-label" for="orden-option">Orden de la pregunta</label>
|
||
|
|
<div class="col-8">
|
||
|
|
<input id="orden-options" name="orden-options" placeholder="Orden de la pregunta" type="text" class="form-control">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="form-group row">
|
||
|
|
<label for="habilitado-option" class="col-md-2 col-12 col-form-label">Habilitado</label>
|
||
|
|
<div class="col-8">
|
||
|
|
<select id="habilitado-options" name="habilitado-options" class="custom-select" required="required">
|
||
|
|
<option value="1">HABILITADO</option>
|
||
|
|
<option value="0">DESHABILITADO</option>
|
||
|
|
</select>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="form-group row justify-content-center">
|
||
|
|
<div class="col-12 col-md-6 text-right">
|
||
|
|
<div class="btn btn-warning btn_cancelar_options">Cancelar</div>
|
||
|
|
<button name="Enviar" type="submit" value="Enviar" class="btn btn-primary">Agregar</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="py-md-4 py-2 controller-options" style="display: none;">
|
||
|
|
<div class="container-fluid">
|
||
|
|
<div class="row align-items-center align-self-center">
|
||
|
|
<div class="col-12">
|
||
|
|
<table id="datatable-options" class="display table table-striped table-bordered" cellspacing="0" width="100%">
|
||
|
|
<thead>
|
||
|
|
<tr></tr>
|
||
|
|
</thead>
|
||
|
|
</table>
|
||
|
|
</div>
|
||
|
|
<div class="col-10 col-md-10 text-right">
|
||
|
|
<div class="btn btn-warning btn_cancelar">Cancelar</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
|
||
|
|
<script type="text/javascript">
|
||
|
|
$(".layer-load").show();
|
||
|
|
var table;
|
||
|
|
var tableOptions;
|
||
|
|
jQuery(document).ready(function ($) {
|
||
|
|
function parseJSON(resp) {
|
||
|
|
if (resp == null) return null;
|
||
|
|
if (typeof resp === 'object') return resp;
|
||
|
|
try { return JSON.parse(resp); }
|
||
|
|
catch (e) { console.error('Respuesta no-JSON del servidor:', String(resp).substring(0, 300)); return null; }
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
/**********************************************************************/
|
||
|
|
/****************** UPLOAD ********************************************/
|
||
|
|
/**********************************************************************/
|
||
|
|
var uppy = Uppy.Core({
|
||
|
|
debug: false,
|
||
|
|
autoProceed: true,
|
||
|
|
allowMultipleUploads: true,
|
||
|
|
locale: Uppy.locales.Spanish,
|
||
|
|
restrictions: {
|
||
|
|
allowedFileTypes: ['image/*']
|
||
|
|
}
|
||
|
|
});
|
||
|
|
uppy.use(Uppy.DragDrop, {
|
||
|
|
target: '.UppyDragDrop',
|
||
|
|
locale: {
|
||
|
|
strings: {
|
||
|
|
browse: 'Buscar',
|
||
|
|
dropHereOr: "Arrastra el archivo aqu\xed o %{browse}",
|
||
|
|
dropHint: "Arrastra el archivo aqu\xed",
|
||
|
|
dropPaste: "Arrastra el archivo aqu\xed, pegar o %{browse}",
|
||
|
|
dropPasteImport: "Arrastra el archivo aqu\xed, pegar, %{browse} o importar desde",
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}).use(Uppy.XHRUpload, {
|
||
|
|
headers: { 'X-CSRF-Token': window.CSRF_TOKEN },
|
||
|
|
endpoint: "encuestas_upload.php",
|
||
|
|
formData: true,
|
||
|
|
method: 'post',
|
||
|
|
fieldName: 'files[]'
|
||
|
|
}).use(Uppy.ProgressBar, { target: '.for-ProgressBar', hideAfterFinish: false }).on('upload-success', function (file, response) { onUploadSuccess(file, response) });
|
||
|
|
|
||
|
|
function onUploadSuccess(file, response) {
|
||
|
|
if (response.uploadURL) {
|
||
|
|
var url = response.uploadURL;
|
||
|
|
$("#urlimgencuesta").val(url);
|
||
|
|
var fileName = file.name;
|
||
|
|
$(".preview").show();
|
||
|
|
$(".uploaded-files").show().addClass('newimg');
|
||
|
|
$(".uploaded-files").html("");
|
||
|
|
$(".uploaded-files").html('<a class="btn-link" href="' + response.uploadURL + '" target="_blank">' +
|
||
|
|
'<img class="img-fluid" src="' + response.uploadURL + '"><br>' + fileName + '</a>');
|
||
|
|
} else {
|
||
|
|
Swal.fire(
|
||
|
|
'',
|
||
|
|
response.body.txt,
|
||
|
|
'error'
|
||
|
|
)
|
||
|
|
uppy.reset();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/**********************************************************************/
|
||
|
|
/****************** DATATABLE *****************************************/
|
||
|
|
/**********************************************************************/
|
||
|
|
function getData() {
|
||
|
|
listadoDeCategorias();
|
||
|
|
$("#datatable").html('<thead><tr></tr></thead>');
|
||
|
|
$.ajax({
|
||
|
|
url: 'encuestas.php'
|
||
|
|
}).done(function (data) {
|
||
|
|
var _data = JSON.parse(data);
|
||
|
|
var tableName = "#datatable";
|
||
|
|
var str;
|
||
|
|
$.each(_data.columns, function (k, colObj) {
|
||
|
|
str = '<th>' + colObj + '</th>';
|
||
|
|
$(str).appendTo(tableName + '>thead>tr');
|
||
|
|
});
|
||
|
|
|
||
|
|
table = $('#datatable').DataTable({
|
||
|
|
dom: "Bfrtip",
|
||
|
|
responsive: true,
|
||
|
|
"drawCallback": function (settings) {
|
||
|
|
$("#btn_edit, #btn_habilitar, #btn_edit_options").addClass('disabled');
|
||
|
|
addEventsCheck();
|
||
|
|
},
|
||
|
|
buttons: [{
|
||
|
|
extend: 'excel',
|
||
|
|
text: 'Exportar a Excel'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Editar',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
editar(e, dt, node, config);
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
id: 'btn_edit'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Editar opciones',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
editar_options(e, dt, node, config);
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
class:'btn btn-info',
|
||
|
|
id: 'btn_edit_options'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Alternar habilitar',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
deshabilitar(e, dt, node, config)
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
id: 'btn_habilitar'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Crear',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
crear();
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
id: 'btn_crear'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
],
|
||
|
|
'columnDefs': [{
|
||
|
|
'targets': 0,
|
||
|
|
'checkboxes': { 'selectRow': true }
|
||
|
|
}],
|
||
|
|
|
||
|
|
'order': [
|
||
|
|
[1, 'asc']
|
||
|
|
],
|
||
|
|
data: _data.datos,
|
||
|
|
"language": {
|
||
|
|
"url": "../json/Spanish.json"
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
$(".layer-load").hide();
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
table.columns.adjust().draw();
|
||
|
|
$(window).resize(function (event) {
|
||
|
|
/* Act on the event */
|
||
|
|
table.columns.adjust().draw();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function reloadData() {
|
||
|
|
listadoDeCategorias();
|
||
|
|
$.ajax({
|
||
|
|
url: 'encuestas.php'
|
||
|
|
})
|
||
|
|
.done(function (data) {
|
||
|
|
var NewlyCreatedData = JSON.parse(data);
|
||
|
|
table.clear();
|
||
|
|
table.rows.add(NewlyCreatedData.datos); // Add new data
|
||
|
|
table.columns.adjust().draw(); // Redraw the DataTable
|
||
|
|
table.column(0).checkboxes.deselectAll();
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
//console.log("error");
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
//console.log("complete");
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
function addEventsCheck() {
|
||
|
|
$("#datatable_wrapper input[type='checkbox']").on('change', function (e) {
|
||
|
|
setTimeout(function (){
|
||
|
|
console.log($("#datatable_wrapper input[type='checkbox']:checked").length);
|
||
|
|
if (table.column(0).checkboxes.selected().length == 0) {
|
||
|
|
$("#btn_edit, #btn_habilitar, #btn_edit_options").addClass('disabled');
|
||
|
|
} else if (table.column(0).checkboxes.selected().length == 1) {
|
||
|
|
$("#btn_edit, #btn_habilitar, #btn_edit_options").removeClass('disabled');
|
||
|
|
} else if (table.column(0).checkboxes.selected().length > 1) {
|
||
|
|
$("#btn_edit, #btn_edit_options").addClass('disabled');
|
||
|
|
$("#btn_habilitar").removeClass('disabled');
|
||
|
|
}
|
||
|
|
}, 150);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/**********************************************************************/
|
||
|
|
/****************** Editar, Deshabilitar, Crear ***********************/
|
||
|
|
/**********************************************************************/
|
||
|
|
|
||
|
|
function listadoDeCategorias() {
|
||
|
|
$(".layer-load").show();
|
||
|
|
$.ajax({
|
||
|
|
url: 'categorias_list.php',
|
||
|
|
type: 'POST'
|
||
|
|
})
|
||
|
|
.done(function (response) {
|
||
|
|
var _data = parseJSON(response);
|
||
|
|
if (_data.code == "1") {
|
||
|
|
$("#catsuperior").html("");
|
||
|
|
var _padres = _.filter(_data.datos, function (n) {
|
||
|
|
return n.padre == 0;
|
||
|
|
});
|
||
|
|
var _datos = _.groupBy(_data.datos, function (n) {
|
||
|
|
return n.padre;
|
||
|
|
});
|
||
|
|
|
||
|
|
$.each(_padres, function (index, val1) {
|
||
|
|
$("#catsuperior").append('<option disabled style="background-color: #959595; color: white;">' + val1.nombre + '</option>');
|
||
|
|
$.each(_datos, function (index, cats) {
|
||
|
|
$.each(cats, function (index, val) {
|
||
|
|
if (val.padre == val1.id || val.nombre == val1.nombre) {
|
||
|
|
if (val.nombre == val1.nombre) {
|
||
|
|
//$("[label='" + val1.nombre + "']").append('<option class="font-weight-bold" value="' + val.id + '">' + val.nombre + '</option>');
|
||
|
|
} else {
|
||
|
|
$("#catsuperior").append('<option value="' + val.id + '">' + val.nombre + '</option>');
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
} else {
|
||
|
|
|
||
|
|
Swal.fire({
|
||
|
|
html: "Sin categorias",
|
||
|
|
icon: "error",
|
||
|
|
onBeforeOpen: function () {},
|
||
|
|
onOpen: function () {},
|
||
|
|
onRender: function () {},
|
||
|
|
onClose: function () {
|
||
|
|
$(".btn_cancelar").click();
|
||
|
|
},
|
||
|
|
onAfterClose: function () {}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
$(".layer-load").hide();
|
||
|
|
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function editar(e, dt, node, config) {
|
||
|
|
var $table = table.table().node();
|
||
|
|
var $chkbox_checked = $('tbody input[type="checkbox"]:checked', $table);
|
||
|
|
$($chkbox_checked).closest('tr')
|
||
|
|
var data = table.row($($chkbox_checked).closest('tr')).data();
|
||
|
|
|
||
|
|
$("#idencuesta").val(data[0]);
|
||
|
|
$("#catsuperior").val(data[1]);
|
||
|
|
$("#titulo").val(data[3]);
|
||
|
|
$("#desc").val(data[4]);
|
||
|
|
$("#desc").trumbowyg('html',data[4]);
|
||
|
|
$("#orden").val(data[5]);
|
||
|
|
|
||
|
|
|
||
|
|
if (data[6] != null) {
|
||
|
|
var name = String(data[6]).split('/');
|
||
|
|
$(".preview").show();
|
||
|
|
$(".uploaded-files").html('<a class="btn-link" href="' + data[6] + '" target="_blank">' +
|
||
|
|
'<img class="img-fluid" src="' + data[6] + '"><br>' + name[name.length - 1] + '</a>');
|
||
|
|
$("#urlimgencuesta").val(data[6]);
|
||
|
|
}
|
||
|
|
|
||
|
|
$("#estilo").val(data[7]);
|
||
|
|
|
||
|
|
$("#habilitado").find('option').each(function (index, el) {
|
||
|
|
if ($(this).text() == data[8]) {
|
||
|
|
$("#habilitado").val($(this).attr('value'));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
$(".newimg").removeClass('newimg');
|
||
|
|
$(".controller").hide();
|
||
|
|
$(".editor").show();
|
||
|
|
$(".edit").show();
|
||
|
|
$(".crear").hide();
|
||
|
|
}
|
||
|
|
|
||
|
|
function editar_options(e, dt, node, config) {
|
||
|
|
$('.edit-options').show();
|
||
|
|
var $table = table.table().node();
|
||
|
|
var $chkbox_checked = $('tbody input[type="checkbox"]:checked', $table);
|
||
|
|
$($chkbox_checked).closest('tr')
|
||
|
|
var data = table.row($($chkbox_checked).closest('tr')).data();
|
||
|
|
|
||
|
|
loadOptions(data[0]);
|
||
|
|
}
|
||
|
|
|
||
|
|
function deshabilitar(e, dt, node, config) {
|
||
|
|
var rows_selected = table.column(0).checkboxes.selected();
|
||
|
|
|
||
|
|
var ids = new Array();
|
||
|
|
$.each(rows_selected, function (index, rowId) {
|
||
|
|
ids.push(rowId);
|
||
|
|
});
|
||
|
|
$(".layer-load").show();
|
||
|
|
$.ajax({
|
||
|
|
url: 'encuestas_delete.php',
|
||
|
|
type: 'POST',
|
||
|
|
data: { ids: ids },
|
||
|
|
})
|
||
|
|
.done(function (response) {
|
||
|
|
Swal.fire({
|
||
|
|
html: response,
|
||
|
|
icon: "success",
|
||
|
|
onBeforeOpen: function () {},
|
||
|
|
onOpen: function () {},
|
||
|
|
onRender: function () {},
|
||
|
|
onClose: function () {
|
||
|
|
reloadData();
|
||
|
|
},
|
||
|
|
onAfterClose: function () {}
|
||
|
|
});
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
$(".layer-load").hide();
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function crear() {
|
||
|
|
$("#idencuesta").val("");
|
||
|
|
$("#nombre").val("");
|
||
|
|
$("#desc").val("");
|
||
|
|
$("#urlimgencuesta").val("");
|
||
|
|
$("#habilitado").val(1);
|
||
|
|
$(".newimg").removeClass('newimg');
|
||
|
|
$(".controller").hide();
|
||
|
|
$(".editor").show();
|
||
|
|
$(".edit").hide();
|
||
|
|
$(".crear").show();
|
||
|
|
}
|
||
|
|
$(".btn_cancelar").click(function (event) {
|
||
|
|
//$(".newimg").removeClass('newimg');
|
||
|
|
if ($(".uploaded-files").hasClass('newimg')) {
|
||
|
|
$(".layer-load").show();
|
||
|
|
$.ajax({
|
||
|
|
url: 'encuestas_deletefile.php',
|
||
|
|
type: 'POST',
|
||
|
|
data: { file: $(".uploaded-files a").attr('href') },
|
||
|
|
})
|
||
|
|
.done(function (response) {
|
||
|
|
|
||
|
|
})
|
||
|
|
.fail(function (error) {
|
||
|
|
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
|
||
|
|
$(".layer-load").hide();
|
||
|
|
$(".preview").hide();
|
||
|
|
$(".ThumbnailGenerator, .uploaded-files").html("");
|
||
|
|
uppy.reset();
|
||
|
|
$(".controller").show();
|
||
|
|
$(".editor").hide();
|
||
|
|
$(".editor-options").hide();
|
||
|
|
$(".uploaded-files").removeClass('newimg');
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
$(".preview").hide();
|
||
|
|
$(".ThumbnailGenerator, .uploaded-files").html("");
|
||
|
|
uppy.reset();
|
||
|
|
$(".preview").hide();
|
||
|
|
$(".controller").show();
|
||
|
|
$(".editor").hide();
|
||
|
|
$(".editor-options").hide();
|
||
|
|
$(".controller-options").hide();
|
||
|
|
}
|
||
|
|
reloadData();
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
$.validator.addMethod('validUrl', function(value, element) {
|
||
|
|
var url = $.validator.methods.url.bind(this);
|
||
|
|
var pattern = new RegExp("^(?:https?://|s?ftps?://)?(?!www | www\.)[A-Za-z0-9_-]+\.+[A-Za-z0-9.\/%&=\?_:;-]+$");
|
||
|
|
return pattern.test("http://localhost/git/estafeta-lms360/site/pkg/scorm_check/index.html");
|
||
|
|
}, 'Por favorsss, escribe una URL válida.');
|
||
|
|
|
||
|
|
$(".formcontroller").validate({
|
||
|
|
submitHandler: function (form) {
|
||
|
|
$('.layer-load').show();
|
||
|
|
|
||
|
|
var controller = 'encuestas_update.php';
|
||
|
|
if ($(".crear").css("display") == "block") {
|
||
|
|
controller = 'encuestas_add.php';
|
||
|
|
}
|
||
|
|
$.ajax({
|
||
|
|
url: controller,
|
||
|
|
type: 'POST',
|
||
|
|
data: $(".formcontroller").serializeArray(),
|
||
|
|
})
|
||
|
|
.done(function (response) {
|
||
|
|
var _data = parseJSON(response);
|
||
|
|
if (_data.code == '200') {
|
||
|
|
loadOptions(_data.data['id']);
|
||
|
|
}else{
|
||
|
|
Swal.fire({
|
||
|
|
html: _data.msg,
|
||
|
|
icon: 'error',
|
||
|
|
onBeforeOpen: function () {},
|
||
|
|
onOpen: function () {},
|
||
|
|
onRender: function () {},
|
||
|
|
onClose: function () {
|
||
|
|
},
|
||
|
|
onAfterClose: function () {}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
//console.log("error");
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
//console.log("complete");
|
||
|
|
});
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
titulo: {
|
||
|
|
required: true,
|
||
|
|
maxlength: 254,
|
||
|
|
minlength: 2,
|
||
|
|
normalizer: function( value ) {
|
||
|
|
return $.trim( value );
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
/**********************************************************************/
|
||
|
|
/**************** DATATABLE OPTIONS ***********************************/
|
||
|
|
/**********************************************************************/
|
||
|
|
function getDataOptions(encuesta) {
|
||
|
|
listadoDeCategorias();
|
||
|
|
$("#datatable-options").html('<thead><tr></tr></thead>');
|
||
|
|
$.ajax({
|
||
|
|
url: 'encuestas_options.php',
|
||
|
|
type:'POST',
|
||
|
|
data:{idencuesta:encuesta}
|
||
|
|
}).done(function (data) {
|
||
|
|
var _data = JSON.parse(data);
|
||
|
|
|
||
|
|
var tableNameOptions = "#datatable-options";
|
||
|
|
var strOptions;
|
||
|
|
$.each(_data.columns, function (k, colObj) {
|
||
|
|
strOptions = '<th>' + colObj + '</th>';
|
||
|
|
$(strOptions).appendTo(tableNameOptions + '>thead>tr');
|
||
|
|
});
|
||
|
|
|
||
|
|
tableOptions = $('#datatable-options').DataTable({
|
||
|
|
dom: "Bfrtip",
|
||
|
|
responsive: false,
|
||
|
|
"drawCallback": function (settings) {
|
||
|
|
$("#btn_edit_options_select, #btn_habilitar_options").addClass('disabled');
|
||
|
|
addEventsCheckOptions();
|
||
|
|
},
|
||
|
|
buttons: [{
|
||
|
|
extend: 'excel',
|
||
|
|
text: 'Exportar a Excel'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Editar pregunta',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
editar_options_select(e, dt, node, config);
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
id: 'btn_edit_options_select'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Alternar habilitar',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
deshabilitar(e, dt, node, config)
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
id: 'btn_habilitar_options'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
{
|
||
|
|
text: 'Agregar pregunta',
|
||
|
|
action: function (e, dt, node, config) {
|
||
|
|
crear_options();
|
||
|
|
},
|
||
|
|
attr: {
|
||
|
|
id: 'btn_crear_options'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
],
|
||
|
|
'columnDefs': [{
|
||
|
|
'targets': 0,
|
||
|
|
'checkboxes': { 'selectRow': true }
|
||
|
|
}],
|
||
|
|
|
||
|
|
'order': [
|
||
|
|
[4, 'asc']
|
||
|
|
],
|
||
|
|
data: _data.datos,
|
||
|
|
"language": {
|
||
|
|
"url": "../json/Spanish.json"
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|
||
|
|
|
||
|
|
$(".layer-load").hide();
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
tableOptions.columns.adjust().draw();
|
||
|
|
$(window).resize(function (event) {
|
||
|
|
/* Act on the event */
|
||
|
|
tableOptions.columns.adjust().draw();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
function reloadDataOptions(encuesta) {
|
||
|
|
$.ajax({
|
||
|
|
url: 'encuestas_options.php',
|
||
|
|
type:'POST',
|
||
|
|
data:{idencuesta:encuesta}
|
||
|
|
})
|
||
|
|
.done(function (data) {
|
||
|
|
$('.editor-options').hide(300);
|
||
|
|
$('.controller-options').show(300);
|
||
|
|
var NewlyCreatedData = JSON.parse(data);
|
||
|
|
tableOptions.clear();
|
||
|
|
tableOptions.rows.add(NewlyCreatedData.datos); // Add new data
|
||
|
|
tableOptions.columns.adjust().draw(); // Redraw the DataTable
|
||
|
|
tableOptions.column(0).checkboxes.deselectAll();
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
//console.log("error");
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
//console.log("complete");
|
||
|
|
});
|
||
|
|
}
|
||
|
|
function addEventsCheckOptions() {
|
||
|
|
$("#datatable-options input[type='checkbox']").on('change', function (e) {
|
||
|
|
setTimeout(function (){
|
||
|
|
console.log($("#datatable-options input[type='checkbox']:checked").length);
|
||
|
|
if (tableOptions.column(0).checkboxes.selected().length == 0) {
|
||
|
|
$("#btn_edit_options_select, #btn_habilitar_options, #btn_edit_options").addClass('disabled');
|
||
|
|
} else if (tableOptions.column(0).checkboxes.selected().length == 1) {
|
||
|
|
$("#btn_edit_options_select, #btn_habilitar_options, #btn_edit_options").removeClass('disabled');
|
||
|
|
} else if (tableOptions.column(0).checkboxes.selected().length > 1) {
|
||
|
|
$("#btn_edit_options_select").addClass('disabled');
|
||
|
|
$("#btn_habilitar_options").removeClass('disabled');
|
||
|
|
}
|
||
|
|
}, 150);
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
function loadOptions(encuesta){
|
||
|
|
$('html, body').animate({
|
||
|
|
scrollTop: $(".navbar").offset().top
|
||
|
|
}, 1000);
|
||
|
|
|
||
|
|
if ($('#datatable-options').hasClass('Initialize')) {
|
||
|
|
reloadDataOptions(encuesta);
|
||
|
|
}else{
|
||
|
|
getDataOptions(encuesta);
|
||
|
|
$('#datatable-options').addClass('Initialize');
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
$('#idencuesta-options').val(encuesta);
|
||
|
|
$('.controller').hide(300);
|
||
|
|
$('.editor').hide(300);
|
||
|
|
$('.controller-options').show(300);
|
||
|
|
$('.layer-load').hide();
|
||
|
|
}
|
||
|
|
/**********************************************************************/
|
||
|
|
/************* Editar, Deshabilitar, Crear Opciones *******************/
|
||
|
|
/**********************************************************************/
|
||
|
|
function crear_options() {
|
||
|
|
$('.check_answers').hide();
|
||
|
|
$('#answers').attr('disabled',false);
|
||
|
|
$("#idpregunta").val("");
|
||
|
|
$('#pregunta').val();
|
||
|
|
$('#pregunta').trumbowyg('empty');
|
||
|
|
$("#answers").val("");
|
||
|
|
$("#habilitado").val(1);
|
||
|
|
|
||
|
|
|
||
|
|
$(".controller-options").hide();
|
||
|
|
$(".editor-options").show();
|
||
|
|
$(".edit-options").hide();
|
||
|
|
$(".crear-options").show();
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
function editar_options_select(e, dt, node, config) {
|
||
|
|
var $tableOptions = tableOptions.table().node();
|
||
|
|
var $chkbox_checkedOptions = $('tbody input[type="checkbox"]:checked', $tableOptions);
|
||
|
|
$($chkbox_checkedOptions).closest('tr')
|
||
|
|
var dataOptions = tableOptions.row($($chkbox_checkedOptions).closest('tr')).data();
|
||
|
|
|
||
|
|
$("#idoptions").val(dataOptions[0]);
|
||
|
|
$("#pregunta").val(dataOptions[1]);
|
||
|
|
$("#pregunta").trumbowyg('html',dataOptions[1]);
|
||
|
|
$("#desc_pregunta").val(dataOptions[2]);
|
||
|
|
$("#desc_pregunta").trumbowyg('html',dataOptions[2]);
|
||
|
|
|
||
|
|
var str = dataOptions[3];
|
||
|
|
var opciones = str.split(",");
|
||
|
|
|
||
|
|
console.log(opciones);
|
||
|
|
$('#answers').html('');
|
||
|
|
$.each(opciones, function (k, colObj) {
|
||
|
|
$('#answers').append(colObj+' ');
|
||
|
|
});
|
||
|
|
$('#answers').attr('disabled',true);
|
||
|
|
$('#status-answers').val('desactivado');
|
||
|
|
$("#editanswers").prop('checked',false);
|
||
|
|
$('.check_answers').show();
|
||
|
|
|
||
|
|
$("#orden-options").val(dataOptions[4]);
|
||
|
|
$("#habilitado").find('option').each(function (index, el) {
|
||
|
|
if ($(this).text() == dataOptions[5]) {
|
||
|
|
$("#habilitado").val($(this).attr('value'));
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
$(".newimg").removeClass('newimg');
|
||
|
|
$(".controller-options").hide();
|
||
|
|
$(".editor-options").show();
|
||
|
|
$(".edit-options").show();
|
||
|
|
$(".crear-options").hide();
|
||
|
|
}
|
||
|
|
|
||
|
|
$("#editanswers").on('change', function() {
|
||
|
|
if( $(this).is(':checked') ) {
|
||
|
|
const swalWithBootstrapButtons = Swal.mixin({
|
||
|
|
customClass: {
|
||
|
|
confirmButton: 'btn btn-success',
|
||
|
|
cancelButton: 'btn btn-danger'
|
||
|
|
},
|
||
|
|
buttonsStyling: false
|
||
|
|
})
|
||
|
|
|
||
|
|
swalWithBootstrapButtons.fire({
|
||
|
|
title: 'Edición de respuestas?',
|
||
|
|
text: "Estas seguro de editar las respuestas al hacerlo se reiniciar el voteo de la pregunta",
|
||
|
|
icon: 'warning',
|
||
|
|
allowOutsideClick: false,
|
||
|
|
showCancelButton: true,
|
||
|
|
confirmButtonText: 'Si, continuar',
|
||
|
|
cancelButtonText: 'No, cancelar',
|
||
|
|
reverseButtons: true
|
||
|
|
}).then((result) => {
|
||
|
|
if (result.isConfirmed) {
|
||
|
|
$('#answers').attr('disabled',false);
|
||
|
|
$('#status-answers').val('activado');
|
||
|
|
swalWithBootstrapButtons.fire(
|
||
|
|
'Activado',
|
||
|
|
'Se ha activado la edición de respuestas',
|
||
|
|
'success'
|
||
|
|
)
|
||
|
|
} else if (
|
||
|
|
/* Read more about handling dismissals below */
|
||
|
|
result.dismiss === Swal.DismissReason.cancel
|
||
|
|
) {
|
||
|
|
$("#editanswers").prop('checked',false);
|
||
|
|
swalWithBootstrapButtons.fire(
|
||
|
|
'Cancelado',
|
||
|
|
'No se ha activado la edición de respuestas',
|
||
|
|
'error'
|
||
|
|
)
|
||
|
|
}
|
||
|
|
});
|
||
|
|
} else {
|
||
|
|
Swal.fire({
|
||
|
|
html: 'Se ha deshabilitado la edición de las respuestas',
|
||
|
|
icon: 'success',
|
||
|
|
onBeforeOpen: function () {},
|
||
|
|
onOpen: function () {},
|
||
|
|
onRender: function () {},
|
||
|
|
onClose: function () {
|
||
|
|
$('#answers').attr('disabled',true);
|
||
|
|
$('#status-answers').val('desactivado');
|
||
|
|
},
|
||
|
|
onAfterClose: function () {}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
$(".btn_cancelar_options").click(function (event) {
|
||
|
|
$('.editor-options').hide(300);
|
||
|
|
$('.controller-options').show(300);
|
||
|
|
});
|
||
|
|
|
||
|
|
$(".formcontroller-options").validate({
|
||
|
|
submitHandler: function (form) {
|
||
|
|
$('.layer-load').show();
|
||
|
|
|
||
|
|
var controller = 'encuestas_preguntas_update.php';
|
||
|
|
if ($(".crear-options").css("display") == "block") {
|
||
|
|
controller = 'encuestas_preguntas_add.php';
|
||
|
|
}
|
||
|
|
$.ajax({
|
||
|
|
url: controller,
|
||
|
|
type: 'POST',
|
||
|
|
data: $(".formcontroller-options").serializeArray(),
|
||
|
|
})
|
||
|
|
.done(function (response) {
|
||
|
|
var _data = parseJSON(response);
|
||
|
|
Swal.fire({
|
||
|
|
html: _data.msg,
|
||
|
|
icon: _data.icon,
|
||
|
|
onBeforeOpen: function () {},
|
||
|
|
onOpen: function () {},
|
||
|
|
onRender: function () {
|
||
|
|
$('.layer-load').hide();
|
||
|
|
},
|
||
|
|
onClose: function () {
|
||
|
|
reloadDataOptions($('#idencuesta-options').val());
|
||
|
|
},
|
||
|
|
onAfterClose: function () {}
|
||
|
|
});
|
||
|
|
|
||
|
|
})
|
||
|
|
.fail(function () {
|
||
|
|
//console.log("error");
|
||
|
|
})
|
||
|
|
.always(function () {
|
||
|
|
//console.log("complete");
|
||
|
|
});
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
pregunta: {
|
||
|
|
required: true,
|
||
|
|
maxlength: 254,
|
||
|
|
minlength: 2,
|
||
|
|
normalizer: function( value ) {
|
||
|
|
return $.trim( value );
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
/**********************************************************************/
|
||
|
|
/*************************** Configuraciones **************************/
|
||
|
|
/**********************************************************************/
|
||
|
|
|
||
|
|
$("#desc, #desc_pregunta, #pregunta").trumbowyg({
|
||
|
|
lang: 'es',
|
||
|
|
btns: [
|
||
|
|
['viewHTML'],
|
||
|
|
['formatting'],
|
||
|
|
['strong', 'em', 'del'],
|
||
|
|
['superscript', 'subscript'],
|
||
|
|
['justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull'],
|
||
|
|
['unorderedList', 'orderedList'],
|
||
|
|
['removeformat']
|
||
|
|
]
|
||
|
|
});
|
||
|
|
|
||
|
|
|
||
|
|
getData();
|
||
|
|
|
||
|
|
});
|
||
|
|
</script>
|