<script>
"use strict";
// Class definition
function showSalaryStack(uno){
	blockPage();
	loadModal('md');	
	$.get('<?=get_admin_path("users/salary_stack")?>/' + uno, function(data, status){
		//alert("Data: " + data + "\nStatus: " + status);
		$('#popup_wrapper_model_content').html(data);				
		unblockPage();
    });
}

var KTDatatableRemoteAjaxDemo = function() {
    // Private functions

    // basic demo
    var demo = function() {

        var datatable = $('#kt_datatable').KTDatatable({
            // datasource definition
            data: {
                type: 'remote',
                source: {
                    read: {
                        url: "<?=get_admin_path('users/ajax_list')?>",
                        // sample custom headers
                        // headers: {'x-my-custom-header': 'some value', 'x-test-header': 'the value'},
						params: {
						  <?=csrf_token()?>: '<?=csrf_hash()?>'
						},
                        map: function(raw) {
                            // sample data mapping
                            var dataSet = raw;
                            if (typeof raw.data !== 'undefined') {
                                dataSet = raw.data;
                            }
                            return dataSet;
                        },
                    },
                },
                pageSize: 10,				
                serverPaging: true,
                serverFiltering: true,
                serverSorting: true,
            },			
            // layout definition
            layout: {
                scroll: false,
                footer: false,
				theme: 'default',
            },
			toolbar: {
				items:{
					pagination:{
						pageSizeSelect: [10, 20, 30, 40, 50],
					},
				},				
			},
            // column sorting
            sortable: true,

            pagination: true,

            search: {
				onEnter: false,
				delay: 600, // milliseconds
                input: $('#kt_datatable_search_query'),
                key: 'generalSearch'
            },

            // columns definition
            columns: [{
                field: 'RecordID',
                title: 'ID',
                width: 70,
				type: 'number',
                selector: false,
                textAlign: 'center',
            }, {
                field: 'code',
                title: 'Code',
            },{
                field: 'name',
                title: 'Name',
				sortable: 'asc',
            }, {
                field: 'company_name',
                title: 'Company',
            },{
                field: 'employee_type',
                title: 'Employee Type',
            },{
                field: 'attendance_machine_id',
                title: 'Attendance ID',
            },{
                field: 'status',
                title: 'Status',
                // callback function support for column rendering
                template: function(row) {
                    var statusProp = {
                        'Active': {
                            'title': 'Active',
                            'class': ' label-light-success'
                        },
                        'Inactive': {
                            'title': 'Inactive',
                            'class': ' label-light-danger'
                        },
                    };
                    return '<span class="label font-weight-bold label-lg ' + statusProp[row.status].class + ' label-inline">' + statusProp[row.status].title + '</span>';
                },
            }, {
                field: 'Actions',
                title: 'Actions',
                sortable: false,
                width: 120,
                overflow: 'visible',
                autoHide: false,
                template: function(row) {
					var deleteUrl = "<?=get_admin_path('users/delete')?>/" + row.RecordID;
                    <?php if($acObj->allowed('is_edit')){ ?>
					return '\
						<a href="javascript:;" onclick="showSalaryStack(\''+row.RecordID+'\');" class="btn btn-sm btn-clean btn-icon" title="Salary Stack / Structure">\
                            <i class="fa fa-file" aria-hidden="true"></i>\
                        </a>\
                        <a href="<?=get_admin_path("users/edit")?>/' + row.RecordID + '" class="btn btn-sm btn-clean btn-icon mr-2" title="Edit details">\
                            <i class="fa fa-edit"></i>\
                        </a>\
                        <a href="javascript:;" onclick="deleteRecord(\''+deleteUrl+'\');" class="btn btn-sm btn-clean btn-icon" title="Delete">\
                            <i class="fa fa-trash" aria-hidden="true"></i>\
                        </a>\
                    ';
					<?php }else{ ?>
					return '-';
					<?php } ?>
                },
            }],

        });

		$('#kt_datatable_search_company').on('change', function() {
            datatable.search($(this).val(), 'u.company_id');
        });

		$('#kt_datatable_search_employee_type').on('change', function() {
            datatable.search($(this).val(), 'u.employee_type_id');
        });

		$('#kt_datatable_search_status').on('change', function() {
            datatable.search($(this).val().toLowerCase(), 'u.status');
			//datatable.search("vishal", 'Mobile_No');
        });

        $('#kt_datatable_search_company, #kt_datatable_search_employee_type, #kt_datatable_search_status, #kt_datatable_search_type').selectpicker();
    };

    return {
        // public functions
        init: function() {
            demo();
        },
    };
}();

jQuery(document).ready(function() {
    KTDatatableRemoteAjaxDemo.init();
});
</script>