$=jQuery;
(function( $ ){
/* Add csrf token */
/* options: url: url to post, loading: dom id, success: func, pre_callback, separated_data:boolean */
$.fn.ajaxList = function (name_list, options)
{
if(!options.hasOwnProperty(loading)) {
$(loading).show();
}
table_base='';
// \
//
$(this).html(table_base);
//Connect with ajax.
if(!options.hasOwnProperty("url")) {
list_tr=' \
| No ajax url defined | \
';
$(this).children('#'+name_list).append(list_tr);
$(loading).hide();
return false;
}
exclude_list=[];
if(options.hasOwnProperty("exclude_list")) {
exclude_list=options.exclude_list;
}
this.order_field=0;
this.order=0;
arr_icon=['', ''];
var func=this;
this.updateAjax=function (name_list, options, position) {
// Get ajax, the ajax request need give a json request with name titles and fields value.
$('#'+name_list).html('');
$('.pages').remove();
$('.link_pages').off();
$('.change_order').off();
extra_data={}
if(options.hasOwnProperty("extra_data")) {
extra_data=options.extra_data;
}
data={position: position, order_field: func.order_field, order: func.order};
for(i in extra_data) {
data[i]=extra_data[i];
}
var block_name=$('#'+name_list).parent();
$.ajax({
type: 'POST',
url: options.url,
data: data,
success: function (data) {
order_field='';
list_tr='';
for(i in data.fields)
{
if(data.fields[i][1])
{
list_tr+='| '+data.fields[i][0]+' | ';
}
else
{
list_tr+=''+data.fields[i][0]+' | ';
}
}
list_tr+='
';
$('#'+name_list).append(list_tr);
list_tr='';
for(i in data.rows)
{
list_tr+='';
for(n in data.rows[i]) {
if(exclude_list.indexOf(n)==-1)
{
list_tr+='| '+data.rows[i][n]+' | ';
}
}
list_tr+='
';
}
$('#'+name_list).append(list_tr);
block_name.prepend(''+data.html_pages+'
');
block_name.append(''+data.html_pages+'
');
// Prepare defaults of fields orders
$('#field_list_'+func.order_field).append(' '+arr_icon[func.order]);
// Prepare button events
$('.link_pages').click(function (e) {
e.preventDefault();
position=parseInt($(this).attr('href').replace('#?begin_page=', ''));
if(isNaN(position))
{
position=0;
}
func.updateAjax(name_list, options, position);
});
$('.change_order').click(function (e) {
e.preventDefault();
func.order_field=$(this).attr('href').replace('#', '');
//alert($(this).children('i').attr('class'));
if($(this).children('i').hasClass('asc_icon'))
{
func.order=1;
}
else
{
func.order=0;
}
func.updateAjax(name_list, options, position);
});
if(options.hasOwnProperty("after_list")) {
after_list=options.after_list;
after_list();
}
},
error: function (data) {
console.log('Cannot connect to list source');
},
dataType: 'json'
});
};
this.updateAjax(name_list, options, 0, '');
$(loading).hide();
return this;
}
})( jQuery );
(function( $ ){
/* Add csrf token */
/* options: url: url to get urls, loading: dom id, success: func, pre_callback, separated_data:boolean */
$.fn.ajaxListSimple = function (fields, options) {
//console.log($(this).find('tr.row_list').attr('class'));
begin_page=0;
order_field='';
//order ASC=0, DESC=1
order=0;
order_by={};
if(!options.hasOwnProperty("url")) {
list_tr=' \
| No ajax url defined | \
';
$(this).append(list_tr);
return false;
}
if(!options.hasOwnProperty("num_elements")) {
options.num_elements=20;
}
if(!options.hasOwnProperty("initial_num_pages")) {
options.initial_num_pages=20;
}
if(!options.hasOwnProperty("order_fields")) {
options.order_fields=[];
}
else {
order_field=options.order_fields[0];
}
this.fields=fields;
this.options=options;
this.css_class='link_pages';
//Prepare search
for(i in options.order_fields) {
field=options.order_fields[i];
field_pos=this.fields.indexOf(field);
if(field_pos!=-1) {
html_ele=''+$(this).find('tr:first-child').children().eq(field_pos).html()+' ';
$(this).find('tr:first-child').children().eq(field_pos).html(html_ele);
if(field==order_field) {
$(this).find('tr:first-child').children().eq(field_pos).find('.fa-caret-square-o-down').show();
}
order_by[field]=1;
}
}
this.updateAjaxList=function () {
options=this.options;
if(options.hasOwnProperty("loading")) {
$(options.loading).show();
}
if(options.hasOwnProperty("pre_callback")) {
pre_callback(this);
}
//In url you can send, begin_page, num_elements for pagination.
$.ajax({
url: options.url,
type: 'GET',
data: {num_elements: options.num_elements, begin_page: begin_page, order_field: order_field, order: order},
table: this,
success: function (data) {
$(options.loading).hide();
//console.log(table.options);
if(!data.error) {
var z=0;
$(this.table).find('tr.row_list').remove();
for (const row of data.items) {
//console.log(element);
tr=this.table.append('|
');
//for (const property in row) {
for (const field of this.table.fields) {
//console.log(`${property}: ${row[property]}`);
var field_name=row[field];
$('#row_ajaxlist_'+z).append(''+field_name+' | ');
}
z++;
}
if(data.hasOwnProperty('total_num_items')) {
var total_elements=data.total_num_items;
var num_elements=options.num_elements;
var link=options.url;
var initial_num_pages=options.initial_num_pages;
var variable='begin_page';
var label='';
var func_jscript='';
var pages=pagination( begin_page, total_elements, num_elements, link ,initial_num_pages, variable, label, func_jscript, this.table.css_class);
$('#table_pages').remove();
this.table.after('');
}
if(options.hasOwnProperty("success")) {
options.success(data);
}
}
else {
if(options.hasOwnProperty("error_data")) {
options.error_data(data);
}
}
},
error: function (data) {
$(options.loading).hide();
alert('Error: '+data.status+' '+data.statusText);
},
dataType: 'json'
});
};
//Pages click method for change page
$(document).on('click', '.'+this.css_class, {table: this}, function (e) {
console.log('Changing page...');
begin_page=$(this).attr('data-begin');
//Update list getting begin_page variable
e.data.table.updateAjaxList();
return false;
});
//Method for change order in page
$(document).on('click', '.change_order', {table: this}, function (e) {
console.log('Changing order list...');
field=$(this).attr('data-field');
begin_page=0;
//Clean order_flag icons
$('.order_flag').hide();
//Reset other fields not selected
Object.entries(order_by).forEach(([key, value]) => {
if(key!=field) {
order_by[key]=1;
}
});
//Change order and showing flags from selected field
if(order_by[field]==1) {
order_by[field]=0;
order=order_by[field];
$('#flag_down_'+field).show();
}
else {
order_by[field]=1;
order=order_by[field];
$('#flag_up_'+field).show();
}
//Set order_field with selected field
order_field=field;
//Update list getting order_field variable
e.data.table.updateAjaxList();
return false;
});
//First loading of list
this.updateAjaxList();
return this;
}
})( jQuery );
//begin_page, int: number of first element showed in table
function pagination( begin_page, total_elements, num_elements, link ,initial_num_pages, variable, label, func_jscript, css_class) {
pages='';
if(begin_page>total_elements) {
begin_page=0;
}
// Calculamos el total de todas las páginas
total_page=Math.ceil(total_elements/num_elements);
// Calculamos en que página nos encontramos
actual_page=Math.ceil(begin_page/num_elements);
// Calculamos el total de intervalos
total_interval=Math.ceil(total_page/initial_num_pages);
// Calculamos el intervalo en el que estamos
actual_interval=Math.floor(actual_page/initial_num_pages);
//Calculamos el elemento de inicio del intervalo
initial_page=Math.ceil(actual_interval*initial_num_pages*num_elements);
last_page=Math.ceil(actual_interval*initial_num_pages*num_elements)+Math.ceil(initial_num_pages*num_elements);
if (last_page>total_elements) {
last_page=total_elements;
}
//url_base=new URL(link);
if(initial_page>0) {
//initial_link=add_get_parameters(link, **{variable: '0'});
initial_url=new URL(link);
initial_url.searchParams.append(variable, '0');
initial_link=initial_url.href;
//middle_link=add_get_parameters(link, **{variable: str((initial_page-num_elements)) } );
middle_url=new URL(link);
begin_page=(initial_page-num_elements);
middle_url.searchParams.append(variable, begin_page);
middle_link=middle_url.href;
pages += "1 << "
}
arr_pages={};
for(x=initial_page;x"+num_page+" ";
arr_pages[begin_page]=''+num_page+' ';
pages+=arr_pages[x];
}
if (last_page>> Last";
}
return pages;
}